Bläddra i källkod

Merge branch 'visu_emergency' of http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization into visu_emergency

whao 2 år sedan
förälder
incheckning
a897f22482

+ 2 - 2
src/api/event.js

@@ -1,9 +1,9 @@
 import request from '@/utils/request'
 
 //获取附近事件
-export function getNearEvent(longitude,latitude,day,loading) {
+export function getNearEvent(longitude, latitude, day, loading, eventTypeIdDl, eventTypeId) {
   return request({
-    url: '/center-emergency/VisuEmergencyEventCenterController/getNearEvent?longitude='+longitude+"&latitude="+latitude+"&day="+day,
+    url: '/center-emergency/VisuEmergencyEventCenterController/getNearEvent?longitude=' + longitude + "&latitude=" + latitude + "&day=" + day + "&eventTypeIdDl=" + eventTypeIdDl + "&eventTypeId=" + eventTypeId,
     method: 'get',
     headers: {
       loading: loading

+ 33 - 0
src/api/forest.js

@@ -1,5 +1,20 @@
 import request from '@/utils/request'
 
+// 获取绑定的事件类型
+export function getMenuEventType() {
+  return request({
+    url: '/center-emergency/VisuEmergencyCloudMapController/getMenuEventType',
+    method: 'get',
+  })
+}
+// 获取事件详情
+export function getEventPush(param) {
+  return request({
+    url: '/center-emergency/VisuEmergencyCloudMapController/getEventPush',
+    method: 'post',
+    data: param
+  })
+}
 // 左侧获取部门信息
 export function getBaseInfo() {
   return request({
@@ -295,4 +310,22 @@ export function getInfoView(dangerId) {
   })
 }
 
+// 事件处置
+export function eventHandling(id,eventCode) {
+  return request({
+    url: '/center-emergency/VisuEmergencyEventCenterController/eventHandling',
+    method: 'post',
+    data: {id:id,eventCode:eventCode,dataStatus:"1"}
+  })
+}
+
+// 会议添加联系人并发送短信
+export function sendMessage(param) {
+  return request({
+    url: '/center-emergency/VisuEmergencyCloudMapController/sendMeetingMsgEmergency',
+    method: 'post',
+    data:param
+  })
+}
+
 

+ 7 - 0
src/api/monitor.js

@@ -29,3 +29,10 @@ export function getRegionalFlag(id) {
     method: 'get',
   })
 }
+//根据部门ID获取具有查看权限的摄像头
+export function getCamerasByDeptId(deptId) {
+  return request({
+    url: '/center-emergency/VisuEmergencyMonitorCenterController/getCamerasByDeptId?deptId=' + deptId,
+    method: 'get',
+  })
+}

+ 3 - 3
src/assets/styles/base.scss

@@ -85,8 +85,8 @@ $date-state3: #d6333b;
 }
 //电视墙视频摄像头预览弹层样式
 .TVWallCustomWidth {
-  width: 1150px !important;
-  height: 700px !important;
+  width: 1200px !important;
+  height: 750px !important;
 }
 
 //公共
@@ -615,7 +615,7 @@ div::-webkit-scrollbar {
 		background: none !important;
 	}
 	.wid-list{
-	  width: 100%  !important;	
+	  width: 100%  !important;
 	  position: relative !important;
 	  left: 0 !important;
 	  top: 0 !important;

+ 207 - 119
src/components/TVWall.vue

@@ -2,28 +2,26 @@
   <div>
     <el-dialog title="电视墙" :visible.sync="TVWallVisible" v-if="TVWallVisible" customClass="TVWallCustomWidth"
                @close="cancelEventLocationShow()">
-	  <div class="forthis" style="width: 22%; position: absolute;left: 0;z-index: 9999999999999;">
-	  	<!-- <div class="this-title">
-	  		<span>林场</span>
-	  		<span>45</span>
-	  	</div> -->
-	  	<div class="i-list-con" style="height: 46vh; overflow-y: scroll;">
-	  		<span v-for="(item,index) in cameraList" :key="index">
-	  			<div class="d-l-con" @click="playhk(item.channelCode)">
-	  				<div class="d-l-l-text">
-	  					<i class="i-small"></i>
-	  					<h4>{{ item.cameraName }}</h4>
-	  				</div>
-	  			</div>
-	  		</span>
-	  	</div>
-	  </div>
-      <div style="width:70%;height:400px;position:absolute;">
-        <!--视频窗口展示---大华-->
-        <div id="dom1" class="dom1"></div>
-        <!--视频窗口展示---海康-->
-        <div id="playWnd" class="playWnd" style="left: 0px; top: 0px;"></div>
-      </div>
+	  <!--<div class="forthis" style="width: 22%; position: absolute;left: 0;z-index: 9999999999999;">-->
+	  	<!--<div class="i-list-con" style="height: 46vh; overflow-y: scroll;">-->
+	  		<!--<span v-for="(item,index) in cameraList" :key="index">-->
+	  			<!--<div class="d-l-con" @click="playhk(item.channelCode)">-->
+	  				<!--<div class="d-l-l-text">-->
+	  					<!--<i class="i-small"></i>-->
+	  					<!--<h4>{{ item.cameraName }}</h4>-->
+	  				<!--</div>-->
+	  			<!--</div>-->
+	  		<!--</span>-->
+	  	<!--</div>-->
+	  <!--</div>-->
+      <!--<div style="width:70%;height:400px;position:absolute;">-->
+        <!--&lt;!&ndash;视频窗口展示-&#45;&#45;大华&ndash;&gt;-->
+        <!--<div id="dom1" class="dom1"></div>-->
+        <!--&lt;!&ndash;视频窗口展示-&#45;&#45;海康&ndash;&gt;-->
+        <!--<div id="playWnd" class="playWnd" style="left: 0px; top: 0px;"></div>-->
+      <!--</div>-->
+
+      <div id="dom1" class="dom1"></div>
     </el-dialog>
   </div>
 
@@ -33,6 +31,7 @@
 /** ----------------------------------摄像头预览开始------------------------------------- */
 import { getDahuaVideoServer, getTVWallList } from '@/api/dahua/dahua'
 import { tvCameraList } from '@/api/haikang/haikang'
+import { findCameraByEventCoordinate,rotation } from '@/api/monitor'
 import DHWs from '@/dahua/lib/DHWs'
 
 /** ----------------------------------摄像头预览结束------------------------------------- */
@@ -41,57 +40,9 @@ export default {
   components: {},
   data() {
     return {
+      array:[],
       tvListJson: [
         {
-        'switchTab': '1',
-        'treeLabels': [
-          {
-            'labelCode': '123456',
-            'labelName': '视频场景',
-            'parentLabelCode': null
-          },
-          {
-            'labelCode': '5a81d1bd499b4940a21fc63ca51f4dfa',
-            'labelName': '标签2',
-            'parentLabelCode': 123456
-          },
-          {
-            'labelCode': 'd941adbbd3e64dac92cc448dec5293cd',
-            'labelName': '标签1',
-            'parentLabelCode': 123456
-          }
-        ],
-        'labelChannels': [{
-          'channelDates': [{
-            'channelCode': '6044981090191552',
-            'channelName': '复兴大桥中段-交通事故',
-            'channelSn': null,
-            'cameraType': 0,
-            'online': 1
-          },
-            {
-              'channelCode': 'ZgVzqsjwA1DTF561VGHK5E',
-              'channelName': '北京7青羊东二路77号2通道1',
-              'channelSn': null,
-              'cameraType': 1,
-              'online': 1
-            }
-          ],
-          'labelCode': 'd941adbbd3e64dac92cc448dec5293cd'
-        },
-          {
-            'channelDates': [{
-              'channelCode': 'ZgVzqsjwA1DTF561VGHKK7',
-              'channelName': '北京7青羊东二路77号2通道2',
-              'channelSn': null,
-              'cameraType': 2,
-              'online': 0
-            }],
-            'labelCode': '5a81d1bd499b4940a21fc63ca51f4dfa'
-          }
-        ]
-      },
-        {
           'switchTab': '2',
           'labelChannels': [{
             'channelDates': [{
@@ -249,8 +200,8 @@ export default {
         }],
       crtPosX: 0,
       crtPosY: 0,
-      crtWidth: 740,
-      crtHeight: 400,
+      crtWidth: 1148,
+      crtHeight: 650,
       domId: 'dom1',
       mixedVideoDisplayMode: 2,
       isShowTipe: true,
@@ -262,12 +213,27 @@ export default {
     }
   },
   created() {
+    const DHWsInstance = DHWs.getInstance()
+    this.ws = DHWsInstance
   },
   methods: {
+    findCameraByEventCoordinate(){
+      findCameraByEventCoordinate().then(res => {
+        const list = [];
+        for(let i in res.data){
+          list.push(res.data[i].cameraCode)
+        }
+        this.rotation('','',list);
+      })
+    },
+    rotation(lng,lat,list){
+      rotation(lng,lat,list).then(res => {
+      })
+    },
     cancelEventLocationShow() {
       // this.activeName = 'tv'
       this.TVWallVisible = false
-      // this.destroy()
+      this.destroy()
 
       if (this.oWebControl != null) {
         this.oWebControl.JS_HideWnd()   // 先让窗口隐藏,规避可能的插件窗口滞后于浏览器消失问题
@@ -277,41 +243,137 @@ export default {
           })
       }
     },
-    showTVWall() {
-      let that=this;
+    playRealMonitorVideo(array) { // 自定义设备树自动播放指定通道编码视频
+      const config = this.ws.config
+      const { loginIp, userCode } = config
+      this.ws.postMessage('playRealMonitorVideo', {
+        loginIp,
+        userCode,
+        params: {
+          ctrlCode: "ctrl1",
+          array: array
+        }
+      })
+
+    },
+
+    //火点联动电视墙调用
+    showTVWall1(longitude,latitude,tvListJson) {
+      // let that=this;
       /** ----------------------------------大华摄像头预览开始------------------------------------- */
-      // const DHWsInstance = DHWs.getInstance()
-      // this.ws = DHWsInstance
-      // this.ws.addEventListener('connectStateChange', data => {
-      //   if (data) {
-      //     console.log('连接成功')
-      //   } else {
-      //     console.log('连接失败,下载客户端')
-      //     this.alertReinstall()
-      //     // this.isShowTipe && this.$modal.confirm({
-      //     //   title: '下载客户端',
-      //     //   content: '检测到您未安装部分插件,将影响部分功能使用,请下载后使用?',
-      //     //   onOk: () => {
-      //     //     //这里写下载方法
-      //     //     this.isShowTipe = false
-      //     //   },
-      //     //   onCancel: () => {
-      //     //     this.isShowTipe = false
-      //     //   }
-      //     // });
-      //   }
-      // })
-      // this.preview()
+      this.ws.addEventListener('connectStateChange', data => {
+        if (data) {
+          console.log('连接成功')
+        } else {
+          console.log('连接失败,下载客户端')
+          this.alertReinstall()
+          this.isShowTipe && this.$modal.confirm({
+            title: '下载客户端',
+            content: '检测到您未安装部分插件,将影响部分功能使用,请下载后使用?',
+            onOk: () => {
+              //这里写下载方法
+              this.isShowTipe = false
+            },
+            onCancel: () => {
+              this.isShowTipe = false
+            }
+          });
+        }
+      })
+        getDahuaVideoServer().then(newResponse => {
+          this.ws.detectConnectQt().then(res => {
+            if (res) { // 连接客户端成功
+              this.alertLogin()
+              this.ws.login({
+                loginIp: newResponse.loginIp,
+                loginPort: newResponse.loginPort,
+                userName: newResponse.userName,
+                userPwd: newResponse.userPwd,
+                // loginIp: '192.168.100.100',
+                // loginPort: 8314,
+                // userName: 'system',
+                // userPwd: 'Admin@123',
+                token: '',
+                https: 1
+              })
+              this.ws.on('loginState', (res) => {
+                this.isLogin = res
+                console.log('---res-----', res)
+                if (res) {
+                  this.alertLoginSuccess()
+                  this.activePanel = 'key2'
+                  console.log(tvListJson)
+                  const array=[]
+                  const array1=[]
+                  tvListJson[0].treeLabels.forEach((item,index)=>
+                  {
+                    if (index!=0)
+                    {
+                      const param =Object.assign({})
+                      param.channelId=item.labelCode
+                       array.push(param)
+                       array1.push(item.labelCode)
+                      }
+
+                  })
+                  this.create1(longitude,latitude,tvListJson,array,array1)
+                  // var obj=JSON.parse(tvListJson)
+                } else {
+                  this.alertLoginFailed()
+                }
+              })
+            } else { // 连接客户端失败
+              this.alertReinstall()
+            }
+          })
+
+        })
       /** ----------------------------------大华摄像头预览结束------------------------------------- */
       /** ----------------------------------海康摄像头预览开始------------------------------------- */
-      tvCameraList().then(response => {
-        this.cameraList=response.data
+      // tvCameraList().then(response => {
+      //   this.cameraList=response.data
+      // })
+      // that.initPlugin()
+      // setTimeout(function() {
+      //   that.playhk();
+      // }, 5000)
+      // /** ----------------------------------海康摄像头预览结束------------------------------------- */
+      this.TVWallVisible = true
+
+    },
+    showTVWall() {
+      // let that=this;
+      /** ----------------------------------大华摄像头预览开始------------------------------------- */
+      this.ws.addEventListener('connectStateChange', data => {
+        if (data) {
+          console.log('连接成功')
+        } else {
+          console.log('连接失败,下载客户端')
+          this.alertReinstall()
+          this.isShowTipe && this.$modal.confirm({
+            title: '下载客户端',
+            content: '检测到您未安装部分插件,将影响部分功能使用,请下载后使用?',
+            onOk: () => {
+              //这里写下载方法
+              this.isShowTipe = false
+            },
+            onCancel: () => {
+              this.isShowTipe = false
+            }
+          });
+        }
       })
-      that.initPlugin()
-      setTimeout(function() {
-        that.playhk();
-      }, 5000)
-      /** ----------------------------------海康摄像头预览结束------------------------------------- */
+      this.preview()
+      /** ----------------------------------大华摄像头预览结束------------------------------------- */
+      /** ----------------------------------海康摄像头预览开始------------------------------------- */
+      // tvCameraList().then(response => {
+      //   this.cameraList=response.data
+      // })
+      // that.initPlugin()
+      // setTimeout(function() {
+      //   that.playhk();
+      // }, 5000)
+      // /** ----------------------------------海康摄像头预览结束------------------------------------- */
       this.TVWallVisible = true
     },
     /** ----------------------------------大华摄像头预览开始------------------------------------- */
@@ -339,6 +401,10 @@ export default {
                 loginPort: newResponse.loginPort,
                 userName: newResponse.userName,
                 userPwd: newResponse.userPwd,
+                // loginIp: '192.168.100.100',
+                // loginPort: 8314,
+                // userName: 'system',
+                // userPwd: 'Admin@123',
                 token: '',
                 https: 1
               })
@@ -349,6 +415,7 @@ export default {
                   this.alertLoginSuccess()
                   this.activePanel = 'key2'
                   this.create(newres.data)
+
                 } else {
                   this.alertLoginFailed()
                 }
@@ -360,7 +427,34 @@ export default {
         })
       })
     },
+    create1(longitude,latitude,tvListJson,array,array1) { // 调用创建控件接口
+      let _this = this
+      const params = [
+        {
+          'ctrlType': 'realMonitorUI',
+          'ctrlCode': 'ctrl1',
+          'ctrlProperty': {
+            'displayMode': 1,
+            'splitNum': 1,
+            'channelList': [
+              {
+                'channelId': ''
+              }
+            ]
+          },
+          'visible': true,
+          'domId': 'dom1'
+        }
+      ]
+      this.setPos()
+      this.customizeTree(tvListJson);
+      _this.ws.createCtrl(params);
+      _this.playRealMonitorVideo(array)
+      setTimeout(() => {
+        _this.rotation(longitude,latitude,array1)
+      }, 5000)
 
+    },
     create(tvListJson) { // 调用创建控件接口
       let _this = this
       const params = [
@@ -372,7 +466,7 @@ export default {
             'splitNum': 1,
             'channelList': [
               {
-                'channelId': '8ORBqXFlA1D77U45SM1ROC'
+                'channelId': ''
               }
             ]
           },
@@ -381,17 +475,11 @@ export default {
         }
       ]
       this.setPos()
-      _this.ws.createCtrl(params).then(res => {
-        this.customizeTree(tvListJson)
-      }).catch(e => {
-        console.log(e)
-      })
-      _this.ws.on('createCtrlResult', (res) => {
-        this.customizeTree(tvListJson)
-        _this.ws.on('createCtrlResult', (res) => {
-          this.customizeTree(tvListJson)
-        })
-      })
+      this.customizeTree(tvListJson);
+      setTimeout(() => {
+        _this.ws.createCtrl(params);
+      }, 5000)
+
     },
     setPos() {
       let target = document.getElementById(this.domId)
@@ -457,7 +545,7 @@ export default {
         },
         cbConnectError: function() { // 创建WebControl实例失败
           that.oWebControl = null
-          $('#playWnd').html('插件未启动,正在尝试启动,请稍候...')
+          $('#playWnd').html('插件未启动,正在尝试启动,请稍候...<a href="./hk/VideoWebPlugin.exe">点击下载插件</a>')
           WebControl.JS_WakeUp('VideoWebPlugin://') // 程序未启动时执行error函数,采用wakeup来启动程序
           initCount++
           if (initCount < 3) {
@@ -465,7 +553,7 @@ export default {
               that.initPlugin()
             }, 3000)
           } else {
-            $('#playWnd').html('插件启动失败,请检查插件是否安装!')
+            $('#playWnd').html('插件启动失败,请检查插件是否安装!<a href="./hk/VideoWebPlugin.exe">点击下载插件</a>')
           }
         },
         cbConnectClose: function(bNormalClose) {

+ 756 - 0
src/components/TVWalls.vue

@@ -0,0 +1,756 @@
+<template>
+  <div>
+    <el-dialog title="电视墙" :visible.sync="TVWallVisible" v-if="TVWallVisible" customClass="TVWallCustomWidth"
+               @close="cancelEventLocationShow()">
+      <!--<div @click="findCameraByEventCoordinate()">视频联动</div>-->
+      <!--<div class="forthis" style="width: 22%; position: absolute;left: 0;z-index: 9999999999999;">-->
+      <!--<div class="i-list-con" style="height: 46vh; overflow-y: scroll;">-->
+      <!--<span v-for="(item,index) in cameraList" :key="index">-->
+      <!--<div class="d-l-con" @click="playhk(item.channelCode)">-->
+      <!--<div class="d-l-l-text">-->
+      <!--<i class="i-small"></i>-->
+      <!--<h4>{{ item.cameraName }}</h4>-->
+      <!--</div>-->
+      <!--</div>-->
+      <!--</span>-->
+      <!--</div>-->
+      <!--</div>-->
+      <!--<div style="width:70%;height:400px;position:absolute;">-->
+      <!--&lt;!&ndash;视频窗口展示-&#45;&#45;大华&ndash;&gt;-->
+      <!--<div id="dom1" class="dom1"></div>-->
+      <!--&lt;!&ndash;视频窗口展示-&#45;&#45;海康&ndash;&gt;-->
+      <!--<div id="playWnd" class="playWnd" style="left: 0px; top: 0px;"></div>-->
+      <!--</div>-->
+
+      <div id="dom1" class="dom1"></div>
+    </el-dialog>
+  </div>
+
+</template>
+
+<script>
+/** ----------------------------------摄像头预览开始------------------------------------- */
+import {getDahuaVideoServer, getTVWallList} from '@/api/dahua/dahua'
+import {tvCameraList} from '@/api/haikang/haikang'
+import {findCameraByEventCoordinate, rotation} from '@/api/monitor'
+import DHWs from '@/dahua/lib/DHWs'
+
+/** ----------------------------------摄像头预览结束------------------------------------- */
+export default {
+  dicts: ['event_source'],
+  components: {},
+  data() {
+    return {
+      tvListJson: [
+        {
+          'switchTab': '1',
+          'treeLabels': [
+            {
+              'labelCode': '123456',
+              'labelName': '视频场景',
+              'parentLabelCode': null
+            },
+            {
+              'labelCode': '5a81d1bd499b4940a21fc63ca51f4dfa',
+              'labelName': '标签2',
+              'parentLabelCode': 123456
+            },
+            {
+              'labelCode': 'd941adbbd3e64dac92cc448dec5293cd',
+              'labelName': '标签1',
+              'parentLabelCode': 123456
+            }
+          ],
+          'labelChannels': [{
+            'channelDates': [{
+              'channelCode': '6044981090191552',
+              'channelName': '复兴大桥中段-交通事故',
+              'channelSn': null,
+              'cameraType': 0,
+              'online': 1
+            },
+              {
+                'channelCode': 'ZgVzqsjwA1DTF561VGHK5E',
+                'channelName': '北京7青羊东二路77号2通道1',
+                'channelSn': null,
+                'cameraType': 1,
+                'online': 1
+              }
+            ],
+            'labelCode': 'd941adbbd3e64dac92cc448dec5293cd'
+          },
+            {
+              'channelDates': [{
+                'channelCode': 'ZgVzqsjwA1DTF561VGHKK7',
+                'channelName': '北京7青羊东二路77号2通道2',
+                'channelSn': null,
+                'cameraType': 2,
+                'online': 0
+              }],
+              'labelCode': '5a81d1bd499b4940a21fc63ca51f4dfa'
+            }
+          ]
+        },
+        {
+          'switchTab': '2',
+          'labelChannels': [{
+            'channelDates': [{
+              'channelCode': 'ZgVzqsjwA1DTF561VGHK5E',
+              'channelName': '北京7青羊东二路77号2通道1',
+              'channelSn': null,
+              'cameraType': 1,
+              'online': 1
+            },
+              {
+                'channelCode': 'ZgVzqsjwA1DTF561VGHKK7',
+                'channelName': '北京7青羊东二路77号2通道2',
+                'channelSn': null,
+                'cameraType': 2,
+                'online': 0
+              }
+            ]
+          }]
+        }
+      ],
+      TVWallVisible: false,
+      activeName: 'tv',
+      channelId: ['ZgVzqsjwA1DTF561VHG69F'],
+      /** ----------------------------------摄像头预览开始------------------------------------- */
+      showModal: true,
+      activePanel: 'key1',
+      isLogin: false,
+      loginType: '1',
+      token: '',
+      ctrlType: 'playerWin',
+      https: 1,
+      httpsList: [
+        {
+          value: 0,
+          label: 0
+        },
+        {
+          value: 1,
+          label: 1
+        }
+      ],
+      ctrlTypeList: [{
+        value: 'playerWin',
+        label: '播放控件'
+      }, {
+        value: 'realMonitorUI',
+        label: '带设备树实时预览控件'
+      }, {
+        value: 'playbackUI',
+        label: '带设备树视频回放控件'
+      }, {
+        value: 'TVWallUI',
+        label: '视频上墙'
+      }],
+      ctrlList: [
+        {
+          value: 'ctrl1',
+          label: '控件1'
+        },
+        {
+          value: 'ctrl2',
+          label: '控件2'
+        },
+        {
+          value: 'ctrl3',
+          label: '控件3'
+        }
+      ],
+      splitList: [
+        {
+          value: 1,
+          label: '1 * 1'
+        },
+        {
+          value: 4,
+          label: '2 * 2'
+        },
+        {
+          value: 9,
+          label: '3 * 3'
+        }
+      ],
+      displayModeList: [
+        {
+          value: 1,
+          label: '播放器预览模式'
+        },
+        {
+          value: 2,
+          label: '播放器回放模式'
+        }
+      ],
+      mixedVideoDisplayModeList: [
+        {
+          value: 1,
+          label: '播放实时视频'
+        },
+        {
+          value: 2,
+          label: '播放回放视频'
+        }
+      ],
+      ctrl: 'ctrl1',
+      splitNum: 1,
+      displayMode: 1,
+      displayTimeRange: [],
+      modalDisplayTimeRange: [],
+      mixedVideoTime: null,
+      recordPath: 'C:\\DSS LightWeight\\DSS LightWeight Client\\Record\\',
+      downloadName: '',
+      downTimeRange: [],
+      downloadFormat: 0,
+      downloadFormatList: [{
+        value: 0,
+        label: 'dav'
+      },
+        {
+          value: 1,
+          label: 'avi'
+        }, {
+          value: 2,
+          label: 'mp4'
+        }],
+      downloadSource: 3,
+      downloadSourceList: [
+        {
+          value: 3,
+          label: '中心录像'
+        }, {
+          value: 2,
+          label: '设备录像'
+        }],
+      showDownloadStreamType: false,
+      downloadStreamType: 1,
+      downloadStreamTypeList: [{
+        value: 1,
+        label: '主码流'
+      },
+        {
+          value: 2,
+          label: '辅码流'
+        },
+        {
+          value: 3,
+          label: '三码流'
+        }],
+      downloadIsShow: true,
+      downloadIsShowList: [{
+        value: true,
+        label: '是'
+      },
+        {
+          value: false,
+          label: '否'
+        }],
+      crtPosX: 0,
+      crtPosY: 0,
+      crtWidth: 1148,
+      crtHeight: 650,
+      domId: 'dom1',
+      mixedVideoDisplayMode: 2,
+      isShowTipe: true,
+      autoList: [],
+      stringList: [],
+      data: null,
+      /** ----------------------------------摄像头预览结束------------------------------------- */
+      cameraList: [],
+      initCount: 0,
+      pubKey: '',
+      oWebControl: null
+    }
+  },
+  created() {
+    const DHWsInstance = DHWs.getInstance()
+    this.ws = DHWsInstance
+  },
+  methods: {
+    cancelEventLocationShow() {
+      // this.activeName = 'tv'
+      this.TVWallVisible = false
+      this.destroy()
+
+      if (this.oWebControl != null) {
+        this.oWebControl.JS_HideWnd()   // 先让窗口隐藏,规避可能的插件窗口滞后于浏览器消失问题
+        this.oWebControl.JS_Disconnect().then(function () {  // 断开与插件服务连接成功
+          },
+          function () {  // 断开与插件服务连接失败
+          })
+      }
+    },
+    showTVWall(data, val) {
+      this.tvListJson = data
+      this.data = val
+      this.autoList = []
+      this.stringList = []
+      for (let i = 1; i < data[0].treeLabels.length; i++) {
+        this.autoList.push({"channelId": data[0].treeLabels[i].labelCode})
+        this.stringList.push(data[0].treeLabels[i].labelCode)
+      }
+      console.log("this.autoList",this.autoList);
+      console.log("this.stringList",this.stringList);
+      // let that=this;
+      /** ----------------------------------大华摄像头预览开始------------------------------------- */
+      this.ws.addEventListener('connectStateChange', data => {
+        if (data) {
+          console.log('连接成功')
+        } else {
+          console.log('连接失败,下载客户端')
+          this.alertReinstall()
+          this.isShowTipe && this.$modal.confirm({
+            title: '下载客户端',
+            content: '检测到您未安装部分插件,将影响部分功能使用,请下载后使用?',
+            onOk: () => {
+              //这里写下载方法
+              this.isShowTipe = false
+            },
+            onCancel: () => {
+              this.isShowTipe = false
+            }
+          });
+        }
+      })
+      this.preview()
+      /** ----------------------------------大华摄像头预览结束------------------------------------- */
+      /** ----------------------------------海康摄像头预览开始------------------------------------- */
+      // tvCameraList().then(response => {
+      //   this.cameraList=response.data
+      // })
+      // that.initPlugin()
+      // setTimeout(function() {
+      //   that.playhk();
+      // }, 5000)
+      // /** ----------------------------------海康摄像头预览结束------------------------------------- */
+      this.TVWallVisible = true
+    },
+    /** ----------------------------------大华摄像头预览开始------------------------------------- */
+    alertLogin: function () {
+      this.$modal.msg('登录中....')
+    },
+    alertLoginSuccess: function () {
+      this.$modal.msgSuccess('登录成功!')
+    },
+    alertLoginFailed: function () {
+      this.$modal.msgError('登陆失败!')
+    },
+    alertReinstall: function () {
+      this.$modal.msgWarning('请重新安装客户端')
+    },
+    /** 预览按钮操作 */
+    preview() {
+      getDahuaVideoServer().then(newResponse => {
+        this.ws.detectConnectQt().then(res => {
+          if (res) { // 连接客户端成功
+            this.alertLogin()
+            this.ws.login({
+              loginIp: newResponse.loginIp,
+              loginPort: newResponse.loginPort,
+              userName: newResponse.userName,
+              userPwd: newResponse.userPwd,
+              // loginIp: '192.168.100.100',
+              // loginPort: 8314,
+              // userName: 'system',
+              // userPwd: 'Admin@123',
+              token: '',
+              https: 1
+            })
+            this.ws.on('loginState', (res) => {
+              this.isLogin = res
+              console.log('---res-----', res)
+              if (res) {
+                this.alertLoginSuccess()
+                this.activePanel = 'key2'
+                this.create(this.tvListJson)
+              } else {
+                this.alertLoginFailed()
+              }
+            })
+          } else { // 连接客户端失败
+            this.alertReinstall()
+          }
+        })
+      })
+    },
+    playRealMonitorVideo() { // 自定义设备树自动播放指定通道编码视频
+      const config = this.ws.config
+      const {loginIp, userCode} = config
+      this.ws.postMessage('playRealMonitorVideo', {
+        loginIp,
+        userCode,
+        params: {
+          ctrlCode: "ctrl1",
+          array: this.autoList
+        }
+      })
+    },
+    create(tvListJson) { // 调用创建控件接口
+      let _this = this
+      const params = [
+        {
+          'ctrlType': 'realMonitorUI',
+          'ctrlCode': 'ctrl1',
+          'ctrlProperty': {
+            'displayMode': 1,
+            'splitNum': 1,
+            'channelList': [
+              {
+                'channelId': ''
+              }
+            ]
+          },
+          'visible': true,
+          'domId': 'dom1'
+        }
+      ]
+      this.setPos()
+      this.customizeTree(tvListJson);
+      _this.ws.createCtrl(params);
+      _this.playRealMonitorVideo();
+      if (_this.data != undefined && _this.data != null) {
+        setTimeout( _this.rotation(_this.data.longitude, _this.data.latitude, _this.stringList),5000)
+      }
+    },
+    rotation(lng,lat,list){
+      rotation(lng,lat,list);
+    },
+    setPos() {
+      let target = document.getElementById(this.domId)
+      console.log(target, 'target')
+      target.style.right = `${this.crtPosX}px`
+      target.style.top = `${this.crtPosY}px`
+      target.style.width = `${this.crtWidth}px`
+      target.style.height = `${this.crtHeight}px`
+      if (document.createEvent) {
+        var event = document.createEvent('HTMLEvents')
+        event.initEvent('resize', true, true)
+        window.dispatchEvent(event)
+      } else if (document.createEventObject) {
+        window.fireEvent('onresize')
+      }
+    },
+    destroy() { // 调用销毁控件接口
+      if (!this.isLogin) {
+        this.$modal.msgWarning('正在登陆客户端,请稍等......')
+        return false
+      }
+      const ctrls = this.ws.ctrls.map(i => {
+        if (i.ctrlCode === this.ctrl) {
+          return i.ctrlCode
+        }
+      })
+      this.ws.destroyCtrl(ctrls)
+    },
+    customizeTree(tvListJson) { // 调用控件接口树
+      const config = this.ws.config
+      const {loginIp, userCode} = config
+      this.ws.postMessage('customizeTree', {
+        loginIp,
+        userCode,
+        params: {
+          array: tvListJson
+        }
+      })
+    },
+    /** ----------------------------------大华摄像头预览结束------------------------------------- */
+    /** ----------------------------------海康摄像头预览开始------------------------------------- */
+    // 创建播放实例
+    initPlugin() {
+      let that = this
+      that.oWebControl = new WebControl({
+        szPluginContainer: 'playWnd',                       // 指定容器id
+        iServicePortStart: 15900,                           // 指定起止端口号,建议使用该值
+        iServicePortEnd: 15909,
+        szClassId: '23BF3B0A-2C56-4D97-9C03-0CB103AA8F11',   // 用于IE10使用ActiveX的clsid
+        cbConnectSuccess: function () {                     // 创建WebControl实例成功
+          that.oWebControl.JS_StartService('window', {         // WebControl实例创建成功后需要启动服务
+            dllPath: './VideoPluginConnect.dll'         // 值"./VideoPluginConnect.dll"写死
+          }).then(function () {                           // 启动插件服务成功
+            that.oWebControl.JS_SetWindowControlCallback({   // 设置消息回调
+              cbIntegrationCallBack: cbIntegrationCallBack
+            })
+
+            that.oWebControl.JS_CreateWnd('playWnd', 850, 615).then(function () { //JS_CreateWnd创建视频播放窗口,宽高可设定
+              that.init()  // 创建播放实例成功后初始化
+            })
+          }, function () { // 启动插件服务失败
+          })
+        },
+        cbConnectError: function () { // 创建WebControl实例失败
+          that.oWebControl = null
+          $('#playWnd').html('插件未启动,正在尝试启动,请稍候...<a href="./hk/VideoWebPlugin.exe">点击下载插件</a>')
+          WebControl.JS_WakeUp('VideoWebPlugin://') // 程序未启动时执行error函数,采用wakeup来启动程序
+          initCount++
+          if (initCount < 3) {
+            setTimeout(function () {
+              that.initPlugin()
+            }, 3000)
+          } else {
+            $('#playWnd').html('插件启动失败,请检查插件是否安装!<a href="./hk/VideoWebPlugin.exe">点击下载插件</a>')
+          }
+        },
+        cbConnectClose: function (bNormalClose) {
+          // 异常断开:bNormalClose = false
+          // JS_Disconnect正常断开:bNormalClose = true
+          console.log('cbConnectClose')
+          that.oWebControl = null
+        }
+      })
+    },
+    //初始化
+    init() {
+      let that = this
+      this.getPubKey(function () {
+        ////////////////////////////////// 请自行修改以下变量值	////////////////////////////////////
+        var appkey = '24699060'                           //综合安防管理平台提供的appkey,必填
+        var secret = that.setEncrypt('tt1pMbsrlwGZUWucdAPw')   //综合安防管理平台提供的secret,必填
+        var ip = '36.49.108.22'                           //综合安防管理平台IP地址,必填
+        var playMode = 0                                  //初始播放模式:0-预览,1-回放
+        var port = 1443                                    //综合安防管理平台端口,若启用HTTPS协议,默认443
+        var snapDir = 'D:\\SnapDir'                       //抓图存储路径
+        var videoDir = 'D:\\VideoDir'                     //紧急录像或录像剪辑存储路径
+        var layout = '3x3'                                //playMode指定模式的布局
+        var enableHTTPS = 1                               //是否启用HTTPS协议与综合安防管理平台交互,这里总是填1
+        var encryptedFields = 'secret'					   //加密字段,默认加密领域为secret
+        var showToolbar = 1                               //是否显示工具栏,0-不显示,非0-显示
+        var showSmart = 1                                 //是否显示智能信息(如配置移动侦测后画面上的线框),0-不显示,非0-显示
+        var buttonIDs = '0,16,256,257,258,259,260,512,513,514,515,516,517,768,769'  //自定义工具条按钮
+        ////////////////////////////////// 请自行修改以上变量值	////////////////////////////////////
+
+        that.oWebControl.JS_RequestInterface({
+          funcName: 'init',
+          argument: JSON.stringify({
+            appkey: appkey,                            //API网关提供的appkey
+            secret: secret,                            //API网关提供的secret
+            ip: ip,                                    //API网关IP地址
+            playMode: playMode,                        //播放模式(决定显示预览还是回放界面)
+            port: port,                                //端口
+            snapDir: snapDir,                          //抓图存储路径
+            videoDir: videoDir,                        //紧急录像或录像剪辑存储路径
+            layout: layout,                            //布局
+            enableHTTPS: enableHTTPS,                  //是否启用HTTPS协议
+            encryptedFields: encryptedFields,          //加密字段
+            showToolbar: showToolbar,                  //是否显示工具栏
+            showSmart: showSmart,                      //是否显示智能信息
+            buttonIDs: buttonIDs                       //自定义工具条按钮
+          })
+        }).then(function (oData) {
+          that.oWebControl.JS_Resize(850, 615)  // 初始化后resize一次,规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
+        })
+      })
+    },
+    //获取公钥
+    getPubKey(callback) {
+      let that = this
+      that.oWebControl.JS_RequestInterface({
+        funcName: 'getRSAPubKey',
+        argument: JSON.stringify({
+          keyLength: 1024
+        })
+      }).then(function (oData) {
+        console.log(oData)
+        if (oData.responseMsg.data) {
+          that.pubKey = oData.responseMsg.data
+          callback()
+        }
+        125
+      })
+    },
+//RSA加密
+    setEncrypt(value) {
+      var encrypt = new JSEncrypt()
+      encrypt.setPublicKey(this.pubKey)
+      return encrypt.encrypt(value)
+    },
+    //播放海康摄像头
+    playhk(channelCode) {
+      var cameraIndexCode = channelCode     //获取输入的监控点编号值,必填
+      var streamMode = 0                                     //主子码流标识:0-主码流,1-子码流
+      var transMode = 1                                      //传输协议:0-UDP,1-TCP
+      var gpuMode = 0                                        //是否启用GPU硬解,0-不启用,1-启用
+      var wndId = -1                                         //播放窗口序号(在2x2以上布局下可指定播放窗口)
+
+      cameraIndexCode = cameraIndexCode.replace(/(^\s*)/g, '')
+      cameraIndexCode = cameraIndexCode.replace(/(\s*$)/g, '')
+
+      this.oWebControl.JS_RequestInterface({
+        funcName: 'startPreview',
+        argument: JSON.stringify({
+          cameraIndexCode: cameraIndexCode,                //监控点编号
+          streamMode: streamMode,                         //主子码流标识
+          transMode: transMode,                           //传输协议
+          gpuMode: gpuMode,                               //是否开启GPU硬解
+          wndId: wndId                                     //可指定播放窗口
+        })
+      })
+    }
+    /** ----------------------------------海康摄像头预览结束------------------------------------- */
+  }
+}
+
+// 推送消息
+function cbIntegrationCallBack(oData) {
+  console.log(JSON.stringify(oData.responseMsg))
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+@import '@/assets/styles/base.scss';
+
+.event-info-con {
+  width: 100%;
+  display: flex;
+
+  .e-left {
+    width: 32%;
+  }
+
+  .e-center {
+    width: 30%;
+    margin-left: 1%;
+
+    .img-company {
+      width: 100%;
+      height: 18.3vh;
+
+      img {
+      }
+    }
+  }
+
+  .e-right {
+    margin-left: 1%;
+    width: 45%;
+  }
+
+  .e-location-left {
+    width: 28%;
+    margin-top: 1rem;
+  }
+
+  .e-location-right {
+    width: 71%;
+    margin-top: 1.3rem;
+    margin-left: 1rem;
+  }
+}
+
+.el-dialog:not(.is-fullscreen) {
+  margin-top: 5.5vh !important;
+}
+
+.bottom-menu-normal {
+  max-width: 90%;
+  padding: 0 3rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 0;
+  z-index: 100000;
+  border-radius: 5px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: url(../assets/images/integrated/btm-menu.png) center no-repeat;
+  background-size: cover;
+  overflow: hidden;
+
+  .btm-m-con {
+    position: relative;
+    color: $inBlue;
+    font-size: .5rem;
+    padding: 1rem 1.5rem;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    -webkit-transform: translateY(0);
+    transform: translateY(0);
+    transition: all 0.2s ease-in-out;
+    cursor: pointer;
+    white-space: nowrap;
+
+    i {
+      font-size: 1rem;
+      color: $inBlue;
+      text-shadow: 0 0 10px rgba($color: $inBlue, $alpha: .6);
+      margin-right: 0.2rem;
+    }
+  }
+
+  .btm-m-con:hover {
+    text-shadow: 0 0 20px rgba($color: $inBlueHover, $alpha: 1.0);
+    filter: brightness(2.3);
+    -webkit-transform: translateX(0.2rem);
+    transform: translateX(0.2rem);
+    transition: all 0.2s ease-in-out;
+
+    i {
+      color: $inBlueHover;
+      text-shadow: 0 0 20px rgba($color: $inBlueHover, $alpha: 1.0);
+    }
+  }
+
+  .m-l-none {
+    .el-input__inner {
+      margin-left: 0 !important;
+    }
+  }
+
+}
+
+/*海康*/
+html, body {
+  padding: 0;
+  margin: 0;
+}
+
+.playWnd {
+  margin: -13px 0 0 255px;
+  width: 850px; /*播放容器的宽和高设定*/
+  height: 615px;
+  border: 1px solid red;
+}
+
+.operate {
+  margin-top: 24px;
+}
+
+.operate::after {
+  content: '';
+  display: block;
+  clear: both;
+}
+
+.module {
+  float: left;
+  width: 340px;
+  /*min-height: 320px;*/
+  margin-left: 16px;
+  padding: 16px 8px;
+  box-sizing: border-box;
+  border: 1px solid #e5e5e5;
+}
+
+.module .item {
+  margin-bottom: 4px;
+}
+
+.module input[type="text"] {
+  box-sizing: border-box;
+  display: inline-block;
+  vertical-align: middle;
+  margin-left: 0;
+  width: 150px;
+  min-height: 20px;
+}
+
+.module .btn {
+  min-width: 80px;
+  min-height: 24px;
+  margin-top: 100px;
+  margin-left: 80px;
+}
+</style>

+ 5 - 0
src/components/supermap.vue

@@ -1290,6 +1290,11 @@ export default {
         duration: 2
       })
     },
+    dropLocation: function(lat, lng,leve) { //落点定位
+      this.map.flyTo([lat, lng], leve, {
+        duration: 2
+      })
+    },
     dropLocation10: function(lat, lng) { //落点定位
       this.map.flyTo([lat, lng], 10, {
         duration: 2

+ 1 - 0
src/components/v-fastmenu.vue

@@ -84,6 +84,7 @@ import Cookies from 'js-cookie'
           this.deptNames=response.data.deptNames
           this.phonenumber=response.data.phonenumber
           Cookies.set('userId',response.data.userId);
+          Cookies.set('nickName',response.data.nickName);
         });
       },
       resetPwd(){

+ 5 - 5
src/components/vBottomMenu.vue

@@ -437,11 +437,11 @@ export default {
           icon: 'iconfont sj-icon-sjdw',
           click: 'eventLocation'
         },
-        {
-          name: '图层切换',
-          icon: 'iconfont sj-icon-tcqh',
-          click: 'layerSwitching'
-        },
+        // {
+        //   name: '图层切换',
+        //   icon: 'iconfont sj-icon-tcqh',
+        //   click: 'layerSwitching'
+        // },
         {
           name: '测量工具',
           icon: 'iconfont sj-icon-clgj',

+ 32 - 32
src/router/index.js

@@ -41,14 +41,14 @@ export const constantRoutes = [{
 			title: '应急云图'
 		}
 	},
-  {
-    path: '/forestDanger',
-    name: 'forestDanger',
-    component: () => import('@/views/forestDanger'),
-    meta: {
-      title: '巡检隐患'
-    }
-  },
+  // {
+  //   path: '/forestDanger',
+  //   name: 'forestDanger',
+  //   component: () => import('@/views/forestDanger'),
+  //   meta: {
+  //     title: '巡检隐患'
+  //   }
+  // },
   {
     path: '/monitor',
     name: 'monitor',
@@ -65,14 +65,14 @@ export const constantRoutes = [{
       title: '应急资源'
     }
   },
-  {
-    path: '/leader',
-    name: 'leader',
-    component: () => import('@/views/leader'),
-    meta: {
-      title: '巡检轨迹'
-    }
-  },
+  // {
+  //   path: '/leader',
+  //   name: 'leader',
+  //   component: () => import('@/views/leader'),
+  //   meta: {
+  //     title: '巡检轨迹'
+  //   }
+  // },
   {
     path: '/bigdata',
     name: 'bigdata',
@@ -98,14 +98,14 @@ export const constantRoutesNew = [{
 			title: '应急云图'
 		}
 	},
-	{
-		path: '/forestDanger',
-		name: 'forestDanger',
-		component: () => import('@/views/forestDanger'),
-		meta: {
-			title: '巡检隐患'
-		}
-	},
+	// {
+	// 	path: '/forestDanger',
+	// 	name: 'forestDanger',
+	// 	component: () => import('@/views/forestDanger'),
+	// 	meta: {
+	// 		title: '巡检隐患'
+	// 	}
+	// },
   {
     path: '/monitor',
     name: 'monitor',
@@ -122,14 +122,14 @@ export const constantRoutesNew = [{
       title: '应急资源'
     }
   },
-  {
-    path: '/leader',
-    name: 'leader',
-    component: () => import('@/views/leader'),
-    meta: {
-      title: '巡检轨迹'
-    }
-  },
+  // {
+  //   path: '/leader',
+  //   name: 'leader',
+  //   component: () => import('@/views/leader'),
+  //   meta: {
+  //     title: '巡检轨迹'
+  //   }
+  // },
   {
     path: '/bigdata',
     name: 'bigdata',

+ 1 - 0
src/store/getters.js

@@ -6,6 +6,7 @@ const getters = {
   cachedViews: state => state.tagsView.cachedViews,
   token: state => state.user.token,
   avatar: state => state.user.avatar,
+  userId: state => state.user.id,
   name: state => state.user.name,
   introduction: state => state.user.introduction,
   roles: state => state.user.roles,

+ 5 - 0
src/store/modules/user.js

@@ -6,6 +6,7 @@ const user = {
     token: getToken(),
     name: '',
     avatar: '',
+    userId: '',
     roles: [],
     permissions: []
   },
@@ -28,6 +29,9 @@ const user = {
     },
     SET_PERMISSIONS: (state, permissions) => {
       state.permissions = permissions
+    },
+    SET_USERID: (state, userId) => {
+      state.userId = userId
     }
   },
 
@@ -65,6 +69,7 @@ const user = {
             commit('SET_ROLES', ['ROLE_DEFAULT'])
           }
           commit('SET_NAME', user.userName)
+          commit('SET_USERID', user.id)
           commit('SET_AVATAR', avatar)
           resolve(res)
         }).catch(error => {

+ 1 - 1
src/utils/request.js

@@ -20,7 +20,7 @@ const service = axios.create({
   // axios中请求配置有baseURL选项,表示请求URL公共部分
   baseURL: process.env.VUE_APP_BASE_API,
   // 超时
-  timeout: 10000
+  timeout: 20000
 })
 
 // request拦截器

+ 22 - 21
src/views/bigdata/bigdata.vue

@@ -58,25 +58,25 @@
           </div>
           <chartFireCause></chartFireCause>
         </div>
-        <div class="b-con mg-b-20 b-49">
-          <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
-            <span>巡检通过类型统计</span>
-          </div>
-          <chartDeviceReportingEvents></chartDeviceReportingEvents>
-        </div>
+<!--        <div class="b-con mg-b-20 b-49">-->
+<!--          <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">-->
+<!--            <span>巡检通过类型统计</span>-->
+<!--          </div>-->
+<!--          <chartDeviceReportingEvents></chartDeviceReportingEvents>-->
+<!--        </div>-->
         <div class="b-con mg-b-20 b-49">
           <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
             <span>高发不合格项</span>
           </div>
           <chartKeyArea></chartKeyArea>
         </div>
-        <div class="b-con mg-b-20 b-49">
-          <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
-            <span>巡检不通过类型统计</span>
-          </div>
-          <chartAncientTree></chartAncientTree>
-        </div>
-        <div class="b-con">
+<!--        <div class="b-con mg-b-20 b-49">-->
+<!--          <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">-->
+<!--            <span>巡检不通过类型统计</span>-->
+<!--          </div>-->
+<!--          <chartAncientTree></chartAncientTree>-->
+<!--        </div>-->
+        <div class="b-con tall">
           <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
             <span>高危企业分布情况</span>
           </div>
@@ -189,10 +189,10 @@ export default {
           path: '/forest',
           name: '应急云图'
         },
-        {
-          path: '/forestDanger',
-          name: '巡检隐患'
-        },
+        // {
+        //   path: '/forestDanger',
+        //   name: '巡检隐患'
+        // },
         {
           path: '/monitor',
           name: '监控中心'
@@ -201,10 +201,10 @@ export default {
           path: '/datacenter',
           name: '应急资源'
         },
-        {
-          path: '/leader',
-          name: '巡检轨迹'
-        },
+        // {
+        //   path: '/leader',
+        //   name: '巡检轨迹'
+        // },
         {
           path: '/bigdata',
           name: '统计分析'
@@ -357,6 +357,7 @@ export default {
 
     .b-con {
       width: 100%;
+      //height: 28.5vh;
       height: 28.5vh;
 
       box-shadow: 0 0 1px rgba($color: #163696, $alpha: .1),

+ 2 - 1
src/views/bigdata/chart-eventTrend.vue

@@ -1,7 +1,8 @@
 <!-- **************************************NO.6 矿坑*************************************** -->
 <template>
   <div class="chart-container">
-    <div id="pit" style="width: 100%; height:24vh;">
+<!--    <div id="pit" style="width: 100%; height:24vh;">-->
+    <div id="pit" style="width: 100%; height:50vh;">
     </div>
   </div>
 </template>

+ 210 - 94
src/views/eventdetailsdialog.vue

@@ -156,9 +156,12 @@
                                 </el-button>
                                 <el-button size="small" icon="el-icon-download" @click="showResponsibility()">责任制
                                 </el-button>
+                                <el-button v-if="eventStatusValue=='forest_event_status_2' && statusFlag=='1' && dataStatus=='0'"
+                                           size="small" icon="el-icon-download" @click="updateCentereventTEventcatalogueStatus('cz',true)">处置
+                                </el-button>
                               </div>
                               <div class="z-info-btm-grp-right">
-                                <el-button size="small" icon="el-icon-mic" @click="joinMeeting()">会议
+                                <el-button size="small" icon="el-icon-mic" @click="Meeting()">会议
                                 </el-button>
                               </div>
                             </div>
@@ -194,38 +197,18 @@
                                              @click="updateCentereventTEventcatalogueStatus('qs',false)">
                                     签收
                                   </el-button>
-                                  <!--<el-button size="small"-->
-                                             <!--icon="el-icon-question"-->
-                                             <!--@click="updateCentereventTEventcatalogueStatus('wb',false)">-->
-                                    <!--误报-->
-                                  <!--</el-button>-->
-                                  <!--<el-button size="small"-->
-                                             <!--icon="el-icon-warning"-->
-                                             <!--@click="updateCentereventTEventcatalogueStatus('cf',false)">-->
-                                    <!--重复-->
-                                  <!--</el-button>-->
                                 </div>
                                 <el-button size="small" icon="el-icon-chat-dot-square" @click="sendEventLog()">发送
                                 </el-button>
                               </div>
                               <div class="z-info-btm-input-btn" v-else-if="eventStatusValue=='forest_event_status_2'">
                                 <div>
-                                  <!--<el-button size="small"-->
-                                             <!--icon="el-icon-question"-->
-                                             <!--@click="updateCentereventTEventcatalogueStatus('wb',false)">-->
-                                    <!--误报-->
-                                  <!--</el-button>-->
-                                  <!--<el-button size="small"-->
-                                             <!--icon="el-icon-warning"-->
-                                             <!--@click="updateCentereventTEventcatalogueStatus('cf',false)">-->
-                                    <!--重复-->
-                                  <!--</el-button>-->
                                   <el-button size="small"
                                              icon="el-icon-phone" style="text-align:left"
                                              @click="updateCentereventTEventcatalogueStatus('ld',false)">
                                     联动
                                   </el-button>
-                                  <el-button size="small" v-if="dataStatus=='1'"
+                                  <el-button size="small" v-if="statusFlag=='1'"
                                              icon="el-icon-success" style="text-align:left"
                                              @click="updateCentereventTEventcatalogueStatus('bj',true)">
                                     办结
@@ -235,12 +218,17 @@
                                 </el-button>
                               </div>
                               <div class="z-info-btm-input-btn"
-                                   v-else-if="eventStatusValue=='forest_event_status_5'&&dataStatus=='1'">
+                                   v-else-if="eventStatusValue=='forest_event_status_5'&&statusFlag=='1'">
                                 <el-button size="small"
-                                           icon="el-icon-success" style="text-align:left"
+                                           icon="el-icon-success" style="text-align:left" v-if="eventType == 1"
                                            @click="updateCentereventTEventcatalogueStatus('gd',false)">
                                   填报
                                 </el-button>
+                                <el-button size="small"
+                                           icon="el-icon-success" style="text-align:left" v-if="eventType != 1"
+                                           @click="updateCentereventTEventcatalogueStatus('gd',true)">
+                                  归档
+                                </el-button>
                                 <el-button size="small" icon="el-icon-chat-dot-square" @click="sendEventLog()">发送
                                 </el-button>
                               </div>
@@ -269,7 +257,7 @@
                class="top-dialog"
                @close="cancelEventConfirm()">
       <el-form label-width="80px">
-        <el-form-item label="火灾半径" v-if="eventStatusButton=='qs'">
+        <el-form-item label="火灾半径" v-if="eventStatusButton=='qs' && eventTypeXl==null">
           <el-input type="number" v-model="sendHuoZaiBanJing" placeholder="请输入火灾半径"/>
         </el-form-item>
         <el-form-item :label="deptNameitem">
@@ -285,7 +273,7 @@
             </el-option>
           </el-select>
         </el-form-item>
-        <el-form-item label="事件类型" v-if="eventStatusButton=='qs'">
+        <el-form-item label="事件类型" v-if="eventStatusButton=='qs'&& eventTypeXl == null">
           <el-select v-model="sendEventType" placeholder="请选择事件类型!" clearable>
             <el-option
               v-for="item in eventTypeList"
@@ -463,6 +451,84 @@
         <div style="clear: both;"></div>
       </el-form>
     </el-dialog>
+    <!--    会议弹窗  start -->
+    <el-dialog title="视频会议" :visible.sync="showMeetingMsgDialog" v-if="showMeetingMsgDialog" width="65%"
+               @close="closeMeetingMsgDialog()">
+      <el-form label-width="1500px">
+        <div class="bottom">
+          <!-- 左侧菜单栏 -->
+          <div class="bottomLeft">
+            <div class="leftItem d-l-con padding-box nowrap" v-for="(item,index) in depteventList">
+              <div class="bgt-info">
+                <div class="bgt-info-name" :class="{on:iconCurrentIndex==item.deptId}"
+                     @click="dutysystemSelect(item.deptId,item.deptName,item.id)">{{ item.deptName }}
+                </div>
+              </div>
+            </div>
+          </div>
+          <!-- 左侧菜单栏对应的右侧的内容 -->
+          <div class="bottomRight" ref="wrapper">
+            <el-button
+              size="mini"
+              type="danger"
+              v-if="depteventId!=null&&depteventId!=''"
+              @click="addLine">添加
+            </el-button>
+            <el-button
+              size="mini"
+              type="danger"
+              v-if="depteventId!=null&&depteventId!=''"
+              @click="finUserByDept">选择
+            </el-button>
+            <el-table
+              :data="dutysystemTableData"
+              style="width: 100%"
+              :rules="rules">
+              <el-table-column prop="id" label="主键" v-if="false">
+                <template slot-scope="scope" hidden>
+                  <el-input v-model="scope.row.id" readonly placeholder="主键"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="name" label="姓名">
+                <template slot-scope="scope">
+                  <el-input v-model="scope.row.name" placeholder="姓名" οninput="value=value.replace(/^[\u4e00-\u9fa5]{2,4}$/,'')"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="post" label="岗位">
+                <template slot-scope="scope">
+                  <el-input v-model="scope.row.post" placeholder="岗位"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="telphone" label="手机号码">
+                <template slot-scope="scope">
+                  <el-input v-model="scope.row.telphone" placeholder="手机号码" οninput="value=value.replace(/^((13[0-9])|(14[5-9])|(15([0-3]|[5-9]))|(16[6-7])|(17[1-8])|(18[0-9])|(19[1|3])|(19[5|6])|(19[8|9]))\d{8}$/,'')"></el-input>
+                </template>
+              </el-table-column>
+              <el-table-column prop="bookbuytime" label="操作">
+                <template slot-scope="scope">
+                  <el-button
+                    size="mini"
+                    type="danger"
+                    icon="el-icon-delete"
+                    @click="handleDelete(scope.$index, scope.row)">删除
+                  </el-button>
+                  <!--<el-button-->
+                  <!--size="mini"-->
+                  <!--type="danger"-->
+                  <!--icon="el-icon-save"-->
+                  <!--@click="handleSave(scope.$index, scope.row)">保存-->
+                  <!--</el-button>-->
+                </template>
+              </el-table-column>
+            </el-table>
+          </div>
+        </div>
+        <el-button size="mini" type="primary" class="fr_button" @click="sendMsg">发送短信
+        </el-button>
+        <div style="clear: both;"></div>
+      </el-form>
+    </el-dialog>
+    <!--    会议弹窗  end   -->
     <el-dialog title="火险报告" :visible.sync="showEventConfirm_gd" v-if="showEventConfirm_gd" width="100%"
                class="top-dialog"
                @close="cancelEventConfirm_gd()">
@@ -1004,7 +1070,9 @@ import {
   dutysystemList,
   dutysystemAdd,
   dutysystemRemove,
-  userFeginlist
+  sendMessage,
+  userFeginlist,
+  eventHandling
 } from '@/api/forest'
 import {
   treeselectAll as deptTreeselect
@@ -1020,6 +1088,8 @@ import {
   getDahuaVideoServer
 } from '@/api/dahua/dahua'
 import DHWs from '@/dahua/lib/DHWs'
+import { selectConfigKey } from "@/api/system/config";
+import Cookies from 'js-cookie';
 export default {
   dicts: ['task_source'],
   watch: {
@@ -1060,7 +1130,7 @@ export default {
       sendDeptId: null,//签收部门/发起部门
       sendDeptName: null,//签收部门/发起部门
       sendEventType: null,//事件类型
-      sendHuoZaiBanJing: null,//火灾报告
+      sendHuoZaiBanJing: 0,//火灾报告
       sendGuanLianYuAn: null,//关联预案
       sendUserFegin: [],//联系人
       sendTaskSource: null,//任务来源
@@ -1174,7 +1244,8 @@ export default {
       eventStatusValue: null,//事件状态
       eventId: null,//事件ID
       eventType: null,//事件类型-大类
-      dataStatus: null,//事件流程按钮
+      eventTypeXl: null,//事件类型-小类
+      statusFlag: null,//事件流程按钮
       deptId: null,//事件流程部门
       eventCode: null,
       eventName: null,
@@ -1185,6 +1256,7 @@ export default {
       visuForestCloudYuAnBo: null,
       eventDialog: false,
       showResponsibilityDialog: false,//责任制弹窗
+      showMeetingMsgDialog: false,//发送会议短信弹窗
       depteventList: [],//责任制部门列表
       iconCurrentIndex: '',
       dutysystemDeptName: '',
@@ -1257,6 +1329,10 @@ export default {
   },
   methods: {
     /************************************责任制-开始****************************************/
+    //初始化责任制数据列表
+    initDutysystemTableData(){
+      this.dutysystemTableData = [];
+    },
     addLine: function() {//添加负责人行数
       var newValue = {
         id: '',//主键
@@ -1339,6 +1415,13 @@ export default {
       this.iconCurrentIndex = ''
       this.showResponsibilityDialog = false
     },
+    closeMeetingMsgDialog() {//会议弹窗关闭
+      this.dutysystemTableData = []
+      this.dutysystemDeptName = ''
+      this.depteventId = ''
+      this.iconCurrentIndex = ''
+      this.showMeetingMsgDialog = false
+    },
     addResponsibilityDialog() {//责任制保存
       let reg_user = /^[\u4e00-\u9fa5]{2,4}$/;    //2-4个中文字符正则
       let reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;    //11位手机号码正则
@@ -1423,7 +1506,7 @@ export default {
                 click: '',
                 parameter: '',
                 keepBindPopup: false,
-                isAggregation: false
+                isAggregation: true
               }
               if (res.data.length > 50) {
                 markersMap.isAggregation = true
@@ -1510,7 +1593,7 @@ export default {
       this.sendDeptName = null
       this.sendUserFegin = []
       this.sendEventType = null
-      this.sendHuoZaiBanJing = null
+      this.sendHuoZaiBanJing = 0
       this.sendGuanLianYuAn = null
       this.longitude = null
       this.latitude = null
@@ -1533,7 +1616,7 @@ export default {
       this.sendDeptName = null
       this.sendUserFegin = []
       this.sendEventType = null
-      this.sendHuoZaiBanJing = null
+      this.sendHuoZaiBanJing = 0
       this.sendGuanLianYuAn = null
       this.sendTaskTitle = null
       this.sendTaskSource = null
@@ -1658,12 +1741,16 @@ export default {
         if (eventStatus == 'qs') {//签收
           that.eventConfirmTitle = '事件签收'
           let param = { parentId: that.eventType }
-          await listSJfl(param).then(res => {
-            //事件类型
-            if (res.code == 200) {
-              that.eventTypeList = res.data
-            }
-          })
+          if(that.eventTypeXl != null){
+            that.sendEventType = that.eventTypeXl;
+          }else{
+            await listSJfl(param).then(res => {
+              //事件类型
+              if (res.code == 200) {
+                that.eventTypeList = res.data
+              }
+            })
+          }
           await listYuAn().then(res => {
             //关联预案
             if (res.code == 200) {
@@ -1767,28 +1854,30 @@ export default {
           })
 
         } else if (eventStatus == 'gd') {
-          let double = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/;    //数字和两位小数
-          let number = /^[+]{0,1}(\d+)$/g;    //正整数
+          if(that.eventType == 1){
+            let double = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/;    //数字和两位小数
+            let number = /^[+]{0,1}(\d+)$/g;    //正整数
 
-          if(!double.test(that.table2.areaTotal)){
-            that.$message.error(`面积只能填写到小数后两位!`)
-            return
-          }
-          if(!number.test(that.table2.peopleTotal)){
-            that.$message.error(`人员请填写正整数!`)
-            return
-          }
-          if(that.table2.forestComposition == '' || that.table2.forestComposition==null){
-            that.$message.error(`林木组成不能为空!`)
-            return
-          }
-          if(that.table2.forestToken == '' || that.table2.forestToken==null){
-            that.$message.error(`林令不能为空!`)
-            return
-          }
+            if(!double.test(that.table2.areaTotal)){
+              that.$message.error(`面积只能填写到小数后两位!`)
+              return
+            }
+            if(!number.test(that.table2.peopleTotal)){
+              that.$message.error(`人员请填写正整数!`)
+              return
+            }
+            if(that.table2.forestComposition == '' || that.table2.forestComposition==null){
+              that.$message.error(`林木组成不能为空!`)
+              return
+            }
+            if(that.table2.forestToken == '' || that.table2.forestToken==null){
+              that.$message.error(`林令不能为空!`)
+              return
+            }
             if(that.table2.porosities == '' || that.table2.porosities==null){
-            that.$message.error(`疏密度不能为空!`)
-            return
+              that.$message.error(`疏密度不能为空!`)
+              return
+            }
           }
 
           //事件处理流程--归档
@@ -1812,6 +1901,15 @@ export default {
               that.$emit('getSupermap', that.calendarDay)
             }
           })
+        } else if(eventStatus == 'cz'){
+          eventHandling(that.eventId,that.eventCode).then(res => {
+            if (res.code == 200) {
+              that.$message.success(`处理成功!`)
+              that.refreshEvent(that.eventCode)
+              that.cancelEventConfirm_send()
+              that.showEventConfirm = false
+            }
+          })
         } else {
           if (eventStatus == 'qs' || eventStatus == 'wb' || eventStatus == 'cf') {
             if (that.sendDeptId == '' || that.sendDeptId == null || that.sendDeptName == '' || that.sendDeptName == null) {
@@ -1819,10 +1917,6 @@ export default {
               return
             }
             if (eventStatus == 'qs') {
-              if (that.sendHuoZaiBanJing == '' || that.sendHuoZaiBanJing == null) {
-                that.$message.error(`请输入火灾半径!`)
-                return
-              }
               if (that.sendEventType == '' || that.sendEventType == null) {
                 that.$message.error(`请选择事件类型!`)
                 return
@@ -1879,7 +1973,7 @@ export default {
       this.$refs.eventLogUpload.eventLogUpload(this.eventCode)
     },
     cancelEventShow() {
-      this.dataStatus = null
+      this.statusFlag = null
       this.deptId = null
       console.log('关闭事件弹窗')
       this.eventLogList = []
@@ -1895,12 +1989,13 @@ export default {
         that.address = res.data.catalogue.address
         that.eventStatusValue = res.data.catalogue.eventStatusValue
         that.eventType = res.data.catalogue.eventType
-        that.dataStatus = res.data.catalogue.dataStatus
+        that.statusFlag = res.data.catalogue.statusFlag
         that.deptId = res.data.catalogue.deptId
         that.eventId = res.data.catalogue.id
         that.longitude = res.data.catalogue.longitude
         that.latitude = res.data.catalogue.latitude
         that.eventName = res.data.catalogue.eventName
+        that.eventTypeXl = res.data.catalogue.eventTypeXl
         let markersMap = {
           lng: 124.59,
           lat: 43.02,
@@ -1909,7 +2004,7 @@ export default {
           click: '',
           parameter: '',
           keepBindPopup: false,
-          isAggregation: false,
+          isAggregation: true,
           radius: 0
         }
         if (res.data.catalogue.eventStatusValue == 'forest_event_status_1' && res.data.catalogue.urgeCount == 0) {
@@ -1938,7 +2033,7 @@ export default {
           that.$refs.supermapDialog.dropLocation10(res.data.catalogue.latitude, res.data.catalogue.longitude)
         }, 2000)
         if (res.data.centermonitorTCamera != null) {
-          that.cameraCode = res.data.centermonitorTCamera.cameraCode;
+          that.cameraCode = res.data.centermonitorTCamera.id;
           let markersMap = {
             lng: 124.59,
             lat: 43.02,
@@ -1947,7 +2042,7 @@ export default {
             click: 'preview',
             parameter: {code:res.data.centermonitorTCamera.cameraCode,type:res.data.centermonitorTCamera.cameraFactory},
             keepBindPopup: false,
-            isAggregation: false,
+            isAggregation: true,
             radius: 0
           }
           markersMap.bindPopupHtml = '<div class="map-tip">' +
@@ -1979,12 +2074,13 @@ export default {
         that.address = res.data.catalogue.address
         that.eventStatusValue = res.data.catalogue.eventStatusValue
         that.eventType = res.data.catalogue.eventType
-        that.dataStatus = res.data.catalogue.dataStatus
+        that.statusFlag = res.data.catalogue.statusFlag
         that.deptId = res.data.catalogue.deptId
         that.eventId = res.data.catalogue.id
         that.latitude = res.data.catalogue.latitude
         that.longitude = res.data.catalogue.longitude
         that.eventName = res.data.catalogue.eventName
+        that.eventTypeXl = res.data.catalogue.eventTypeXl
         let markersMap = {
           lng: 124.59,
           lat: 43.02,
@@ -1993,7 +2089,7 @@ export default {
           click: '',
           parameter: '',
           keepBindPopup: false,
-          isAggregation: false,
+          isAggregation: true,
           radius: 0
         }
         if (res.data.catalogue.eventStatusValue == 'forest_event_status_1' && res.data.catalogue.urgeCount == 0) {
@@ -2033,7 +2129,7 @@ export default {
             click: 'preview',
             parameter: {code:res.data.centermonitorTCamera.cameraCode,type:res.data.centermonitorTCamera.cameraFactory},
             keepBindPopup: false,
-            isAggregation: false,
+            isAggregation: true,
             radius: 0
           }
           markersMap.bindPopupHtml = '<div class="map-tip">' +
@@ -2184,7 +2280,7 @@ export default {
         this.$Message.info('正在登陆客户端,请稍等......')
         return false
       }
-      this.ws.openVideo(cameraParams)
+      this.ws.openVideo([cameraParams])
     },
     /** ----------------------------------摄像头预览结束------------------------------------- */
 
@@ -2318,30 +2414,50 @@ export default {
       encrypt.setPublicKey(this.pubKey)
       return encrypt.encrypt(value)
     },
-    //加入华为视频会议方法
-    joinMeeting(){
-      let eventId = this.eventId;
-      let subject = "视频会议";
-      let nickName;
-      getUserInfo().then(res => {
-        nickName = res.data.nickName;
-      });
-      hasConferences(eventId).then(res => {
-        let data = res.data;
-        /**如果没有正在开启的会议会返回空对象**/
-        if(res.code == 200 && Object.keys(data).length === 0){
-          createConferences(eventId,subject).then(res => {
-            let data = res.data;
-            if(res.code == 200){
-              window.open("/hwMeeting/meeting.html?nickName="+encodeURI(encodeURI(nickName))+"&conferenceID="+data.conferenceID+"&password="+data.password);
-            }
-          });
-        }else{
-          window.open("/hwMeeting/meeting.html?nickName="+encodeURI(encodeURI(nickName))+"&conferenceID="+data.conferenceID+"&password="+data.password);
-        }
-      });
-    }
     /** ----------------------------------海康摄像头预览结束------------------------------------- */
+    /** ----------------------------------视频会议开始------------------------------------- */
+    sendMsg() {// 视频会议发送短信
+      let reg_user = /^[\u4e00-\u9fa5]{2,4}$/;    //2-4个中文字符正则
+      let reg_tel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;    //11位手机号码正则
+      for(let i in this.dutysystemTableData){
+        if(!reg_user.test(this.dutysystemTableData[i].name)){
+          this.$message.error(`请输入正确姓名!`)
+          return;
+        }
+        if(!reg_tel.test(this.dutysystemTableData[i].telphone)){
+          this.$message.error(`请输入正确手机号码!`)
+          return;
+        }
+
+        if(this.dutysystemTableData[i].id==null || this.dutysystemTableData[i].id==''){
+          this.dutysystemTableData[i].dept = this.dutysystemDeptName;
+          this.dutysystemTableData[i].depteventId = this.depteventId;
+        }
+      }
+      const param = {centereventTDutySystemList:this.dutysystemTableData,eventCode:this.eventCode,eventName:this.eventName,eventId:this.eventId}
+      sendMessage(param).then(res => {
+        this.$message.success(res.msg);
+        this.dutysystemSelect(this.iconCurrentIndex, this.dutysystemDeptName, this.depteventId);
+        this.showMeetingMsgDialog = false;
+        this.joinMeeting();
+      })
+    },
+    joinMeeting(){
+      let hwMeetingUrl;
+      selectConfigKey('hwMeetingUrl').then(res => {
+        hwMeetingUrl = res.data
+        window.open(hwMeetingUrl+"/joinConferences/"+this.eventId+"/"+this.eventName+"的会议"+"/"+Cookies.get("nickName"));
+      })
+    },
+    Meeting() {//弹出发送会议短信弹窗
+      let param = { eventCode: this.eventCode }
+      centereventtdepteventList(param).then(res => {
+        this.depteventList = res.data
+        this.showMeetingMsgDialog = true
+        this.initDutysystemTableData();
+      })
+    },
+    /** ----------------------------------视频会议结束------------------------------------- */
   }
 }
 

+ 3 - 7
src/views/firespread.vue

@@ -1021,7 +1021,7 @@
         sendDeptId: null,//签收部门/发起部门
         sendDeptName: null,//签收部门/发起部门
         sendEventType: null,//事件类型
-        sendHuoZaiBanJing: null,//火灾报告
+        sendHuoZaiBanJing: 0,//火灾报告
         sendGuanLianYuAn: null,//关联预案
         sendUserFegin: [],//联系人
         sendTaskSource: null,//任务来源
@@ -1456,7 +1456,7 @@
         this.sendDeptName = null
         this.sendUserFegin = []
         this.sendEventType = null
-        this.sendHuoZaiBanJing = null
+        this.sendHuoZaiBanJing = 0
         this.sendGuanLianYuAn = null
         this.longitude = null
         this.latitude = null
@@ -1479,7 +1479,7 @@
         this.sendDeptName = null
         this.sendUserFegin = []
         this.sendEventType = null
-        this.sendHuoZaiBanJing = null
+        this.sendHuoZaiBanJing = 0
         this.sendGuanLianYuAn = null
         this.sendTaskTitle = null
         this.sendTaskSource = null
@@ -1765,10 +1765,6 @@
                 return
               }
               if (eventStatus == 'qs') {
-                if (that.sendHuoZaiBanJing == '' || that.sendHuoZaiBanJing == null) {
-                  that.$message.error(`请输入火灾半径!`)
-                  return
-                }
                 if (that.sendEventType == '' || that.sendEventType == null) {
                   that.$message.error(`请选择事件类型!`)
                   return

+ 225 - 203
src/views/forest.vue

@@ -10,10 +10,10 @@
         <!-- 1 基本情况 -->
         <div class="forthis">
           <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;"/>
+            <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;" />
             <div class="this-title">
               <span>基本情况</span>
-              <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
+              <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;" />
             </div>
             <div class="i-list-con h-14">
               <div class="d-l-con no_hover">
@@ -27,7 +27,7 @@
         <!-- 2 事件统计-->
         <div class="forthis">
           <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;"/>
+            <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">
                 <div class="event-count">
@@ -37,8 +37,7 @@
                   <div class="count-number">{{ totalStr.charAt(3) }}</div>
                   <div class="count-number">{{ totalStr.charAt(4) }}</div>
                   <div class="count-number">{{ totalStr.charAt(5) }}</div>
-                  <dv-decoration-5
-                    style="width:81%;height:15px;position: absolute; top:4.2rem;z-index: 0; "/>
+                  <dv-decoration-5 style="width:81%;height:15px;position: absolute; top:4.2rem;z-index: 0; " />
                 </div>
               </div>
               <div class="d-l-con-icon">
@@ -48,7 +47,7 @@
                     {{ newReport_pre }}%
                   </dv-decoration-9>
                   <div class="e-state"
-                       :style="{'background-image':`url(${require('@/assets/images/integrated/state-bg.png')})`}">
+                    :style="{ 'background-image': `url(${require('@/assets/images/integrated/state-bg.png')})` }">
                     <span>新上报</span> <span>{{ newReport }}</span>
                   </div>
                 </div>
@@ -58,7 +57,7 @@
                     {{ readySure_pre }}%
                   </dv-decoration-9>
                   <div class="e-state"
-                       :style="{'background-image':`url(${require('@/assets/images/integrated/state-bg.png')})`}">
+                    :style="{ 'background-image': `url(${require('@/assets/images/integrated/state-bg.png')})` }">
                     <span>处理中</span> <span>{{ readySure }}</span>
                   </div>
                 </div>
@@ -68,7 +67,7 @@
                     {{ readyFinish_pre }}%
                   </dv-decoration-9>
                   <div class="e-state"
-                       :style="{'background-image':`url(${require('@/assets/images/integrated/state-bg.png')})`}">
+                    :style="{ 'background-image': `url(${require('@/assets/images/integrated/state-bg.png')})` }">
                     <span>已完成</span> <span>{{ readyFinish }}</span>
                   </div>
                 </div>
@@ -82,14 +81,14 @@
         <!-- 3 组织机构 -->
         <div class="forthis">
           <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;"/>
+            <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>
-                <el-collapse-item v-for="(item,index) in forestFarm" :key="index">
+                <el-collapse-item v-for="(item, index) in forestFarm" :key="index">
                   <!-- deptId -->
                   <template slot="title">
-                    <div class="d-l-con sj-collapse" :class="{on:listCurrentIndex1==item.deptId}"
-                         v-on:click="selectCameraByDeptId(item.deptId)">
+                    <div class="d-l-con sj-collapse" :class="{ on: listCurrentIndex1 == item.deptId }"
+                      v-on:click="selectCameraByDeptId(item.deptId)">
                       <div class="d-l-l-text">
                         <h4 class="collapse-title">{{ item.deptName }}</h4>
                       </div>
@@ -104,100 +103,86 @@
       </div>
       <!-- 地图 -->
       <supermap ref="supermap" style="width: 100%;height: 100vh;" class="indexSupermapClass" :mapDiv="'forestMap'"
-                :dynamicPlotting="false"
-                :mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false"
-                @showEventDialog="showEventDialog"></supermap>
+        :dynamicPlotting="false" :mapSite="{ doubleClickZoom: false }" :codes="['9fa5']" :isSideBySide="false"
+        @showEventDialog="showEventDialog"></supermap>
       <!-- 右侧 -->
       <div class="rightbar rightbar-index" ref="right">
         <div class="right-item1">
           <!-- 天气 -->
           <div class="forthis">
             <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+              <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">
                   <el-col :span="9">
                     <div class="weather-img">
-                      <img v-if="weatherinformationWeather==1"
-                           src="../assets/images/integrated/weather/qing-1.png">
-                      <img v-if="weatherinformationWeather==2"
-                           src="../assets/images/integrated/weather/duoyun-2.png">
-                      <img v-if="weatherinformationWeather==3"
-                           src="../assets/images/integrated/weather/yin-3.png">
-                      <img v-if="weatherinformationWeather==4"
-                           src="../assets/images/integrated/weather/zhenyu-4.png">
-                      <img v-if="weatherinformationWeather==5"
-                           src="../assets/images/integrated/weather/leizhenyu-5.png">
-                      <img v-if="weatherinformationWeather==6"
-                           src="../assets/images/integrated/weather/leizhenyubingbao-6.png">
-                      <img v-if="weatherinformationWeather==7"
-                           src="../assets/images/integrated/weather/yujiaxue-7.png">
-                      <img v-if="weatherinformationWeather==8"
-                           src="../assets/images/integrated/weather/xiaoyu-8.png">
-                      <img v-if="weatherinformationWeather==9||weatherinformationWeather==22"
-                           src="../assets/images/integrated/weather/zhongyu-9.png">
-                      <img v-if="weatherinformationWeather==10||weatherinformationWeather==23"
-                           src="../assets/images/integrated/weather/dayu-10.png">
-                      <img v-if="weatherinformationWeather==11||weatherinformationWeather==24"
-                           src="../assets/images/integrated/weather/baoyu-11.png">
-                      <img v-if="weatherinformationWeather==12||weatherinformationWeather==25"
-                           src="../assets/images/integrated/weather/dabaoyu-12.png">
-                      <img v-if="weatherinformationWeather==13||weatherinformationWeather==26"
-                           src="../assets/images/integrated/weather/tedabaoyu-13.png">
-                      <img v-if="weatherinformationWeather==14"
-                           src="../assets/images/integrated/weather/zhenxue-14.png">
-                      <img v-if="weatherinformationWeather==15"
-                           src="../assets/images/integrated/weather/xiaoxue-15.png">
-                      <img v-if="weatherinformationWeather==16||weatherinformationWeather==27"
-                           src="../assets/images/integrated/weather/zhongxue-16.png">
-                      <img v-if="weatherinformationWeather==17||weatherinformationWeather==28"
-                           src="../assets/images/integrated/weather/daxue-17.png">
-                      <img v-if="weatherinformationWeather==18||weatherinformationWeather==29"
-                           src="../assets/images/integrated/weather/baoxue-18.png">
-                      <img v-if="weatherinformationWeather==19"
-                           src="../assets/images/integrated/weather/wu-19.png">
-                      <img v-if="weatherinformationWeather==20"
-                           src="../assets/images/integrated/weather/dongyu-20.png">
-                      <img v-if="weatherinformationWeather==21"
-                           src="../assets/images/integrated/weather/shachenbao-21.png">
-                      <img v-if="weatherinformationWeather==30"
-                           src="../assets/images/integrated/weather/fuchen-30.png">
-                      <img v-if="weatherinformationWeather==31"
-                           src="../assets/images/integrated/weather/yangsha-31.png">
-                      <img v-if="weatherinformationWeather==32"
-                           src="../assets/images/integrated/weather/qiangshachenbao-32.png">
-                      <span v-if="weatherinformationWeather==1">晴</span>
-                      <span v-if="weatherinformationWeather==2">多云</span>
-                      <span v-if="weatherinformationWeather==3">阴</span>
-                      <span v-if="weatherinformationWeather==4">阵雨</span>
-                      <span v-if="weatherinformationWeather==5">雷阵雨</span>
-                      <span v-if="weatherinformationWeather==6">雷阵雨伴有冰雹</span>
-                      <span v-if="weatherinformationWeather==7">雨夹雪</span>
-                      <span v-if="weatherinformationWeather==8">小雨</span>
-                      <span v-if="weatherinformationWeather==9">中雨</span>
-                      <span v-if="weatherinformationWeather==10">大雨</span>
-                      <span v-if="weatherinformationWeather==11">暴雨</span>
-                      <span v-if="weatherinformationWeather==12">大暴雨</span>
-                      <span v-if="weatherinformationWeather==13">特大暴雨</span>
-                      <span v-if="weatherinformationWeather==14">阵雪</span>
-                      <span v-if="weatherinformationWeather==15">小雪</span>
-                      <span v-if="weatherinformationWeather==16">中雪</span>
-                      <span v-if="weatherinformationWeather==17">大雪</span>
-                      <span v-if="weatherinformationWeather==18">暴雪</span>
-                      <span v-if="weatherinformationWeather==19">雾</span>
-                      <span v-if="weatherinformationWeather==20">冻雨</span>
-                      <span v-if="weatherinformationWeather==21">沙尘暴</span>
-                      <span v-if="weatherinformationWeather==22">小雨—中雨</span>
-                      <span v-if="weatherinformationWeather==23">中雨—大雨</span>
-                      <span v-if="weatherinformationWeather==24">大雨—暴雨</span>
-                      <span v-if="weatherinformationWeather==25">暴雨—大暴雨</span>
-                      <span v-if="weatherinformationWeather==26">大暴雨—特大暴雨</span>
-                      <span v-if="weatherinformationWeather==27">小雪—中雪</span>
-                      <span v-if="weatherinformationWeather==28">中雪—大雪</span>
-                      <span v-if="weatherinformationWeather==29">大雪—暴雪</span>
-                      <span v-if="weatherinformationWeather==30">浮尘</span>
-                      <span v-if="weatherinformationWeather==31">扬沙</span>
-                      <span v-if="weatherinformationWeather==32">强沙尘暴</span>
+                      <img v-if="weatherinformationWeather == 1" src="../assets/images/integrated/weather/qing-1.png">
+                      <img v-if="weatherinformationWeather == 2" src="../assets/images/integrated/weather/duoyun-2.png">
+                      <img v-if="weatherinformationWeather == 3" src="../assets/images/integrated/weather/yin-3.png">
+                      <img v-if="weatherinformationWeather == 4" src="../assets/images/integrated/weather/zhenyu-4.png">
+                      <img v-if="weatherinformationWeather == 5" src="../assets/images/integrated/weather/leizhenyu-5.png">
+                      <img v-if="weatherinformationWeather == 6"
+                        src="../assets/images/integrated/weather/leizhenyubingbao-6.png">
+                      <img v-if="weatherinformationWeather == 7" src="../assets/images/integrated/weather/yujiaxue-7.png">
+                      <img v-if="weatherinformationWeather == 8" src="../assets/images/integrated/weather/xiaoyu-8.png">
+                      <img v-if="weatherinformationWeather == 9 || weatherinformationWeather == 22"
+                        src="../assets/images/integrated/weather/zhongyu-9.png">
+                      <img v-if="weatherinformationWeather == 10 || weatherinformationWeather == 23"
+                        src="../assets/images/integrated/weather/dayu-10.png">
+                      <img v-if="weatherinformationWeather == 11 || weatherinformationWeather == 24"
+                        src="../assets/images/integrated/weather/baoyu-11.png">
+                      <img v-if="weatherinformationWeather == 12 || weatherinformationWeather == 25"
+                        src="../assets/images/integrated/weather/dabaoyu-12.png">
+                      <img v-if="weatherinformationWeather == 13 || weatherinformationWeather == 26"
+                        src="../assets/images/integrated/weather/tedabaoyu-13.png">
+                      <img v-if="weatherinformationWeather == 14" src="../assets/images/integrated/weather/zhenxue-14.png">
+                      <img v-if="weatherinformationWeather == 15" src="../assets/images/integrated/weather/xiaoxue-15.png">
+                      <img v-if="weatherinformationWeather == 16 || weatherinformationWeather == 27"
+                        src="../assets/images/integrated/weather/zhongxue-16.png">
+                      <img v-if="weatherinformationWeather == 17 || weatherinformationWeather == 28"
+                        src="../assets/images/integrated/weather/daxue-17.png">
+                      <img v-if="weatherinformationWeather == 18 || weatherinformationWeather == 29"
+                        src="../assets/images/integrated/weather/baoxue-18.png">
+                      <img v-if="weatherinformationWeather == 19" src="../assets/images/integrated/weather/wu-19.png">
+                      <img v-if="weatherinformationWeather == 20" src="../assets/images/integrated/weather/dongyu-20.png">
+                      <img v-if="weatherinformationWeather == 21"
+                        src="../assets/images/integrated/weather/shachenbao-21.png">
+                      <img v-if="weatherinformationWeather == 30" src="../assets/images/integrated/weather/fuchen-30.png">
+                      <img v-if="weatherinformationWeather == 31" src="../assets/images/integrated/weather/yangsha-31.png">
+                      <img v-if="weatherinformationWeather == 32"
+                        src="../assets/images/integrated/weather/qiangshachenbao-32.png">
+                      <span v-if="weatherinformationWeather == 1">晴</span>
+                      <span v-if="weatherinformationWeather == 2">多云</span>
+                      <span v-if="weatherinformationWeather == 3">阴</span>
+                      <span v-if="weatherinformationWeather == 4">阵雨</span>
+                      <span v-if="weatherinformationWeather == 5">雷阵雨</span>
+                      <span v-if="weatherinformationWeather == 6">雷阵雨伴有冰雹</span>
+                      <span v-if="weatherinformationWeather == 7">雨夹雪</span>
+                      <span v-if="weatherinformationWeather == 8">小雨</span>
+                      <span v-if="weatherinformationWeather == 9">中雨</span>
+                      <span v-if="weatherinformationWeather == 10">大雨</span>
+                      <span v-if="weatherinformationWeather == 11">暴雨</span>
+                      <span v-if="weatherinformationWeather == 12">大暴雨</span>
+                      <span v-if="weatherinformationWeather == 13">特大暴雨</span>
+                      <span v-if="weatherinformationWeather == 14">阵雪</span>
+                      <span v-if="weatherinformationWeather == 15">小雪</span>
+                      <span v-if="weatherinformationWeather == 16">中雪</span>
+                      <span v-if="weatherinformationWeather == 17">大雪</span>
+                      <span v-if="weatherinformationWeather == 18">暴雪</span>
+                      <span v-if="weatherinformationWeather == 19">雾</span>
+                      <span v-if="weatherinformationWeather == 20">冻雨</span>
+                      <span v-if="weatherinformationWeather == 21">沙尘暴</span>
+                      <span v-if="weatherinformationWeather == 22">小雨—中雨</span>
+                      <span v-if="weatherinformationWeather == 23">中雨—大雨</span>
+                      <span v-if="weatherinformationWeather == 24">大雨—暴雨</span>
+                      <span v-if="weatherinformationWeather == 25">暴雨—大暴雨</span>
+                      <span v-if="weatherinformationWeather == 26">大暴雨—特大暴雨</span>
+                      <span v-if="weatherinformationWeather == 27">小雪—中雪</span>
+                      <span v-if="weatherinformationWeather == 28">中雪—大雪</span>
+                      <span v-if="weatherinformationWeather == 29">大雪—暴雪</span>
+                      <span v-if="weatherinformationWeather == 30">浮尘</span>
+                      <span v-if="weatherinformationWeather == 31">扬沙</span>
+                      <span v-if="weatherinformationWeather == 32">强沙尘暴</span>
                     </div>
                   </el-col>
                   <el-col :span="15">
@@ -205,14 +190,14 @@
                       <ul>
                         <li>风力:{{ weatherinformationPower }}级</li>
                         <li>低温:{{ weatherinformationLow }}℃</li>
-                        <li v-if="weatherinformationDirection==1">风向:东风</li>
-                        <li v-if="weatherinformationDirection==2">风向:东南风</li>
-                        <li v-if="weatherinformationDirection==3">风向:南风</li>
-                        <li v-if="weatherinformationDirection==4">风向:西南风</li>
-                        <li v-if="weatherinformationDirection==5">风向:西风</li>
-                        <li v-if="weatherinformationDirection==6">风向:西北风</li>
-                        <li v-if="weatherinformationDirection==7">风向:北风</li>
-                        <li v-if="weatherinformationDirection==8">风向:东北风</li>
+                        <li v-if="weatherinformationDirection == 1">风向:东风</li>
+                        <li v-if="weatherinformationDirection == 2">风向:东南风</li>
+                        <li v-if="weatherinformationDirection == 3">风向:南风</li>
+                        <li v-if="weatherinformationDirection == 4">风向:西南风</li>
+                        <li v-if="weatherinformationDirection == 5">风向:西风</li>
+                        <li v-if="weatherinformationDirection == 6">风向:西北风</li>
+                        <li v-if="weatherinformationDirection == 7">风向:北风</li>
+                        <li v-if="weatherinformationDirection == 8">风向:东北风</li>
                         <li>高温:{{ weatherinformationHigh }}℃</li>
                         <li>火险:{{ weatherinformationLevelValue }}
                         </li>
@@ -230,19 +215,19 @@
                 </el-row>
                 <div class="firestate" v-if="todatWeather">
                   <div
-                    :class="weatherinformationLevel=='forest_weatherinformation_level_1'? 'state-block1 state-on':'state-block1'">
+                    :class="weatherinformationLevel == 'forest_weatherinformation_level_1' ? 'state-block1 state-on' : 'state-block1'">
                   </div>
                   <div
-                    :class="weatherinformationLevel=='forest_weatherinformation_level_2'? 'state-block2 state-on':'state-block2'">
+                    :class="weatherinformationLevel == 'forest_weatherinformation_level_2' ? 'state-block2 state-on' : 'state-block2'">
                   </div>
                   <div
-                    :class="weatherinformationLevel=='forest_weatherinformation_level_3'? 'state-block3 state-on':'state-block3'">
+                    :class="weatherinformationLevel == 'forest_weatherinformation_level_3' ? 'state-block3 state-on' : 'state-block3'">
                   </div>
                   <div
-                    :class="weatherinformationLevel=='forest_weatherinformation_level_4'? 'state-block4 state-on':'state-block4'">
+                    :class="weatherinformationLevel == 'forest_weatherinformation_level_4' ? 'state-block4 state-on' : 'state-block4'">
                   </div>
                   <div
-                    :class="weatherinformationLevel=='forest_weatherinformation_level_5'? 'state-block5 state-on':'state-block5'">
+                    :class="weatherinformationLevel == 'forest_weatherinformation_level_5' ? 'state-block5 state-on' : 'state-block5'">
                   </div>
                 </div>
               </div>
@@ -251,13 +236,13 @@
           <!-- 曝光台 -->
           <div class="forthis">
             <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;"/>
+              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;" />
               <div class="this-title">
-                <span>曝光台</span>
-                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
+                <span>超期事件</span>
+                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;" />
               </div>
               <div class="i-list-con small-bottom-margin h-18">
-                <div class="d-l-con padding-box nowrap" v-for="(item,index) in exposureStageList">
+                <div class="d-l-con padding-box nowrap" v-for="(item, index) in exposureStageList">
                   <div class="bgt-state">
                     <div class="bgt-state-frequency">{{ item.urgeCount }}</div>
                     <div class="bgt-state-minute">{{ item.timeDiff }}分钟</div>
@@ -278,77 +263,68 @@
           <!-- 事件列表 -->
           <div class="forthis">
             <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;"/>
+              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;" />
               <div class="this-title">
                 <span>事件列表</span>
-                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
+                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;" />
               </div>
               <div class="i-list-con small-bottom-margin" style="height: 30vh;">
                 <div class="event-list-search">
                   <el-input placeholder="请输入内容" prefix-icon="el-icon-search" v-model="eventSearch"
-                            @change="getEventList(calendarDay,10,1,eventSearch)">
+                    @change="getEventList(calendarDay, 10, 1, eventSearch)">
                   </el-input>
                 </div>
-                <div class="d-l-con padding-box nowrap" v-for="(item,index) in eventList"
-                     @click="dropLocation(item.latitude,item.longitude)" data-html2canvas-ignore>
+                <div class="d-l-con padding-box nowrap" v-for="(item, index) in eventList"
+                  @click="dropLocation(item.latitude, item.longitude,item.eventCode)" data-html2canvas-ignore>
                   <div class="bgt-img">
-                    <img v-if="item.picturePath!=null&&item.picturePath!=''&& item.pictureType=='image'"
-                         :src="item.picturePath" style="width: 93px;height: 64px" loading="lazy"/>
-                    <img v-else src="../assets/images/integrated/event-img-sub.png"
-                         style="width: 93px;height: 64px"/>
+                    <img v-if="item.picturePath != null && item.picturePath != '' && item.pictureType == 'image'"
+                      :src="item.picturePath" style="width: 93px;height: 64px" loading="lazy" />
+                    <img v-else src="../assets/images/integrated/event-img-sub.png" style="width: 93px;height: 64px" />
                   </div>
                   <div class="bgt-info">
-                    <div v-if="item.eventStatusValue=='forest_event_status_1'&&item.urgeCount==0"
-                         class="event-state-sb">
+                    <div v-if="item.eventStatusValue == 'forest_event_status_1' && item.urgeCount == 0" class="event-state-sb">
                       <i class="el-icon-caret-left"></i>
                       <div class="event-list-state-sb">
                         新上报
                       </div>
                     </div>
-                    <div v-if="item.eventStatusValue=='forest_event_status_1'&&item.urgeCount>0"
-                         class="event-state-cb">
+                    <div v-if="item.eventStatusValue == 'forest_event_status_1' && item.urgeCount > 0" class="event-state-cb">
                       <i class="el-icon-caret-left"></i>
                       <div class="event-list-state-cb">
                         催办
                       </div>
                     </div>
-                    <div v-if="item.eventStatusValue=='forest_event_status_2'"
-                         class="event-state-qs">
+                    <div v-if="item.eventStatusValue == 'forest_event_status_2'" class="event-state-qs">
                       <i class="el-icon-caret-left"></i>
                       <div class="event-list-state-qs">
                         签收
                       </div>
                     </div>
-                    <div v-if="item.eventStatusValue=='forest_event_status_3'"
-                         class="event-state-wb">
+                    <div v-if="item.eventStatusValue == 'forest_event_status_3'" class="event-state-wb">
                       <i class="el-icon-caret-left"></i>
                       <div class="event-list-state-wb">
                         误报
                       </div>
                     </div>
-                    <div v-if="item.eventStatusValue=='forest_event_status_4'"
-                         class="event-state-cf">
+                    <div v-if="item.eventStatusValue == 'forest_event_status_4'" class="event-state-cf">
                       <i class="el-icon-caret-left"></i>
                       <div class="event-list-state-cf">
                         重复
                       </div>
                     </div>
-                    <div v-if="item.eventStatusValue=='forest_event_status_5'"
-                         class="event-state-bj">
+                    <div v-if="item.eventStatusValue == 'forest_event_status_5'" class="event-state-bj">
                       <i class="el-icon-caret-left"></i>
                       <div class="event-list-state-bj">
                         办结
                       </div>
                     </div>
-                    <div v-if="item.eventStatusValue=='forest_event_status_6'"
-                         class="event-state-gd">
+                    <div v-if="item.eventStatusValue == 'forest_event_status_6'" class="event-state-gd">
                       <i class="el-icon-caret-left"></i>
                       <div class="event-list-state-gd">
                         归档
                       </div>
                     </div>
-                    <div v-if="item.eventStatusValue=='forest_event_status_7'"
-                         class="event-state-qr">
+                    <div v-if="item.eventStatusValue == 'forest_event_status_7'" class="event-state-qr">
                       <i class="el-icon-caret-left"></i>
                       <div class="event-list-state-qr">
                         确认
@@ -365,10 +341,10 @@
               </div>
               <!--分页-->
               <div class="paging">
-                <el-button type="button" @click="getEventList(calendarDay,10,pageNum-1)">上一页
+                <el-button type="button" @click="getEventList(calendarDay, 10, pageNum - 1)">上一页
                 </el-button>
                 <!-- <span>第0页</span> -->
-                <el-button type="button" @click="getEventList(calendarDay,10,pageNum+1)">下一页
+                <el-button type="button" @click="getEventList(calendarDay, 10, pageNum + 1)">下一页
                 </el-button>
               </div>
             </dv-border-box-13>
@@ -378,7 +354,7 @@
           <!-- 日历 -->
           <div class="forthis">
             <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;"/>
+              <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>
               </div>
@@ -387,28 +363,28 @@
           <!-- 事件分类 -->
           <div class="forthis">
             <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">
+              <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>
-                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
+                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;" />
               </div>
               <div class="i-list-con small-bottom-margin h-19">
-                <dv-capsule-chart v-if="showEventKind" :config="eventKind"
-                                  style="width: 90%;height: 18vh; padding:.5rem 1rem"/>
+                <chart v-if="showEventKind" :config="eventKind" @setEventTypeId="setEventTypeId"
+                  style="width: 90%;height: 18vh; padding:.5rem 1rem" />
               </div>
             </dv-border-box-13>
           </div>
           <!-- 上报排行 -->
           <div class="forthis">
             <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;"/>
+              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;" />
               <div class="this-title">
                 <span>上报排行</span>
-                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
+                <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;" />
               </div>
               <div class="i-list-con small-bottom-margin h-19">
-                <dv-scroll-ranking-board :config="reportList"
-                                         style="width: 100%;height: 300px; padding:.5rem 1rem"/>
+                <dv-scroll-ranking-board :config="reportList" style="width: 100%;height: 300px; padding:.5rem 1rem" />
               </div>
             </dv-border-box-13>
           </div>
@@ -420,12 +396,10 @@
     </div>
     <audio id="resource" ref="up" :src="audioSrc" controls style="display: none;"></audio>
     <eventdetailsdialog ref="eventdetailsdialog" :calendarDay="calendarDay" @getEventList="getEventList"
-                        @getTodayEvents="getTodayEvents" @getFirespread="getFirespread"
-                        @getSupermap="getSupermap"></eventdetailsdialog>
+      @getTodayEvents="getTodayEvents" @getFirespread="getFirespread" @getSupermap="getSupermap"></eventdetailsdialog>
 
-    <firespread ref="firespread" :calendarDay="calendarDay" @getEventList="getEventList"
-                @getTodayEvents="getTodayEvents" @showEventDialog="showEventDialog"
-                @getSupermap="getSupermap"></firespread>
+    <firespread ref="firespread" :calendarDay="calendarDay" @getEventList="getEventList" @getTodayEvents="getTodayEvents"
+      @showEventDialog="showEventDialog" @getSupermap="getSupermap"></firespread>
     <eventLocation ref="eventLocation"></eventLocation>
     <TVWall ref="TVWall"></TVWall>
   </div>
@@ -438,6 +412,8 @@ import Cookies from 'js-cookie'
 /** ----------------------------------weosocket结束------------------------------------- */
 
 import {
+  getMenuEventType,
+  getEventPush,
   getBaseInfo,
   getTodayEvents,
   getDeptEventCount,
@@ -459,16 +435,16 @@ import eventLocation from '@/components/eventLocation.vue' //事件定位弹窗
 import TVWall from '@/components/TVWall.vue' //电视墙弹窗
 import eventdetailsdialog from '@/views/eventdetailsdialog.vue' //事件详情弹窗
 import firespread from '@/views/firespread.vue' //事件详情弹窗
-
 /** ----------------------------------摄像头预览开始------------------------------------- */
 import {
   getDahuaVideoServer
 } from '@/api/dahua/dahua'
 // import DHWs from '@/dahua/lib/DHWs'
 import Firespread from './firespread'
+import {selectConfigKey} from "@/api/system/config";
 
 /** ----------------------------------摄像头预览结束------------------------------------- */
-
+import chart from "./from/dvCapsuleChart.vue";
 let echarts = require('echarts')
 export default {
   components: {
@@ -479,6 +455,7 @@ export default {
     vheader,
     vBottomMenu,
     eventLocation,
+    chart,
     TVWall,
     dateChoose,
     eventdetailsdialog,
@@ -502,20 +479,10 @@ export default {
     this.getEventByReportorOrder(this.getCurrentDataStr())
     this.getExposureStage(this.getCurrentDataStr())
     this.getSupermap(this.getCurrentDataStr())
+    this.getMenuEventType()
     /** ----------------------------------weosocket开始------------------------------------- */
     // this.initWebSocket()
     /** ----------------------------------weosocket结束------------------------------------- */
-    setInterval(() => {
-      if (this.calendarDay == this.getCurrentDataStr()) {
-        this.getTodayEvents(this.getCurrentDataStr(), true)
-        this.getDeptEventCount(this.getCurrentDataStr(), true)
-        this.getEventList(this.getCurrentDataStr(), this.pageSize, this.pageNum, '', true)
-        this.getEventByEventType(this.getCurrentDataStr(), true)
-        this.getEventByReportorOrder(this.getCurrentDataStr(), true)
-        this.getExposureStage(this.getCurrentDataStr(), true)
-        this.getSupermap(this.getCurrentDataStr(), true)
-      }
-    }, 10000)
     this.bottomMenuList() //获取底部公共组件消息和任务
   },
   data() {
@@ -573,7 +540,14 @@ export default {
       /** ----------------------------------weosocket开始------------------------------------- */
       weosocket: false,
       websock: '',
+      eventTypeIdDl: [],
+      eventTypeId: [],
       setIntervalWesocketPush: null,
+      websockSid: {
+        userId: '',
+        eventTypeDl: '',
+        eventType: '',
+      },
       /** ----------------------------------weosocket结束------------------------------------- */
       /** ----------------------------------摄像头预览开始------------------------------------- */
       activePanel: 'key1',
@@ -595,6 +569,31 @@ export default {
   },
   /** ----------------------------------weosocket结束------------------------------------- */
   methods: {
+    getMenuEventType() {
+      let that = this
+      getMenuEventType().then(res => {
+        that.websockSid.userId = Cookies.get('userId')
+        that.websockSid.eventTypeDl = res.data.eventTypeDl
+        that.websockSid.eventType = res.data.eventType
+        that.initWebSocket(that.websockSid.userId, that.websockSid.eventTypeDl, that.websockSid.eventType)
+        console.log(that.websockSid)
+      })
+    },
+    setEventTypeId(data) {
+      // let data = {eventTypeIdDl: [], eventTypeId: []}
+      // let data = {eventTypeIdDl: that.eventTypeIdDl, eventTypeId: that.eventTypeId}
+      let that = this
+      that.eventTypeIdDl = data.eventTypeIdDl
+      that.eventTypeId = data.eventTypeId
+      that.getSupermap(that.calendarDay, false)
+      that.getTodayEvents(that.calendarDay, false)
+      that.getEventByEventType(that.calendarDay, false)
+      that.getExposureStage(that.calendarDay, false)
+      that.getEventByReportorOrder(that.calendarDay, false)
+      that.getDeptEventCount(that.calendarDay, false)
+      that.getEventList(that.calendarDay, that.pageSize, that.pageNum, '', false)
+    },
+
     // searchEvent(pageSize,pageNum,eventSearch) {
     //   this.pageSize = pageSize;
     //   this.pageNum = pageNum;
@@ -612,8 +611,9 @@ export default {
     //     }
     //   })
     // },
-    dropLocation(lat, lng) {
-      this.$refs.supermap.dropLocation(lat, lng)
+    dropLocation(lat, lng,eventCode) {
+      this.$refs.supermap.dropLocation(lat, lng,18)
+      this.showEventDialog(eventCode)
     },
     showEventDialog(eventCode) {
       //事件信息弹出
@@ -753,7 +753,7 @@ export default {
               show: true,
               position: 'inside',
               offset: [0, 1],
-              formatter: function(obj) {
+              formatter: function (obj) {
                 return (obj.value).toLocaleString() + '%'
               },
               textStyle: {
@@ -799,7 +799,7 @@ export default {
               show: true,
               position: 'inside',
               offset: [0, 1],
-              formatter: function(obj) {
+              formatter: function (obj) {
                 return (obj.value).toLocaleString() + '%'
               },
               textStyle: {
@@ -833,7 +833,7 @@ export default {
     getTodayEvents(day, loading) {
       let that = this
       //左侧获取事件信息统计
-      getTodayEvents({ day: day }, loading).then(res => {
+      getTodayEvents({ eventTypeIdDl: that.eventTypeIdDl, eventTypeId: that.eventTypeId, day: day }, loading).then(res => {
         this.aiTotal = res.data.aiTotal
         this.aiTotal_pre = res.data.aiTotal_pre
         this.newReport = res.data.newReport
@@ -852,7 +852,7 @@ export default {
     getDeptEventCount(day, loading) {
       let that = this
       //左侧获取事件部门数量
-      getDeptEventCount({ day: day }, loading).then(res => {
+      getDeptEventCount({ eventTypeIdDl: that.eventTypeIdDl, eventTypeId: that.eventTypeId, day: day }, loading).then(res => {
         this.forestFarm = res.data
       })
     },
@@ -882,7 +882,7 @@ export default {
     },
     getSupermap(day, loading) {
       let that = this
-      getNearEvent('', '', day, loading).then(res => {
+      getNearEvent('', '', day, loading, that.eventTypeIdDl, that.eventTypeId).then(res => {
         that.markersList = []
         if (res.data != null && res.data.length > 0) {
           for (let i = 0; i < res.data.length; i++) {
@@ -981,7 +981,7 @@ export default {
       let that = this
       this.eventList = []
       //右侧获取事件列表
-      getEventList({ day: day, pageSize: pageSize, pageNum: pageNum, eventName: eventSearch }, loading).then(res => {
+      getEventList({ eventTypeIdDl: that.eventTypeIdDl, eventTypeId: that.eventTypeId, day: day, pageSize: pageSize, pageNum: pageNum, eventName: eventSearch }, loading).then(res => {
         this.eventList = res.data
         if (this.eventList != null && this.eventList.length > 0) {
           if (this.eventList[0].eventStatusValue == 'forest_event_status_1') {
@@ -996,7 +996,7 @@ export default {
     getEventByEventType(day, loading) {
       let that = this
       //右侧获取事件分类
-      getEventByEventType({ day: day }, loading).then(res => {
+      getEventByEventType({ eventTypeIdDl: that.eventTypeIdDl, eventTypeId: that.eventTypeId, day: day }, loading).then(res => {
         if (res.data != null && res.data.length > 0) {
           this.showEventKind = true
           this.eventKind.data = res.data
@@ -1013,7 +1013,7 @@ export default {
     getEventByReportorOrder(day, loading) {
       let that = this
       //右侧获取上报排名
-      getEventByReportorOrder({ day: day }, loading).then(res => {
+      getEventByReportorOrder({ eventTypeIdDl: that.eventTypeIdDl, eventTypeId: that.eventTypeId, day: day }, loading).then(res => {
         if (res.data != null && res.data.length > 0) {
           this.reportList.data = res.data
           this.reportList = { ...this.reportList }
@@ -1034,7 +1034,7 @@ export default {
     },
     getWebSocketEvent(data) {
       let that = this
-      const event = JSON.parse(data)
+      const event = data
       //右侧获取事件列表
       that.markersList = []
       let markersMap = {
@@ -1112,19 +1112,20 @@ export default {
     getExposureStage(day, loading) {
       let that = this
       //右侧获取曝光台
-      getExposureStage({ day: day }, loading).then(res => {
+      getExposureStage({ eventTypeIdDl: that.eventTypeIdDl, eventTypeId: that.eventTypeId, day: day }, loading).then(res => {
         this.exposureStageList = res.data
       })
     },
     /** ----------------------------------weosocket开始------------------------------------- */
-    initWebSocket() { //初始化weosocket
-      // const wsuri = 'ws://127.0.0.1:10003/webSocket/' + Cookies.get('username')
-      const wsuri = 'ws://127.0.0.1:10003/webSocket/admin'
-      this.websock = new WebSocket(wsuri)
-      console.log('建立websocket连接')
-      this.websock.onopen = this.websocketonopen
-      this.websock.onmessage = this.websocketonmessage
-      this.websock.onerror = this.websocketonerror
+    initWebSocket(userId, eventTypeDl, eventType) {        //初始化weosocket
+      selectConfigKey('KSH_SOCKET').then(res => {
+        const wsuri = res.data + userId + '/' + eventTypeDl + '/' + eventType
+        this.websock = new WebSocket(wsuri)
+        console.log('建立websocket连接')
+        this.websock.onopen = this.websocketonopen
+        this.websock.onmessage = this.websocketonmessage
+        this.websock.onerror = this.websocketonerror
+      })
     },
     websocketonopen() { //连接建立之后执行send方法发送数据
       console.log('websocket连接成功')
@@ -1132,26 +1133,49 @@ export default {
       this.sendPing()
     },
     websocketonerror() { //连接建立失败重连
-      this.initWebSocket()
+      this.initWebSocket(this.websockSid.userId, this.websockSid.eventTypeDl, this.websockSid.eventType,)
     },
     websocketonmessage(e) { //数据接收
       console.log('接收数据', e.data)
       // let data = "{\"fromId\":\"forest\",\"fromUserId\":\""+Cookies.get('username')+"\",\"toUserId\":\""+Cookies.get('username')+"\"}";
-      let data = '{"fromId":"forest","fromUserId":"admin","toUserId":"admin"}'
+      let data = '{"fromId":"emergency"}'
       if (this.calendarDay == this.getCurrentDataStr() && data != e.data) {
-        this.getWebSocketEvent(e.data)
-
-        // this.getEventListNew();
-        // this.getTodayEvents(this.getCurrentDataStr());
-        // this.getDeptEventCount(this.getCurrentDataStr());
-        // this.getEventByEventType(this.getCurrentDataStr());
-        // this.getEventByReportorOrder(this.getCurrentDataStr());
+        // 处理收到的消息
+        this.handleWebSoceketEvent(e.data)
 
-        // this.$refs.bottomMenu.updateAlert();
-        // this.$refs.up.play();
+        this.getTodayEvents(this.getCurrentDataStr(), true)
+        this.getDeptEventCount(this.getCurrentDataStr(), true)
+        this.getEventByEventType(this.getCurrentDataStr(), true)
+        this.getEventByReportorOrder(this.getCurrentDataStr(), true)
+        this.getExposureStage(this.getCurrentDataStr(), true)
+        this.$refs.bottomMenu.updateAlert();
+        this.$refs.up.play();
         // thes.$refs.up.pause();//停止播放音乐
       }
     },
+    // 处理WebSocket事件
+    handleWebSoceketEvent(val) {
+      let that = this
+      let data = JSON.parse(val)
+      /**
+       * that.markersList.filter( item => data.eventCode == item.parameter).length == 0 如果地图中不存在当前事件则添加
+       * eventPush: 事件列表消息
+       * */
+      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(that.eventList[0])
+    },
     websocketsend(Data) { //数据发送
       this.websock.send(Data)
     },
@@ -1165,16 +1189,14 @@ export default {
      * @param {string} ping 心跳名称 默认字符串ping
      */
     sendPing(time = 60000, ping = {
-      'fromId': 'forest',
-      'fromUserId': Cookies.get('username'),
-      'toUserId': Cookies.get('username')
+      'fromId': 'emergency'
     }) {
       clearInterval(this.setIntervalWesocketPush)
       this.setIntervalWesocketPush = setInterval(() => {
         if (this.weosocket) {
           this.websock.send(JSON.stringify(ping))
         } else {
-          this.initWebSocket()
+          // this.initWebSocket()
         }
       }, time)
     },

+ 165 - 0
src/views/from/dvCapsuleChart.vue

@@ -0,0 +1,165 @@
+<template>
+  <div class="dv-capsule-chart">
+    <template v-if="mergedConfig">
+      <div class="label-column">
+        <div v-for="item in mergedConfig.data" :key="item.name" style="cursor: pointer" @click="getEventList(item)">
+          {{ item.name }}
+        </div>
+        <div>&nbsp;</div>
+      </div>
+      <div class="capsule-container">
+        <div class="capsule-item" v-for="(capsule, index) in capsuleLength" :key="index" style="cursor: pointer" @click="getEventList(mergedConfig.data[index])">
+          <div
+            class="capsule-item-column"
+            :style="`width: ${capsule * 100}%; background-color: ${mergedConfig.colors[index % mergedConfig.colors.length]};`"
+          >
+            <div
+              v-if="mergedConfig.showValue"
+              class="capsule-item-value"
+            >{{ capsuleValue[index] }}
+            </div>
+          </div>
+        </div>
+
+        <div class="unit-label">
+          <div
+            v-for="(label, index) in labelData"
+            :key="label + index"
+          >{{ label }}
+          </div>
+        </div>
+      </div>
+
+      <div class="unit-text" v-if="mergedConfig.unit">{{ mergedConfig.unit }}</div>
+    </template>
+  </div>
+</template>
+
+<script>
+import {deepMerge} from '@jiaminghi/charts/lib/util/index'
+
+import {deepClone} from '@jiaminghi/c-render/lib/plugin/util'
+
+export default {
+  name: 'DvCapsuleChart',
+  props: {
+    config: {
+      type: Object,
+      default: () => ({})
+    }
+  },
+  data() {
+    return {
+      defaultConfig: {
+        /**
+         * @description Capsule chart data
+         * @type {Array<Object>}
+         * @default data = []
+         * @example data = [{ name: 'foo1', value: 100 }, { name: 'foo2', value: 100 }]
+         */
+        data: [],
+        /**
+         * @description Colors (hex|rgb|rgba|color keywords)
+         * @type {Array<String>}
+         * @default color = ['#37a2da', '#32c5e9', '#67e0e3', '#9fe6b8', '#ffdb5c', '#ff9f7f', '#fb7293']
+         * @example color = ['#000', 'rgb(0, 0, 0)', 'rgba(0, 0, 0, 1)', 'red']
+         */
+        colors: [
+          '#37a2da',
+          '#32c5e9',
+          '#67e0e3',
+          '#9fe6b8',
+          '#ffdb5c',
+          '#ff9f7f',
+          '#fb7293'
+        ],
+        /**
+         * @description Chart unit
+         * @type {String}
+         * @default unit = ''
+         */
+        unit: '',
+        /**
+         * @description Show item value
+         * @type {Boolean}
+         * @default showValue = false
+         */
+        showValue: false
+      },
+
+      mergedConfig: null,
+
+      capsuleLength: [],
+      capsuleValue: [],
+      labelData: [],
+      labelDataLength: []
+    }
+  },
+  watch: {
+    config() {
+      const {calcData} = this
+      calcData()
+    }
+  },
+  methods: {
+    getEventList(val) {
+      debugger
+      let args = {eventTypeIdDl: [], eventTypeId: []}
+      if (val.id != '0') {
+        args.eventTypeIdDl.push(-1)
+        args.eventTypeId.push(val.id)
+      } else {
+        args.eventTypeIdDl.push(val.parentId)
+        args.eventTypeId.push(-1)
+      }
+      this.$emit('setEventTypeId', args)
+
+    },
+    calcData() {
+      const {mergeConfig, calcCapsuleLengthAndLabelData} = this
+
+      mergeConfig()
+
+      calcCapsuleLengthAndLabelData()
+    },
+    mergeConfig() {
+      let {config, defaultConfig} = this
+
+      this.mergedConfig = deepMerge(
+        deepClone(defaultConfig, true),
+        config || {}
+      )
+    },
+    calcCapsuleLengthAndLabelData() {
+      const {data} = this.mergedConfig
+
+      if (!data.length) return
+
+      const capsuleValue = data.map(({value}) => value)
+
+      const maxValue = Math.max(...capsuleValue)
+
+      this.capsuleValue = capsuleValue
+
+      this.capsuleLength = capsuleValue.map(v => (maxValue ? v / maxValue : 0))
+
+      const oneFifth = maxValue / 5
+
+      const labelData = Array.from(
+        new Set(new Array(6).fill(0).map((v, i) => Math.ceil(i * oneFifth)))
+      )
+
+      this.labelData = labelData
+
+      this.labelDataLength = Array.from(labelData).map(v =>
+        maxValue ? v / maxValue : 0
+      )
+    }
+  },
+  mounted() {
+    const {calcData} = this
+
+    calcData()
+  }
+}
+</script>

+ 32 - 2
src/views/monitor.vue

@@ -106,7 +106,15 @@
               <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
             </div>
             <div class="i-list-con h-43">
-              <div class="d-l-con" v-for="(item,index) in visuForestCloudCameraBOList"
+              <el-input
+                v-model="rightDeptName"
+                placeholder="请输入摄像头名称"
+                clearable
+                size="small"
+                prefix-icon="el-icon-search"
+                style="margin-bottom: 20px"
+              />
+              <div class="d-l-con" v-for="(item,index) in visuForestCloudCameraBOListSearch"
                    :class="{on:listCurrentIndex2 == index}"
                    v-on:click="dropLocation(item.latitude,item.longitude,index)">
                 <div class="d-l-l-text">
@@ -145,6 +153,7 @@
     </div>
     <eventLocation ref="eventLocation"></eventLocation>
     <TVWall ref="TVWall"></TVWall>
+    <TVWalls ref="TVWalls"></TVWalls>
     <el-dialog :title="cameraTitle" :visible.sync="cameraVisible" v-if="cameraVisible" customClass="videoCustomWidth"
                @close="cancelEventLocationShow()">
       <div style="width:1020px;height:625px;position:relative;">
@@ -160,6 +169,7 @@ import {
   selectDeviceType,
   selectCameraByDeptId,
   selectKeyAreaList,
+  getCamerasByDeptId,
   getRegionalFlag
 } from '@/api/monitor'
 
@@ -169,6 +179,7 @@ import vheader from '@/components/v-header.vue' //一体化共用头部
 import vBottomMenu from '@/components/vBottomMenu.vue' //一体化公共底部菜单
 import eventLocation from '@/components/eventLocation.vue' //事件定位弹窗
 import TVWall from '@/components/TVWall.vue' //电视墙弹窗
+import TVWalls from '@/components/TVWalls.vue' //电视墙弹窗
 
 /** ----------------------------------摄像头预览开始------------------------------------- */
 import {
@@ -189,6 +200,7 @@ export default {
     vheader,
     vBottomMenu,
     eventLocation,
+    TVWalls,
     TVWall
   },
   created() {
@@ -211,6 +223,9 @@ export default {
   },
   data() {
     return {
+      //摄像头名称
+      rightDeptName: undefined,
+      visuForestCloudCameraBOListSearch:[],
       // 部门名称
       deptName: undefined,
 // 部门树选项
@@ -261,6 +276,14 @@ export default {
     // 根据名称筛选部门树
     deptName(val) {
       this.$refs.tree.filter(val)
+    },
+    rightDeptName(val){
+      this.visuForestCloudCameraBOListSearch=[];
+      for (let i in this.visuForestCloudCameraBOList) {
+        if(this.visuForestCloudCameraBOList[i].cameraName.indexOf(val) != -1){
+          this.visuForestCloudCameraBOListSearch.push(this.visuForestCloudCameraBOList[i]);
+        }
+      }
     }
   },
   methods: {
@@ -279,8 +302,13 @@ export default {
     },
 // 节点单击事件
     handleNodeClick(data) {
+      let that = this
+      console.log("节点单击事件",data);
       // this.findCameraByDept(data.id)
-      this.selectCameraByDeptId(data.id);
+      that.selectCameraByDeptId(data.id);
+      getCamerasByDeptId(data.id).then(res => {
+        that.$refs.TVWalls.showTVWall(res.data, {longitude: data.deptLongitude, latitude: data.deptLatitude});
+      })
     },
     selectKeyAreaList() {
       this.keyAreaList = []
@@ -401,6 +429,7 @@ export default {
         }
 
         that.visuForestCloudCameraBOList = res.data.visuForestCloudCameraBOList
+        that.visuForestCloudCameraBOListSearch = res.data.visuForestCloudCameraBOList
         // this.cameraChat()
         if (res.data.visuForestCloudCameraBOList != null && res.data.visuForestCloudCameraBOList
           .length > 0) {
@@ -498,6 +527,7 @@ export default {
       selectCameraByDeptId(depId).then(res => {
         //根据设备类型查看列表
         that.visuForestCloudCameraBOList = res.data
+        that.visuForestCloudCameraBOListSearch = res.data
         if (res.data != null && res.data.length > 0) {
           for (let i = 0; i < res.data.length; i++) {
             let markersMap = {