From 19e3b730db6bc99122e09ac82151ed87a4e0c8cf Mon Sep 17 00:00:00 2001
From: yanran200730 <yanran200830@163.com>
Date: Mon, 21 Mar 2022 15:04:43 +0800
Subject: [PATCH] 28383

---
 packages/monitor/components/locateDialog.vue  |   1 -
 .../AppMonitorManage/AppMonitorManage.vue     | 277 +++++++++---------
 .../monitor/components/locateDialog.vue       |  12 +-
 3 files changed, 151 insertions(+), 139 deletions(-)

diff --git a/packages/monitor/components/locateDialog.vue b/packages/monitor/components/locateDialog.vue
index a8af27a3..e3e6c673 100644
--- a/packages/monitor/components/locateDialog.vue
+++ b/packages/monitor/components/locateDialog.vue
@@ -55,7 +55,6 @@ export default {
         plugins: ['AMap.PlaceSearch', 'AMap.Marker', 'AMap.Geolocation'],
       }).then(AMap => {
         this.AMap = AMap
-        console.log(this.latlng)
         this.map = new AMap.Map('amap', {
           zoom: 14,
           center: this.latlng ? [this.latlng.lng, this.latlng.lat] : ''
diff --git a/project/shandong10086/apps/shandong/monitor/AppMonitorManage/AppMonitorManage.vue b/project/shandong10086/apps/shandong/monitor/AppMonitorManage/AppMonitorManage.vue
index 1d8200d1..4dbfe6ec 100644
--- a/project/shandong10086/apps/shandong/monitor/AppMonitorManage/AppMonitorManage.vue
+++ b/project/shandong10086/apps/shandong/monitor/AppMonitorManage/AppMonitorManage.vue
@@ -25,162 +25,169 @@
         </el-form-item>
       </el-form>
     </ai-dialog>
-    <locate-dialog v-model="locate" :ins="instance" @confirm="v=>handleLocate(selected,v)"/>
-    <ai-area custom-clicker :input-clicker="false" v-model="selected.areaId" :instance="instance" ref="BindArea"
+    <locate-dialog v-model="locate" :ins="instance" :latlng="latlng" @confirm="v=>handleLocate(selected,v)"/>
+    <ai-area custom-clicker :input-clicker="false" v-model="selected.areaId" :hideLevel="disabledLevel" :instance="instance" ref="BindArea"
              @change="handleSubmit(selected)"/>
   </section>
 </template>
 
 <script>
-import DeviceSlider from "../components/deviceSlider";
-import LocateDialog from "../components/locateDialog";
+  import { mapState } from 'vuex'
+  import DeviceSlider from "../components/deviceSlider";
+  import LocateDialog from "../components/locateDialog";
 
-export default {
-  name: "AppMonitorManage",
-  components: {LocateDialog, DeviceSlider},
-  label: "监控实况",
-  props: {
-    instance: Function,
-    dict: Object,
-    permissions: Function
-  },
-  computed: {
-    splitOps() {
-      return [
-        {label: "单分屏", value: 1, per: "100%"},
-        {label: "四分屏", value: 4, per: "49%"},
-        {label: "九分屏", value: 9, per: "32%"}
-      ]
+  export default {
+    name: "AppMonitorManage",
+    components: {LocateDialog, DeviceSlider},
+    label: "监控实况",
+    props: {
+      instance: Function,
+      dict: Object,
+      permissions: Function
     },
-    currentSplitStyle() {
-      let per = this.splitOps.find(e => e.value == this.splitScreen)?.per || "100%"
-      return {width: per, height: per}
+    computed: {
+      splitOps() {
+        return [
+          {label: "单分屏", value: 1, per: "100%"},
+          {label: "四分屏", value: 4, per: "49%"},
+          {label: "九分屏", value: 9, per: "32%"}
+        ]
+      },
+      currentSplitStyle() {
+        let per = this.splitOps.find(e => e.value == this.splitScreen)?.per || "100%"
+        return {width: per, height: per}
+      },
+      ...mapState(['user'])
     },
-  },
-  data() {
-    return {
-      slider: true,
-      fullscreen: false,
-      splitScreen: 1,
-      monitors: [],
-      dialog: false,
-      locate: false,
-      selected: {},
-      rules: {
-        name: [{required: true, message: "请填写 设备名称"}]
+
+    data() {
+      return {
+        slider: true,
+        fullscreen: false,
+        splitScreen: 1,
+        monitors: [],
+        dialog: false,
+        locate: false,
+        selected: {
+          areaId: ''
+        },
+        latlng: null,
+        disabledLevel: 0,
+        rules: {
+          name: [{required: true, message: "请填写 设备名称"}]
+        }
       }
-    }
-  },
-  methods: {
-    handleFullscreen() {
-      this.fullscreen = !this.fullscreen
-      this.$fullscreen(this.fullscreen)
     },
-    handleSelectMonitor(monitor) {
-      let {id} = monitor,
-          index = this.monitors.findIndex(e => e.id == id)
-      if (index > -1) {
-        this.monitors.splice(index, 1)
-        this.monitors.map((e, i) => {
-          if (i > index) {
-            this.showMonitor(e, true)
+
+    created () {
+      this.selected.areaId = this.user.info.areaId
+      this.disabledLevel = this.user.info.areaList.length
+    },
+
+    methods: {
+      handleFullscreen() {
+        this.fullscreen = !this.fullscreen
+        this.$fullscreen(this.fullscreen)
+      },
+      handleSelectMonitor(monitor) {
+        let {id} = monitor,
+            index = this.monitors.findIndex(e => e.id == id)
+        if (index > -1) {
+          this.monitors.splice(index, 1)
+          this.monitors.map((e, i) => {
+            if (i > index) {
+              this.showMonitor(e, true)
+            }
+          })
+        } else if (this.monitors.length >= this.splitScreen && this.splitScreen > 1) {
+          this.$message.warning("可分屏监控已满,请先取消其他的监控")
+        } else {
+          this.showMonitor(monitor)
+        }
+      },
+      showMonitor(monitor, refresh = false) {
+        let {id: deviceId} = monitor
+        deviceId && this.instance.post("/app/appzyvideoequipment/getWebSdkUrl", null, {
+          params: {deviceId}
+        }).then(res => {
+          if (res?.data) {
+            let data = JSON.parse(res.data)
+            if (refresh) {
+              monitor.url = data.url
+            } else if (this.splitScreen == 1) {
+              this.monitors = [{...monitor, ...data}]
+            } else {
+              this.monitors.push({...monitor, ...data})
+            }
           }
         })
-      } else if (this.monitors.length >= this.splitScreen && this.splitScreen > 1) {
-        this.$message.warning("可分屏监控已满,请先取消其他的监控")
-      } else {
-        this.showMonitor(monitor)
-      }
-    },
-    showMonitor(monitor, refresh = false) {
-      let {id: deviceId} = monitor
-      deviceId && this.instance.post("/app/appzyvideoequipment/getWebSdkUrl", null, {
-        params: {deviceId}
-      }).then(res => {
-        if (res?.data) {
-          let data = JSON.parse(res.data)
-          if (refresh) {
-            monitor.url = data.url
-          } else if (this.splitScreen == 1) {
-            this.monitors = [{...monitor, ...data}]
-          } else {
-            this.monitors.push({...monitor, ...data})
-          }
-        }
-      })
-    },
-    renderTreeItem: function (h, {node, data}) {
-      let show = data.deviceStatus==1 ? 'show' : ''
-      if (node.isLeaf) {
-        return (
+      },
+      renderTreeItem: function (h, {node, data}) {
+        let show = data.deviceStatus==1 ? 'show' : ''
+        if (node.isLeaf) {
+          return (
+              <div class="flexRow">
+                <i class={['iconfont', 'iconshipinjiankong', show]}/>
+                <div>{node.label}</div>
+                <el-dropdown class="menuBtn" onCommand={e => this.handleSliderOption(e, data)}>
+                  <i class="iconfont iconMore"/>
+                  <el-dropdown-menu slot="dropdown">
+                    <el-dropdown-item command="edit">修改名称</el-dropdown-item>
+                    <el-dropdown-item command="area">行政地区</el-dropdown-item>
+                    <el-dropdown-item command="locate">地图标绘</el-dropdown-item>
+                  </el-dropdown-menu>
+                </el-dropdown>
+              </div>
+          )
+        } else return (
             <div class="flexRow">
-              <i class={['iconfont', 'iconshipinjiankong', show]}/>
               <div>{node.label}</div>
-              <el-dropdown class="menuBtn" onCommand={e => this.handleSliderOption(e, data)}>
-                <i class="iconfont iconMore"/>
-                <el-dropdown-menu slot="dropdown">
-                  <el-dropdown-item command="changeStatus">设为公开</el-dropdown-item>
-                  <el-dropdown-item command="edit">修改名称</el-dropdown-item>
-                  <el-dropdown-item command="area">行政地区</el-dropdown-item>
-                  <el-dropdown-item command="locate">地图标绘</el-dropdown-item>
-                </el-dropdown-menu>
-              </el-dropdown>
+              {data.id != 'no_area' ? <div class="sta">
+                    <p>{data.online || 0}</p>/{data.sum || 0}
+                  </div>
+                  : <div/>}
             </div>
         )
-      } else return (
-          <div class="flexRow">
-            <div>{node.label}</div>
-            {data.id != 'no_area' ? <div class="sta">
-                  <p>{data.online || 0}</p>/{data.sum || 0}
-                </div>
-                : <div/>}
-          </div>
-      )
-    },
-    handleSliderOption(command, data) {
-      this.selected = JSON.parse(JSON.stringify({...data, command}))
-      if (command == "edit") {//修改名称
-        this.dialog = true
-      } else if (command == "area") {//绑定areaId
-        this.$refs.BindArea?.chooseArea()
-      } else if (command == "locate") {//地图标绘
-        this.locate = true
-      } else {
-        this.$confirm('确定设为公开？').then(() => {
-          console.log(data)
-          // this.instance.post(`/app/appeveryvillagecode/delete?ids=${this.selected.id}`).then(res => {
-          //   if (res.code == 0) {
-          //     this.getList()
-          //   }
-          // })
-        })
-      }
-    },
-    handleSubmit(row) {
-      delete row.createTime
-      return this.instance.post("/app/appzyvideoequipment/addOrUpdate", {
-        ...row
-      }).then(res => {
-        if (res?.code == 0) {
-          this.$message.success("提交成功!")
-          this.dialog = false
-          this.$refs.DeviceSlider?.getDevices()
+      },
+      handleSliderOption(command, data) {
+        this.selected = JSON.parse(JSON.stringify({...data, command}))
+        if (command == "edit") {//修改名称
+          this.dialog = true
+        } else if (command == "area") {//绑定areaId
+          this.$refs.BindArea?.chooseArea()
+        } else if (command == "locate") {//地图标绘
+          this.latlng = data.lat && data.lng ? {
+            lat: data.lat,
+            lng: data.lng
+          } : ''
+          this.locate = true
         }
-      })
-    },
-    handleLocate(row, locate) {
-      if (locate) {
-        let {lat, lng} = locate.location
-        this.handleSubmit({...row, lat, lng}).then(() => {
-          this.locate = false
+      },
+      handleSubmit(row) {
+        delete row.createTime
+        return this.instance.post("/app/appzyvideoequipment/addOrUpdate", {
+          ...row
+        }).then(res => {
+          if (res?.code == 0) {
+            this.$message.success("提交成功!")
+            this.dialog = false
+            this.$refs.DeviceSlider?.getDevices()
+          }
         })
+      },
+      handleLocate(row, locate) {
+        if (locate) {
+          let {lat, lng} = locate.location
+          this.handleSubmit({...row, lat, lng}).then(() => {
+            this.locate = false
+          })
+        }
       }
+    },
+    beforeDestroy() {
+      this.monitors = []
     }
-  },
-  beforeDestroy() {
-    this.monitors = []
   }
-}
 </script>
 
 <style lang="scss" scoped>
diff --git a/project/shandong10086/apps/shandong/monitor/components/locateDialog.vue b/project/shandong10086/apps/shandong/monitor/components/locateDialog.vue
index 13cdd466..a8af27a3 100644
--- a/project/shandong10086/apps/shandong/monitor/components/locateDialog.vue
+++ b/project/shandong10086/apps/shandong/monitor/components/locateDialog.vue
@@ -30,9 +30,7 @@ export default {
     prop: "visible",
     event: "visible",
   },
-  props: {
-    visible: Boolean
-  },
+  props: ['latlng', 'visible'],
   data() {
     return {
       dialog: false,
@@ -57,13 +55,21 @@ export default {
         plugins: ['AMap.PlaceSearch', 'AMap.Marker', 'AMap.Geolocation'],
       }).then(AMap => {
         this.AMap = AMap
+        console.log(this.latlng)
         this.map = new AMap.Map('amap', {
           zoom: 14,
+          center: this.latlng ? [this.latlng.lng, this.latlng.lat] : ''
         }).on('click', res => {
           this.map.clearMap()
           this.selected = {location: res.lnglat}
           this.poi?.searchNearBy('', res.lnglat, 100)
         });
+        if (this.latlng) {
+          let marker = new AMap.Marker({
+            position: [this.latlng.lng, this.latlng.lat]
+          })
+          this.map.add(marker)
+        }
         this.poi = new AMap.PlaceSearch().on('complete', ({poiList}) => {
           this.map.clearMap()
           if (poiList?.length > 0) {