以房找人

src/apps/AppBuilding/AppBuilding.vue

@@ -21,7 +21,7 @@ export default {
 
   data() {
     return {
-      component: 'Add',
+      component: 'SearchMap',
       params: {}
     }
   },

src/apps/AppBuilding/components/detail.vue

@@ -226,7 +226,8 @@ export default {
       this.$emit('change', {
         type: 'Add',
         params: {
-          id: this.houseId
+          id: this.houseId,
+          communityId: this.communityId
         }
       })
     }

src/apps/AppBuilding/components/list.vue

@@ -10,7 +10,7 @@
           <p class="address">{{item.createAddress}}</p>
           <span class="status" :class="'color'+item.locationStatus">{{$dict.getLabel('BuildLocationStatus', item.locationStatus)}}</span>
         </div>
-        <div class="item-btn" v-if="item.locationStatus != 1">
+        <div class="item-btn" v-if="item.locationStatus != 1" @click="toMap(item.communityId, item.areaId)">
           <span>去定位</span>
         </div>
       </div>
@@ -61,6 +61,12 @@ export default {
         type: 'Detail',
         params: {id}
       })
+    },
+    toMap(id, areaId) {
+      this.$emit('change', {
+        type: 'Map',
+        params: {id, areaId}
+      })
     }
     
   },

src/apps/AppBuilding/components/map.vue

@@ -1,12 +1,16 @@
 <template>
   <div class="map">
     <div class="build-btn">
-      <img src="./img/build-icon.png" alt=""> 楼栋<br/>列表
+      <img src="./img/model-icon.png" alt="" @click="toDetail"> 楼栋<br/>模型
     </div>
     <div class="map-content">
       <AiTMap :areaId="areaId" :map.sync="map" :lib.sync="lib" :ops="ops" :libraries="['service', 'tools']"></AiTMap>
     </div>
-    <u-popup v-model="show" mode="bottom" border-radius="14">
+    <div class="footer">
+      <div class="click" @click="isFlag=true">点击定位</div>
+      <div class="btn" @click="confirm">确认定位</div>
+    </div>
+    <!-- <u-popup v-model="show" mode="bottom" border-radius="14">
       <div class="popup">
         <div class="bg"></div>
         <div class="title">恒大城西社区居委会</div>
@@ -38,92 +42,86 @@
           </span>
         </div>
       </div>
-    </u-popup>
+      <div class="popup-btn">查看楼栋模型</div>
+    </u-popup> -->
   </div>
 </template>
 
 <script>
 import { mapState } from 'vuex'
 export default {
-
+  props: ['params'],
   data() {
     return {
       areaId: '',
       ops: {},
       lib: '',
       map: null,
-      markerArr: [],
+      markerLayer: '',
-      show: true,
+      isFlag: false,
-      value: ''
+      latLng: {lat: '', lng: ''},
     }
   },
   computed: { ...mapState(['user']) },
   mounted() {
-    this.areaId = this.user.areaId
+    this.areaId = this.params.areaId
     this.initMap()
   },
 
   methods: {
-    initMap() {
+    initMap() {  //初始化地图
-      //初始化地图
-      
       this.$nextTick(() =>{
         let {lib: TMap, map} = this
-        var center = new TMap.LatLng(40.040422, 116.273521)
+        map.on("click", (evt) => {
-        var marker = null;
+          if( this.markerLayer) {
-        var points = []
+            this.markerLayer.setMap(null);
-        map.setCenter(center)
+          }
-        map.setZoom(18)
+         
-
+          this.markerLayer = new TMap.MultiMarker({
-        marker = new TMap.MultiMarker({
+            id: 'marker-layer',
-          id: 'marker-layer', // 图层id
+            map: map
-          map: map,
+          });
-          styles: {
+          if(this.isFlag) {
-            // 点标注的相关样式
+            this.markerLayer.add({
-            marker: new TMap.MarkerStyle({
+              position: evt.latLng
-              width: 25,
+            }); 
-              height: 35,
+            this.latLng = {
-              anchor: { x: 16, y: 32 },
+              lat: evt.latLng.lat,
-              src:'',
+              lng: evt.latLng.lng
-            }),
+            }
-          },
+          }
-          geometries: [
+                               
-            {
-              // 点标注数据数组
-              id: 'demo',
-              styleId: 'marker',
-              position: new TMap.LatLng(40.040422, 116.273521),
-            },
-          ],
         });
-
-        var infoWindow = null;
-        var infoWindow2 = null
-        var html = `<div style=" display: inline-block;padding: 6px 10px;line-height: 16px;border-radius: 24px; background: #5088FF;color: #fff;font-size: 12px;position: relative;">`
-          +`腾讯大厦<span style=" width: 0;height: 0;border-left: 6px solid transparent;border-right: 6px solid transparent;border-top: 12px solid #5088FF;position: absolute;bottom: -12px;left: 50%;margin-left:-6px;"></span></div>`
-        
-        infoWindow = new TMap.InfoWindow(
-          {
-          map: map,
-          enableCustom: true,
-          position: new TMap.LatLng(40.040422, 116.273521),
-          offset: { y: -70, x: -5 },
-          content: html
-          },
-        );
-
-        infoWindow2 = new TMap.InfoWindow(
-          {
-          map: map,
-          enableCustom: true,
-          position: new TMap.LatLng(40.03592, 116.27058),
-          offset: { y: -70, x: -5 },
-          content: html
-          },
-        );
       })
-      
     },
+    confirm() {
+      if(!this.latLng.lat) {
+        return this.$u.toast(`未获取到定位信息，无法定位`)
+      }
+
+      this.$http.post(`/app/appcommunitybuildinginfo/updateLocation`, null, {
+        params: {
+          id: this.params.id,
+          lat: this.latLng.lat,
+          lng: this.latLng.lng,
+        }
+      }).then(res => {
+        if (res.code == 0) {
+          this.$u.toast('提交成功')
+          setTimeout(() => {
+            this.$emit('change', {
+              type: 'List',
+            })
+          }, 600)
+        }
+      })
+    },
+    toDetail() {
+      this.$emit('change', {
+        type: 'Detail',
+        params: this.params
+      })
+    }
     
   }
 }
@@ -144,7 +142,7 @@ uni-page-body{
     position: fixed;
     bottom: 136px;
     right: 24px;
-    z-index: 99;
+    z-index: 99999;
     padding: 16px 16px 0;
     box-sizing: border-box;
     font-size: 24px;
@@ -210,5 +208,40 @@ uni-page-body{
       }
     }
   }
+  .popup-btn{
+    width: 100%;
+    font-size: 32px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    background: #1365DD;
+    color: #FFF;
+  }
+  .footer{
+    width: 100%;
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    z-index: 99999;
+    display: flex;
+    font-size: 32px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    height: 112px;
+    line-height: 112px;
+    text-align: center;
+    .click{
+      flex: 1;
+      color: #333;
+      background-color: #fff;
+    }
+    .btn{
+      flex: 2;
+      background: #1365DD;
+      color: #FFF;
+    }
+  }
 }
 </style>

src/apps/AppBuilding/components/searchMap.vue

@@ -50,7 +50,46 @@ export default {
   },
 
   methods: {
-    initMap() {
+    initMap() { this.$nextTick(() =>{
+        let {lib: TMap, map} = this
+      var markerCluster = new TMap.MarkerCluster({
+        id: 'cluster',
+        map: map,
+        enableDefaultStyle: true, // 启用默认样式
+        minimumClusterSize: 1, // 形成聚合簇的最小个数
+        geometries: [{ // 点数组
+            position: new TMap.LatLng(39.953416, 116.480945)
+          },
+          {
+            position: new TMap.LatLng(39.984104, 116.407503)
+          },
+          {
+            position: new TMap.LatLng(39.908802, 116.497502)
+          },
+          {
+            position: new TMap.LatLng(40.040417, 116.373514)
+          },
+          {
+            position: new TMap.LatLng(39.953416, 116.380945)
+          },
+          {
+            position: new TMap.LatLng(39.984104, 116.307503)
+          },
+          {
+            position: new TMap.LatLng(39.908802, 116.397502)
+          },
+          {
+            position: new TMap.LatLng(40.040417, 116.273514)
+          },
+        ],
+        zoomOnClick: true, // 点击簇时放大至簇内点分离
+        gridSize: 60, // 聚合算法的可聚合距离
+        averageCenter: false, // 每个聚和簇的中心是否应该是聚类中所有标记的平均值
+        maxZoom: 10 // 采用聚合策略的最大缩放级别
+      });
+    })
+    },
+    initMap2() {
       //初始化地图
       
       this.$nextTick(() =>{
@@ -240,7 +279,7 @@ uni-page-body{
     position: fixed;
     bottom: 136px;
     right: 24px;
-    z-index: 99;
+    z-index: 99999;
     padding: 16px 16px 0;
     box-sizing: border-box;
     font-size: 24px;