BUG 25656

src/apps/AppBuilding/components/searchMap.vue

@@ -3,7 +3,8 @@
     <div class="grid-input">
       <img src="./img/search-icon.png" alt="" class="search-icon">
       <!-- <img src="./img/back-icon.png" alt="" class="back-icon"> -->
-      <input type="text" class="input" placeholder="请输入姓名、房屋信息" v-model="name" maxlength="10" confirm-type="search" @confirm="search" />
+      <input type="text" class="input" placeholder="请输入姓名、房屋信息" v-model="name" maxlength="10" confirm-type="search"
+             @confirm="search"/>
       <div class="clear-btn">
         <img src="./img/del-icon.png" alt="" class="del-icon" v-if="name" @click="clear">
       </div>
@@ -14,7 +15,7 @@
       <div class="title border">
         <img src="./img/search-icon.png" alt="" class="search-icon">{{ name }}
       </div>
-      <div class="item border" v-for="(item, index) in buildList" :key="index" @click.stop="getBuidInfo(item)">
+      <div class="item border" v-for="(item, index) in buildList" :key="index" @click.stop="getBuildingInfo(item)">
         <img src="./img/user-icon.png" alt="" class="search-icon user-icon">
         <div class="item-content">
           <h3>{{ item.residentName }}</h3>
@@ -26,7 +27,8 @@
       <img src="./img/build-icon.png" alt=""> 楼栋<br/>列表
     </div>
     <div class="map-content">
-      <AiTMap v-if="areaId" :areaId="areaId" :map.sync="map" :lib.sync="lib" :ops="ops" :libraries="['service', 'tools']"/>
+      <AiTMap v-if="areaId" :areaId="areaId" :map.sync="map" :lib.sync="lib" :ops="ops"
+              :libraries="['service', 'tools']"/>
     </div>
     <u-popup v-model="showPop" mode="bottom" border-radius="14">
       <div class="popup">
@@ -72,7 +74,6 @@
 <script>
 import {mapState} from 'vuex'
 
-
 export default {
   data() {
     return {
@@ -98,7 +99,6 @@ export default {
   computed: {...mapState(['user'])},
   mounted() {
     this.areaId = this.user.areaId
-    // Promise.all([this.getCenterLatLng(),this.getCommunityList()])
     this.getCenterLatLng().then(points => {
       this.getMarkerCluster(points)
     })
@@ -136,8 +136,8 @@ export default {
         }
       })
     },
-    getMarkerCluster(points) {
-      let {lib: TMap, map, retryMapCount} = this
+    getMarkerCluster(points, count = 0) {
+      let {lib: TMap, map} = this
       if (map) {
         map.setCenter(this.latLngCenter)
         let MarkerCluster = new TMap.MarkerCluster({
@@ -165,6 +165,7 @@ export default {
               geometries.push({
                 styleId: 'cluster',
                 position: item.center,
+                properties: {...item},
                 content: item.geometries.length.toString() || "0"
               })
             } else {
@@ -173,6 +174,7 @@ export default {
               function ClusterBubble(options) {
                 TMap.DOMOverlay.call(this, options);
               }
+
               ClusterBubble.prototype = new TMap.DOMOverlay();
               ClusterBubble.prototype.onInit = function (options) {
                 this.content = options.content;
@@ -236,14 +238,17 @@ export default {
                 })
               },
             })
+            marker.on('click', (e) => {
+              let {bounds} = e.geometry.properties
+              map.fitBounds(bounds)
+            })
           }
         })
         return Promise.resolve()
       } else {
-        if (retryMapCount < 5) {
+        if (count < 5) {
           setTimeout(() => {
-            this.retryMapCount++
-            return this.getMarkerCluster(points)
+            return this.getMarkerCluster(points, ++count)
           }, 1000)
         } else Promise.reject("加载失败")
       }
@@ -281,7 +286,7 @@ export default {
         }
       })
     },
-    getBuidInfo(item) {
+    getBuildingInfo(item) {
       this.$http.post(`/app/appcommunityhouseinfo/queryDetailByIdWithBuilding?buildId=${item.buildingId}&houseId=${item.id}`).then(res => {
         if (res.code == 0) {
           this.show = false