应急可视化 隐患云图

src/api/forest.js

@@ -294,3 +294,5 @@ export function getInfoView(dangerId) {
     method: 'get',
   })
 }
+
+

src/api/leader.js

@@ -1,56 +1,25 @@
 import request from '@/utils/request'
 
-// 获取左侧
-export function getRy() {
+// 查询应急巡检人员
+export function findEmergencyUserByPost() {
   return request({
-    url: '/center-emergency/VisuEmergencyCloudMapController/getRy',
-    method: 'post',
-  })
-}
-
-// 获取左侧人员列表
-export function getForestLeader(linJob,linType) {
-  return request({
-    url: '/center-fire/VisuForestLeaderController/getForestLeader?linJob='+linJob+"&linType="+linType,
-    method: 'get',
-  })
-}
-// 点击左侧人员列表获取轨迹
-export function getLeaderTrack(trackById) {
-  return request({
-    url: '/center-fire/VisuForestLeaderController/getLeaderTrack?trackById='+trackById,
-    method: 'get',
-  })
-}
-
-// 点击左侧人员获取人员的巡林计划
-export function getRemotelist() {
-  return request({
-    url: '/center-fire/VisuForestLeaderController/getRemotelist',
-    method: 'get',
-  })
-}
-
-// 巡林计划
-export function getPlanList(personId) {
-  return request({
-    url: '/center-fire/VisuForestLeaderController/getPlanList?personId='+personId,
+    url: '/center-emergency/VisuEmergencyCloudMapController/findEmergencyUserByPost',
     method: 'get',
   })
 }
 
-// 巡林记录
-export function getRecordList(planId, personId) {
+// 应急巡检人员巡检日期
+export function findItudeByUserId(userId) {
   return request({
-    url: '/center-fire/VisuForestLeaderController/getRecordList?planId='+planId+'&personId='+personId,
+    url: '/center-emergency/VisuEmergencyCloudMapController/findItudeByUserId/'+userId,
     method: 'get',
   })
 }
 
-// 巡林轨迹
-export function getPointList(recordId) {
+// 应急巡检人员和时间查询轨迹
+export function findItudeByUserIdAndTime(userId,time) {
   return request({
-    url: '/center-fire/VisuForestLeaderController/getPointList?recordId='+recordId,
+    url: '/center-emergency/VisuEmergencyCloudMapController/findItudeByUserIdAndTime/'+userId+'/'+time,
     method: 'get',
   })
 }

src/components/v-fastmenu.vue

@@ -40,6 +40,7 @@
 import resetPwd from "../views/system/user/profile/resetPwd";
 import { getUserProfile } from "@/api/system/user";
 import { selectConfigKey } from "@/api/system/config";
+import Cookies from 'js-cookie'
 
 
 	export default {
@@ -82,6 +83,7 @@ import { selectConfigKey } from "@/api/system/config";
           this.nickName=response.data.nickName
           this.deptNames=response.data.deptNames
           this.phonenumber=response.data.phonenumber
+          Cookies.set('userId',response.data.userId);
         });
       },
       resetPwd(){

src/components/vBottomMenu.vue

@@ -53,10 +53,10 @@
           <div v-show="showBanChild && fastMenu.click == 'forestban'" class="nav-child">
             <div class="forestban">
               <div class="forestban-con">
-<!--                <el-input-->
-<!--                  placeholder="输入关键字进行过滤"-->
-<!--                  v-model="filterbanText">-->
-<!--                </el-input>-->
+                <!--                <el-input-->
+                <!--                  placeholder="输入关键字进行过滤"-->
+                <!--                  v-model="filterbanText">-->
+                <!--                </el-input>-->
                 <el-tree
                   :data="deptOptionsLiandong"
                   ref="banDept"
@@ -73,7 +73,8 @@
                 <el-input placeholder="请输入内容" prefix-icon="el-icon-search" v-model="searchFB">
                 </el-input>
                 <el-checkbox-group v-model="banCheckList" @change="handleCheckedCitiesChangeBan">
-                  <el-checkbox v-for="(fastMenu,index) in filterbanList" label="http://218.27.1.154:8090/iserver/services/map-sipingshi/rest/maps/tiedong_lunkuo">
+                  <el-checkbox v-for="(fastMenu,index) in filterbanList"
+                               label="http://218.27.1.154:8090/iserver/services/map-sipingshi/rest/maps/tiedong_lunkuo">
                     铁东
                   </el-checkbox>
                 </el-checkbox-group>
@@ -87,10 +88,10 @@
           <div v-show="showChangChild && fastMenu.click == 'forestchang'" class="nav-child">
             <div class="forestban">
               <div class="forestban-con">
-<!--                <el-input-->
-<!--                  placeholder="输入关键字进行过滤"-->
-<!--                  v-model="filterchangText">-->
-<!--                </el-input>-->
+                <!--                <el-input-->
+                <!--                  placeholder="输入关键字进行过滤"-->
+                <!--                  v-model="filterchangText">-->
+                <!--                </el-input>-->
                 <el-tree
                   :data="deptOptionsLiandong"
                   ref="changDept"
@@ -104,7 +105,8 @@
                 ></el-tree>
               </div>
               <div class="forestban-right">
-                <el-input placeholder="请输入内容" prefix-icon="el-icon-search" v-model="filterchang" @change="searchFilterchang(filterchang)">
+                <el-input placeholder="请输入内容" prefix-icon="el-icon-search" v-model="filterchang"
+                          @change="searchFilterchang(filterchang)">
                 </el-input>
                 <el-checkbox-group v-model="changCheckList" @change="handleCheckedCitiesChangeChang">
                   <el-checkbox v-for="(item,index) in filterchangList" :label="item.farmAddress">
@@ -147,7 +149,9 @@
               </div>
               <div class="btm-r-pop-info-list">
                 <div class="btm-r-pop-info-list-name">催办状态</div>
-                <div class="btm-r-pop-info-list-text" style="color: red" v-if="item.isUrged==1">任务催办中，请及时处理！！</div>
+                <div class="btm-r-pop-info-list-text" style="color: red" v-if="item.isUrged==1">
+                  任务催办中，请及时处理！！
+                </div>
                 <div class="btm-r-pop-info-list-text" v-else>正常</div>
               </div>
             </div>
@@ -166,38 +170,19 @@
       </el-popover>
       <el-popover placement="top" trigger="click">
         <div class="btm-r-pop-info">
-          <div class="btm-r-pop-info-box" v-for="(item,index) in 0">
-            <div class="btm-r-pop-info-tit">
-              <h3>火险任务</h3>
-            </div>
+          <div class="btm-r-pop-info-box" v-for="(item,index) in messageList">
             <div class="btm-r-pop-info-con">
               <div class="btm-r-pop-info-list">
-                <div class="btm-r-pop-info-list-name">标题</div>
-                <div class="btm-r-pop-info-list-text">四平阿斯利康大姐夫啊路上的风景可丽金啊水电分离家</div>
-              </div>
-              <div class="btm-r-pop-info-list">
-                <div class="btm-r-pop-info-list-name">发起人</div>
-                <div class="btm-r-pop-info-list-text">张三</div>
-              </div>
-              <div class="btm-r-pop-info-list">
-                <div class="btm-r-pop-info-list-name">发起时间</div>
-                <div class="btm-r-pop-info-list-text">2022-09-05 12:12:15</div>
-              </div>
-              <div class="btm-r-pop-info-list">
-                <div class="btm-r-pop-info-list-name">关联事件</div>
-                <div class="btm-r-pop-info-list-text">啊萨杜拉副科级啊萨杜拉副科级</div>
+                <div class="btm-r-pop-info-list-name">{{ item.title }}</div>
+                <div class="btm-r-pop-info-list-text">{{ item.content }}</div>
               </div>
             </div>
             <div class="btm-r-pop-info-btm">
-              <el-link type="success">查看详情</el-link>
-              <div class="btm-r-pop-info-btm-btn">
-                <el-button type="danger">拒绝</el-button>
-                <el-button type="primary">领取</el-button>
-              </div>
+              <el-link type="success" @click="selectMessageById(item.id)">标记已读</el-link>
             </div>
           </div>
         </div>
-        <el-badge :value="0" slot="reference">
+        <el-badge :value="messageCount" slot="reference">
           <el-button size="small" icon="el-icon-chat-line-round">消息</el-button>
         </el-badge>
       </el-popover>
@@ -380,7 +365,9 @@
 
 <script>
 import {
-  selectTaskBO, getEventDetail, selectTaskDtpts, receiveTask, refusedTask
+  selectTaskBO, getEventDetail, selectTaskDtpts, receiveTask, refusedTask, selectMessageCount,
+  selectMessageList,
+  selectMessageById
 } from '@/api/forest'
 import {
   selectFarmByDeptId
@@ -390,6 +377,7 @@ import {
 } from '@/api/system/dept'
 import supermapTaskDialog from '@/components/supermap' //超图
 import TcPlayer from '@/components/TcPlayer' //视频预览
+import Cookies from 'js-cookie'
 
 export default {
   components: {
@@ -435,6 +423,8 @@ export default {
 
       taskCount: 0,//任务数量
       taskList: 0,//任务列表
+      messageCount: 0,//任务数量
+      messageList: [],//任务列表
 
       btmTipIndent: '', //图例收起弹出
       eventLocationVisible: false,
@@ -521,8 +511,9 @@ export default {
       searchFB: '',
       filterchang: '',//林场搜索
       btmCurrent: '',
-      eventWarn: false, //webSocket事件问题警报标记
+      eventWarn: false //webSocket事件问题警报标记
     }
+
   },
   created() {
     /** 查询部门树结构 */
@@ -531,6 +522,7 @@ export default {
     })
   },
   methods: {
+
     filterbanNode(value, data) {
       //树搜索
       if (!value) return true
@@ -541,10 +533,10 @@ export default {
       if (!value) return true
       return data.label.indexOf(value) !== -1
     },
-    handlechangNodeClick(node,data,value) {
+    handlechangNodeClick(node, data, value) {
       //获取林场列表
-      this.filterchang=''
-      selectFarmByDeptId({deptId:node.id}).then(res => {
+      this.filterchang = ''
+      selectFarmByDeptId({ deptId: node.id }).then(res => {
         this.filterchangList = res.data
         this.filterchangListAll = res.data
       })
@@ -630,6 +622,25 @@ export default {
         }
       })
     },
+    selectMessageById(id) {
+      selectMessageById(id).then(response => {
+        /** 获取消息列表 */
+        this.selectMessageList()
+      })
+    },
+    /** 获取消息个数 */
+    selectMessageCount() {
+      selectMessageCount(Cookies.get('userId')).then(response => {
+        this.messageCount = response.data
+      })
+    },
+    /** 获取消息列表 */
+    selectMessageList() {
+      selectMessageList(Cookies.get('userId')).then(response => {
+        this.messageList = response.data
+        this.messageCount = response.data.length
+      })
+    },
     cancelEventShow() {
       console.log('关闭事件弹窗')
       this.eventCode = null
@@ -650,46 +661,46 @@ export default {
         this.eventDialog = true
         this.eventLogList = res.data.eventlog
         this.visuForestCloudYuAnBo = res.data.visuForestCloudYuAnBo//应急预案
-          this.address = res.data.catalogue.address
-          this.eventType = res.data.catalogue.eventType
-          this.eventId = res.data.catalogue.id
-          this.longitude = res.data.catalogue.longitude
-          this.latitude = res.data.catalogue.latitude
-          let markersMap = {
-            lng: 124.59,
-            lat: 43.02,
-            icon: 'marker',
-            bindPopupHtml: '',
-            click: '',
-            parameter: '',
-            keepBindPopup: false,
-            isAggregation: false,
-            radius: 0
-          }
+        this.address = res.data.catalogue.address
+        this.eventType = res.data.catalogue.eventType
+        this.eventId = res.data.catalogue.id
+        this.longitude = res.data.catalogue.longitude
+        this.latitude = res.data.catalogue.latitude
+        let markersMap = {
+          lng: 124.59,
+          lat: 43.02,
+          icon: 'marker',
+          bindPopupHtml: '',
+          click: '',
+          parameter: '',
+          keepBindPopup: false,
+          isAggregation: false,
+          radius: 0
+        }
 
-          if (res.data.catalogue.eventStatusValue == 'forest_event_status_1' && res.data.catalogue.urgeCount == 0) {
-            markersMap.icon = 'sj-icon-map-xinshangbao'
-          }
-          if (res.data.catalogue.eventStatusValue == 'forest_event_status_1' && res.data.catalogue.urgeCount > 0) {
-            markersMap.icon = 'sj-icon-map-cuiban'
-          } else if (res.data.catalogue.eventStatusValue == 'forest_event_status_2') {
-            markersMap.icon = 'sj-icon-map-qianshou'
-          } else if (res.data.catalogue.eventStatusValue == 'forest_event_status_5') {
-            markersMap.icon = 'sj-icon-map-banjie'
-          } else if (res.data.catalogue.eventStatusValue == 'forest_event_status_6') {
-            markersMap.icon = 'sj-icon-map-guidang'
-          }
-          markersMap.lng = res.data.catalogue.longitude
-          markersMap.lat = res.data.catalogue.latitude
-          if (res.data.eventdetail != null && res.data.eventdetail.length > 0 && res.data.eventdetail[0].fireRadius != null && res.data.eventdetail[0].fireRadius != '' && res.data.eventdetail[0].fireRadius > 0) {
-            markersMap.radius = res.data.eventdetail[0].fireRadius
-          }
-          setTimeout(() => {
-            // that.$refs.supermapTaskDialog.dynamicPlotting()//弹出动态绘制窗口，防止截图位置改变
-            that.$refs.supermapTaskDialog.clearM(false)
-            that.$refs.supermapTaskDialog.setMarkersRadius([markersMap])
-            that.$refs.supermapTaskDialog.dropLocation(res.data.catalogue.latitude, res.data.catalogue.longitude)
-          }, 1000)
+        if (res.data.catalogue.eventStatusValue == 'forest_event_status_1' && res.data.catalogue.urgeCount == 0) {
+          markersMap.icon = 'sj-icon-map-xinshangbao'
+        }
+        if (res.data.catalogue.eventStatusValue == 'forest_event_status_1' && res.data.catalogue.urgeCount > 0) {
+          markersMap.icon = 'sj-icon-map-cuiban'
+        } else if (res.data.catalogue.eventStatusValue == 'forest_event_status_2') {
+          markersMap.icon = 'sj-icon-map-qianshou'
+        } else if (res.data.catalogue.eventStatusValue == 'forest_event_status_5') {
+          markersMap.icon = 'sj-icon-map-banjie'
+        } else if (res.data.catalogue.eventStatusValue == 'forest_event_status_6') {
+          markersMap.icon = 'sj-icon-map-guidang'
+        }
+        markersMap.lng = res.data.catalogue.longitude
+        markersMap.lat = res.data.catalogue.latitude
+        if (res.data.eventdetail != null && res.data.eventdetail.length > 0 && res.data.eventdetail[0].fireRadius != null && res.data.eventdetail[0].fireRadius != '' && res.data.eventdetail[0].fireRadius > 0) {
+          markersMap.radius = res.data.eventdetail[0].fireRadius
+        }
+        setTimeout(() => {
+          // that.$refs.supermapTaskDialog.dynamicPlotting()//弹出动态绘制窗口，防止截图位置改变
+          that.$refs.supermapTaskDialog.clearM(false)
+          that.$refs.supermapTaskDialog.setMarkersRadius([markersMap])
+          that.$refs.supermapTaskDialog.dropLocation(res.data.catalogue.latitude, res.data.catalogue.longitude)
+        }, 1000)
       })
     },
     refreshTaskList() {
@@ -745,7 +756,7 @@ export default {
         this.btmTipIndent = ''
       }
     },
-    searchFilterchang(filterchang){
+    searchFilterchang(filterchang) {
       //林场列表搜索
       let searchFilterchangnew = []
       if (filterchang != null && filterchang != '') {
@@ -761,11 +772,11 @@ export default {
     },
     //标记警报
     updateAlert() {
-      this.eventWarn = true;
+      this.eventWarn = true
     },
-    updateAlertFalse(){
-      this.eventWarn = false;
-      this.$emit('stopAudio');
+    updateAlertFalse() {
+      this.eventWarn = false
+      this.$emit('stopAudio')
     }
   }
 }
@@ -786,7 +797,7 @@ export default {
   align-items: center;
 
 
-	z-index:9999;
+  z-index: 9999;
 
   .light {
     position: absolute;
@@ -1087,6 +1098,7 @@ export default {
 
 
 }
+
 //警铃
 .fire-tip {
   text-align: center;
@@ -1125,7 +1137,7 @@ export default {
 .bell {
   position: absolute;
   right: 10px;
-  bottom:-20px;
+  bottom: -20px;
   width: 100%;
   height: 320px;
   z-index: 999;

src/views/forest.vue

@@ -490,6 +490,7 @@
       window.choseLayerSwitching = this.choseLayerSwitching
       window.choseLayerSwitchingList = this.choseLayerSwitchingList
       window.choseLayerSwitchingList_Data = this.choseLayerSwitchingList_Data
+      this.bottomMenuList() //获取底部公共组件消息和任务
       /** ----------------------------------底部按钮公用组件结束------------------------------------- */
     },
     mounted() {
@@ -516,7 +517,7 @@
           this.getSupermap(this.getCurrentDataStr(), true);
         }
       }, 10000)
-      this.bottomMenuList() //获取底部公共组件消息和任务
+
     },
     data() {
       return {

src/views/forestDanger.vue

@@ -145,18 +145,8 @@ export default {
     /** ----------------------------------底部按钮公用组件结束------------------------------------- */
   },
   mounted() {
-    // this.getEventByEventType(this.getCurrentDataStr())
     this.getAllDanger(this.getCurrentDataStr(),false)
-    /** ----------------------------------weosocket开始------------------------------------- */
-    // this.initWebSocket()
-    /** ----------------------------------weosocket结束------------------------------------- */
-    this.selectTaskList()//获取任务
-    // setInterval(() => {
-    //   if(this.calendarDay == this.getCurrentDataStr()){
-    //     this.getAllDanger(this.getCurrentDataStr(),0,0,true);
-    //     this.getEventByEventType(this.getCurrentDataStr(),true);
-    //   }
-    // }, 10000)
+    this.bottomMenuList() //获取底部公共组件消息和任务
   },
   data() {
     return {
@@ -305,9 +295,6 @@ export default {
       this.calendarDay = day
     },
 
-    selectTaskList() {
-      this.$refs.bottomMenu.selectTaskList()
-    },
     // getEventByEventType(day,loading) {
     //   let that = this
     //   //左侧获取隐患部门数量
@@ -469,6 +456,10 @@ export default {
     /** ----------------------------------weosocket结束------------------------------------- */
 
     /** ----------------------------------底部按钮公用组件开始------------------------------------- */
+    bottomMenuList() {
+      this.$refs.bottomMenu.selectTaskList()//获取任务列表
+      this.$refs.bottomMenu.selectMessageList()//获取消息列表
+    },
     showDialog(click) {
       if (click == 'eventLocation') {
         this.$refs.eventLocation.showEventLocation()

src/views/leader.vue

@@ -1,514 +1,255 @@
 <template>
-	<div class="visual-con">
-		<!--头部-->
-		<vheader></vheader>
-		<!--主体-->
-		<div class="visual-body">
-			<!-- 左侧 -->
-			<div class="leftbar" :class="indentleft" ref="left">
-				<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">
-							<span>人员分布</span>
-							<dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;" />
-						</div>
-						<div class="i-list-con h-25">
-							<div id="personnel-chart" style="width: 100%;height:12vh;"></div>
-							<div class="d-l-con-icon">
-								<div class="icon-con w-50" :class="{on:iconCurrentIndex1==item.jobValue}"
-									v-for="(item,index) in visuForestCloudRYBO"
-									@click="getForestLeader(item.jobValue,item.jobType)">
-									<div class="icon icon-mid el-icon-user"></div>
-									<div class="icon-text">
-										<h5>{{ item.job }}</h5>
-										<h6>{{ item.number }}</h6>
-									</div>
-								</div>
-								<!-- <div class="icon-con w-50  m-btm-no" :class="{on:listCurrentIndex1==item.jobType}" v-for="(item,index) in visuForestCloudRYBO" v-if="index%2!=0" @click="getForestLeader(item.jobValue,item.jobType)">
-                <div class="icon icon-mid el-icon-user"></div>
-                <div class="icon-text">
-                  <h5>{{item.job}}</h5>
-                  <h6>{{item.number}}</h6>
-                </div>
-              </div> -->
-							</div>
-						</div>
-					</dv-border-box-13>
-				</div>
-				<!--        avatar: ""-->
-				<!--        deptName: "锦程社区第一网格"-->
-				<!--        nickName: "李猛"-->
-				<!--        userId: 102-->
-				<!--        userName: "limeng"-->
-				<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="i-list-con h-27">
-							<div class="d-l-con-icon">
-								<div class="icon-con" :class="{on:listCurrentIndex1==item.userId}"
-									v-for="(item,index) in peopleList" @click="getPlanList(item.userId)">
-									<div class="icon icon-mid el-icon-user"></div>
-									<div class="icon-text personnel-name">
-										<h6>{{ item.nickName }}</h6>
-										<h5>{{ item.deptName }}</h5>
-									</div>
-								</div>
-							</div>
-						</div>
-					</dv-border-box-13>
-				</div>
-			</div>
-			<!-- 地图 -->
-			<supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'forestMap'" class="indexSupermapClass"
-				:mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false"></supermap>
-			<!-- 右侧 -->
-			<div class="rightbar" :class="indentright" ref="right">
-				<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">
-							<span>巡林计划</span>
-							<dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;" />
-						</div>
-						<div class="i-list-con h-73">
-
-							<div class="h-73 overflow-y">
-								<el-collapse accordion>
-									<el-collapse-item v-for="(item,index) in xunLinListOne">
-										<template slot="title">
-											<div class="d-l-con sj-collapse"
-												@click="getRecordList(item.id, item.personId)">
-												<div class="d-l-l-text">
-													<el-tooltip class="item" effect="dark" placement="left"
-														style="width:10rem ;" :disabled="(item.name.length <= 20)">
-														<div slot="content">
-															<h4 class="collapse-title" style="width: 200px;">
-																{{ item.name}}</h4>
-														</div>
-														<h4 class="collapse-title" style="width: 100px;">
-															{{ item.name | ellipsis20}}</h4>
-													</el-tooltip>
-												</div>
-												<div class="d-l-l-count">({{ item.recordCount }}/{{ item.planCount }})
-												</div>
-											</div>
-										</template>
-										<div class="d-l-con this-child sj-collapse" @click="getPointList(child.id)"
-											v-for="(child,index) in recordList">
-											<div class="d-l-l-text">
-												<h4>{{child.beginTime}} - {{child.endTime}}</h4>
-											</div>
-											<!--<div class="d-l-l-count">{{index}}</div>-->
-										</div>
-										<div class="d-l-con this-child sj-collapse"
-											v-if="showNothing && (recordList == null || recordList == '' || recordList == [])">
-											<div class="d-l-l-text">
-												<h4 class="text-gray">暂无信息</h4>
-											</div>
-										</div>
-									</el-collapse-item>
-								</el-collapse>
-								<!--<div class="d-l-con" :class="{on:listCurrentIndex2==item.planName}"
-                     v-for="(item,index) in xunLinListOne"
-                     @click="setConnectList(item.planLine,item.planName)">
-                  <div class="d-l-l-text">
-                    <i class="i-small"></i>
-                    <h4>{{ item.planName }}</h4>
+  <div class="visual-con">
+    <!--头部-->
+    <vheader></vheader>
+    <!--主体-->
+    <div class="visual-body">
+      <!-- 左侧 -->
+      <div class="leftbar" ref="left">
+        <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="i-list-con h-27">
+              <div class="d-l-con-icon">
+                <div class="icon-con" :class="{on:listCurrentIndex1==item.userId}"
+                     v-for="(item,index) in peopleList" @click="findItudeByUserId(item.userId)">
+                  <div class="icon icon-mid el-icon-user"></div>
+                  <div class="icon-text personnel-name">
+                    <h6>{{ item.nickName }}</h6>
+                    <h5>{{ item.deptName }}</h5>
                   </div>
-                </div>-->
-							</div>
-						</div>
-					</dv-border-box-13>
-				</div>
-
-
-			</div>
-			<vBottomMenu ref="bottomMenu"></vBottomMenu>
-			<!--      <el-tooltip :content="indentText" placement="top" :disabled="indentdisabled">-->
-			<!--        <div class="mascot" ref="mascot" :class="indentStyle" @click="indent">-->
-			<!--          <img src="@/assets/images/mascot.png"/>-->
-			<!--        </div>-->
-			<!--      </el-tooltip>-->
-		</div>
-		<eventLocation ref="eventLocation"></eventLocation>
-		<TVWall ref="TVWall"></TVWall>
-	</div>
+                </div>
+              </div>
+            </div>
+          </dv-border-box-13>
+        </div>
+      </div>
+      <!-- 地图 -->
+      <supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'forestMap'" class="indexSupermapClass"
+                :mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false"></supermap>
+      <!-- 右侧 -->
+      <div class="rightbar" ref="right">
+        <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">
+              <span>巡林计划</span>
+              <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
+            </div>
+            <div class="i-list-con h-73">
+
+              <div class="h-73 overflow-y">
+                <el-collapse accordion>
+                  <el-collapse-item v-for="(item,index) in recordList">
+                    <template slot="title">
+                      <div class="d-l-con sj-collapse" :class="{on:listCurrentIndex2==item.time}"
+                           @click="findItudeByUserIdAndTime(item.userId, item.time)">
+                        <div class="d-l-l-text">
+                          <div slot="content">
+                            <h4 class="collapse-title" style="width: 200px;">
+                              {{ item.time }}</h4>
+                          </div>
+                        </div>
+                      </div>
+                    </template>
+                  </el-collapse-item>
+                </el-collapse>
+              </div>
+            </div>
+          </dv-border-box-13>
+        </div>
+
+
+      </div>
+      <vBottomMenu ref="bottomMenu"></vBottomMenu>
+    </div>
+    <eventLocation ref="eventLocation"></eventLocation>
+    <TVWall ref="TVWall"></TVWall>
+  </div>
 </template>
 
 <script>
-	import {
-		getForestLeader,
-		getLeaderTrack,
-		getPlanList,
-		getRecordList,
-		getPointList,
-		getRy,
-		getRemotelist
-	} from '@/api/leader'
-
-	import supermap from '@/components/supermap' //超图
-	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' //电视墙弹窗
-
-	let echarts = require('echarts')
-	export default {
-		components: {
-			supermap,
-			vheader,
-			vBottomMenu,
-			eventLocation,
-			TVWall
-		},
-		data() {
-			return {
-				iconCurrentIndex1: '1',
-				listCurrentIndex1: '',
-				listCurrentIndex2: '',
-				//左右缩进
-				indentStyle: '',
-				indentleft: '',
-				indentright: '',
-				indentText: '收起左右栏',
-				indentdisabled: false,
-				visuForestCloudRYBO: [], //人员类型列表
-				peopleList: [], //人员列表
-				connectList: [], //画线
-				xunLinListOne: [], //巡林计划
-				recordList: [], //巡查记录
-				showNothing: false, //暂无信息
-				zrs: 0, //总人数
-				zxrs: 0 //在线人数
-			}
-		},
-		created() {
-			this.getInit()
-			/** ----------------------------------底部按钮公用组件开始------------------------------------- */
-			window.showDialog = this.showDialog
-			window.choseLayerSwitching = this.choseLayerSwitching
-			window.choseLayerSwitchingList = this.choseLayerSwitchingList
-			/** ----------------------------------底部按钮公用组件结束------------------------------------- */
-		},
-    mounted(){
-      this.bottomMenuList() //获取底部公共组件消息和任务
+import {
+  findEmergencyUserByPost,
+  findItudeByUserId,
+  findItudeByUserIdAndTime
+} from '@/api/leader'
+
+import supermap from '@/components/supermap' //超图
+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' //电视墙弹窗
+
+let echarts = require('echarts')
+export default {
+  components: {
+    supermap,
+    vheader,
+    vBottomMenu,
+    eventLocation,
+    TVWall
+  },
+  data() {
+    return {
+      listCurrentIndex1: '',
+      listCurrentIndex2: '',
+      peopleList: [], //人员列表
+      recordList: [], //巡查记录
+      connectList: [] //画线
+    }
+  },
+  created() {
+    this.getInit()
+    /** ----------------------------------底部按钮公用组件开始------------------------------------- */
+    window.showDialog = this.showDialog
+    window.choseLayerSwitching = this.choseLayerSwitching
+    window.choseLayerSwitchingList = this.choseLayerSwitchingList
+    /** ----------------------------------底部按钮公用组件结束------------------------------------- */
+  },
+  mounted() {
+    this.bottomMenuList() //获取底部公共组件消息和任务
+  },
+  methods: {
+    /** ----------------------------------底部按钮公用组件开始------------------------------------- */
+    bottomMenuList() {
+      this.$refs.bottomMenu.selectTaskList()//获取任务列表
+      this.$refs.bottomMenu.selectMessageList()//获取消息列表
     },
-		methods: {
-			/** ----------------------------------底部按钮公用组件开始------------------------------------- */
-      bottomMenuList() {
-        this.$refs.bottomMenu.selectTaskList()//获取任务列表
-        this.$refs.bottomMenu.selectMessageList()//获取消息列表
-      },
-			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()
-					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.supermap.isEditableLayers = false
-					this.$refs.bottomMenu.showChild = false
-					this.$refs.bottomMenu.showChangChild = false
-					if (!this.$refs.bottomMenu.showBanChild) {
-						this.$refs.bottomMenu.showBanChild = true
-					} else {
-						this.$refs.bottomMenu.showBanChild = false
-					}
-				} else if (click == 'forestchang') {
-					this.$refs.supermap.isEditableLayers = false
-					this.$refs.bottomMenu.showBanChild = false
-					this.$refs.bottomMenu.showChild = false
-					if (!this.$refs.bottomMenu.showChangChild) {
-						this.$refs.bottomMenu.showChangChild = true
-					} else {
-						this.$refs.bottomMenu.showChangChild = false
-					}
-				}
-
-			},
-			//选择图层
-			choseLayerSwitching(url, isClear) {
-				this.$refs.supermap.layerSwitching(url, isClear)
-			},
-			//选择图层(传递数组)
-			choseLayerSwitchingList(urlList) {
-				this.$refs.supermap.layerSwitchingList(urlList)
-			},
-			/** ----------------------------------底部按钮公用组件结束------------------------------------- */
-
-			//初始化
-			getInit() {
-				let that = this
-				this.iconCurrentIndex1 = '1'
-				this.listCurrentIndex1 = ''
-				this.listCurrentIndex2 = ''
-				//获取左侧菜单列表
-				getRy().then(res => {
-					that.visuForestCloudRYBO = res.data.visuForestCloudRYBO
-					that.zrs = res.data.visuForestCloudRyZxBO.zrs
-					that.zxrs = res.data.visuForestCloudRyZxBO.zxrs
-					this.personnelChart()
-				})
-				//获取巡林计划
-				// getPlanList().then(res => {
-				//   this.xunLinListOne = res.data
-				// })
-			},
-			//获取左侧人员列表
-			getForestLeader(linJob, linType) {
-				this.listCurrentIndex1 = ''
-				this.listCurrentIndex2 = ''
-				this.iconCurrentIndex1 = linJob
-				this.peopleList = []
-				getForestLeader(linJob, linType).then(res => {
-					this.peopleList = res.data
-				})
-				this.connectList = []
-				this.$refs.supermap.clearC()
-			},
-			//获取巡林计划
-			// getPlanList(personId) {
-			//   alert(personId)
-			//   getPlanList(personId).then(res => {
-			//     console.log("计划", res.data)
-			//     this.xunLinListOne = res.data
-			//   })
-			// },
-			//点击左侧人员列表获取 巡林计划
-			getPlanList(personId) {
-				this.showNothing = false;
-				this.recordList = [];
-				getPlanList(personId).then(res => {
-					console.log("计划", res.data);
-					this.xunLinListOne = res.data;
-				})
-				this.$refs.supermap.clearC()
-			},
-			//点击左侧人员列表获取轨迹
-			getLeaderTrack(userId) {
-				this.getRemotelist();
-				this.listCurrentIndex1 = userId
-				let that = this
-				this.connectList = []
-				getLeaderTrack(userId).then(res => {
-					if (res.data != null && res.data.length > 0) {
-						for (let i = 0; i < res.data.length; i++) {
-							let latlng = {
-								lat: res.data[i].latitude,
-								lng: res.data[i].longitude
-							}
-							this.connectList.push(latlng)
-						}
-						setTimeout(() => {
-							that.$refs.supermap.clearC()
-							that.$refs.supermap.setConnectList(this.connectList, 'red')
-						}, 1000)
-					} else {
-						that.$refs.supermap.clearC()
-					}
-				})
-			},
-			//点击右侧巡林计划获取 巡查记录
-			getRecordList(id, personId) {
-				this.showNothing = false;
-				this.recordList = [];
-				getRecordList(id, personId).then(res => {
-					console.log("记录", res.data);
-					this.recordList = res.data;
-				})
-				this.$refs.supermap.clearC()
-			},
-			//点击右侧巡查记录获取 巡查轨迹
-			getPointList(id, ) {
-				getPointList(id).then(res => {
-					// console.log("落点",res.data);
-					this.setPointList(res);
-				})
-			},
-			//点击左侧人员获取人员的巡林计划列表
-			getRemotelist() {
-				getRemotelist().then(res => {
-					this.xunLinListOne = res.data;
-				})
-			},
-			//点击巡查轨迹时段 巡查轨迹落点
-			setPointList(res) {
-				let that = this;
-				this.connectList = [];
-				console.log("落点", res.data)
-				if (res.data != null && res.data.length > 0) {
-					for (let i = 0; i < res.data.length; i++) {
-						let latlng = {
-							lat: res.data[i].latitude,
-							lng: res.data[i].longitude
-						}
-						this.connectList.push(latlng)
-					}
-					setTimeout(() => {
-						that.$refs.supermap.clearC()
-						that.$refs.supermap.setConnectList(this.connectList, 'red')
-					}, 1000)
-				} else {
-					that.$refs.supermap.clearC()
-				}
-			},
-			setConnectList(points, planName) {
-				this.listCurrentIndex2 = planName
-				this.connectList = []
-				if (points != null && points != '') {
-					this.connectList = JSON.parse(points)
-					this.$refs.supermap.setConnectTwoList(this.connectList, 'red')
-				}
-			},
-
-			//吉祥物收起左右框
-			indent() {
-				let list = document.getElementsByClassName('el-tooltip__popper')
-				list[list.length - 1].style.display = 'none'
-				if (this.indentStyle == '') {
-					this.indentStyle = 'indent-style'
-					this.indentleft = 'indent-left'
-					this.indentright = 'indent-right'
-					this.indentText = '展开左右栏'
-				} else if (this.indentText == '展开左右栏') {
-					this.indentStyle = ''
-					this.indentleft = ''
-					this.indentright = ''
-					this.indentText = '收起左右栏'
-				}
-			},
-			//人员chart
-			personnelChart() {
-				// 基于准备好的dom，初始化echarts实例
-				let myChart = echarts.init(document.getElementById('personnel-chart'))
-				// 绘制图表
-				const handred = this.zrs
-				let point = this.zxrs
-				myChart.setOption({
-					title: [{
-						text: '总人数：' + handred + '人' + '\n' + '\n' + '在线人数：' + point + '人',
-						x: '48%',
-						y: '25%',
-						textStyle: {
-							fontWeight: 'normal',
-							color: '#02d6fc',
-							fontSize: '14'
-						}
-					}],
-					series: [{
-						name: 'circle',
-						type: 'pie',
-						center: ['22%', '50%'],
-						radius: ['60%', '70%'],
-						clockWise: true,
-						label: {
-							normal: {
-								position: 'center'
-
-							}
-						},
-						itemStyle: {
-							normal: {
-								label: {
-									show: false
-								},
-								labelLine: {
-									show: false
-								}
-							}
-						},
-						data: [{
-							value: point,
-							name: '当前在线',
-							label: {
-								show: true, //单独显示该数据项
-								formatter: '{c}人',
-								labelLayout: {
-									top: '50%'
-								},
-								textStyle: {
-									color: '#02d6fc',
-									fontSize: 14
-								}
-							},
-							itemStyle: {
-								normal: {
-									color: { // 完成的圆环的颜色
-										colorStops: [{
-											offset: 0,
-											color: '#02d6fc' // 0% 处的颜色
-										}, {
-											offset: 1,
-											color: '#367bec' // 100% 处的颜色
-										}]
-									},
-									label: {
-										show: false
-									},
-									labelLine: {
-										show: false
-									}
-								}
-							}
-						}, {
-							value: handred - point,
-							itemStyle: {
-								color: '#666'
-							}
-						}]
-					}]
-				})
-			}
+    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()
+        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.supermap.isEditableLayers = false
+        this.$refs.bottomMenu.showChild = false
+        this.$refs.bottomMenu.showChangChild = false
+        if (!this.$refs.bottomMenu.showBanChild) {
+          this.$refs.bottomMenu.showBanChild = true
+        } else {
+          this.$refs.bottomMenu.showBanChild = false
+        }
+      } else if (click == 'forestchang') {
+        this.$refs.supermap.isEditableLayers = false
+        this.$refs.bottomMenu.showBanChild = false
+        this.$refs.bottomMenu.showChild = false
+        if (!this.$refs.bottomMenu.showChangChild) {
+          this.$refs.bottomMenu.showChangChild = true
+        } else {
+          this.$refs.bottomMenu.showChangChild = false
+        }
+      }
 
-
-		},
-		//过滤器
-
-		filters: {
-
-			//标题截取前20
-			ellipsis20(value) {
-				if (!value) return '';
-				if (value.length > 20) {
-					return value.slice(0, 20) + '...'
-				}
-				return value
-			}
-		},
-
-	}
+    },
+    //选择图层
+    choseLayerSwitching(url, isClear) {
+      this.$refs.supermap.layerSwitching(url, isClear)
+    },
+    //选择图层(传递数组)
+    choseLayerSwitchingList(urlList) {
+      this.$refs.supermap.layerSwitchingList(urlList)
+    },
+    /** ----------------------------------底部按钮公用组件结束------------------------------------- */
+
+    //初始化
+    getInit() {
+      let that = this
+      this.iconCurrentIndex1 = '1'
+      this.listCurrentIndex1 = ''
+      this.listCurrentIndex2 = ''
+      this.findEmergencyUserByPost()
+    },
+    //获取左侧人员列表
+    findEmergencyUserByPost() {
+      this.listCurrentIndex1 = ''
+      this.listCurrentIndex2 = ''
+      this.iconCurrentIndex1 = ''
+      this.peopleList = []
+      findEmergencyUserByPost().then(res => {
+        this.peopleList = res.data
+      })
+      this.connectList = []
+    },
+    //点击左侧人员列表获取轨迹
+    findItudeByUserId(userId) {
+      this.listCurrentIndex1 = userId
+      let that = this
+      findItudeByUserId(userId).then(res => {
+        that.recordList = res.data
+      })
+    },
+    //点击右侧巡林计划获取 巡查记录
+    findItudeByUserIdAndTime(id, time) {
+      this.listCurrentIndex2 = time
+      let that = this
+      this.connectList = []
+      findItudeByUserIdAndTime(id, time).then(res => {
+        if (res.data != null && res.data.length > 0) {
+          for (let i = 0; i < res.data.length; i++) {
+            let latlng = {
+              lat: res.data[i].latitude,
+              lng: res.data[i].longitude
+            }
+            that.connectList.push(latlng)
+          }
+          setTimeout(() => {
+            that.$refs.supermap.clearC()
+            that.$refs.supermap.setConnectList(that.connectList, 'red')
+          }, 1000)
+        } else {
+          that.$refs.supermap.clearC()
+        }
+      })
+
+    }
+  },
+  //过滤器
+
+  filters: {
+    //标题截取前20
+    ellipsis20(value) {
+      if (!value) return ''
+      if (value.length > 20) {
+        return value.slice(0, 20) + '...'
+      }
+      return value
+    }
+  }
+
+}
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
-	@import '@/assets/styles/base.scss';
+@import '@/assets/styles/base.scss';
 
-	.h-27 {
-		height: 27rem;
-	}
+.h-27 {
+  height: 27rem;
+}
 </style>