网格调整完毕

src/project/grid/AppGridManagement/Map.vue

@@ -1,11 +1,16 @@
 <template>
-  <div class="map">
+  <div class="detail">
     <div class="grid-select">
-      <span class="label">网格选择</span>
-      <div class="grid-select__right" @click="toChoose">
-        <span>{{ form.girdName || '请选择' }}</span>
-        <u-icon name="arrow-right" color="#cccccc" size="30" style="margin-left:8px;"></u-icon>
-      </div>
+      <AiPagePicker type="custom" class="fill" @select="handleSelectGird"
+                    :ops="{url:'./SelectGird',label: 'girdName'}">
+        <div class="gird-content">
+          <div class="label">网格选择</div>
+          <div class="grid-select__right">
+            <span>{{ form.girdName || '请选择' }}</span>
+            <u-icon name="arrow-right" color="#cccccc" size="26" style="margin-left:4px;"></u-icon>
+          </div>
+        </div>
+      </AiPagePicker>
     </div>
     <div class="map-content">
       <AiTMap ref="AiTMap" :map.sync="map" :lib.sync="lib" :libraries="['geometry','service', 'tools']"/>
@@ -14,23 +19,13 @@
       <div class="popup">
         <div class="bg"></div>
         <div class="title">{{ form.girdName }}</div>
-				<scroll-view scroll-y="true" class="grid-info">
-          <div class="info-flex">
-            <span class="label">网格类型</span>
-            <span class="value">{{ $dict.getLabel('girdType', form.girdType) }}</span>
-          </div>
-          <div class="info-flex">
-            <span class="label">网格层级</span>
-            <span class="value">{{ $dict.getLabel('girdLevel', form.girdLevel) }}</span>
-          </div>
-          <div v-if="form.girdMemberManageList && form.girdMemberManageList.length">
-            <div class="info-flex" v-for="(item, index) in  form.girdMemberManageList" :key="index">
-              <span class="label">网格长</span>
-              <span class="value">{{ item.name }}&nbsp;&nbsp;{{ item.phone }}
-                <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(item.phone)" class="phone-icon"
-                    v-if="item.phone">
-              </span>
-            </div>
+        <scroll-view scroll-y="true" class="grid-info">
+          <div class="info-flex" v-for="(item, index) in  form.girdMemberManageList" :key="index">
+            <span class="label">网格长</span>
+            <span class="value">
+              {{ [item.name,item.phone].join("  ") }}
+
+            </span>
           </div>
           <div v-if="form.girdMemberList && form.girdMemberList.length">
             <div class="info-flex" v-for="(item, index) in  form.girdMemberList" :key="index">
@@ -68,16 +63,10 @@ export default {
   },
   computed: {...mapState(['user', 'config'])},
   created() {
-    this.$dict.load('girdType', 'girdLevel')
+    this.$dict.load('girdType')
     this.areaId = this.user.areaId
     // this.getLeafNodes()
     uni.$on('goback', e => {
-      if (e.girdLevel == '0') {
-        setTimeout(() => {
-          this.$u.toast('请选择二级或者三级网格')
-        }, 400)
-        return false
-      }
       this.getGridList(e.id, true)
     })
   },
@@ -94,14 +83,14 @@ export default {
     getLeafNodes() {
       this.$http.post(`/app/appgirdinfo/queryGirdMemberGirdsById`).then((res) => {
         if (res?.data) {
-          this.treeList = res.data.filter(v => v.girdLevel === '2')
+          this.treeList = res.data
 
           const arr = res.data.filter(v => v.points).map(e => {
             return {
               id: e.id,
               girdName: e.girdName,
               points: e.points.map(p => [p.lng, p.lat])
-            } 
+            }
           })
 
           arr.length > 0 && this.renderGridMap(arr)
@@ -121,7 +110,6 @@ export default {
               points: v.points ? v.points.map(p => [p.lng, p.lat]) : []
             }
           })
-
           this.renderGridMap(arr)
         }
       }).catch(() => {
@@ -142,7 +130,7 @@ export default {
               girdName: res.data.girdName,
               points: res.data.points.map(p => [p.lng, p.lat])
             }]
-            
+
             this.renderGridMap(arr)
           }
 
@@ -262,17 +250,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-::v-deep uni-page-body {
+.detail {
   height: 100%;
-}
 
-ai-tree-picker {
-  display: inline-block;
-}
-
-.map {
-  height: 100%;
-  height: calc(100% - 98px);
   .grid-select {
     width: 100%;
     padding: 34px 32px;
@@ -282,14 +262,15 @@ ai-tree-picker {
     justify-content: space-between;
     line-height: 44px;
     color: #333;
-    // position: fixed;
-    // top: 0;
-    // left: 0;
-    // z-index: 999;
 
     .grid-select__right {
+      width: calc(100% - 140px);
+      text-align: right;
+    }
+
+    .gird-content {
       display: flex;
-      align-items: center;
+      justify-content: space-between;
     }
 
     .label {
@@ -309,7 +290,7 @@ ai-tree-picker {
 
   .map-content {
     width: 100%;
-    height: calc(100% - 115px);
+    height: calc(100% - 210px);
   }
 
   .popup {
@@ -343,8 +324,8 @@ ai-tree-picker {
       line-height: 40px;
       font-size: 28px;
 
-      &:last-child {
-        border: none;
+      &:last-of-type {
+        border-bottom: none;
       }
 
       .label {
@@ -357,22 +338,11 @@ ai-tree-picker {
       .value {
         color: #666;
         font-size: 26px;
-
-        .phone-icon {
-          width: 40px;
-          height: 40px;
-          vertical-align: sub;
-          margin-left: 16px;
-        }
       }
     }
   }
 }
 
-.grid-name {
-  display: inline-block;
-}
-
 .footer {
   width: 100%;
   position: fixed;