事件列表图片

src/views/forest.vue

@@ -163,7 +163,7 @@
                 <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>
+                    <div class="bgt-state-minute">{{ item.timeDiff }}分钟</div>
                   </div>
                   <div class="bgt-info">
                     <div class="bgt-info-name">{{ item.eventName }}</div>
@@ -193,13 +193,16 @@
                     v-model="eventSearch" @change="searchEvent(eventSearch)">
                   </el-input>
                 </div>
-                <div class="d-l-con padding-box nowrap" v-for="(item,index) in eventList" @click="dropLocation(item.latitude,item.longitude)">
+                <div class="d-l-con padding-box nowrap" v-for="(item,index) in eventList"
+                     @click="dropLocation(item.latitude,item.longitude)">
                   <div class="bgt-img">
-                    <img v-if="item.picturePath!=null&&item.picturePath!=''" :src="item.picturePath" style="width: 93px;height: 64px"/>
+                    <img v-if="item.picturePath!=null&&item.picturePath!=''" :src="item.picturePath"
+                         style="width: 93px;height: 64px"/>
                     <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">
                         新上报
@@ -295,7 +298,8 @@
       </div>
       <vBottomMenu ref="bottomMenu"></vBottomMenu>
     </div>
-    <eventdetailsdialog ref="eventdetailsdialog" :calendarDay="calendarDay" @getEventList="getEventList" @getTodayEvents="getTodayEvents"></eventdetailsdialog>
+    <eventdetailsdialog ref="eventdetailsdialog" :calendarDay="calendarDay" @getEventList="getEventList"
+                        @getTodayEvents="getTodayEvents"></eventdetailsdialog>
     <eventLocation ref="eventLocation"></eventLocation>
     <TVWall ref="TVWall"></TVWall>
   </div>
@@ -375,7 +379,7 @@ export default {
   },
   data() {
     return {
-      calendarDay:this.getCurrentDataStr(),
+      calendarDay: this.getCurrentDataStr(),
       //基本情况
       forestInfo: '', //基本情况
       //左侧获取事件信息统计
@@ -394,7 +398,7 @@ export default {
       //左侧部门事件数量
       forestFarm: [],
       //右侧天气
-      todatWeather:false,
+      todatWeather: false,
       weatherinformationDirection: '',
       weatherinformationHigh: '',
       weatherinformationLevel: '',
@@ -404,7 +408,7 @@ export default {
       weatherinformationTime: '',
       weatherinformationWeather: '',
       //右侧曝光台
-      exposureStageList:[],
+      exposureStageList: [],
       //右侧事件列表
       eventList: [],
       eventListnew: [],
@@ -445,16 +449,16 @@ export default {
     searchEvent(eventSearch) {
       let that = this
       //事件列表搜索
-      this.eventListnew = [];
-      if(eventSearch!=null&&eventSearch!=""){
+      this.eventListnew = []
+      if (eventSearch != null && eventSearch != '') {
         for (var i = 0; i < this.eventListAll.length; i++) {
-          if (this.eventListAll[i].reportor.indexOf(eventSearch)>-1) {
-            this.eventListnew.push(this.eventListAll[i]);
+          if (this.eventListAll[i].reportor.indexOf(eventSearch) > -1) {
+            this.eventListnew.push(this.eventListAll[i])
           }
         }
-        this.eventList=this.eventListnew
-      }else{
-        this.eventList=this.eventListAll
+        this.eventList = this.eventListnew
+      } else {
+        this.eventList = this.eventListAll
       }
       if (this.eventList != null && this.eventList.length > 0) {
         for (let i = 0; i < this.eventList.length; i++) {
@@ -475,7 +479,7 @@ export default {
             markersMap.click = 'showEventDialog'
             markersMap.icon = 'sj-icon-map-wcl'
             markersMap.isAggregation = false
-          } else if ( this.eventList[i].eventStatusValue == 'forest_event_status_2' || this.eventList[i].eventStatusValue == 'forest_event_status_3' || this.eventList[i].eventStatusValue == 'forest_event_status_4' || this.eventList[i].eventStatusValue == 'forest_event_status_5') {
+          } else if (this.eventList[i].eventStatusValue == 'forest_event_status_2' || this.eventList[i].eventStatusValue == 'forest_event_status_3' || this.eventList[i].eventStatusValue == 'forest_event_status_4' || this.eventList[i].eventStatusValue == 'forest_event_status_5') {
             markersMap.click = 'showEventDialog'
             markersMap.icon = 'sj-icon-map-clz'
           } else if (this.eventList[i].eventStatusValue == 'forest_event_status_6') {
@@ -509,8 +513,17 @@ export default {
             '                  <h4>事件时间：' + this.eventList[i].reportTime + '</h4>' +
             '                </div>' +
             '                </div>' +
-            '                </span>' +
-            '</div>'
+            '                </span>'
+          if (this.eventList[i].picturePath != null && this.eventList[i].picturePath != '') {
+            markersMap.bindPopupHtml += '<span>' +
+              '                  <div class="d-l-con">' +
+              '                  <div class="d-l-l-text">' +
+              '<img src="' + this.eventList[i].picturePath + '" style="width: 150px;height: 100px"/>' +
+              '                </div>' +
+              '                </div>' +
+              '                </span>'
+          }
+          markersMap.bindPopupHtml += '</div>'
           that.markersList.push(markersMap)
         }
         setTimeout(() => {
@@ -525,7 +538,7 @@ export default {
         }, 1000)
       }
     },
-    dropLocation(lat, lng){
+    dropLocation(lat, lng) {
       this.$refs.supermap.dropLocation(lat, lng)
     },
     showEventDialog(eventCode) {
@@ -549,7 +562,7 @@ export default {
       this.getEventByEventType(day)
       this.getEventByReportorOrder(day)
       this.getExposureStage(day)
-      this.calendarDay=day
+      this.calendarDay = day
     },
 
     //事件数量统计chart 样例地址http://192.144.199.210:8080/editor/index.html?chart_id=jTXf0Rv4A3oiBONB
@@ -727,16 +740,16 @@ export default {
         }]
       })
     },
-    selectTaskList(){
-      this.$refs.bottomMenu.selectTaskList();
+    selectTaskList() {
+      this.$refs.bottomMenu.selectTaskList()
     },
     getBaseInfo() {
       //左侧获取部门信息
       getBaseInfo().then(res => {
-        if(res.code==200){
-          if(res.msg=="未找到部门信息"){
-            this.forestInfo='未找到部门信息!'
-          }else{
+        if (res.code == 200) {
+          if (res.msg == '未找到部门信息') {
+            this.forestInfo = '未找到部门信息!'
+          } else {
             this.forestInfo = res.data.baseinfo //基本情况
           }
         }
@@ -772,11 +785,11 @@ export default {
       let that = this
       //右侧获取天气信息
       getWeather({ day: day }).then(res => {
-        if(res.code==200){
-          if(res.msg=="天气未添加"){
-            this.todatWeather=false
-          }else{
-            this.todatWeather=true
+        if (res.code == 200) {
+          if (res.msg == '天气未添加') {
+            this.todatWeather = false
+          } else {
+            this.todatWeather = true
             this.weatherinformationDirection = res.data.weatherinformationDirection
             this.weatherinformationHigh = res.data.weatherinformationHigh
             this.weatherinformationLevel = res.data.weatherinformationLevel
@@ -786,8 +799,8 @@ export default {
             this.weatherinformationTime = res.data.weatherinformationTime
             this.weatherinformationWeather = res.data.weatherinformationWeather
           }
-        }else{
-          this.todatWeather=false
+        } else {
+          this.todatWeather = false
         }
       })
     },
@@ -816,16 +829,16 @@ export default {
               markersMap.isAggregation = true
             }
             if (this.eventList[i].eventStatusValue == 'forest_event_status_1') {
-              if(this.eventList[i].urgeCount>0){
+              if (this.eventList[i].urgeCount > 0) {
                 markersMap.click = 'showEventDialog'
                 markersMap.icon = 'sj-icon-map-wcl'
                 markersMap.isAggregation = false
-              }else{
+              } else {
                 markersMap.click = 'showEventDialog'
                 markersMap.icon = 'sj-icon-map-wcl'
                 markersMap.isAggregation = false
               }
-            } else if ( this.eventList[i].eventStatusValue == 'forest_event_status_2' || this.eventList[i].eventStatusValue == 'forest_event_status_3' || this.eventList[i].eventStatusValue == 'forest_event_status_4' || this.eventList[i].eventStatusValue == 'forest_event_status_5') {
+            } else if (this.eventList[i].eventStatusValue == 'forest_event_status_2' || this.eventList[i].eventStatusValue == 'forest_event_status_3' || this.eventList[i].eventStatusValue == 'forest_event_status_4' || this.eventList[i].eventStatusValue == 'forest_event_status_5') {
               markersMap.click = 'showEventDialog'
               markersMap.icon = 'sj-icon-map-clz'
             } else if (this.eventList[i].eventStatusValue == 'forest_event_status_6') {
@@ -859,8 +872,17 @@ export default {
               '                  <h4>事件时间：' + this.eventList[i].reportTime + '</h4>' +
               '                </div>' +
               '                </div>' +
-              '                </span>' +
-              '</div>'
+              '                </span>'
+            if (this.eventList[i].picturePath != null && this.eventList[i].picturePath != '') {
+              markersMap.bindPopupHtml += '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '<img src="' + this.eventList[i].picturePath + '" style="width: 150px;height: 100px"/>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>'
+            }
+            markersMap.bindPopupHtml += '</div>'
             that.markersList.push(markersMap)
           }
           setTimeout(() => {
@@ -886,7 +908,7 @@ export default {
           this.eventKind.showValue = true
           this.eventKind = { ...this.eventKind }
         } else {
-          this.eventKind={}
+          this.eventKind = {}
           this.eventKind = { ...this.eventKind }
         }
       })
@@ -908,7 +930,7 @@ export default {
       let that = this
       //右侧获取曝光台
       getExposureStage({ day: day }).then(res => {
-          this.exposureStageList = res.data
+        this.exposureStageList = res.data
       })
     },
     /** ----------------------------------weosocket开始------------------------------------- */
@@ -962,59 +984,59 @@ export default {
     },
     /** ----------------------------------weosocket结束------------------------------------- */
 
-   /** ----------------------------------底部按钮公用组件开始------------------------------------- */
-      showDialog(click) {
-        if (click == 'eventLocation') {
-          this.$refs.eventLocation.showEventLocation()
-          this.$refs.supermap.isEditableLayers = false
-          this.$refs.bottomMenu.showChild = false
-       		this.$refs.bottomMenu.showBanChild = false
-   			this.$refs.bottomMenu.showChangChild = false
-        } else if (click == 'editableLayers') {
-          this.$refs.bottomMenu.showChild = false
-       		this.$refs.bottomMenu.showBanChild = false
-   			this.$refs.bottomMenu.showChangChild = false
-          if (!this.$refs.supermap.isEditableLayers) {
-            this.$refs.supermap.isEditableLayers = true
-          } else {
-            this.$refs.supermap.isEditableLayers = false
-          }
-        } else if (click == 'layerSwitching') {
-          this.$refs.supermap.isEditableLayers = false
-       		this.$refs.bottomMenu.showBanChild = false
-   			this.$refs.bottomMenu.showChangChild = false
-          if (!this.$refs.bottomMenu.showChild) {
-            this.$refs.bottomMenu.showChild = true
-          } else {
-            this.$refs.bottomMenu.showChild = false
-          }
-        } else if (click == 'TVWall') {
-          this.$refs.TVWall.showTVWall()
+    /** ----------------------------------底部按钮公用组件开始------------------------------------- */
+    showDialog(click) {
+      if (click == 'eventLocation') {
+        this.$refs.eventLocation.showEventLocation()
+        this.$refs.supermap.isEditableLayers = false
+        this.$refs.bottomMenu.showChild = false
+        this.$refs.bottomMenu.showBanChild = false
+        this.$refs.bottomMenu.showChangChild = false
+      } else if (click == 'editableLayers') {
+        this.$refs.bottomMenu.showChild = false
+        this.$refs.bottomMenu.showBanChild = false
+        this.$refs.bottomMenu.showChangChild = false
+        if (!this.$refs.supermap.isEditableLayers) {
+          this.$refs.supermap.isEditableLayers = true
+        } else {
           this.$refs.supermap.isEditableLayers = false
+        }
+      } else if (click == 'layerSwitching') {
+        this.$refs.supermap.isEditableLayers = false
+        this.$refs.bottomMenu.showBanChild = false
+        this.$refs.bottomMenu.showChangChild = false
+        if (!this.$refs.bottomMenu.showChild) {
+          this.$refs.bottomMenu.showChild = true
+        } else {
           this.$refs.bottomMenu.showChild = false
-       		this.$refs.bottomMenu.showBanChild = false
-   			this.$refs.bottomMenu.showChangChild = false
-        }  else if (click == 'forestban') {
-       		this.$refs.bottomMenu.showBanChild = true
-          this.$refs.supermap.isEditableLayers = false
-       		this.$refs.bottomMenu.showChild = false
-   			this.$refs.bottomMenu.showChangChild = false
-          if (!this.$refs.bottomMenu.showBanChild) {
-            this.$refs.bottomMenu.showBanChild = false
-          }
-        }else if (click == 'forestchang') {
-       		this.$refs.bottomMenu.showChangChild = true
-          this.$refs.supermap.isEditableLayers = false
-   			this.$refs.bottomMenu.showBanChild = false
-       		this.$refs.bottomMenu.showChild = false
-          if (!this.$refs.bottomMenu.showChangChild) {
-            this.$refs.bottomMenu.showChangChild = false
-          }
         }
+      } else if (click == 'TVWall') {
+        this.$refs.TVWall.showTVWall()
+        this.$refs.supermap.isEditableLayers = false
+        this.$refs.bottomMenu.showChild = false
+        this.$refs.bottomMenu.showBanChild = false
+        this.$refs.bottomMenu.showChangChild = false
+      } else if (click == 'forestban') {
+        this.$refs.bottomMenu.showBanChild = true
+        this.$refs.supermap.isEditableLayers = false
+        this.$refs.bottomMenu.showChild = false
+        this.$refs.bottomMenu.showChangChild = false
+        if (!this.$refs.bottomMenu.showBanChild) {
+          this.$refs.bottomMenu.showBanChild = false
+        }
+      } else if (click == 'forestchang') {
+        this.$refs.bottomMenu.showChangChild = true
+        this.$refs.supermap.isEditableLayers = false
+        this.$refs.bottomMenu.showBanChild = false
+        this.$refs.bottomMenu.showChild = false
+        if (!this.$refs.bottomMenu.showChangChild) {
+          this.$refs.bottomMenu.showChangChild = false
+        }
+      }
 
-      },
+    },
     //选择图层
-    choseLayerSwitching(url,isClear) {
+    choseLayerSwitching(url, isClear) {
       this.$refs.supermap.layerSwitching(url, isClear)
     },
     //选择图层(传递数组)