可视化网格化

src/api/components/supermap.js

@@ -54,4 +54,8 @@ export const iconList = {
   'sj-icon-map-centerdata_atmospheric_sensor': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_atmospheric_sensor.png'),//大气传感器
   'sj-icon-map-centerdata_water_pressure_sensor': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_water_pressure_sensor.png'),//水压传感器
 
+  //云图图标
+  'sj-icon-map-centerdata-t-forest-firehydrant@1': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_t_forest_firehydrant@1.png'),//地上消防栓
+  'sj-icon-map-centerdata-t-forest-firehydrant@2': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_t_forest_firehydrant@2.png'),//地下消防栓
+  'sj-icon-map-centerdata-t-forest-firehydrant@3': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_t_forest_firehydrant@3.png'),//室内消防栓
 }

src/api/forest.js

@@ -1,5 +1,24 @@
 import request from '@/utils/request'
 
+// 获取消防左侧菜单列表
+export function fireControlViewList() {
+  return request({
+    url: '/center-firecontrol/VisuForestDataCenterController/fireControlViewList',
+    method: 'post',
+  })
+}
+// 点击左侧菜单列表查询落点
+export function fireControlViewPoint(type, name) {
+  return request({
+    url: '/center-firecontrol/VisuForestDataCenterController/fireControlViewPoint',
+    method: 'post',
+    data:{
+      // "name": name,
+      "type": type
+    }
+  })
+}
+
 // 获取绑定的事件类型
 export function getMenuEventType() {
   return request({

src/views/eventdetailsdialog.vue

@@ -39,7 +39,7 @@
                       <div class="i-list-con">
                         <div class="d-l-con-icon" style="flex-direction:row;flex-wrap: nowrap;">
                           <div class="icon-con" style="width: fit-content !important;"
-                               v-for="(item,index) in resourcesList" @click="listResourceByWz(item.type)">
+                               v-for="(item,index) in resourcesList" @click="fireControlViewPoint(item.type)">
                             <div class="iconfont icon icon-normal" :class="item.icon"></div>
                             <div class="icon-text">
                               <h5>{{ item.resourceName }}</h5>
@@ -1080,6 +1080,8 @@ import areaSupermap from '@/components/supermap'//区域标记地图
 import TcPlayer from '@/components/TcPlayer' //视频预览
 import findUserByDept from '@/views/findUserByDept' //责任人选择弹框
 import {
+  fireControlViewPoint,
+  fireControlViewList,
   getEventDetail,
   sendEventLog,
   listSJfl,
@@ -1349,12 +1351,45 @@ export default {
     calendarDay: null//首页日历选择
   },
   created() {
+    // 获取消防左侧菜单列表
+    this.fireControlViewList();
     /** ----------------------------------摄像头预览开始------------------------------------- */
     const DHWsInstance = DHWs.getInstance()
     this.ws = DHWsInstance
     /** ----------------------------------摄像头预览结束------------------------------------- */
   },
   methods: {
+    // 获取消防左侧菜单列表
+    fireControlViewList() {
+      this.resourcesList = [];
+      let _this = this;
+      // {
+      //   resourceName: '取水口',
+      //     type: 'qsk',
+      //   count: '1',
+      //   icon: 'sj-icon-waterintake'
+      // },
+      fireControlViewList().then(function (res) {
+        // _this.resourcesList = res.data
+        //截取data.resourceTable字段中“_”分隔符最后一个作为关键字,重新拼接成前端需要的图标:class,格式sj-icon-xxxx,将其set回原数组
+        res.data.forEach(function (data, index) {
+          let obj = {};
+          let icon ='sj' + '-' + 'icon' + '-' + data.type.replaceAll("_", "-").replaceAll("@", "-");
+          obj.resourceName = data.name.replaceAll("(个)", "");
+          obj.type = data.type;
+          obj.count = data.num;
+          obj.icon = icon;
+          _this.resourcesList.push(obj);
+          console.log("icon_" + (index + 1) + "=", icon);
+        })
+        _this.resourcesList.push({
+          resourceName: '摄像头',
+          type: 'sxt',
+          count: '1',
+          icon: 'sj-icon-jkzx'
+        })
+      })
+    },
     /************************************责任制-开始****************************************/
     addLine: function() {//添加负责人行数
       var newValue = {
@@ -1532,6 +1567,62 @@ export default {
         })
       }
     },
+    fireControlViewPoint(type) {
+      // alert(type)
+      if (this.resourcesListCheck.indexOf(type) > -1) {
+        this.resourcesListCheck.splice(this.resourcesListCheck.indexOf(type), 1)
+        setTimeout(() => {
+          this.$refs.supermapDialog.clearMByType(type)
+        }, 1000)
+      } else {
+        // 消防资源落点
+        let param = { longitude: this.longitude, latitude: this.latitude, type: type, radius: this.radius }
+        if (type != 'sxt') {
+          fireControlViewPoint(type).then(res => {
+            if (res.data != null && res.data.pointList.length > 0) {
+              this.resourcesListCheck.push(type)
+              var markersList = []
+              for (let i = 0; i < res.data.pointList.length; i++) {
+                let markersMap = {
+                  lng: 124.59,
+                  lat: 43.02,
+                  icon: 'marker',
+                  bindPopupHtml: '',
+                  click: '',
+                  parameter: '',
+                  keepBindPopup: false,
+                  isAggregation: true
+                }
+                if (res.data.pointList.length > 50) {
+                  markersMap.isAggregation = true
+                }
+                // centerdata_t_firecontrol_basic_linkage_force
+                // sj-icon-map-centerdata-t-firecontrol-basic-linkage-force
+                markersMap.icon = 'sj-icon-map-' + type.replaceAll("_", "-");
+                // alert(res.data.pointList[i].longitude)
+                markersMap.lng = res.data.pointList[i].longitude;
+                markersMap.lat = res.data.pointList[i].latitude;
+                markersMap.bindPopupHtml = '<div class="map-tip">' +
+                  '<span>' +
+                  '                  <div class="d-l-con">' +
+                  '                  <div class="d-l-l-text">' +
+                  '                  <h4>资源名称：' + res.data.pointList[i].name + '</h4>' +
+                  '                </div>' +
+                  '                </div>' +
+                  '                </span>' +
+                  '</div>'
+                markersList.push(markersMap)
+              }
+              setTimeout(() => {
+                this.$refs.supermapDialog.setMarkersByType(markersList, type)
+              }, 1000)
+            }
+          })
+        }else {
+          this.listResourceByWz(type);
+        }
+      }
+    },
     listResourceByWz(type) {
       if (this.resourcesListCheck.indexOf(type) > -1) {
         this.resourcesListCheck.splice(this.resourcesListCheck.indexOf(type), 1)
@@ -1578,8 +1669,8 @@ export default {
                 if (res.data[i].cameraCode != null) {
                   markersMap.click = 'preview'
                   // markersMap.parameter = res.data[i].cameraCode
-                  markersMap.parameter = {code:res.data.data[i].cameraCode,
-                    type:res.data.data[i].cameraFactory}
+                  markersMap.parameter = {code:res.data[i].cameraCode,
+                    type:res.data[i].cameraFactory?res.data[i].cameraFactory:1}
                 }
               }
               markersMap.lng = res.data[i].longitude