Merge remote-tracking branch 'origin/visu_environment' into visu_environment

src/api/components/supermap.js

@@ -28,4 +28,14 @@ export const iconList = {
   'sj-icon-map-centerdata-t-environment-source-pollution': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata-t-environment-source-pollution.png'),//污染源
   'sj-icon-map-centerdata_t_environment_sewage_outlet': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_t_environment_sewage_outlet.png'),//排污口
   'sj-icon-map-centerdata-t-environment-key-enterprise': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata-t-environment-key-enterprise.png'),//重点企业
+
+  // 数据中心传感器
+  'sj-icon-map-centerdata_water_quality_sensor': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_water_quality_sensor.png'),//水质传感器
+  'sj-icon-map-centerdata_water_gauge': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_water_gauge.png'),//水尺
+  'sj-icon-map-centerdata_hydrological_monitoring_equipment': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_hydrological_monitoring_equipment.png'),//水文监测设备
+  'sj-icon-map-centerdata_soil_monitoring_equipment': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_soil_monitoring_equipment.png'),//土壤监测设备
+  'sj-icon-map-centerdata_pest_and_disease_monitoring_station': require('@/assets/icons/sj-icon-map/centerdata/sj-icon-map-centerdata_pest_and_disease_monitoring_station.png'),//病虫害监测站
+  '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'),//水压传感器
+
 }

src/api/datacenter.js

@@ -9,11 +9,14 @@ export function getResource() {
 }
 
 //点击左侧菜单列表查询落点
-export function getResourcePoint(resourceTable) {
+export function getResourcePoint(resourceTable, name) {
   return request({
     url: '/center-environment/VisuForestDataCenterController/getResourcePoint',
     method: 'post',
-    data:{"resourceTable":resourceTable}
+    data:{
+      "name": name,
+      "resourceTable":resourceTable
+    }
   })
 }
 //点击右侧菜单列表查询落点

src/api/forest.js

@@ -15,6 +15,13 @@ export function getTodayEvents(param) {
     data: param
   })
 }
+// 获取消息列表
+export function selectMessageList(userId) {
+  return request({
+    url: '/center-message/centerMessageFeign/selectMessageList/'+userId,
+    method: 'get'
+  })
+}
 // 左侧获取事件部门数量
 export function getDeptEventCount(param) {
   return request({

src/api/monitor.js

@@ -53,13 +53,22 @@ export function rotation(lng,lat,list) {
   })
 }
 
-//根据部门ID获取具有查看权限的摄像头
-export function getCamerasByDeptId(deptId) {
+//根据部门id查询部门及部门以下的数据，没有则默认查询所有
+export function getSensorListByDeptId(deptId) {
   return request({
-    url: '/center-environment/VisuForestMonitorCenterController/getCamerasByDeptId?deptId=' + deptId,
+    url: '/center-environment/VisuForestMonitorCenterController/getSensorListByDeptId?deptId=' + deptId,
     method: 'get',
   })
 }
+//根据部门id查询部门及部门以下的数据，没有则默认查询所有
+export function getDlblistBydeptId(deptId) {
+  return request({
+    url: '/center-environment/VisuForestMonitorCenterController/getDlblistBydeptId?deptId=' + deptId,
+    method: 'get',
+  })
+}
+
+
 /***********************************和上面方法目前一样只是入参不一样以后可能有不一样的地方 start  所以下面三个方法暂时没用到**********************/
 // // 获取环保污染源设备列表
 // export function selectListDevice(param) {

src/assets/iconfont/iconfont.json

@@ -8,7 +8,7 @@
     {
       "icon_id": "10083087",
       "name": "GIS-图例、图层icon_排污井",
-      "font_class": "paiwukou",
+      "font_class": "centerdata-t-environment-sewage-outlet",
       "unicode": "e63c",
       "unicode_decimal": 58940
     },
@@ -127,21 +127,21 @@
     {
       "icon_id": "33526953",
       "name": "禁烧区",
-      "font_class": "area",
+      "font_class": "centerdata-t-environment-prohibition-area",
       "unicode": "e62f",
       "unicode_decimal": 58927
     },
     {
       "icon_id": "33526954",
       "name": "重点企业",
-      "font_class": "enterprise",
+      "font_class": "centerdata-t-environment-key-enterprise",
       "unicode": "e630",
       "unicode_decimal": 58928
     },
     {
       "icon_id": "33526955",
       "name": "污染源",
-      "font_class": "pollution",
+      "font_class": "centerdata-t-environment-source-pollution",
       "unicode": "e631",
       "unicode_decimal": 58929
     },

src/assets/styles/base.scss

@@ -4,7 +4,7 @@ $fontLED: led;
 
 //颜色
 $white: #fff;
-$inBlue: #26cbc6;
+$inBlue: #2bacf7;
 $subtitle: #638395;
 $inBlueHover: #07ffc1;
 $inYellow: #ffd014;
@@ -12,43 +12,46 @@ $deepBlue: #0b293a;
 $listText: #1a7988;
 $textGray: #ccc;
 $grayBlue: #5685a0;
-$tipHover: #23b8ba;
+$tipHover: #2082ba;
 $eventBG: #0b284e;
 
 
 //渐变
-$GradualGreen: 180deg, rgba($color: #1a996f, $alpha: .8),
+$GradualGreen: 180deg, rgba($color: #124799, $alpha: .8),
 rgba($color: #04151e, $alpha: .8);
 
-$conBg: 180deg, rgba($color: #0f282c, $alpha: 1),
-rgba($color: #051216, $alpha: 1);
+$conBg: 180deg, rgba($color: #0f162c, $alpha: 1),
+rgba($color: #040b1f, $alpha: 1);
 
-$btmMemu: 180deg, rgba($color: #0a2011, $alpha: 1),
-rgba($color: #012a08, $alpha: 1);
+$btmMemu: 180deg, rgba($color: #0d1620, $alpha: 1),
+rgba($color: #020f2a, $alpha: 1);
 
 $boxBG: 180deg, rgba($color: #0d2760, $alpha: 1),
 rgba($color: #081a41, $alpha: 1);
 
+$popupBG:180deg, rgba($color: #1541a0, $alpha: 1),
+rgba($color: #3566d0, $alpha: 1);
+
 //内阴影
-$shadowList: 0 0 1rem 0 rgba($color: #0b2523, $alpha: .8);
-$shadowTitle: 0 -0.2rem .5rem 0.3rem rgba($color: #15dbb4, $alpha: .09) inset;
-$shadowListHover: rgba($color: #21b387, $alpha: .7) 0px 0px 50px inset;
+$shadowList: 0 0 1rem 0 rgba($color: #0b1b25, $alpha: .8);
+$shadowTitle: 0 -0.2rem .5rem 0.3rem rgba($color: #0dc0db, $alpha: .09) inset;
+$shadowListHover: rgba($color: #0567c2, $alpha: .7) 0px 0px 50px inset;
 $shadowListHoverI: 0 0 3px rgba($color: #41ff84, $alpha: .5), -0 -0 10px rgba($color: #41fff8, $alpha: .9);
-$shadowTip: 0 0 1rem 0 rgba($color: #34c7e7, $alpha: .8) inset;
+$shadowTip: 0 0 1rem 0 rgba($color: #387ee7, $alpha: .8) inset;
 $shadowCount: 0 0 .5rem 0 rgba($color: #00c8ff, $alpha: 1) inset;
 
 //可视化 数字林业
-$fBlue: #38cb9a;
+$fBlue: #03c6e2;
 $fBlueHover: #07ffc1;
 $fBlueG: #0bf3f7;
-$fListTitle: #20cbb2;
-$barBgc: rgba($color: #102127, $alpha: .9);
-$barShadow: rgba($color: #17d1bc, $alpha: .8) 0px 0px 18px inset;
+$fListTitle: #2bacf7;
+$barBgc: rgba($color: #051520, $alpha: .9);
+$barShadow: rgba($color: #078ad1, $alpha: .8) 0px 0px 18px inset;
 $barBorder: solid rgba($color: #33467f, $alpha: .7);
 $tableBorder: solid rgba($color: #33467f, $alpha: .7);
 $countBorder: solid rgba($color: #00aeff, $alpha: .9);
-$searchBorder: solid rgba($color: #327f61, $alpha: 1);
-$searchBG: #102127;
+$searchBorder: solid rgba($color: #33467f, $alpha: 1);
+$searchBG: #101527;
 $deepBG: #09192f;
 //icon
 $iconBg: #f5ad1b, #58b35d, #0FA2FF, #da8ec5, #78bfc2, #a28e52, #ff6063, #96bd5b, #f5ad1b, #da8ec5, #5f89ce, #78bfc2, #bec278, #f07779;
@@ -79,19 +82,17 @@ $date-state1: #2abc65;
 $date-state2: #e68d3f;
 $date-state3: #d6333b;
 
-
 //视频摄像头预览弹层样式
 .videoCustomWidth {
   width: 1070px !important;
-  height: 750px !important;
+  height: 700px !important;
 }
 //电视墙视频摄像头预览弹层样式
 .TVWallCustomWidth {
   width: 1200px !important;
-  height: 800px !important;
+  height: 750px !important;
 }
 
-
 //公共
 body {
   height: 100%;
@@ -230,6 +231,40 @@ ul {
   height: 100vh;
 }
 
+ //超图气泡
+ .leaflet-popup-content-wrapper {
+  // padding: 15px 20px !important;
+  background-image: -moz-linear-gradient($popupBG)!important;
+  background-image: -webkit-linear-gradient($popupBG) !important;
+  background-image: linear-gradient($popupBG)!important;
+  box-shadow: $shadowTitle !important;
+  color: #3cd7ef !important;
+
+
+}
+.leaflet-popup-tip{
+  background: #3061c9 !important;
+  color: #333;
+  box-shadow:none !important;
+}
+ //超图气泡内插槽
+  .map-tip {
+    .d-l-con {
+      width: 100%;
+      box-shadow: none;
+
+      .d-l-l-text {
+        width: 100%;
+        //white-space: nowrap;
+
+        h4 {
+          // display: flex;
+          color:$white;
+        }
+      }
+    }
+  }
+
 div::-webkit-scrollbar {
   display: none;
 }
@@ -580,6 +615,7 @@ div::-webkit-scrollbar {
     height: 780px !important;
     position: absolute;
     z-index: 999;
+
     button {
       padding: 0 .3rem;
       height: 1.5rem;
@@ -823,8 +859,8 @@ div::-webkit-scrollbar {
 
           .el-collapse-item__arrow {
             color: $inBlue;
-            position: relative;
-            left: -20.5rem;
+            position: absolute;
+            left: 1rem;
             margin: 0;
           }
 
@@ -1128,8 +1164,8 @@ div::-webkit-scrollbar {
 
           .el-collapse-item__arrow {
             color: $inBlue;
-            position: relative;
-            left: -20.5rem;
+            position: absolute;
+            left: 1rem;
             margin: 0;
           }
 
@@ -1353,22 +1389,7 @@ div::-webkit-scrollbar {
     color: $inBlue;
   }
 
-  .map-tip {
-    .d-l-con {
-      width: 100%;
-      box-shadow: none;
-
-      .d-l-l-text {
-        width: 100%;
-        //white-space: nowrap;
-
-        h4 {
-          display: flex;
-          color: #04080c;
-        }
-      }
-    }
-  }
+ 
 
   //收起展开
   .mascot {
@@ -1793,8 +1814,8 @@ div::-webkit-scrollbar {
 
     .el-collapse-item__arrow {
       color: $inBlue;
-      position: relative;
-      left: -20.5rem;
+      position: absolute;
+      left: 1rem;
       margin: 0;
     }
 
@@ -1944,6 +1965,7 @@ div::-webkit-scrollbar {
 
 }
 
+
 .d-evnet-list-con {
   padding: .5rem .5rem !important;
   align-items: flex-start !important;
@@ -2160,13 +2182,16 @@ div::-webkit-scrollbar {
     max-width: 90%;
   }
 
+
   .d-l-l-text {
     display: flex;
     align-items: center;
     flex: 1;
     color: $fListTitle;
     padding: .2rem;
-
+    .el-tooltip__popper{
+		width: 100px;
+	}
     h4 {
       font-size: .7rem;
       margin: 0;
@@ -2299,7 +2324,8 @@ div::-webkit-scrollbar {
 
   //曝光台
   .bgt-state {
-    width: 35%;
+    // width: 35%;
+	width:38%;
     padding: 0.3rem 0.5rem;
     border: 2px solid rgba(0, 174, 255, 0.9);
     -webkit-box-shadow: 0 0 0.5rem 0 #00c8ff inset;
@@ -2314,9 +2340,9 @@ div::-webkit-scrollbar {
     color: $white;
 
     .bgt-state-frequency {
-      width: 1.2rem;
-      height: 1.2rem;
-      font-size: 1rem;
+      width: 1.1rem;
+      height: 1.1rem;
+      font-size: 0.8rem;
       background-color: #1294a0;
       text-align: center;
       line-height: 1.2rem;
@@ -2349,7 +2375,8 @@ div::-webkit-scrollbar {
         width: fit-content;
         background-color: $eventStateColor-sb;
         color: $white;
-        padding: .4rem;
+        // padding: .4rem;
+		padding:0.25rem 0.4rem;
         margin-left: -.5rem;
         margin-bottom: .2rem;
         border-radius: .2rem;
@@ -2371,7 +2398,8 @@ div::-webkit-scrollbar {
         width: fit-content;
         background-color: $eventStateColor-cb;
         color: $white;
-        padding: .4rem;
+        // padding: .4rem;
+		padding:0.25rem 0.4rem;
         margin-left: -.5rem;
         margin-bottom: .2rem;
         border-radius: .2rem;
@@ -2393,7 +2421,8 @@ div::-webkit-scrollbar {
         width: fit-content;
         background-color: $eventStateColor-qs;
         color: $white;
-        padding: .4rem;
+        // padding: .4rem;
+		padding:0.25rem 0.4rem;
         margin-left: -.5rem;
         margin-bottom: .2rem;
         border-radius: .2rem;
@@ -2415,7 +2444,8 @@ div::-webkit-scrollbar {
         width: fit-content;
         background-color: $eventStateColor-wb;
         color: $white;
-        padding: .4rem;
+        // padding: .4rem;
+		padding:0.25rem 0.4rem;
         margin-left: -.5rem;
         margin-bottom: .2rem;
         border-radius: .2rem;
@@ -2437,7 +2467,8 @@ div::-webkit-scrollbar {
         width: fit-content;
         background-color: $eventStateColor-cf;
         color: $white;
-        padding: .4rem;
+        // padding: .4rem;
+		padding:0.25rem 0.4rem;
         margin-left: -.5rem;
         margin-bottom: .2rem;
         border-radius: .2rem;
@@ -2459,7 +2490,8 @@ div::-webkit-scrollbar {
         width: fit-content;
         background-color: $eventStateColor-bj;
         color: $white;
-        padding: .4rem;
+        // padding: .4rem;
+		padding:0.25rem 0.4rem;
         margin-left: -.5rem;
         margin-bottom: .2rem;
         border-radius: .2rem;
@@ -2481,13 +2513,13 @@ div::-webkit-scrollbar {
         width: fit-content;
         background-color: $eventStateColor-gd;
         color: $white;
-        padding: .4rem;
+        // padding: .4rem;
+		padding:0.25rem 0.4rem;
         margin-left: -.5rem;
         margin-bottom: .2rem;
         border-radius: .2rem;
       }
     }
-
     //确认
     .event-state-qr {
       display: flex;
@@ -2503,7 +2535,7 @@ div::-webkit-scrollbar {
         width: fit-content;
         background-color: $eventStateColor-qr;
         color: $white;
-        padding:0.25rem 0.4rem;
+		    padding:0.25rem 0.4rem;
         margin-left: -.5rem;
         margin-bottom: .2rem;
         border-radius: .2rem;
@@ -2878,7 +2910,9 @@ div::-webkit-scrollbar {
 }
 
 .el-dialog:not(.is-fullscreen) {
-  margin-top: 10vh !important;
+  // margin-top: 10vh !important;
+  margin-top: 2vh !important;
+  z-index: 9999;
 }
 
 
@@ -2948,22 +2982,22 @@ div::-webkit-scrollbar {
   background: $GradualGreen;
   margin-right: 5px;
   color: #3cd7ef;
-  background: -webkit-gradient(linear, right top, left top, from(#052b24), color-stop(#00335c), to(#052b1d));
-  background: linear-gradient(to left, #052b28, #00575c, #042b27);
+  background: -webkit-gradient(linear, right top, left top, from(#051d2b), color-stop(#00335c), to(#051d2b));
+  background: linear-gradient(to left, #051d2b, #00335c, #051d2b);
 }
 
 .el-tabs__item:hover {
   color: #fff;
-  background: linear-gradient(to left, #051d2b, #0ba9c8, #051d2b);
-  box-shadow: rgba($color: #0ca1c2, $alpha: .8) 0px 0px 15px inset;
+  background: linear-gradient(to left, #051d2b, #006ec8, #051d2b);
+  box-shadow: rgba($color: #0567c2, $alpha: .8) 0px 0px 15px inset;
 }
 
 .el-tabs__item.is-active {
   color: #fff;
   font-size: 15px;
   font-weight: bolder;
-  background: linear-gradient(to left, #051d2b, #0ba9c8, #051d2b);
-  box-shadow: rgba($color: #13c231, $alpha: .8) 0px 0px 15px inset;
+  background: linear-gradient(to left, #051d2b, #006ec8, #051d2b);
+  box-shadow: rgba($color: #0567c2, $alpha: .8) 0px 0px 15px inset;
 }
 
 
@@ -3149,3 +3183,38 @@ div::-webkit-scrollbar {
 }
 
 
+
+
+// 20220927 林业修改
+.no_hover:hover{
+	background: none!important;
+	box-shadow: initial;
+}
+.no_hover:hover h4{
+	color:#2bacf7!important;
+}
+.no_hover:hover .event-count .count-number{
+	border: 2px solid rgb(59 193 255 / 90%);
+	-webkit-box-shadow: 0 0 0.5rem 0 #2700ff inset;
+	box-shadow: 0 0 0.5rem 0 #2700ff inset;
+	background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(#55b8f7), to(#8f3bff));
+}
+
+.tree_scroll::-webkit-scrollbar{
+	width: 1px;
+	height: 4px;
+	background: #00335c;
+}
+.tz_tk .el-dialog{
+	width: 20% !important;
+}
+.tz_tk .el-form-item__label{
+	color: #d2d2d2;
+}
+
+// .d-l-l-text h4{
+// 	color:#fff!important;
+// }
+.no_hover .no-weight h4{
+	color:#2bacf7!important;
+}

src/components/eventLocation.vue

@@ -483,7 +483,7 @@ export default {
                 '<span>' +
                 '                  <div class="d-l-con">' +
                 '                  <div class="d-l-l-text">' +
-                '                  <h4>摄像头类型：' + (res.data[i].cameraFactory=="1"?"大华":"海康") + '</h4>' +
+                '                  <h4>网络运营商：' + (res.data[i].operatorType == "1" ? "联通" : (res.data[i].operatorType == "2" ? "移动":"电信")) + '</h4>' +
                 '                </div>' +
                 '                </div>' +
                 '                </span>' +

src/components/supermap.vue

@@ -131,6 +131,7 @@ export default {
       isheatPlotting: false,//火灾蔓延
       heat_lat: 0, //火灾蔓延经纬度
       heat_lng: 0, //火灾蔓延经纬度
+      aac:null,
       host:''
     }
   },
@@ -994,6 +995,71 @@ export default {
       //结果得到的也是number类型，单位是 米
       return (dis / 10e2).toFixed(2) + 'km'
     },
+    setMarkersA: function(markersList) { //地图标点
+      const _that = this
+      for (let i = 0; i < markersList.length; i++) {
+        let isAggregation = markersList[i].isAggregation == null ? false : markersList[i]
+          .isAggregation //是否聚合点位
+        let keepBindPopup = isAggregation == true ? false : markersList[i].keepBindPopup //提示气泡是否一直显示
+
+        let icon = new window.L.Icon({
+          iconUrl: iconList[markersList[i].icon],
+          iconSize: [48, 48],
+          iconAnchor: [24, 40],
+          popupAnchor: [-3, -40],
+          shadowSize: [41, 41]
+        })
+        let markerClick = window.L.marker([markersList[i].lat, markersList[i].lng], {
+          icon: icon
+        })
+
+        markerClick.on('mouseover', function() {
+          let a = "";
+          _that.aac = setInterval(function (){
+            var color = "green";
+            var value = Math.random();
+            var up = "▲";
+            var down = "▼";
+            if(value>0.5){
+              color = "red";
+              value = value +""+ up;
+            }else{
+              value = value +""+ down;
+            }
+            a = "<span style='color:"+color+"'>当前传感器数值:"+value+"</span>";
+            markerClick.bindPopup(a).openPopup(markerClick.getLatLng());
+            console.log(this);
+          },500);
+        }).on('mouseout', function() {
+          clearInterval(_that.aac);
+          this.closePopup();
+        })
+        if (markersList[i].click != null && markersList[i].click !== '') {
+          if (markersList[i].parameter != null && markersList[i].parameter !== '') {
+            markerClick.on('click', function() {
+              let clickName = markersList[i].click
+              _that.$emit(clickName, markersList[i].parameter)
+            })
+          } else {
+            markerClick.on('click', function() {
+              let clickName = markersList[i].click
+              _that.$emit(clickName)
+            })
+          }
+        }
+        if (isAggregation) {
+          _that.isAggregationLayers.addLayer(markerClick)
+          _that.isAggregationMyGroup = window.L.layerGroup(_that.isAggregationLayers)
+        } else {
+          _that.layers.push(markerClick)
+          _that.myGroup = window.L.layerGroup(_that.layers)
+        }
+      }
+      if (_that.myGroup != undefined && _that.myGroup != false) {
+        _that.map.addLayer(_that.myGroup)
+      }
+      _that.map.addLayer(_that.isAggregationLayers)
+    },
     setMarkers: function(markersList) { //地图标点
       const _that = this
       for (let i = 0; i < markersList.length; i++) {

src/router/index.js

@@ -32,7 +32,7 @@ import Layout from '@/layout'
 export const constantRoutes = [
   {
 		path: '/',
-		redirect: 'forest',
+		redirect: 'datacenter',
 	},
 	{
 		//生态云图
@@ -116,7 +116,7 @@ export const constantRoutes = [
 // 公共路由
 export const constantRoutesNew = [{
 		path: '/',
-		redirect: 'forest',
+		redirect: 'datacenter',
 	},
 	{
 		//生态云图

src/store/modules/user.js

@@ -1,5 +1,6 @@
 import { login, logout, getInfo, refreshToken } from '@/api/login'
 import { getToken, setToken, setExpiresIn, removeToken } from '@/utils/auth'
+import Cookies from "js-cookie";
 
 const user = {
   state: {
@@ -71,6 +72,7 @@ const user = {
           commit('SET_NAME', user.userName)
           commit('SET_USERID', user.id)
           commit('SET_AVATAR', avatar)
+          Cookies.set('deptId',user.deptId)
           resolve(res)
         }).catch(error => {
           reject(error)

src/views/datacenter.vue

@@ -8,17 +8,35 @@
       <!-- 左侧 -->
       <div class="leftbar w-10" ref="left">
         <div class="forthis">
-          <dv-border-box-13 :color="['#0e7957', '#0da24c']" backgroundColor="#09140e" style="padding-bottom: 1rem;">
+          <dv-border-box-13    backgroundColor="#09140e" style="padding-bottom: 1rem;">
             <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
             <div class="i-list-con h-78">
               <div class="d-l-con-icon">
+
+                <div class="i-list-con h-65" v-show="showSearch == true">
+                  <div class="head-container">
+                    <el-input
+                      v-model="searchName"
+                      placeholder="请输入名称"
+                      @blur="searchByName()"
+                      clearable
+                      size="small"
+                      prefix-icon="el-icon-search"
+                      style="margin-bottom: 20px"
+                    />
+                  </div>
+                </div>
+
                 <div class="icon-con" :class="{on:iconCurrentIndex==item.resourceTable}"
                      v-for="(item,index) in resourcesList"
-                     v-on:click="indentleftSetMarkers(item.resourceTable)">
+                     v-on:click="indentleftSetMarkers(item.type, searchName)">
+                     <!--v-on:click="indentleftSetMarkers(item.resourceTable)">-->
                   <div class="iconfont icon icon-normal" :class="item.icon"></div>
                   <div class="icon-text">
-                    <h6>{{ item.count }}</h6>
-                    <h5>{{ item.resourceName }}</h5>
+                    <h6>{{ item.num }}</h6>
+                    <!--<h6>{{ item.count }}</h6>-->
+                    <h5>{{ item.name }}</h5>
+                    <!--<h5>{{ item.resourceName }}</h5>-->
                   </div>
                 </div>
               </div>
@@ -32,9 +50,9 @@
       <!--      <button @click="showEventInfo1" style="position: absolute; right: 50%;top: 45%;z-index: 1000;">弹层事件演示用按钮-->
       <!--      </button>-->
       <!-- 右侧 -->
-      <div class="rightbar" ref="right">
+      <div class="rightbar" ref="right" v-if="showSearch == true">
         <div class="forthis">
-          <dv-border-box-13 :color="['#0e7957', '#0da24c']" backgroundColor="#09140e" style="padding-bottom: 1rem;">
+          <dv-border-box-13    backgroundColor="#09140e" style="padding-bottom: 1rem;">
             <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
             <div class="this-title">
               <span>数据分布</span>
@@ -103,6 +121,12 @@ export default {
   },
   data() {
     return {
+      // 搜索框
+      showSearch: false,
+      // 搜索名称
+      searchName: undefined,
+      // 搜索类型
+      searchType: undefined,
       iconCurrentIndex: '',
       listCurrentIndex: '',
       markersList: [],
@@ -123,6 +147,11 @@ export default {
   },
 
   methods: {
+    // 根据名称筛选资源点位
+    searchByName() {
+      this.$modal.msgSuccess("正在查询，请稍后...");
+      this.indentleftSetMarkers(this.searchType, this.searchName);
+    },
     /** ----------------------------------底部按钮公用组件开始------------------------------------- */
     bottomMenuList() {
       this.$refs.bottomMenu.selectTaskList()//获取任务列表
@@ -176,6 +205,15 @@ export default {
           trigger: 'item'
 
         },
+        dataZoom: [{
+          show: true,
+          type: 'slider',
+          yAxisIndex: 0,
+          left: 0,
+          start: 0,
+          end: this.source.length > 8 ? 8 : 100,
+          width: 15
+        }],
         grid: {
           top: '5%',
           left: '2%',
@@ -273,23 +311,35 @@ export default {
       //获取左侧菜单列表
       getResource().then(res => {
         that.resourcesList = res.data
+        console.log("that.resourcesList=", that.resourcesList)
         //截取data.resourceTable字段中“_”分隔符最后一个作为关键字,重新拼接成前端需要的图标:class,格式sj-icon-xxxx,将其set回原数组
         res.data.forEach(function(data, index) {
-          that.$set(that.resourcesList[index], 'icon', 'sj' + '-' + 'icon' + '-' + data
-            .resourceTable.split('_').slice(-1))
+          that.$set(that.resourcesList[index], 'icon', 'sj' + '-' + 'icon' + '-' + data.type.replaceAll("_", "-"));
+          if(index < 5){
+            // that.fireControlViewPoint(data.type, 'undefined');
+            that.indentleftSetMarkers(data.type, '所有');
+          }
         })
-        console.log(that.resourcesList)
-
       })
     },
-    indentleftSetMarkers(resourceTable) {
+    indentleftSetMarkers(resourceTable, name) {
+      // 搜索框
+      // if(name == 'undefined' && this.showSearch == false){
+      // if(name == '所有' && this.showSearch == false){
+      if(name == '所有'){
+        name = undefined;
+      }else {
+        this.showSearch = true;
+      }
+      // 搜索类型
+      this.searchType = resourceTable;
       this.iconCurrentIndex = resourceTable
       let that = this
       that.resourceTable = resourceTable
       that.markersList = []
       that.source = []
       //点击左侧地图落点
-      getResourcePoint(resourceTable).then(res => {
+      getResourcePoint(resourceTable, name).then(res => {
         that.deptGroupList = res.data.deptGroupList
         if (res.data.deptGroupList != null && res.data.deptGroupList.length > 0) {
           for (let i = 0; i < res.data.deptGroupList.length; i++) {
@@ -308,159 +358,12 @@ export default {
               keepBindPopup: false,
               isAggregation: false
             }
-            if (resourceTable == 'centerdata_t_environment_key_enterprise') { //重点企业
-              markersMap.icon = 'sj-icon-map-centerdata-t-environment-key-enterprise'
-              markersMap.lng = res.data.resourceList[i].longitude
-              markersMap.lat = res.data.resourceList[i].latitude
-              markersMap.bindPopupHtml = '<div class="map-tip">' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>经纬度：' + res.data.resourceList[i].longitude + ',' + res
-                  .data.resourceList[i].latitude + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>企业名称：' + res.data.resourceList[i].name +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>地址：' + res.data.resourceList[i].address +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>企业法人：' + res.data.resourceList[i].legalPerson +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>联系电话：' + res.data.resourceList[i].contactsPhone +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span></div>'
-            } else if (resourceTable == 'centerdata_t_environment_prohibition_area') { //禁烧区
-              markersMap.icon = 'sj-icon-map-centerdata-t-environment-prohibition-area'
-              markersMap.lng = res.data.resourceList[i].longitude
-              markersMap.lat = res.data.resourceList[i].latitude
-              markersMap.bindPopupHtml = '<div class="map-tip">' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>经纬度：' + res.data.resourceList[i].longitude + ',' + res
-                  .data.resourceList[i].latitude + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>禁烧区名称：' + res.data.resourceList[i].name + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>地址：' + res.data.resourceList[i].address + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>区域负责人：' + res.data.resourceList[i].principal + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>联系电话：' + res.data.resourceList[i].contactsPhone + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span></div>'
-            } else if (resourceTable == 'centerdata_t_environment_source_pollution') { //污染源
-              markersMap.icon = 'sj-icon-map-centerdata-t-environment-source-pollution'
-              markersMap.lng = res.data.resourceList[i].longitude
-              markersMap.lat = res.data.resourceList[i].latitude
-              markersMap.bindPopupHtml = '<div class="map-tip">' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>经纬度：' + res.data.resourceList[i].longitude + ',' + res
-                  .data.resourceList[i].latitude + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>污染源名称：' + res.data.resourceList[i].name +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>地址：' + res.data.resourceList[i].address +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '</div>'
-            } else if (resourceTable == 'centerdata_t_environment_sewage_outlet') { //排污口
-              markersMap.icon = 'sj-icon-map-centerdata_t_environment_sewage_outlet'
-              markersMap.lng = res.data.resourceList[i].longitude
-              markersMap.lat = res.data.resourceList[i].latitude
-              markersMap.bindPopupHtml = '<div class="map-tip">' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>经纬度：' + res.data.resourceList[i].longitude + ',' + res
-                  .data.resourceList[i].latitude + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>排污口名称：' + res.data.resourceList[i].name +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>地址：' + res.data.resourceList[i].address +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '</div>'
-            }
-            that.markersList.push(markersMap)
+            that.markersList.push(this.getMarkersMap(resourceTable, markersMap, res.data.resourceList[i]));
           }
         }
-        this.dataChat()
+        if(this.showSearch == true){
+          this.dataChat();
+        }
         that.$refs.supermap.clearM(false)
         that.$refs.supermap.setMarkers(that.markersList)
       })
@@ -470,6 +373,7 @@ export default {
       let that = this
       //点击左侧地图落点
       getResourcePointByDeptId(that.resourceTable, deptId).then(res => {
+        console.log("1===============dituluodian===============", res.data.resourceList);
         that.markersList = []
         if (res.data.resourceList != null && res.data.resourceList.length > 0) {
           for (let i = 0; i < res.data.resourceList.length; i++) {
@@ -482,161 +386,176 @@ export default {
               keepBindPopup: false,
               isAggregation: false
             }
-            if (that.resourceTable == 'centerdata_t_environment_key_enterprise') { //重点企业
-              markersMap.icon = 'sj-icon-map-centerdata-t-environment-key-enterprise'
-              markersMap.lng = res.data.resourceList[i].longitude
-              markersMap.lat = res.data.resourceList[i].latitude
-              markersMap.bindPopupHtml = '<div class="map-tip">' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>经纬度：' + res.data.resourceList[i].longitude + ',' + res
-                  .data.resourceList[i].latitude + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>企业名称：' + res.data.resourceList[i].name +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>地址：' + res.data.resourceList[i].address +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>企业法人：' + res.data.resourceList[i].legalPerson +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>联系电话：' + res.data.resourceList[i].contactsPhone +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span></div>'
-            } else if (that.resourceTable == 'centerdata_t_environment_prohibition_area') { //禁烧区
-              markersMap.icon = 'sj-icon-map-centerdata-t-environment-prohibition-area'
-              markersMap.lng = res.data.resourceList[i].longitude
-              markersMap.lat = res.data.resourceList[i].latitude
-              markersMap.bindPopupHtml = '<div class="map-tip">' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>经纬度：' + res.data.resourceList[i].longitude + ',' + res
-                  .data.resourceList[i].latitude + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>禁烧区名称：' + res.data.resourceList[i].name + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>地址：' + res.data.resourceList[i].address + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>区域负责人：' + res.data.resourceList[i].principal + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>联系电话：' + res.data.resourceList[i].contactsPhone + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span></div>'
-            } else if (that.resourceTable == 'centerdata_t_environment_source_pollution') { //污染源
-              markersMap.icon = 'sj-icon-map-centerdata-t-environment-source-pollution'
-              markersMap.lng = res.data.resourceList[i].longitude
-              markersMap.lat = res.data.resourceList[i].latitude
-              markersMap.bindPopupHtml = '<div class="map-tip">' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>经纬度：' + res.data.resourceList[i].longitude + ',' + res
-                  .data.resourceList[i].latitude + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>污染源名称：' + res.data.resourceList[i].name +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>地址：' + res.data.resourceList[i].address +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '</div>'
-            } else if (that.resourceTable == 'centerdata_t_environment_sewage_outlet') { //排污口
-              markersMap.icon = 'sj-icon-map-centerdata_t_environment_sewage_outlet'
-              markersMap.lng = res.data.resourceList[i].longitude
-              markersMap.lat = res.data.resourceList[i].latitude
-              markersMap.bindPopupHtml = '<div class="map-tip">' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>经纬度：' + res.data.resourceList[i].longitude + ',' + res
-                  .data.resourceList[i].latitude + '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>排污口名称：' + res.data.resourceList[i].name +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '                  <div class="d-l-con">' +
-                '                  <div class="d-l-l-text">' +
-                '                  <h4>地址：' + res.data.resourceList[i].address +
-                '</h4>' +
-                '                </div>' +
-                '                </div>' +
-                '                </span>' +
-                '<span>' +
-                '</div>'
-            }
-            that.markersList.push(markersMap)
+            that.markersList.push(this.getMarkersMap(that.resourceTable, markersMap, res.data.resourceList[i]));
           }
         }
         that.$refs.supermap.clearM(false)
         that.$refs.supermap.setMarkers(that.markersList)
       })
+    },
+    getMarkersMap(resourceTable, markersMap, item){
+      if (resourceTable == 'centerdata_t_environment_key_enterprise') { //重点企业
+        markersMap.icon = 'sj-icon-map-centerdata-t-environment-key-enterprise'
+        markersMap.lng = (item.longitude?item.longitude:"")
+        markersMap.lat = (item.latitude?item.latitude:"")
+        markersMap.bindPopupHtml = '<div class="map-tip">' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>经纬度：' + (item.longitude?item.longitude:"") + ',' + (item.latitude?item.latitude:"") + '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>企业名称：' + (item.name?item.name:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>地址：' + (item.address?item.address:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>联系人：' + (item.contacts?item.contacts:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>联系人电话：' + (item.contacts_phone?item.contacts_phone:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>企业法人：' + (item.contacts?item.contacts:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>联系电话：' + (item.contacts_phone?item.contacts_phone:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span></div>'
+      } else if (resourceTable == 'centerdata_t_environment_prohibition_area') { //禁烧区
+        markersMap.icon = 'sj-icon-map-centerdata-t-environment-prohibition-area'
+        markersMap.lng = (item.longitude?item.longitude:"")
+        markersMap.lat = (item.latitude?item.latitude:"")
+        markersMap.bindPopupHtml = '<div class="map-tip">' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>经纬度：' + (item.longitude?item.longitude:"") + ',' + (item.latitude?item.latitude:"") + '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>禁烧区名称：' + (item.name?item.name:"") + '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>地址：' + (item.address?item.address:"") + '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>区域负责人：' + (item.principal?item.principal:"") + '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>联系电话：' + (item.contactsPhone?item.contactsPhone:"") + '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span></div>'
+      } else if (resourceTable == 'centerdata_t_environment_source_pollution') { //污染源
+        markersMap.icon = 'sj-icon-map-centerdata-t-environment-source-pollution'
+        markersMap.lng = (item.longitude?item.longitude:"")
+        markersMap.lat = (item.latitude?item.latitude:"")
+        markersMap.bindPopupHtml = '<div class="map-tip">' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>经纬度：' + (item.longitude?item.longitude:"") + ',' + (item.latitude?item.latitude:"") + '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>污染源名称：' + (item.name?item.name:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>地址：' + (item.address?item.address:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '</div>'
+      } else if (resourceTable == 'centerdata_t_environment_sewage_outlet') { //排污口
+        markersMap.icon = 'sj-icon-map-centerdata_t_environment_sewage_outlet'
+        markersMap.lng = (item.longitude?item.longitude:"")
+        markersMap.lat = (item.latitude?item.latitude:"")
+        markersMap.bindPopupHtml = '<div class="map-tip">' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>经纬度：' + (item.longitude?item.longitude:"") + ',' + (item.latitude?item.latitude:"") + '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>排污口名称：' + (item.name?item.name:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '                  <div class="d-l-con">' +
+          '                  <div class="d-l-l-text">' +
+          '                  <h4>地址：' + (item.address?item.address:"") +
+          '</h4>' +
+          '                </div>' +
+          '                </div>' +
+          '                </span>' +
+          '<span>' +
+          '</div>'
+      }
+      return markersMap;
     }
 
   }

src/views/eventdetailsdialog.vue

@@ -80,7 +80,7 @@
             <el-col :span="6" class="dia-right">
               <div class="e-right">
                 <div class="forthis1">
-                  <dv-border-box-7 backgroundColor="#040b1f" :color="['#0e7957', '#0da24c']"
+                  <dv-border-box-7 backgroundColor="#040b1f" :color="['#25335d', '#5baffd']"
                                    style="padding-bottom:1rem ;">
                     <div class="i-list-con">
                       <div class="this-con">

src/views/forest.vue

@@ -9,7 +9,7 @@
       <div class="leftbar" ref="left">
         <!-- 1 基本情况 -->
         <div class="forthis">
-          <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']" style="padding-bottom: 1rem;">
+          <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"   style="padding-bottom: 1rem;">
             <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
             <div class="this-title">
               <span>基本情况</span>
@@ -26,7 +26,7 @@
         </div>
         <!-- 2 事件统计-->
         <div class="forthis">
-          <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']" style="padding-bottom: 1rem;">
+          <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"   style="padding-bottom: 1rem;">
             <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
             <div class="i-list-con h-29-5">
               <div class="d-l-con no_hover">
@@ -81,7 +81,7 @@
         </div>
         <!-- 3 组织机构 -->
         <div class="forthis">
-          <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']" style="padding-bottom: 1rem;">
+          <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"   style="padding-bottom: 1rem;">
             <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
             <div class="i-list-con h-27" style="padding-left: 1rem;">
               <el-collapse accordion>
@@ -112,7 +112,7 @@
         <div class="right-item1">
           <!-- 天气 -->
           <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']">
+            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"  >
               <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
               <div class="i-list-con small-bottom-margin h-18">
                 <el-row :gutter="20" v-if="todatWeather">
@@ -250,7 +250,7 @@
           </div>
           <!-- 曝光台 -->
           <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']" style="padding-bottom: 1rem;">
+            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"   style="padding-bottom: 1rem;">
               <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
               <div class="this-title">
                 <span>超期事件</span>
@@ -277,7 +277,7 @@
           </div>
           <!-- 事件列表 -->
           <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']" style="padding-bottom: 1rem;">
+            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"   style="padding-bottom: 1rem;">
               <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
               <div class="this-title">
                 <span>事件列表</span>
@@ -377,7 +377,7 @@
         <div class="right-item2">
           <!-- 日历 -->
           <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']" style="padding-bottom: 1rem;">
+            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"   style="padding-bottom: 1rem;">
               <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
               <div class="i-list-con small-bottom-margin h-30">
                 <dateChoose @selectDay="selectDay"></dateChoose>
@@ -386,7 +386,7 @@
           </div>
           <!-- 事件分类 -->
           <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']" style="padding-bottom: 1rem;">
+            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"   style="padding-bottom: 1rem;">
               <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
               <div class="this-title" style="cursor: pointer" @click="setEventTypeId({eventTypeIdDl: [], eventTypeId: []})">
                 <span>事件分类</span>
@@ -400,7 +400,7 @@
           </div>
           <!-- 上报排行 -->
           <div class="forthis">
-            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0e7957', '#0da24c']" style="padding-bottom: 1rem;">
+            <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)"   style="padding-bottom: 1rem;">
               <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
               <div class="this-title">
                 <span>上报排行</span>

src/views/monitor.vue

@@ -16,27 +16,25 @@
             </div>
             <div class="i-list-con h-73">
               <div class="d-l-con-icon">
-                <div class="icon-con w-33 m-btm-no" :class="{on:iconCurrentIndex1==index}"
-                     v-for="(item,index) in visuForestCloudMapDeviceBOList"
-                     v-on:click="selectDeviceType(index)">
+                <div class="icon-con w-33 m-btm-no" :class="{on:onShe}" @click="sheClick">
                   <!--   -->
                   <div class="icon icon-dot"></div>
                   <div class="icon-text">
-                    <h6>{{ item.deviceCount }}</h6>
-                    <h5>{{ item.deviceName }}</h5>
+                    <h6>{{ visuForestCloudMapDeviceBOList[0].deviceCount }}</h6>
+                    <h5>{{ visuForestCloudMapDeviceBOList[0].deviceName }}</h5>
                   </div>
                 </div>
-                <div class="icon-con w-33 m-btm-no">
+                <div class="icon-con w-33 m-btm-no" :class="{on:onChuan}" @click="chuanClick">
                   <div class="icon icon-dot"></div>
                   <div class="icon-text">
-                    <h6>0</h6>
+                    <h6>{{ sensorNum }}</h6>
                     <h5>传感器</h5>
                   </div>
                 </div>
-                <div class="icon-con w-33 m-btm-no">
+                <div class="icon-con w-33 m-btm-no" :class="{on:onLa}" @click="laClick">
                   <div class="icon icon-dot"></div>
                   <div class="icon-text">
-                    <h6>0</h6>
+                    <h6>{{ loudspeakerNum }}</h6>
                     <h5>大喇叭</h5>
                   </div>
                 </div>
@@ -108,7 +106,7 @@
             <div class="i-list-con h-43">
               <el-input
                 v-model="rightDeptName"
-                placeholder="请输入摄像头名称"
+                :placeholder="placeholderMsg"
                 clearable
                 size="small"
                 prefix-icon="el-icon-search"
@@ -167,6 +165,8 @@
 import {
   selectDeviceType,
   selectCameraByDeptId,
+  getSensorListByDeptId,
+  getDlblistBydeptId,
   selectKeyAreaList,
   getCamerasByDeptId,
   getRegionalFlag
@@ -191,6 +191,7 @@ import DHWs from '@/dahua/lib/DHWs'
 /** ----------------------------------摄像头预览结束------------------------------------- */
   // import echarts from 'echarts'
 let echarts = require('echarts')
+import Cookies from 'js-cookie';
 
 export default {
   components: {
@@ -214,9 +215,12 @@ export default {
     /** ----------------------------------底部按钮公用组件结束------------------------------------- */
   },
   mounted() {
-    this.selectDeviceType(-1)
     this.selectKeyAreaList()
     this.getTreeselect()
+    this.deptId = Cookies.get("deptId")
+    this.getSensorListByDeptId()
+    this.getDlblistBydeptId()
+    this.selectDeviceType(-1)
     this.bottomMenuList() //获取底部公共组件消息和任务
   },
   data() {
@@ -247,7 +251,7 @@ export default {
       pubKey: '',
       oWebControl: null,
       /** ----------------------------------摄像头预览结束------------------------------------- */
-      visuForestCloudMapDeviceBOList: [],
+      visuForestCloudMapDeviceBOList: [{deviceCount: 0, deviceName: "摄像头"}],
       visuForestCloudCameraBOList: [],
       cameraMarkersList: [],
       sourceData: [],
@@ -267,6 +271,16 @@ export default {
       indentText: '收起左右栏',
       indentdisabled: false,
       domId: 'dom1',
+      placeholderMsg: "请输入摄像头名称",
+      localMark: "she",
+      onShe: false,
+      onChuan: false,
+      onLa: false,
+      colors: "green",
+      sensorNum: 0,
+      deptId: '',
+      loudspeakerNum: 0,
+      values: Math.random()
     }
   },
   watch: {
@@ -338,12 +352,154 @@ export default {
 // 节点单击事件
     handleNodeClick(data) {
       let that = this
-      console.log("节点单击事件",data);
-      // this.findCameraByDept(data.id)
-      that.selectCameraByDeptId(data.id);
-      getCamerasByDeptId(data.id).then(res => {
-        that.$refs.TVWalls.showTVWall(res.data, {longitude: data.deptLongitude, latitude: data.deptLatitude});
+      that.deptId = data.id
+      if (that.localMark == 'she') {
+        that.selectCameraByDeptId(data.id);
+        getCamerasByDeptId(data.id).then(res => {
+          that.$refs.TVWalls.showTVWall(res.data, {longitude: data.deptLongitude, latitude: data.deptLatitude});
+        })
+      } else if (that.localMark == 'chuan') {
+        that.getSensorListByDeptId()
+      } else if (that.localMark == 'la') {
+        that.getDlblistBydeptId()
+      }
+    },
+    sheClick() {
+      this.onLa = false
+      this.onShe = true
+      this.onChuan = false
+      this.localMark = 'she'
+      this.placeholderMsg = "请输入摄像头名称"
+      this.selectDeviceType()
+    },
+    laClick() {
+      this.onLa = true
+      this.onShe = false
+      this.onChuan = false
+      this.localMark = 'la'
+      this.placeholderMsg = "请输入大喇叭名称"
+      this.getDlblistBydeptId()
+    },
+    chuanClick() {
+      this.onLa = false
+      this.onShe = false
+      this.onChuan = true
+      this.localMark = 'chuan'
+      this.placeholderMsg = "请输入传感器名称"
+      this.getSensorListByDeptId()
+    },
+    // 大喇叭
+    getDlblistBydeptId() {
+      let that = this;
+      let markersList = [];
+      getDlblistBydeptId(that.deptId).then(function (res) {
+        that.loudspeakerNum = res.data.length
+        that.visuForestCloudCameraBOListSearch = []
+        if (res.data != null && res.data.length > 0) {
+          for (let j = 0; j < res.data.length; j++) {
+            let dat = {
+              cameraName: res.data[j].name,
+              longitude: res.data[j].longitude,
+              latitude: res.data[j].latitude,
+            }
+            that.visuForestCloudCameraBOListSearch.push(dat)
+          }
+          for (let i = 0; i < res.data.length; i++) {
+            let markersMap = {
+              lng: 124.59,
+              lat: 43.02,
+              icon: "marker",
+              bindPopupHtml: "",
+              click: "",
+              parameter: "",
+              keepBindPopup: false,
+              isAggregation: false,
+            };
+            markersMap.icon = "big-horn";
+
+            markersMap.lng = res.data[i].longitude;
+            markersMap.lat = res.data[i].latitude;
+            markersList.push(markersMap);
+          }
+          setTimeout(() => {
+            that.$refs.supermap.clearM(false);
+            that.$refs.supermap.clearM(true);
+            that.$refs.supermap.setMarkers(markersList);
+          }, 2000);
+        } else {
+          setTimeout(() => {
+            that.$refs.supermap.clearM(false);
+            that.$refs.supermap.clearM(true);
+          }, 2000);
+        }
+      })
+        .catch(function (error) {
+          console.error(error);
+        });
+    },
+    // 传感器
+    getSensorListByDeptId() {
+      let that = this;
+      let markersList = [];
+      getSensorListByDeptId(that.deptId).then(function (res) {
+        that.visuForestCloudCameraBOListSearch = []
+        that.sensorNum = res.data.length
+        if (res.data != null && res.data.length > 0) {
+          for (let j = 0; j < res.data.length; j++) {
+            let dat = {
+              cameraName: res.data[j].deviceName,
+              longitude: res.data[j].longitude,
+              latitude: res.data[j].latitude,
+            }
+            that.visuForestCloudCameraBOListSearch.push(dat)
+          }
+          for (let i = 0; i < res.data.length; i++) {
+            let markersMap = {
+              lng: 124.59,
+              lat: 43.02,
+              icon: "marker",
+              bindPopupHtml: "",
+              click: "",
+              parameter: "",
+              keepBindPopup: false,
+              isAggregation: false,
+            };
+            if (res.data[i].deviceCode == '001') {  // 水质传感器
+              markersMap.icon = "sj-icon-map-centerdata_water_quality_sensor";
+            } else if (res.data[i].deviceCode == '002') {  // 水尺
+              markersMap.icon = "sj-icon-map-centerdata_water_gauge";
+            } else if (res.data[i].deviceCode == '003') {  // 水文监测设备
+              markersMap.icon = "sj-icon-map-centerdata_hydrological_monitoring_equipment";
+            } else if (res.data[i].deviceCode == '004') {  // 土壤监测设备
+              markersMap.icon = "sj-icon-map-centerdata_soil_monitoring_equipment";
+            } else if (res.data[i].deviceCode == '005') {  // 病虫害监测站
+              markersMap.icon = "sj-icon-map-centerdata_pest_and_disease_monitoring_station";
+            } else if (res.data[i].deviceCode == '006') {  // 大气传感器
+              markersMap.icon = "sj-icon-map-centerdata_atmospheric_sensor";
+            } else if (res.data[i].deviceCode == '007') {  // 水压传感器
+              markersMap.icon = "sj-icon-map-centerdata_water_pressure_sensor";
+            }
+
+            markersMap.lng = res.data[i].longitude;
+            markersMap.lat = res.data[i].latitude;
+
+            markersList.push(markersMap);
+          }
+          setTimeout(() => {
+            that.$refs.supermap.clearM(false);
+            that.$refs.supermap.clearM(true);
+            that.$refs.supermap.setMarkersA(markersList);
+          }, 2000);
+        } else {
+          setTimeout(() => {
+            that.$refs.supermap.clearM(false);
+            that.$refs.supermap.clearM(true);
+          }, 2000);
+        }
       })
+        .catch(function (error) {
+          console.error(error);
+        });
     },
     selectKeyAreaList() {
       this.keyAreaList=[]
@@ -511,7 +667,7 @@ export default {
               '<span>' +
               '                  <div class="d-l-con">' +
               '                  <div class="d-l-l-text">' +
-              '                  <h4>摄像头类型：' + (res.data.visuForestCloudCameraBOList[i].cameraFactory=="1"?"大华":"海康") + '</h4>' +
+              '                  <h4>网络运营商：' + (res.data.visuForestCloudCameraBOList[i].operatorType == "1" ? "联通" : (res.data.visuForestCloudCameraBOList[i].operatorType == "2" ? "移动":"电信")) + '</h4>' +
               '                </div>' +
               '                </div>' +
               '                </span>' +
@@ -607,7 +763,7 @@ export default {
               '<span>' +
               '                  <div class="d-l-con">' +
               '                  <div class="d-l-l-text">' +
-              '                  <h4>摄像头类型：' + (res.data[i].cameraFactory=="1"?"大华":"海康") + '</h4>' +
+              '                  <h4>网络运营商：' + (res.data[i].operatorType == "1" ? "联通" : (res.data[i].operatorType == "2" ? "移动":"电信")) + '</h4>' +
               '                </div>' +
               '                </div>' +
               '                </span>' +

vue.config.js

@@ -51,8 +51,8 @@ module.exports = {
     proxy: {
       // detail: https://cli.vuejs.org/config/#devserver-proxy
       [process.env.VUE_APP_BASE_API]: {
-         // target: `http://121.36.228.66:3031`,
-        target: `http://127.0.0.1:3031`,
+         target: `http://121.36.228.66:3031`,
+        // target: `http://127.0.0.1:3031`,
         changeOrigin: true,
         pathRewrite: {
           ['^' + process.env.VUE_APP_BASE_API]: ''