陈薪名 1 year ago
parent
commit
973b4e3037
  1. 53
      src/components/SearchHigh/src/SearchHigh.vue

53
src/components/SearchHigh/src/SearchHigh.vue

@ -11,7 +11,7 @@
</div> </div>
<!-- 第二列 条件--> <!-- 第二列 条件-->
<div class="rowInnerItem"> <div class="rowInnerItem">
<el-select v-model="item.action" placeholder="请选择条件" :disabled="item.column == '' || item.hide ? true : false"> <el-select v-model="item.action" placeholder="请选择条件" :disabled="item.column == '' || item.hide ? true : false" @change="actionSelect(item)" >
<el-option v-for="item in formatMoreListActions(item) " :key="item.value" :label="item.label" <el-option v-for="item in formatMoreListActions(item) " :key="item.value" :label="item.label"
:value="item.value" /> :value="item.value" />
</el-select> </el-select>
@ -19,24 +19,24 @@
<!-- 第三列 --> <!-- 第三列 -->
<div class="rowInnerItem1"> <div class="rowInnerItem1">
<!-- 输入框 --> <!-- 输入框 -->
<el-input v-if="getInputType(item.column) == 'input'" v-model="item.value" placeholder="请输入内容" clearable /> <el-input v-if="getInputType(item.column) == 'input'" v-model="item.value" placeholder="请输入内容" clearable :disabled="item.disabled"/>
<!-- 数字输入框 --> <!-- 数字输入框 -->
<el-input-number v-else-if="getInputType(item.column) == 'inputNumber'" v-model="item.value" :precision="6" /> <el-input-number v-else-if="getInputType(item.column) == 'inputNumber'" v-model="item.value" :precision="6" :disabled="item.disabled"/>
<!-- 下拉框 --> <!-- 下拉框 -->
<el-select v-else-if="getInputType(item.column) == 'select'" v-model="item.value" placeholder="请选择内容" :filterable="true" clearable > <el-select v-else-if="getInputType(item.column) == 'select'" v-model="item.value" placeholder="请选择内容" :filterable="true" clearable :disabled="item.disabled">
<el-option v-for="dict in initSelectOptions(item.column)" :key="dict.value" :label="dict.label" <el-option v-for="dict in initSelectOptions(item.column)" :key="dict.value" :label="dict.label"
:value="dict.value" /> :value="dict.value" />
<!-- <el-option v-for="(op, index) in initSelectOptions(item.column)" :label="op[item.optionsLabel] || op.label" <!-- <el-option v-for="(op, index) in initSelectOptions(item.column)" :label="op[item.optionsLabel] || op.label"
:value="op[item.optionsValue] || op.value" :key="index" /> --> :value="op[item.optionsValue] || op.value" :key="index" /> -->
</el-select> </el-select>
<!-- 时间 --> <!-- 时间 -->
<el-time-picker v-else-if="getInputType(item.column) == 'time'" range-separator="-" start-placeholder="开始时间" end-placeholder="结束时间" v-model="item.time" style="width: 340px;margin-right: 20px;"/> <el-time-picker v-else-if="getInputType(item.column) == 'time'" range-separator="-" start-placeholder="开始时间" end-placeholder="结束时间" v-model="item.time" style="width: 340px;margin-right: 20px;" :disabled="item.disabled"/>
<!-- 日期 --> <!-- 日期 -->
<el-date-picker v-else-if="getInputType(item.column) == 'date'" v-model="item.time" type="daterange" <el-date-picker v-else-if="getInputType(item.column) == 'date'" v-model="item.time" type="daterange"
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 340px;margin-right: 20px;" @change="changeDateTimePicker($event, item,'daterange')" value-format="YYYY-MM-DD" format="YYYY/MM/DD"/> range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 340px;margin-right: 20px;" @change="changeDateTimePicker($event, item,'daterange')" value-format="YYYY-MM-DD" format="YYYY/MM/DD" :disabled="item.disabled"/>
<!-- 日期时间 --> <!-- 日期时间 -->
<el-date-picker v-else-if="getInputType(item.column) == 'datePicker'" v-model="item.time" type="datetimerange" <el-date-picker v-else-if="getInputType(item.column) == 'datePicker'" v-model="item.time" type="datetimerange"
range-separator="-" start-placeholder="开始时间" end-placeholder="结束时间" style="width: 340px;" @change="changeDateTimePicker($event, item, 'datetimerange')" value-format="x" format="YYYY/MM/DD HH:mm:ss"/> range-separator="-" start-placeholder="开始时间" end-placeholder="结束时间" style="width: 340px;" @change="changeDateTimePicker($event, item, 'datetimerange')" value-format="x" format="YYYY/MM/DD HH:mm:ss" :disabled="item.disabled"/>
</div> </div>
<!-- 删除条件按钮 --> <!-- 删除条件按钮 -->
<el-button type="danger" :icon="Minus" circle size="small" <el-button type="danger" :icon="Minus" circle size="small"
@ -144,23 +144,11 @@ const moreListOptions = ref({
// ==,!=,>,<,>=,<=,like,in,notIn,betweeen,isNull,isNotNull // ==,!=,>,<,>=,<=,like,in,notIn,betweeen,isNull,isNotNull
const formatMoreListActions = (val) => { const formatMoreListActions = (val) => {
if (val) { if (val) {
// for(var i = 0; i < searchOption_high.value.length; i++) { if(getInputType(val.column)=='datePicker'|| getInputType(val.column) == 'date'){
// if (val == searchOption_high[i].prop) { return moreListOptions.value.action.filter(item => item.value == 'betweeen')
// if (state.searchOption_high[i].filters) { }else{
// return state.moreListOptions.action.filter(item => item.value == '==' || item.value == '!=') return moreListOptions.value.action.filter(item => item.value != 'betweeen')
// } else if (state.searchOption_high[i].type == 'dateTime') { }
// return state.moreListOptions.action.filter(item =>
// item.value == '==' ||
// item.value == '!=' ||
// item.value == '>' ||
// item.value == '<' ||
// item.value == '>=' ||
// item.value == '<=' )
// } else {
// return moreListOptions.value.action
// }
// }
// }
} }
return moreListOptions.value.action return moreListOptions.value.action
} }
@ -189,8 +177,23 @@ const moreListPush = () => {
// //
const resetSelect = (val) => { const resetSelect = (val) => {
val.action = "==" if (getInputType(val.column) == 'datePicker' || getInputType(val.column) == 'date') {
val.action = 'betweeen'
val.value = ""
val.disabled = false
}else{
val.action = '=='
val.value = "" val.value = ""
val.disabled = false
}
}
//
const actionSelect = (val)=>{
if(val.action=='isNull'|| val.action == 'isNotNull'){
val.disabled = true
}else{
val.disabled = false
}
} }
// //

Loading…
Cancel
Save