Bladeren bron

分布图搜索的那个,如果搜索到换热站直接定位到换热站的位置

yanglzh 2 jaren geleden
bovenliggende
commit
a2a7279a7b
2 gewijzigde bestanden met toevoegingen van 30 en 10 verwijderingen
  1. 1 0
      src/api/heatStation/index.ts
  2. 29 10
      src/views/heating/monitor/map.vue

+ 1 - 0
src/api/heatStation/index.ts

@@ -12,6 +12,7 @@ export default {
     // getAll: (params?: object) => get('/region/monitor/getAllHeatStation', params),
     getAll: (params?: object) => get('/region/monitor/loopMap', params),
     getList: (params: object) => get('/region/heatStation/tree', params),
+    getAllList: (params: object) => get('/region/heatStation/getAll', params),
     add: (data: object) => post('/region/heatStation/add', data),
     edit: (data: object) => put('/region/heatStation/edit', data),
     del: (id: number) => del('/region/heatStation/del', { id }),

+ 29 - 10
src/views/heating/monitor/map.vue

@@ -3,11 +3,15 @@
     <div style="position: relative; flex: 1;">
       <div class="map" ref="mapRef" style="height: 100%"></div>
       <div class="search-hover">
-        <el-input v-model="searchText" @keydown.enter.native="searchPoint" placeholder="地址搜索" style="width:250px">
+        <!-- <el-input v-model="searchText" @keydown.enter.native="searchPoint" placeholder="地址搜索" style="width:250px">
           <template #append>
             <el-button :icon="Search" @click="searchPoint"></el-button>
           </template>
-        </el-input>
+        </el-input> -->
+
+        <el-select v-model="searchText" filterable allow-create default-first-option :reserve-keyword="false" placeholder="地址搜索" style="width:250px" @change="searchPoint">
+          <el-option v-for="item in heatList" :key="item.id" :label="item.name" :value="item.id" />
+        </el-select>
       </div>
       <!-- 显示弹层区域 -->
       <div class="view">
@@ -90,15 +94,30 @@ window.mapToDetail = (code: string) => {
   router.push('/heating/monitor/loopSupervision/list/loopDetail?code=' + code)
 }
 
-function searchPoint() {
-  if (local) {
-    local.search(searchText.value);
+function searchPoint(val: number | string) {
+  if (typeof val === 'number') {
+    map.setZoom(15);
+    const { lat, lnt: lng } = heatList.value.find((item: any) => item.id === val) as any
+
+    setTimeout(() => {
+      map.centerAndZoom({ lat, lng }, 20);
+    }, 500)
+
+    local && local.search('');
+
+    // 选择的换热站
   } else {
-    local = new BMapGL.LocalSearch(map, {
-      renderOptions: { map }
-    });
-    local.search(searchText.value);
+    // 自定义的地址搜索
+    if (local) {
+      local.search(searchText.value);
+    } else {
+      local = new BMapGL.LocalSearch(map, {
+        renderOptions: { map }
+      });
+      local.search(searchText.value);
+    }
   }
+  console.log(val)
 }
 
 onMounted(() => {
@@ -128,7 +147,7 @@ onMounted(() => {
     setLine(list, map);
   });
   // 获取换热站列表
-  api.heatStation.getList({
+  api.heatStation.getAllList({
     status: 1
   }).then((res: any) => {
     heatList.value = res