修改WebSocket接收事件消息

src/api/forest.js

@@ -1,5 +1,20 @@
 import request from '@/utils/request'
 
+// 获取绑定的事件类型
+export function getMenuEventType() {
+  return request({
+    url: '/center-firecontrol/VisuForestCloudMapController/getMenuEventType',
+    method: 'get',
+  })
+}
+// 获取事件详情
+export function getEventPush(param) {
+  return request({
+    url: '/center-firecontrol/VisuForestCloudMapController/getEventPush',
+    method: 'post',
+    data: param
+  })
+}
 // 左侧获取部门信息
 export function getBaseInfo() {
   return request({

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,

src/store/modules/user.js

@@ -4,6 +4,7 @@ import { getToken, setToken, setExpiresIn, removeToken } from '@/utils/auth'
 const user = {
   state: {
     token: getToken(),
+    userId: '',
     name: '',
     avatar: '',
     roles: [],
@@ -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 => {

src/views/forest.vue

@@ -10,11 +10,11 @@
         <!-- 1 基本情况 -->
         <div class="forthis">
           <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0c4b53', '#18caca']"
-                            style="padding-bottom: 1rem;">
-            <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+            style="padding-bottom: 1rem;">
+            <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">
@@ -28,8 +28,8 @@
         <!-- 2 事件统计-->
         <div class="forthis">
           <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0c4b53', '#18caca']"
-                            style="padding-bottom: 1rem;">
-            <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+            style="padding-bottom: 1rem;">
+            <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;" />
             <div class="i-list-con h-29-5">
               <div class="d-l-con no_hover">
                 <div class="event-count">
@@ -39,8 +39,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">
@@ -50,7 +49,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>
@@ -60,7 +59,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>
@@ -70,7 +69,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>
@@ -84,15 +83,15 @@
         <!-- 3 组织机构 -->
         <div class="forthis">
           <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0c4b53', '#18caca']"
-                            style="padding-bottom: 1rem;">
-            <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+            style="padding-bottom: 1rem;">
+            <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;" />
             <div class="i-list-con h-27" style="padding-left: 1rem;">
               <el-collapse accordion>
-                <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>
@@ -107,100 +106,90 @@
       </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)" :color="['#0c4b53', '#18caca']">
-              <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">
@@ -208,14 +197,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>
@@ -233,19 +222,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>
@@ -254,14 +243,14 @@
           <!-- 曝光台 -->
           <div class="forthis">
             <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0c4b53', '#18caca']"
-                              style="padding-bottom: 1rem;">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+              style="padding-bottom: 1rem;">
+              <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-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>
@@ -282,78 +271,71 @@
           <!-- 事件列表 -->
           <div class="forthis">
             <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0c4b53', '#18caca']"
-                              style="padding-bottom: 1rem;">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+              style="padding-bottom: 1rem;">
+              <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)" 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">
                         确认
@@ -370,10 +352,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>
@@ -383,8 +365,8 @@
           <!-- 日历 -->
           <div class="forthis">
             <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0c4b53', '#18caca']"
-                              style="padding-bottom: 1rem;">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+              style="padding-bottom: 1rem;">
+              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;" />
               <div class="i-list-con small-bottom-margin h-30">
                 <dateChoose ref="dateChoose" @selectDay="selectDay"></dateChoose>
               </div>
@@ -393,31 +375,30 @@
           <!-- 事件分类 -->
           <div class="forthis">
             <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0c4b53', '#18caca']"
-                              style="padding-bottom: 1rem;">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+              style="padding-bottom: 1rem;">
+              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;" />
               <div class="this-title" style="cursor: pointer"
-                   @click="setEventTypeId({eventTypeIdDl: [], eventTypeId: []})">
+                @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">
                 <chart v-if="showEventKind" :config="eventKind" @setEventTypeId="setEventTypeId"
-                       style="width: 90%;height: 18vh; padding:.5rem 1rem"></chart>
+                  style="width: 90%;height: 18vh; padding:.5rem 1rem"></chart>
               </div>
             </dv-border-box-13>
           </div>
           <!-- 上报排行 -->
           <div class="forthis">
             <dv-border-box-13 backgroundColor="rgba(12, 19, 38, .90)" :color="['#0c4b53', '#18caca']"
-                              style="padding-bottom: 1rem;">
-              <img src="../assets/images/integrated/light.png" style="width: 100%; margin-top: .4rem;"/>
+              style="padding-bottom: 1rem;">
+              <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>
@@ -429,12 +410,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>
+      @getTodayEvents="getTodayEvents" @showEventDialog="showEventDialog" @getSupermap="getSupermap"></firespread>
     <eventLocation ref="eventLocation"></eventLocation>
     <TVWall ref="TVWall"></TVWall>
   </div>
@@ -447,6 +426,8 @@ import Cookies from 'js-cookie'
 /** ----------------------------------weosocket结束------------------------------------- */
 
 import {
+  getMenuEventType,
+  getEventPush,
   getBaseInfo,
   getTodayEvents,
   getDeptEventCount,
@@ -505,6 +486,7 @@ export default {
     this.getEventByReportorOrder(this.getCurrentDataStr())
     this.getExposureStage(this.getCurrentDataStr())
     this.getSupermap(this.getCurrentDataStr())
+    this.getMenuEventType()
     /** ----------------------------------weosocket开始------------------------------------- */
     // this.initWebSocket()
     /** ----------------------------------weosocket结束------------------------------------- */
@@ -512,13 +494,13 @@ export default {
       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.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);
+        // this.getSupermap(this.getCurrentDataStr(), true);
       }
-    }, 10000)
+    }, 30000)
     this.bottomMenuList() //获取底部公共组件消息和任务
   },
   data() {
@@ -578,6 +560,11 @@ export default {
       weosocket: false,
       websock: '',
       setIntervalWesocketPush: null,
+      websockSid: {
+        userId: '',
+        eventTypeDl: '',
+        eventType: '',
+      },
       /** ----------------------------------weosocket结束------------------------------------- */
       /** ----------------------------------摄像头预览开始------------------------------------- */
       activePanel: 'key1',
@@ -599,6 +586,16 @@ 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)
+      })
+    },
     // searchEvent(pageSize,pageNum,eventSearch) {
     //   this.pageSize = pageSize;
     //   this.pageNum = pageNum;
@@ -872,7 +869,7 @@ export default {
     getWeather(day) {
       let that = this
       //右侧获取天气信息
-      getWeather({day: day}).then(res => {
+      getWeather({ day: day }).then(res => {
         if (res.code == 200) {
           if (res.msg == '天气未添加') {
             this.todatWeather = false
@@ -1040,11 +1037,11 @@ export default {
           this.eventKind.data = res.data
           this.eventKind.colors = ['#1ce0a9', '#d6333b', '#e68d3f', '#32c5e9', '#2abc65']
           this.eventKind.showValue = true
-          this.eventKind = {...this.eventKind}
+          this.eventKind = { ...this.eventKind }
         } else {
           this.showEventKind = false
           this.eventKind = {}
-          this.eventKind = {...this.eventKind}
+          this.eventKind = { ...this.eventKind }
         }
       })
     },
@@ -1058,10 +1055,10 @@ export default {
       }, loading).then(res => {
         if (res.data != null && res.data.length > 0) {
           this.reportList.data = res.data
-          this.reportList = {...this.reportList}
+          this.reportList = { ...this.reportList }
         } else {
           this.reportList.data = []
-          this.reportList = {...this.reportList}
+          this.reportList = { ...this.reportList }
         }
       })
     },
@@ -1069,14 +1066,14 @@ export default {
       this.eventList = []
       this.eventListAll = []
       //右侧获取事件列表
-      getEventList({day: this.getCurrentDataStr()}).then(res => {
+      getEventList({ day: this.getCurrentDataStr() }).then(res => {
         this.eventList = res.data
         this.eventListAll = res.data
       })
     },
     getWebSocketEvent(data) {
       let that = this
-      const event = JSON.parse(data);
+      const event = data
       //右侧获取事件列表
       that.markersList = []
       let markersMap = {
@@ -1163,9 +1160,8 @@ export default {
       })
     },
     /** ----------------------------------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'
+    initWebSocket(userId, eventTypeDl, eventType) {        //初始化weosocket
+      const wsuri = 'ws://127.0.0.1:10003/eventPush/' + userId + '/' + eventTypeDl + '/' + eventType
       this.websock = new WebSocket(wsuri)
       console.log('建立websocket连接')
       this.websock.onopen = this.websocketonopen
@@ -1178,14 +1174,15 @@ 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\"}";
       if (this.calendarDay == this.getCurrentDataStr() && data != e.data) {
-        this.getWebSocketEvent(e.data);
+        // 处理收到的消息
+        this.handleWebSoceketEvent(e.data)
 
         // this.getEventListNew();
         // this.getTodayEvents(this.getCurrentDataStr());
@@ -1198,6 +1195,29 @@ export default {
         // 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)
     },
@@ -1220,7 +1240,7 @@ export default {
         if (this.weosocket) {
           this.websock.send(JSON.stringify(ping))
         } else {
-          this.initWebSocket()
+          // this.initWebSocket()
         }
       }, time)
     },