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

src/assets/styles/base.scss

@@ -4,7 +4,7 @@ $fontLED: led;
 
 //颜色
 $white: #fff;
-$inBlue: #25bdcb;
+$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: #138399, $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: #0a1f20, $alpha: 1),
-rgba($color: #011d2a, $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: #0b1b25, $alpha: .8);
-$shadowTitle: 0 -0.2rem .5rem 0.3rem rgba($color: #15dbb4, $alpha: .09) inset;
-$shadowListHover: rgba($color: #1cbfc2, $alpha: .7) 0px 0px 50px inset;
+$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: #0bb3c2;
+$fBlue: #03c6e2;
 $fBlueHover: #07ffc1;
 $fBlueG: #0bf3f7;
-$fListTitle: #0fc4d4;
-$barBgc: rgba($color: #102127, $alpha: .9);
+$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: #33727f, $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,6 +82,16 @@ $date-state1: #2abc65;
 $date-state2: #e68d3f;
 $date-state3: #d6333b;
 
+//视频摄像头预览弹层样式
+.videoCustomWidth {
+  width: 1070px !important;
+  height: 800px !important;
+}
+//电视墙视频摄像头预览弹层样式
+.TVWallCustomWidth {
+  width: 1200px !important;
+  height: 800px !important;
+}
 
 //公共
 body {
@@ -218,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;
 }
@@ -559,20 +606,7 @@ div::-webkit-scrollbar {
   height: 866px !important;
 }
 
-//视频摄像头预览弹层样式
-.videoCustomWidth {
-  width: 1070px !important;
-  height: 750px !important;
-}
-//电视墙视频摄像头预览弹层样式
-.TVWallCustomWidth {
-  width: 1200px !important;
-  height: 800px !important;
-}
-
 .dia-event-info {
-
-
   .el-row {
     height: 780px;
   }
@@ -581,27 +615,26 @@ div::-webkit-scrollbar {
     height: 780px !important;
     position: absolute;
     z-index: 999;
-    //超图绘制截屏
-
-	button {
-	  padding: 0 .3rem;
-	  height: 1.5rem;
-	  background-color: #112543;
-	  color: $inBlue;
-	  border: 1px $searchBorder;
-	}
 
-	button:hover {
-	  text-shadow: 0 0 15px rgba($color: $inBlueHover, $alpha: 1.0);
-	}
-	.fire-m{
-		position: absolute;
-		right: 1rem;
-		bottom: 1rem;
-		z-index:100000;
+    button {
+      padding: 0 .3rem;
+      height: 1.5rem;
+      background-color: #112543;
+      color: $inBlue;
+      border: 1px $searchBorder;
+    }
 
-	}
+    button:hover {
+      text-shadow: 0 0 15px rgba($color: $inBlueHover, $alpha: 1.0);
+    }
+    .fire-m{
+      position: absolute;
+      right: 1rem;
+      bottom: 1rem;
+      z-index:100000;
 
+    }
+    //超图绘制截屏
     .leaflet-pane .leaflet-overlay-pane {
       height: 780px !important;
       width: 1340px !important;
@@ -826,8 +859,8 @@ div::-webkit-scrollbar {
 
           .el-collapse-item__arrow {
             color: $inBlue;
-            position: relative;
-            left: -20.5rem;
+            position: absolute;
+            left: 1rem;
             margin: 0;
           }
 
@@ -1131,8 +1164,8 @@ div::-webkit-scrollbar {
 
           .el-collapse-item__arrow {
             color: $inBlue;
-            position: relative;
-            left: -20.5rem;
+            position: absolute;
+            left: 1rem;
             margin: 0;
           }
 
@@ -1356,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 {
@@ -1796,8 +1814,8 @@ div::-webkit-scrollbar {
 
     .el-collapse-item__arrow {
       color: $inBlue;
-      position: relative;
-      left: -20.5rem;
+      position: absolute;
+      left: 1rem;
       margin: 0;
     }
 
@@ -1947,6 +1965,7 @@ div::-webkit-scrollbar {
 
 }
 
+
 .d-evnet-list-con {
   padding: .5rem .5rem !important;
   align-items: flex-start !important;
@@ -2163,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;
@@ -2302,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;
@@ -2317,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;
@@ -2352,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;
@@ -2374,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;
@@ -2396,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;
@@ -2418,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;
@@ -2440,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;
@@ -2462,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;
@@ -2484,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;
@@ -2506,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;
@@ -2881,7 +2910,9 @@ div::-webkit-scrollbar {
 }
 
 .el-dialog:not(.is-fullscreen) {
-  margin-top: 5vh !important;
+  // margin-top: 10vh !important;
+  margin-top: 2vh !important;
+  z-index: 9999;
 }
 
 
@@ -2957,16 +2988,16 @@ div::-webkit-scrollbar {
 
 .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: #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;
 }
 
 
@@ -3152,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/vBottomMenu.vue

@@ -496,6 +496,13 @@
 				searchFB: '',
 				filterchang: '', //林场搜索
 				btmCurrent: '',
+        websock: '',
+        wsuri:'ws://127.0.0.1:10012/messagePush/',
+        wsuri2:'ws://127.0.0.1:10005/taskPush/',
+        setIntervalWesocketPush: null,
+        websockSid: {
+          userId: ''
+        },
 
 				eventWarn: false, //webSocket事件问题警报标记
 			}
@@ -506,8 +513,101 @@
 				this.deptOptionsLiandong = response.data
 			})
 		},
-		methods: {
-			filterbanNode(value, data) {
+    mounted() {
+      this.websockSid.userId=Cookies.get("userId")
+    },
+
+    methods: {
+      initWebSocket(wsurl,userId) {        //初始化weosocket
+        //const wsuri = 'ws://127.0.0.1:10003/eventPush/' + userId + '/' + eventTypeDl + '/' + eventType
+        const wsuri = wsurl+userId
+        // const wsuri = 'ws://172.28.20.82:10012/taskPush/'+userId
+        this.websock = new WebSocket(wsuri)
+        console.log('建立websocket连接'+wsuri)
+        this.websock.onopen = this.websocketonopen
+        this.websock.onmessage = this.websocketonmessage
+        this.websock.onerror = this.websocketonerror
+      },
+      websocketonopen() { //连接建立之后执行send方法发送数据
+        console.log('websocket连接成功')
+        this.weosocket = true
+        this.sendPing()
+      },
+      websocketonerror() { //连接建立失败重连
+        this.initWebSocket(this.wsuri,this.websockSid.userId)
+      },
+      websocketonmessage(e) { //数据接收
+        console.log('接收数据', e.data)
+        // let data = "{\"fromId\":\"farming\"}";
+        // 处理收到的消息
+        this.handleWebSoceketEvent(e.data)
+      },
+      handleWebSoceketEvent(val) {
+        let that = this
+        let data = JSON.parse(val)
+        console.log('数据数据数据数据',data)
+        /**
+         * that.markersList.filter( item => data.eventCode == item.parameter).length == 0 如果地图中不存在当前事件则添加
+         * eventPush: 事件列表消息
+         * */
+        let  message=data.centermessageTPushrecord
+        let message2=data.centertaskTTask
+        if (null!=message)
+        {
+          console.log(message)
+          this.messageList.push(message)
+          this.messageCount++
+        }else if (null!=message2)
+        {
+          this.taskList.push(message2)
+          this.taskCount ++
+        }
+
+
+
+        // if (data.tag == "eventPush" && that.markersList.filter( item => data.eventCode == item.parameter).length == 0) {
+        //   getEventPush({eventCode: data.eventCode}).then((res) => {
+        //     if (res.data != undefined) {
+        //       //插入到第一条
+        //       this.eventList.unshift(res.data)
+        //       // 插入后删除最后一条 保证列表中为10条数据
+        //       if (this.eventList.length > 9)
+        //         this.eventList.splice(10, 1)
+        //       // 将收到的数据在地图上添加
+        //       this.getWebSocketEvent(res.data)
+        //     }
+        //   })
+        // }
+
+        console.log(data)
+      },
+
+
+      websocketsend(Data) { //数据发送
+        this.websock.send(Data)
+      },
+      websocketclose(e) { //关闭
+        console.log('断开连接', e)
+        // clearInterval(this.setIntervalWesocketPush)
+        this.weosocket = false
+      },
+      /**发送心跳
+       * @param {number} time 心跳间隔毫秒 默认5000
+       * @param {string} ping 心跳名称 默认字符串ping
+       */
+      sendPing(time = 60000, ping = {
+        'fromId': 'farming'
+      }) {
+        clearInterval(this.setIntervalWesocketPush)
+        this.setIntervalWesocketPush = setInterval(() => {
+          if (this.weosocket) {
+            this.websock.send(JSON.stringify(ping))
+          } else {
+            // this.initWebSocket()
+          }
+        }, time)
+      },
+      filterbanNode(value, data) {
 				//树搜索
 				if (!value) return true
 				return data.label.indexOf(value) !== -1
@@ -696,6 +796,7 @@
 					this.taskList = res.data
 					this.taskCount = res.data.length
 				})
+        this.initWebSocket(this.wsuri2,this.websockSid.userId)
 			},
 
       selectMessageById(id) {
@@ -716,6 +817,7 @@
           this.messageList = response.data
           this.messageCount = response.data.length
         });
+        this.initWebSocket(this.wsuri,this.websockSid.userId)
       },
 			handleCheckedCitiesChangeBan(value) {
 				this.choseLayerSwitchingList(this.banCheckList)

src/views/monitor.vue

@@ -507,7 +507,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>' +
@@ -600,7 +600,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

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