同步地区组件

src/components/AiAreaPicker/AiAreaPicker.vue

@@ -131,12 +131,12 @@ export default {
       obj.select('#areaSelector').boundingClientRect()
       obj.exec(rect => {
         if (rect.length) {
-          this.height = `calc(100% - ${rect[0].height}px)`
+          this.height = `calc(100% - ${rect[0]?.height}px)`
         }
       })
     },
     getFullArea(areaId) {
-      return areaId && this.$http.post('/admin/area/getAllParentAreaId', null, {
+      return areaId && this.$instance.post('/admin/area/getAllParentAreaId', null, {
         withoutToken: true,
         params: {areaId},
       }).then((res) => {
@@ -327,6 +327,8 @@ export default {
   }
 
   ::v-deep .pendingList {
+    height: 500px;
+    overflow-y: auto;
     padding: 0 32px 120px;
     box-sizing: border-box;
 

src/mods/AppVideoSurve/AppVideoSurve.vue

@@ -1,11 +1,9 @@
 <template>
   <section class="videoSurveillance">
     <div class="area-content">
-      <AiAreaPicker class="ai-area" :value="areaId" :areaId="areaId" :name.sync="areaName" @select="areaSelect">
+      <AiAreaPicker class="ai-area" :name.sync="areaName" @select="areaSelect">
         <div class="ai-area__wrapper">
-          <span class="label" v-if="areaName">{{ areaName }}</span>
+          <u-icon name="arrow-down" color="#666" size="24" :label="areaName||'请选择'" label-pos="left" label-size="40"/>
-          <span v-else>请选择</span>
-          <u-icon name="arrow-down" color="#666" size="24"></u-icon>
         </div>
       </AiAreaPicker>
     </div>
@@ -27,26 +25,29 @@
 
     <div class="list-content">
       <div class="item" v-for="(item, index) in list" :key="index" @click="showMonitor(item)">
-        <img class="img" :src="item.indexUrl" alt="" v-if="item.deviceStatus == 1" />
+        <img class="img" :src="item.indexUrl" alt="" v-if="item.deviceStatus == 1"/>
-        <img class="img" src="https://cdn.cunwuyun.cn/dvcp/AppVideoSurve/offline.png" alt="" v-else />
+        <img class="img" src="https://cdn.cunwuyun.cn/dvcp/AppVideoSurve/offline.png" alt="" v-else/>
         <p>{{ item.name }}</p>
-        <img class="icon" src="https://cdn.cunwuyun.cn/dvcp/AppVideoSurve/https://cdn.cunwuyun.cn/dvcp/AppVideoSurve" alt="" v-if="item.deviceStatus == 1" />
+        <img class="icon" src="https://cdn.cunwuyun.cn/dvcp/AppVideoSurve/https://cdn.cunwuyun.cn/dvcp/AppVideoSurve"
-        <img class="icon" src="https://cdn.cunwuyun.cn/dvcp/AppVideoSurve/not-https://cdn.cunwuyun.cn/dvcp/AppVideoSurve" alt="" v-else />
+             alt="" v-if="item.deviceStatus == 1"/>
+        <img class="icon"
+             src="https://cdn.cunwuyun.cn/dvcp/AppVideoSurve/not-https://cdn.cunwuyun.cn/dvcp/AppVideoSurve" alt=""
+             v-else/>
       </div>
-      <AiEmpty v-if="!list.length" />
+      <AiEmpty v-if="!list.length"/>
     </div>
   </section>
 </template>
 
 <script>
-import { mapState } from 'vuex'
+import {mapState} from 'vuex'
 
 export default {
   name: 'AppVideoSurve',
   appName: '视频监控',
   data() {
     return {
-      nodes: [{ nodeName: '首页' }],
+      nodes: [{nodeName: '首页'}],
       monitors: [],
 
       areaId: '',
@@ -58,8 +59,9 @@ export default {
       offlineRate: '',
     }
   },
-  computed: { ...mapState(['user']) },
+  computed: {...mapState(['user'])},
-  onLoad() {},
+  onLoad() {
+  },
   onShow() {
     this.areaId = this.$areaId
     this.areaName = this.$areaName
@@ -80,15 +82,15 @@ export default {
     getMonitors(nodeId, queryType = 0) {
       this.monitors = []
       this.$instance
-        .post('/app/appzyvideoequipment/getTree', {
+      .post('/app/appzyvideoequipment/getTree', {
-          nodeId,
+        nodeId,
-          queryType,
+        queryType,
-        })
+      })
-        .then((res) => {
+      .then((res) => {
-          if (res?.data) {
+        if (res?.data) {
-            this.monitors = JSON.parse(res.data)?.[queryType == 0 ? 'node' : 'device'] || []
+          this.monitors = JSON.parse(res.data)?.[queryType == 0 ? 'node' : 'device'] || []
-          }
+        }
-        })
+      })
     },
 
     getMore(row) {
@@ -112,7 +114,7 @@ export default {
 
     showMonitor(row) {
       if (row.deviceStatus != 1) return
-      uni.navigateTo({ url: `./monitorDetail?id=${row.id}` })
+      uni.navigateTo({url: `./monitorDetail?id=${row.id}`})
     },
   },
 }
@@ -123,10 +125,12 @@ export default {
   background: #fff;
   padding: 0 32px;
   height: 100%;
+
   .area-content {
     .ai-area {
       .ai-area__wrapper {
         padding: 28px 0;
+
         .label {
           font-size: 40px;
           font-weight: 600;
@@ -219,6 +223,7 @@ export default {
         left: 158px;
       }
     }
+
     .item:nth-child(2n + 0) {
       margin-left: 3.5%;
     }