| | |
| | | <div class="doumee-filter"> |
| | | <el-form inline label-suffix=":" @submit.native.prevent> |
| | | <template v-for="(item, index) in queryFormConfig.formItems"> |
| | | <el-form-item v-if="item.type === 'input' && (showZk || index < listLength)" :key="item.filed" |
| | | :label="item.label"> |
| | | <el-form-item v-if="item.type === 'input' && (showZk || index < listLength)" :key="item.filed"> |
| | | <el-input v-model="searchForm[item.filed]" |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :placeholder="item.placeholder ? item.placeholder : '请输入' + item.label" class="w200" |
| | | @change="changeForm(item.filed)" @keyup.enter.native="handlekeyup(item.keyup || false)" /> |
| | | :placeholder="item.label" class="w200" @change="changeForm(item.filed)" |
| | | @keyup.enter.native="handlekeyup(item.keyup || false)" /> |
| | | </el-form-item> |
| | | <el-form-item v-if="item.type === 'moneySelect' && (showZk || index < listLength)" :key="item.label" |
| | | :label="item.label"> |
| | | <el-form-item v-if="item.type === 'moneySelect' && (showZk || index < listLength)" :key="item.label"> |
| | | <el-input v-model="searchForm[item.filedStrt]" |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :placeholder="item.start" style="width: 150px" /> |
| | |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :placeholder="item.end" style="width: 150px" /> |
| | | </el-form-item> |
| | | <el-form-item v-if="item.type === 'select' && (showZk || index < listLength)" :key="item.filed" |
| | | :label="item.label"> |
| | | <el-form-item v-if="item.type === 'select' && (showZk || index < listLength)" :key="item.filed"> |
| | | <el-select v-model="searchForm[item.filed]" :filterable="item.filterable || true" |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :placeholder="item.placeholder ? item.placeholder : '请选择' + item.label" class="w200" |
| | | @change="changeForm(item.filed)"> |
| | | :placeholder="item.label" class="w200" @change="changeForm(item.filed)"> |
| | | <el-option v-for="opt, i in item.options" :key="i" :value="item.valueCode ? opt[item.valueCode] : opt.value" |
| | | :label="item.labelCode ? opt[item.labelCode] : opt.label" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item v-if="item.type === 'date' && (showZk || index < listLength)" :key="item.filed" |
| | | :label="item.label || '日期'"> |
| | | <el-form-item v-if="item.type === 'date' && (showZk || index < listLength)" :key="item.filed"> |
| | | <el-date-picker v-model="searchForm[item.filed]" type="date" value-format="yyyy-MM-dd" class="w200" |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :placeholder="item.placeholder || '请选择日期'" :picker-options="item.pickerOptions || {}" |
| | | @change="changeForm(item.filed)" /> |
| | | :placeholder="item.label" :picker-options="item.pickerOptions || {}" @change="changeForm(item.filed)" /> |
| | | </el-form-item> |
| | | <el-form-item v-if="item.type === 'daterange' && (showZk || index < listLength)" :key="item.filed" |
| | | :label="item.label || ''"> |
| | | <el-form-item :label="item.label ? item.label : '起止时间'" |
| | | v-if="item.type === 'datetime' && (showZk || index < listLength)" :key="item.filed1"> |
| | | <el-date-picker v-model="searchForm[item.filed1]" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" |
| | | class="w200" |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :placeholder="item.label" @change="changeForm(item.filed)" /> |
| | | <el-date-picker v-model="searchForm[item.filed2]" type="datetime" value-format="yyyy-MM-dd HH:mm:ss" |
| | | class="w200" |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :placeholder="item.label" @change="changeForm(item.filed)" /> |
| | | </el-form-item> |
| | | <el-form-item v-if="item.type === 'daterange' && (showZk || index < listLength)" :key="item.filed"> |
| | | <el-date-picker v-model="searchForm[item.filed]" value-format="yyyy-MM-dd" type="daterange" |
| | | range-separator="至" |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :start-placeholder="item.start || ''" :end-placeholder="item.end || ''" |
| | | :picker-options="item.pickerOptions || {}" class="w400" @change="changeForm(item.filed)" /> |
| | | </el-form-item> |
| | | <el-form-item v-if="item.type === 'timePicker' && (showZk || index < listLength)" :key="item.filed" |
| | | :label="item.label || '选择时间'"> |
| | | <el-form-item v-if="item.type === 'timePicker' && (showZk || index < listLength)" :key="item.filed"> |
| | | <el-time-picker v-model="searchForm[item.filed]" is-range range-separator="至" format="HH:mm" |
| | | value-format="HH:mm" start-placeholder="开始时间" end-placeholder="结束时间" placeholder="选择时间范围" class="w400" |
| | | @change="changeForm(item.filed)" /> |
| | | </el-form-item> |
| | | <el-form-item v-if="item.type === 'datetimerange' && (showZk || index < listLength)" :key="item.filed" |
| | | :label="item.label || '选择日期'"> |
| | | <el-form-item v-if="item.type === 'datetimerange' && (showZk || index < listLength)" :key="item.filed"> |
| | | <el-date-picker v-model="searchForm[item.filed]" format="yyyy-MM-dd HH:mm:ss" |
| | | value-format="yyyy-MM-dd HH:mm:ss" type="datetimerange" |
| | | value-format="yyyy-MM-dd HH:mm:ss" type="datetimerange" :default-time="['00:00:00', '23:59:59']" |
| | | :picker-options="item.pickerOptions || pickerOptions" range-separator="至" |
| | | :clearable="(item.clearable !== null && item.clearable !== undefined && item.clearable !== '') ? item.clearable : true" |
| | | :start-placeholder="item.start || '开始时间'" :end-placeholder="item.end || '结束时间'" class="w400" |
| | | @change="changeForm(item.filed)" /> |
| | | </el-form-item> |
| | | <el-form-item v-if="item.type === 'slot' && (showZk || index < listLength)" :key="item.filed" |
| | | :label="item.label"> |
| | | <el-form-item :label="item.label ? item.label : ''" |
| | | v-if="item.type === 'slot' && (showZk || index < listLength)" :key="item.filed"> |
| | | <slot :name="item.filed" /> |
| | | </el-form-item> |
| | | </template> |
| | |
| | | }, |
| | | listLength: { |
| | | type: Number, |
| | | default: 3 |
| | | default: 6 |
| | | }, |
| | | queryFormConfig: { |
| | | type: Object, |
| | |
| | | align-items: center; |
| | | background-color: #fff; |
| | | border-bottom: 10px solid #f7f8f9; |
| | | margin: 0 -30px; |
| | | padding: 0 0 0 30px; |
| | | margin: 0 -20px; |
| | | padding: 0 0 0 20px; |
| | | |
| | | .el-input, |
| | | .el-select { |