|
|
@@ -1,45 +1,43 @@
|
|
|
<template>
|
|
|
<el-form ref="form" :model="formData" :inline="true" :label-width="labelWidth" size="small">
|
|
|
<el-row>
|
|
|
- <div >
|
|
|
- <el-col :span="6" v-for="field in formFields" :key="field.label">
|
|
|
- <el-form-item :label="field.label" v-show="field.Retained !== false">
|
|
|
- <template v-if="field.type === 'input'">
|
|
|
- <el-input v-model="formData[field.name]" :placeholder="'请输入' + field.label"></el-input>
|
|
|
- </template>
|
|
|
- <template v-else-if="field.type === 'select'">
|
|
|
- <el-select v-model="formData[field.name]" filterable clearable :placeholder="'请选择' + field.label"
|
|
|
- @change="selectChange($event, field.name)">
|
|
|
- <el-option v-for="(option, index) in field.options" :key="index"
|
|
|
- :label="field.optionsIabel ? option[field.optionsIabel] : option.name"
|
|
|
- :value="field.optionsValue ? option[field.optionsValue] : option.id"></el-option>
|
|
|
- </el-select>
|
|
|
- </template>
|
|
|
- <template v-else-if="field.type === 'date'">
|
|
|
- <el-date-picker type="daterange" value-format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期"
|
|
|
- end-placeholder="结束日期" v-model="formData[field.list]" style="width: 100%;"
|
|
|
- @change="dateChange($event, field.name)"></el-date-picker>
|
|
|
- </template>
|
|
|
- <template v-else-if="field.type === 'switch'">
|
|
|
- <el-switch v-model="formData[field.name]"></el-switch>
|
|
|
- </template>
|
|
|
- <template v-else-if="field.type === 'checkbox'">
|
|
|
- <el-checkbox-group v-model="formData[field.name]">
|
|
|
- <el-checkbox v-for="(option, index) in field.options" :key="index" :label="option.label"
|
|
|
- :name="field.name"></el-checkbox>
|
|
|
- </el-checkbox-group>
|
|
|
- </template>
|
|
|
- <template v-else-if="field.type === 'radio'">
|
|
|
- <el-radio-group v-model="formData[field.name]">
|
|
|
- <el-radio v-for="(option, index) in field.options" :key="index" :label="option.label"></el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </template>
|
|
|
- <template v-else-if="field.type === 'textarea'">
|
|
|
- <el-input type="textarea" v-model="formData[field.name]"></el-input>
|
|
|
- </template>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </div>
|
|
|
+ <el-col :span="6" v-for="field in formFields" :key="field.label">
|
|
|
+ <el-form-item :label="field.label" v-show="field.Retained !== false">
|
|
|
+ <template v-if="field.type === 'input'">
|
|
|
+ <el-input v-model="formData[field.name]" :placeholder="'请输入' + field.label"></el-input>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="field.type === 'select'">
|
|
|
+ <el-select v-model="formData[field.name]" filterable clearable :placeholder="'请选择' + field.label"
|
|
|
+ @change="selectChange($event, field.name)">
|
|
|
+ <el-option v-for="(option, index) in field.options" :key="index"
|
|
|
+ :label="field.optionsIabel ? option[field.optionsIabel] : option.name"
|
|
|
+ :value="field.optionsValue ? option[field.optionsValue] : option.id"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="field.type === 'date'">
|
|
|
+ <el-date-picker type="daterange" value-format="yyyy-MM-dd" range-separator="至" start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期" v-model="formData[field.list]" style="width: 100%;"
|
|
|
+ @change="dateChange($event, field.name)"></el-date-picker>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="field.type === 'switch'">
|
|
|
+ <el-switch v-model="formData[field.name]"></el-switch>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="field.type === 'checkbox'">
|
|
|
+ <el-checkbox-group v-model="formData[field.name]">
|
|
|
+ <el-checkbox v-for="(option, index) in field.options" :key="index" :label="option.label"
|
|
|
+ :name="field.name"></el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="field.type === 'radio'">
|
|
|
+ <el-radio-group v-model="formData[field.name]">
|
|
|
+ <el-radio v-for="(option, index) in field.options" :key="index" :label="option.label"></el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </template>
|
|
|
+ <template v-else-if="field.type === 'textarea'">
|
|
|
+ <el-input type="textarea" v-model="formData[field.name]"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
<el-col :span="2" :offset="1" style="margin-top: 10px;" class="fold">
|
|
|
<span @click="toggleCollapse">折叠筛选信息</span>
|
|
|
<img src="../../../src/icon/Arrow.png" alt
|
|
|
@@ -85,19 +83,19 @@ export default {
|
|
|
if (field.label === '报价时间' && !this.formData[field.list]) {
|
|
|
this.$set(this.formData, field.list, [this.currentDate, this.currentDate]);
|
|
|
this.$set(this.formData, field.name[0], this.currentDate);
|
|
|
- this.$set(this.formData, field.name[1],this.currentDate );
|
|
|
+ this.$set(this.formData, field.name[1], this.currentDate);
|
|
|
}
|
|
|
});
|
|
|
this.formFields = this.fields;
|
|
|
this.resetForm();
|
|
|
- this.defaultTime=this.currentDate;
|
|
|
+ this.defaultTime = this.currentDate;
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
selectChange(id, filed) {
|
|
|
switch (filed) {
|
|
|
case 'provinceId':
|
|
|
- console.log(this.formData)
|
|
|
+ console.log(this.formData)
|
|
|
break;
|
|
|
case 'cityId':
|
|
|
|
|
|
@@ -142,6 +140,11 @@ export default {
|
|
|
};
|
|
|
</script>
|
|
|
<style scoped lang="scss">
|
|
|
+.el-row{
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ align-content: flex-start;
|
|
|
+}
|
|
|
.el-form-item>>>.el-input {
|
|
|
width: 250px;
|
|
|
}
|