map-top修改

src/views/dataBoard/overview/components/map-top.vue

@@ -1,19 +1,8 @@
 <template>
   <div :class="['m-per', { 'm-l77': level != 'street' }]">
-    <el-autocomplete
-      v-model="keyWord"
-      :fetch-suggestions="querySearch"
-      :placeholder="searchPlaceholder"
-      class="input-with-select"
-      popper-class="selectPopClass"
-      :value-key="'value'"
-    >
-      <el-select
-        v-model="searchSelect"
-        slot="prepend"
-        placeholder="请选择"
-        popper-class="selectPopClass"
-        @change="handleSelect"
+    <el-autocomplete v-model="keyWord" :fetch-suggestions="querySearch" :placeholder="searchPlaceholder"
+      class="input-with-select" popper-class="selectPopClass" :value-key="'value'">
+      <el-select v-model="searchSelect" slot="prepend" placeholder="请选择" popper-class="selectPopClass"
         >
         <el-option label="需求" value="1"></el-option>
         <el-option label="问题" value="2"></el-option>
@@ -48,9 +37,6 @@ export default {
       selectIndex: "",
       numData: {},
       searchSelect: "1",
-
-      searchPlaceholder:"可按需求人、需求内容关键词搜索",
-
       keyWord: "",
     };
   },
@@ -84,20 +70,20 @@ export default {
       this.selectIndex = type;
       this.$emit("changeType", type);
     },
-    async querySearch(queryString) {
+    async querySearch(queryString, cb) {
       try {
         let params = {
           keyword: queryString,
           pageSize: 20,
           pageNo: 1
         }
-        const {data} = await requestGet('/governance/dataBoard/demand/search', params);
-        const suggestions = data.map(item => ({ label: item.content, value: item.id }));
+        console.log(this.searchUrl);
+        const { data } = await requestGet(this.searchUrl, params);
+        const suggestions = data.map(item => ({ label: item.id, value: item.content }));
         console.log(suggestions);
-        return suggestions
+        cb(suggestions)
       } catch (error) {
         console.error('Error fetching suggestions:', error);
-        return [];
       }
     },
     getData(item) {
@@ -112,21 +98,37 @@ export default {
           this.numData = data;
         });
     },
-    handleSelect(val){
-    if(val == 1){
-      this.searchPlaceholder = '可按需求人、需求内容关键词搜索'
-    }else if(val == 2){
-      this.searchPlaceholder = '可按联系人、问题描述关键词搜索'
+  },
+  computed: {
 
-    }else if(val == 3){
-      this.searchPlaceholder = '可按单位名称、负责人、负责人联系电话关键词搜索'
+    searchPlaceholder() {
+      const mapArr = new Map([
+        ['1', '可按需求人、需求内容关键词搜索'],
+        ['2', '可按联系人、问题描述关键词搜索'],
+        ['3', '可按单位名称、负责人、负责人联系电话关键词搜索'],
+        ['4', '可按姓名、联系电话、问题描述关键词搜索']
+      ]);
 
-    }else if(val == 4){
-      this.searchPlaceholder = '可按姓名、联系电话、问题描述关键词搜索'
-    }
+      const a = mapArr.get(this.searchSelect);
+      return a;
+    },
+
+    searchUrl() {
+
+      const mapArrs = new Map([
+        ['1', '/governance/dataBoard/demand/search'],
+        ['2', '/governance/dataBoard/event/search'],
+        ['3', '/governance/dataBoard/satisfaction/search'],
+        ['4', '/actual/base/dataBoard/resource/search']
+      ]);
+
+
+      const a = mapArrs.get(this.searchSelect)
+
+      return a
     }
 
-  },
+  }
 };
 </script>
 
@@ -135,6 +137,7 @@ export default {
 .m-l77 {
   margin-left: 77px;
 }
+
 ::v-deep .el-autocomplete {
   width: 100%;
 }
@@ -146,6 +149,7 @@ export default {
     border-right: none;
     position: relative;
     width: 131px;
+
     &::after {
       content: "";
       position: absolute;
@@ -157,12 +161,14 @@ export default {
       transform: translateY(-7px);
     }
   }
+
   .el-input__inner {
     background: #001c44;
     border: 1px solid #007ff1;
     border-left: none;
     border-right: none;
   }
+
   .el-input-group__append {
     background: #0058ac;
     border: 1px solid #007ff1;