From 660454e318a57cc82811908389cd4056fbfce1f7 Mon Sep 17 00:00:00 2001 From: wangting <675591594@qq.com> Date: 星期五, 25 八月 2023 16:55:05 +0800 Subject: [PATCH] 修改样式,修改编码规则 --- Source/UBCS-WEB/src/components/advanced-query/advancedQuery.vue | 230 +++++++++++++++++++++++++++------------------------------ 1 files changed, 108 insertions(+), 122 deletions(-) diff --git a/Source/UBCS-WEB/src/components/advanced-query/advancedQuery.vue b/Source/UBCS-WEB/src/components/advanced-query/advancedQuery.vue index 733f77b..f2a1313 100644 --- a/Source/UBCS-WEB/src/components/advanced-query/advancedQuery.vue +++ b/Source/UBCS-WEB/src/components/advanced-query/advancedQuery.vue @@ -4,24 +4,29 @@ 3銆佺敤鎴疯緭鍏ョ殑鍊间細浠onditionMap[field]鐨勬牸寮忔嫾鎺ュソ杩涜鍥炰紶锛岀劧鍚庡氨闇�瑕佷娇鐢ㄧ殑鍦版柟鑷杩涜鏌ヨ鐨勮皟鐢紱 --> <template> - <el-dialog + <el-dialog title="楂樼骇鏌ヨ" append-to-body - width="55vw" - style="height: 115vh; margin-top: -10vh; overflow: hidden" + width="46vw" + style="height: 100vh;overflow: hidden" + v-dialogDrag :visible.sync="isShowDialog" + lock-scroll + class="avue-dialog avue-dialog--top" + top="-3%" + destroy-on-close @close="recoverPage"> <div class="search-total"> <!-- 澶撮儴鎸夐挳鍖哄煙 --> - <div slot="title" class="dialog-search-button"> - <el-button - type="primary" + <div slot="title" class="dialog-search-button"> + <el-button + type="primary" size="small" icon="el-icon-search" @click="searchSubmit"> 鏌ヨ </el-button> - <el-button + <el-button type="warning" size="small" icon="el-icon-refresh" @@ -31,11 +36,11 @@ </div> <!-- 椤甸潰涓讳綋鍐呭鍖哄煙 --> <div class="search-content"> - <el-row + <el-row v-for="(item,index) in initOptions" :key="item.queryField" :span="24"> - <el-col :span="5"> + <el-col :span="6"> <div class="grid-content"> <el-select disabled placeholder="璇烽�夋嫨" v-model="searchFormArrays[index].queryField"> <el-option @@ -65,9 +70,9 @@ <el-select v-else-if="item.fieldType==='combox'" v-model="searchFormArrays[index].fieldValue" placeholder="璇烽�夋嫨"> <el-option v-for="option in item.data" - :key="option.itemValue" - :label="option.itemName" - :value="option.itemValue"> + :key="option.itemValue || option.value" + :label="option.itemName || option.label" + :value="option.itemValue || option.value"> </el-option> </el-select> <el-switch v-else-if="item.fieldType==='truefalse'" v-model="searchFormArrays[index].fieldValue"></el-switch> @@ -82,11 +87,11 @@ :value="searchFormArrays[index].fieldValue" :text="item.showField" :display="!item.hidden" - @setReferValue="setReferValue"> + @setReferValue="val=>setReferValue(val,index)"> </vci-web-refer> </div> </el-col> - <el-col :span="2"> + <el-col :span="1"> <div class="grid-content"> <i class="el-icon-close" @click="removeInput(index)"></i> </div> @@ -172,7 +177,7 @@ label: "涓嶇瓑浜�", },{ value: "_ge", //澶т簬锛岄粯璁や负澶т簬绛変簬 - label: "澶т簬", + label: "澶т簬", },{ value: "_le", //灏忎簬锛岄粯璁や负灏忎簬绛変簬 label: "灏忎簬", @@ -189,64 +194,73 @@ }, // 瀵硅瘽妗嗗唴瀹规覆鏌撻厤缃� options(){ - // 灏唎ptions閰嶇疆璧嬪�煎埌data涓殑option涓紝閬垮厤娣辨祬鎷疯礉鐨勯棶棰樻墍浠ラ渶瑕佽浆json涔嬪悗鍐嶈祴鍊� - const data = JSON.stringify(this.options); - this.initOptions = JSON.parse(data); - //console.log(this.initOptions); - this.initOptions.forEach((item,index) => { - if(item.fieldType==='combox') { - let enumCach = JSON.parse(localStorage.getItem(item.comboxKey)); - if(enumCach != null) { - item.data = enumCach; - }else { - getDictionary({code: item.comboxKey}).then(res=>{ - item.data = res.data.data; - localStorage.setItem(item.comboxKey,JSON.stringify(res.data.data)); - }) - } - }else if(item.fieldType==='refer'){ - this.$set(item,"referConfigData",{ - title: item.referConfig.textField, - showField: item.showField || item.field, - field: item.field, - placeholder: item.inputTip || '', - options: Object.assign(item.referConfig,{width:'100%'}), - }) - //console.log(item.referConfigData.options); - //console.log(item); - } - // TODO: 杩欏効淇敼涓�涓嬪弬鐓х殑鏌ヨ鏉′欢 - let conditions = []; - if(item.fieldType==='text'){ - conditions = this.searchConditions; - }else if (item.fieldType==='combox'){ - conditions = this.dateConditions; - }else if (item.fieldType==='datetime') { - conditions = this.switchSearchConditions; - }else { - conditions = this.referSearchConditions; - } - // console.log(conditions); - this.$set(item,"conditions",conditions) - let add = { - queryField: String(item.queryField), - condition: item.fieldType==='text' ? String("_like"):String("_equal"), - fieldValue: item.fieldType==='truefalse' ? Boolean(false):String(''), - } - this.searchFormArrays.push(add) - }); - //console.log(this.initOptions); - //console.log(this.searchFormArrays); + this.initData(); } }, methods: { + initData(){ + // 灏唎ptions閰嶇疆璧嬪�煎埌data涓殑option涓紝閬垮厤娣辨祬鎷疯礉鐨勯棶棰樻墍浠ラ渶瑕佽浆json涔嬪悗鍐嶈祴鍊� + const data = JSON.stringify(this.options); + this.initOptions = JSON.parse(data); + //console.log(this.initOptions); + if(this.initOptions.length > 0){ + let array = []; + this.initOptions.forEach((item,index) => { + if(item.fieldType==='combox') { + let enumCach = item.data || JSON.parse(localStorage.getItem(item.comboxKey)); + if(enumCach != null) { + item.data = enumCach; + }else { + getDictionary({code: item.comboxKey}).then(res=>{ + item.data = res.data.data; + localStorage.setItem(item.comboxKey,JSON.stringify(res.data.data)); + }) + } + }else if(item.fieldType==='refer'){ + this.$set(item,"referConfigData",{ + title: item.title, + showField: item.showField || item.field, + field: item.field, + placeholder: item.inputTip || '', + options: Object.assign(item.referConfig,{width:"80%"}), + }) + //console.log(item.referConfigData.options); + //console.log(item); + } + // TODO: 杩欏効淇敼涓�涓嬪弬鐓х殑鏌ヨ鏉′欢 + let conditions = []; + if(item.fieldType==='text'){ + conditions = this.searchConditions; + }else if (item.fieldType==='combox'|| item.fieldType==='truefalse'){ + conditions = this.switchSearchConditions; + }else if (item.fieldType==='datetime') { + conditions = this.dateConditions; + }else { + conditions = this.referSearchConditions; + } + // console.log(conditions); + this.$set(item,"conditions",conditions) + + let add = { + queryField: String(item.queryField), + condition: item.fieldType==='text' ? String("_like"):String("_equal"), + fieldValue: item.fieldType==='truefalse' ? Boolean(false):String(''), + } + array.push(add) + }); + this.searchFormArrays = array; + } + //console.log(this.initOptions); + //console.log(this.searchFormArrays); + }, + /** 涓哄弬鐓х被鍨嬫椂鍊奸�夋嫨涔嬪悗鐨勫鐞� */ - setReferValue(data){ - // if(data.field) { - - // } - console.log(data); + setReferValue(data,index){ + if(data.field) { + this.searchFormArrays[index][data.fieldValue] = data.value || ''; + this.initOptions[index][data.showField] = data.text || ''; + } }, // 灞炴�у垏鎹㈡椂鏌ヨ鏉′欢鍜屾煡璇㈠�间篃闇�瑕佸杈撳叆妗嗚繘琛屽垏鎹� @@ -274,7 +288,7 @@ // }, // 绉婚櫎鎼滅储妗� - + removeInput(index){ //console.log(this.initOptions); this.$delete(this.initOptions,index); @@ -282,20 +296,7 @@ }, // 閲嶇疆褰撳墠鐣岄潰鐨勮緭鍏ユ resetInput(){ - const data = JSON.stringify(this.options); - this.initOptions = JSON.parse(data); - let array = []; - this.initOptions.forEach((item,index) => { - let add = { - queryField: String(item.queryField), - condition:item.fieldType=='text' ? String("_like"):String("_equal"), - fieldValue: item.fieldType=='truefalse' ? Boolean(false):String(''), - } - array.push(add) - }); - this.searchFormArrays = array; - //console.log(this.initOptions); - //console.log(this.searchFormArrays); + this.initData(); }, // 鎭㈠椤甸潰 recoverPage(){ @@ -323,32 +324,18 @@ console.log(condtionParam); this.$emit('echoContion',condtionParam) this.isShowDialog = false; - }, + }, } } </script> <style lang="scss" scoped> - .search-total { - border-radius: 4px; - min-height: 70vh; - // margin-left: 35px; - margin-top: -8px; - overflow-y: auto; - height: 70vh; + border-radius: 4px; + margin-top: -10px; } .dialog-search-button { - border-top: 1px solid #E9E7E7; - border-bottom: 1px solid #E9E7E7; - padding: 10px 10px 10px; - position: fixed; - display: block; - background-color: #fff; - // top: 10%; - margin-top: -30px; - width: 50%; - z-index: 1000; + margin-bottom: 15px; } // .search-total > .search-content > .el-row{ // margin-bottom: 5px; @@ -357,40 +344,39 @@ // } // } .search-total > .search-content { - margin-top: 40px; } .search-total > .search-content > .el-row > .el-col { - border-radius: 4px; + border-radius: 4px; } .search-total > .search-content > .el-row > .el-col > .grid-content { - border-radius: 4px; - min-height: 36px; + border-radius: 4px; + min-height: 36px; } .search-total > .search-content > .el-row > .el-col { - margin-right: 6px; - &:last-child { - margin-right: 0; - } + margin-right: 6px; + &:last-child { + margin-right: 0; + } } .grid-content > .el-icon-close { - font-size: 35px; - cursor: pointer; - color: rgb(222, 130, 105); + font-size: 30px; + line-height: 40px; + cursor: pointer; + color: rgb(222, 130, 105); } - .grid-content > .el-icon-close:hover{ - font-size: 38px; - color: rgb(219, 52, 6); + .grid-content > .el-icon-close:hover { + font-size: 30px; + color: rgb(219, 52, 6); } .grid-content > .el-select { - width: 100%; + width: 100%; } .grid-content > .el-switch { - line-height: 40px; - height: 40px; + line-height: 40px; + height: 40px; } - .grid-content > .el-date-editor.el-input, .el-date-editor.el-input__inner{ - width: 100%; + .grid-content > .el-date-editor.el-input, .el-date-editor.el-input__inner { + width: 100%; } - -</style> \ No newline at end of file +</style> -- Gitblit v1.9.3