|  |  |  | @ -11,13 +11,31 @@ | 
			
		
	
		
			
				
					|  |  |  |  |     :disabled="isDisabled" | 
			
		
	
		
			
				
					|  |  |  |  |     @change="change" | 
			
		
	
		
			
				
					|  |  |  |  |   > | 
			
		
	
		
			
				
					|  |  |  |  |     <el-option | 
			
		
	
		
			
				
					|  |  |  |  |       v-for="(item, index) in list" | 
			
		
	
		
			
				
					|  |  |  |  |       :key="item.id + index" | 
			
		
	
		
			
				
					|  |  |  |  |       :label="item[config.labelKey]" | 
			
		
	
		
			
				
					|  |  |  |  |       :value="item[config.valueKey]" | 
			
		
	
		
			
				
					|  |  |  |  |     > | 
			
		
	
		
			
				
					|  |  |  |  |     </el-option> | 
			
		
	
		
			
				
					|  |  |  |  |     <template v-if="labelIsMore"> | 
			
		
	
		
			
				
					|  |  |  |  |       <el-option | 
			
		
	
		
			
				
					|  |  |  |  |         v-for="(item, index) in list" | 
			
		
	
		
			
				
					|  |  |  |  |         :key="item.id + index" | 
			
		
	
		
			
				
					|  |  |  |  |         :label=" | 
			
		
	
		
			
				
					|  |  |  |  |           item[config.labelKey[0]] + | 
			
		
	
		
			
				
					|  |  |  |  |           '(' + | 
			
		
	
		
			
				
					|  |  |  |  |           item[config.labelKey[1]] + | 
			
		
	
		
			
				
					|  |  |  |  |           '-' + | 
			
		
	
		
			
				
					|  |  |  |  |           item[config.labelKey[2]] + | 
			
		
	
		
			
				
					|  |  |  |  |           ')' | 
			
		
	
		
			
				
					|  |  |  |  |         " | 
			
		
	
		
			
				
					|  |  |  |  |         :value="item[config.valueKey]" | 
			
		
	
		
			
				
					|  |  |  |  |       > | 
			
		
	
		
			
				
					|  |  |  |  |       </el-option> | 
			
		
	
		
			
				
					|  |  |  |  |     </template> | 
			
		
	
		
			
				
					|  |  |  |  |     <template> | 
			
		
	
		
			
				
					|  |  |  |  |       <el-option | 
			
		
	
		
			
				
					|  |  |  |  |         v-for="(item, index) in list" | 
			
		
	
		
			
				
					|  |  |  |  |         :key="index" | 
			
		
	
		
			
				
					|  |  |  |  |         :label="item[config.labelKey]" | 
			
		
	
		
			
				
					|  |  |  |  |         :value="item[config.valueKey]" | 
			
		
	
		
			
				
					|  |  |  |  |       > | 
			
		
	
		
			
				
					|  |  |  |  |       </el-option> | 
			
		
	
		
			
				
					|  |  |  |  |     </template> | 
			
		
	
		
			
				
					|  |  |  |  |   </el-select> | 
			
		
	
		
			
				
					|  |  |  |  | </template> | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
	
		
			
				
					|  |  |  | @ -37,6 +55,8 @@ export default { | 
			
		
	
		
			
				
					|  |  |  |  |   data() { | 
			
		
	
		
			
				
					|  |  |  |  |     return { | 
			
		
	
		
			
				
					|  |  |  |  |       text: "", | 
			
		
	
		
			
				
					|  |  |  |  |       labelIsMore: false, | 
			
		
	
		
			
				
					|  |  |  |  |       // labelKeyArr:[], | 
			
		
	
		
			
				
					|  |  |  |  |       list: [], | 
			
		
	
		
			
				
					|  |  |  |  |       isDisabled: false, | 
			
		
	
		
			
				
					|  |  |  |  |     }; | 
			
		
	
	
		
			
				
					|  |  |  | @ -44,48 +64,68 @@ export default { | 
			
		
	
		
			
				
					|  |  |  |  |   watch: { | 
			
		
	
		
			
				
					|  |  |  |  |     "config.echoId": { | 
			
		
	
		
			
				
					|  |  |  |  |       handler(nval, oval) { | 
			
		
	
		
			
				
					|  |  |  |  |         this.list = []; | 
			
		
	
		
			
				
					|  |  |  |  |         // this.isDisabled = !!this.config.isDisabled; | 
			
		
	
		
			
				
					|  |  |  |  |         if (nval) { | 
			
		
	
		
			
				
					|  |  |  |  |           this.remoteMethod(this.config.echoName); | 
			
		
	
		
			
				
					|  |  |  |  |           let resultName = this.config.echoName.replace(/\s*/g, ""); | 
			
		
	
		
			
				
					|  |  |  |  |           if (!resultName) return; | 
			
		
	
		
			
				
					|  |  |  |  |           this.remoteMethod(resultName); | 
			
		
	
		
			
				
					|  |  |  |  |         } | 
			
		
	
		
			
				
					|  |  |  |  |       }, | 
			
		
	
		
			
				
					|  |  |  |  |       deep: true, | 
			
		
	
		
			
				
					|  |  |  |  |       immediate: true, | 
			
		
	
		
			
				
					|  |  |  |  |     }, | 
			
		
	
		
			
				
					|  |  |  |  |     "config.isDisabled": { | 
			
		
	
		
			
				
					|  |  |  |  |       handler(nval, oval) { | 
			
		
	
		
			
				
					|  |  |  |  |         let type = this.$utils.typeJudgment(nval); | 
			
		
	
		
			
				
					|  |  |  |  |         if (["Boolean", "String"].includes(type)) { | 
			
		
	
		
			
				
					|  |  |  |  |           this.isDisabled = !!this.config.isDisabled; | 
			
		
	
		
			
				
					|  |  |  |  |         } | 
			
		
	
		
			
				
					|  |  |  |  |         this.isDisabled = !!this.config.isDisabled; | 
			
		
	
		
			
				
					|  |  |  |  |       }, | 
			
		
	
		
			
				
					|  |  |  |  |       deep: true, | 
			
		
	
		
			
				
					|  |  |  |  |       immediate: true, | 
			
		
	
		
			
				
					|  |  |  |  |     }, | 
			
		
	
		
			
				
					|  |  |  |  |   }, | 
			
		
	
		
			
				
					|  |  |  |  |   created() { | 
			
		
	
		
			
				
					|  |  |  |  |     let { labelKey } = this.config; | 
			
		
	
		
			
				
					|  |  |  |  |     let type = this.$utils.typeJudgment(labelKey); | 
			
		
	
		
			
				
					|  |  |  |  |     // console.log(type); | 
			
		
	
		
			
				
					|  |  |  |  |     if (type === "Array") { | 
			
		
	
		
			
				
					|  |  |  |  |       // let | 
			
		
	
		
			
				
					|  |  |  |  |       this.labelIsMore = true; | 
			
		
	
		
			
				
					|  |  |  |  |       // console.log(this.labelIsMore); | 
			
		
	
		
			
				
					|  |  |  |  |     } | 
			
		
	
		
			
				
					|  |  |  |  |   }, | 
			
		
	
		
			
				
					|  |  |  |  |   methods: { | 
			
		
	
		
			
				
					|  |  |  |  |     // 远程搜索 | 
			
		
	
		
			
				
					|  |  |  |  |     remoteMethod(query) { | 
			
		
	
		
			
				
					|  |  |  |  |       if (query !== "") { | 
			
		
	
		
			
				
					|  |  |  |  |         this.loading = true; | 
			
		
	
		
			
				
					|  |  |  |  |         let params = {}; | 
			
		
	
		
			
				
					|  |  |  |  |         let type = this.$utils.typeJudgment(this.config.autocompleteKey); | 
			
		
	
		
			
				
					|  |  |  |  |         if (!type.includes("Object") && !type.includes("String")) return; | 
			
		
	
		
			
				
					|  |  |  |  | 
 | 
			
		
	
		
			
				
					|  |  |  |  |         if (type.includes("Object")) { | 
			
		
	
		
			
				
					|  |  |  |  |         let params = {}; | 
			
		
	
		
			
				
					|  |  |  |  |         if (["Object"].includes(type)) { | 
			
		
	
		
			
				
					|  |  |  |  |           params[this.config.autocompleteKey.key] = query; | 
			
		
	
		
			
				
					|  |  |  |  |           params["enableMark"] = this.config.autocompleteKey.enableMark; | 
			
		
	
		
			
				
					|  |  |  |  |         } | 
			
		
	
		
			
				
					|  |  |  |  |         if (type.includes("String")) { | 
			
		
	
		
			
				
					|  |  |  |  |         if (["String", "Undefined", "Null"].includes(type)) { | 
			
		
	
		
			
				
					|  |  |  |  |           // 接口为get类型时需将autocompleteKey值设为空 | 
			
		
	
		
			
				
					|  |  |  |  |           this.config.autocompleteKey | 
			
		
	
		
			
				
					|  |  |  |  |             ? (params[this.config.autocompleteKey] = query) | 
			
		
	
		
			
				
					|  |  |  |  |             : (params["queryTypeGet"] = query); | 
			
		
	
		
			
				
					|  |  |  |  |             : (params = query); | 
			
		
	
		
			
				
					|  |  |  |  |         } | 
			
		
	
		
			
				
					|  |  |  |  |         this.config.serveTarget(params).then((res) => { | 
			
		
	
		
			
				
					|  |  |  |  |           let timeInstance = setTimeout(() => { | 
			
		
	
		
			
				
					|  |  |  |  |             this.loading = false; | 
			
		
	
		
			
				
					|  |  |  |  |             clearTimeout(timeInstance); | 
			
		
	
		
			
				
					|  |  |  |  |             if (res.data.length) { | 
			
		
	
		
			
				
					|  |  |  |  |               this.list = res.data; | 
			
		
	
		
			
				
					|  |  |  |  |             } else this.list = []; | 
			
		
	
		
			
				
					|  |  |  |  |           }, 1000 * Math.random()); | 
			
		
	
		
			
				
					|  |  |  |  |           this.loading = false; | 
			
		
	
		
			
				
					|  |  |  |  |           if (res.data.length) { | 
			
		
	
		
			
				
					|  |  |  |  |             this.list = res.data; | 
			
		
	
		
			
				
					|  |  |  |  |           } else this.list = []; | 
			
		
	
		
			
				
					|  |  |  |  |         }); | 
			
		
	
		
			
				
					|  |  |  |  |       } else { | 
			
		
	
		
			
				
					|  |  |  |  |         this.list = []; | 
			
		
	
		
			
				
					|  |  |  |  |       } | 
			
		
	
		
			
				
					|  |  |  |  |     }, | 
			
		
	
		
			
				
					|  |  |  |  |     change(val) { | 
			
		
	
		
			
				
					|  |  |  |  |       this.$emit("change", val); | 
			
		
	
		
			
				
					|  |  |  |  |       this.$emit("change", val, this.list); | 
			
		
	
		
			
				
					|  |  |  |  |     }, | 
			
		
	
		
			
				
					|  |  |  |  |   }, | 
			
		
	
		
			
				
					|  |  |  |  | }; | 
			
		
	
	
		
			
				
					|  |  |  | 
 |