Browse Source

Merge branch 'master' of http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization

whao 2 năm trước cách đây
mục cha
commit
3b49dc8e1b

+ 8 - 0
src/components/eventLocation.vue

@@ -505,6 +505,10 @@
         this.cameraMarkersList = []
       },
       getNearEvent() {
+        if(this.longitude==null||this.longitude==""||this.latitude==null||this.latitude==""){
+          this.$modal.msgError('请输入经纬度!');
+          return
+        }
         this.activeName = 'event'
         let marker = [{
           lng: this.longitude,
@@ -597,6 +601,10 @@
           isAggregation: false
         }]
         if (tab.name == 'monitor') {
+          if(this.longitude==null||this.longitude==""||this.latitude==null||this.latitude==""){
+            this.$modal.msgError('请输入经纬度!');
+            return
+          }
           that.cameraMarkersList = []
           that.cameraList = []
           getNearCamera(this.longitude, this.latitude).then(res => {

+ 21 - 0
src/components/supermap.vue

@@ -31,6 +31,7 @@
         isAggregationMyGroup: [],
         polygon: null,
         connectLayer: [],
+        connectLayerTwo: [],
         graphicsLayer: [],
         latLngLayers: [],
         latLngGroup: [],
@@ -252,6 +253,12 @@
         }
         this.connectLayer = []
       },
+      clearCTwo: async function() {//清理地图画线two
+        if (this.connectLayerTwo != undefined && this.connectLayerTwo != false) {
+          this.connectLayerTwo.clearLayers()
+        }
+        this.connectLayerTwo = []
+      },
       clearG: async function() {//清理地图图形
         if (this.graphicsLayer != undefined && this.graphicsLayer != false) {
           this.graphicsLayer.clearLayers()
@@ -696,6 +703,20 @@
           _that.connectLayer.addLayer(polyline)
         }
       },
+      setConnectTwoList: function(connectList, color) {//地图画线图层2
+        const _that = this
+        let points = []
+        for (let i = 0; i < connectList.length; i++) {
+          points.push([connectList[i].lat, connectList[i].lng])//创建点
+        }
+        let polyline = window.L.polyline(points, { color: color })
+        if (this.connectLayerTwo != undefined && this.connectLayerTwo != false) {
+          _that.connectLayerTwo.addLayer(polyline)
+        } else {
+          _that.connectLayerTwo = window.L.featureGroup().addTo(this.map)
+          _that.connectLayerTwo.addLayer(polyline)
+        }
+      },
       setGraphicsList: function(graphicsList, color) {//地图图形
         const _that = this
         let points = []

+ 181 - 174
src/views/afforestation.vue

@@ -1,100 +1,102 @@
 <!--植树造林-->
 <template>
-	<div class="visual-con">
-		<!--头部-->
-		<vheader></vheader>
-		<!--主体-->
-		<div class="visual-body">
-			<!-- 左侧 -->
-			<div class="leftbar" :class="indentleft" ref="left">
-				<div class="forthis">
-					<div class="this-title">
-						<el-date-picker v-model="pickYear"  @change="getInit()" type="year" placeholder="选择年">
-						</el-date-picker>
-					</div>
-					<div class="i-list-con h-19">
-						<div class="d-l-con" :class="{on:listCurrentIndex1 == item.id}" v-for="(item,index) in afforestationList" @click="getAfforestationArea(item.id)">
-							<div class="d-l-l-text">
-								<i class="i-small"></i>
-								<h4>{{item.plantingQuantity}}</h4>
-							</div>
-						</div>
-					</div>
-				</div>
-				<div class="forthis">
-					<div class="i-list-con h-51">
-						<div class="d-l-con" :class="{on:listCurrentIndex2 == item.points}" v-for="(item,index) in AfforestationAreaList" @click="setGraphicsList(item.points)">
-							<div class="d-l-l-text">
-								<i class="i-small"></i>
-								<h4>区域{{index+1}}</h4>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-			<!-- 地图 -->
-			<supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'disasterMap'"
-				:mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false"></supermap>
-			<!--底部 -->
-			<vBottomMenu ref="bottomMenu"></vBottomMenu>
+  <div class="visual-con">
+    <!--头部-->
+    <vheader></vheader>
+    <!--主体-->
+    <div class="visual-body">
+      <!-- 左侧 -->
+      <div class="leftbar" :class="indentleft" ref="left">
+        <div class="forthis">
+          <div class="this-title">
+            <el-date-picker v-model="pickYear" @change="getInit()" type="year" placeholder="选择年">
+            </el-date-picker>
+          </div>
+          <div class="i-list-con h-19">
+            <div class="d-l-con" :class="{on:listCurrentIndex1 == item.id}" v-for="(item,index) in afforestationList"
+                 @click="getAfforestationArea(item.id)">
+              <div class="d-l-l-text">
+                <i class="i-small"></i>
+                <h4>{{item.plantingQuantity}}</h4>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="forthis">
+          <div class="i-list-con h-51">
+            <div class="d-l-con" :class="{on:listCurrentIndex2 == item.points}"
+                 v-for="(item,index) in AfforestationAreaList" @click="setGraphicsList(item.points)">
+              <div class="d-l-l-text">
+                <i class="i-small"></i>
+                <h4>区域{{index+1}}</h4>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 地图 -->
+      <supermap ref="supermap" style="width: 100%;height: 100vh;" :mapDiv="'disasterMap'"
+                :mapSite="{doubleClickZoom:false}" :codes="['9fa5']" :isSideBySide="false"></supermap>
+      <!--底部 -->
+      <vBottomMenu ref="bottomMenu"></vBottomMenu>
 
-		</div>
+    </div>
     <eventLocation ref="eventLocation"></eventLocation>
-	</div>
+  </div>
 </template>
 
 <script>
-	import {
-    getAfforestation,getAfforestationArea
-	} from '@/api/afforestation'
-	/** ----------------------------------摄像头预览开始------------------------------------- */
-	import {
-		getDahuaVideoServer
-	} from "@/api/dahua/dahua";
-	import DHWs from '@/dahua/lib/DHWs'
+  import {
+    getAfforestation, getAfforestationArea
+  } from '@/api/afforestation'
+  /** ----------------------------------摄像头预览开始------------------------------------- */
+  import {
+    getDahuaVideoServer
+  } from '@/api/dahua/dahua'
+  import DHWs from '@/dahua/lib/DHWs'
 
-	/** ----------------------------------摄像头预览结束------------------------------------- */
-	import supermap from '@/components/supermap' //超图
-	import vheader from '@/components/v-header.vue' //一体化共用头部
-	import vBottomMenu from '@/components/vBottomMenu.vue' //一体化公共底部菜单
-	import eventLocation from '@/components/eventLocation.vue' //事件定位弹窗
-	let echarts = require('echarts')
-	export default {
-		dicts: ['event_source'],
-		components: {
-			supermap,
-			vheader,
-			vBottomMenu,
-			eventLocation
-		},
+  /** ----------------------------------摄像头预览结束------------------------------------- */
+  import supermap from '@/components/supermap' //超图
+  import vheader from '@/components/v-header.vue' //一体化共用头部
+  import vBottomMenu from '@/components/vBottomMenu.vue' //一体化公共底部菜单
+  import eventLocation from '@/components/eventLocation.vue' //事件定位弹窗
+  let echarts = require('echarts')
+  export default {
+    dicts: ['event_source'],
+    components: {
+      supermap,
+      vheader,
+      vBottomMenu,
+      eventLocation
+    },
     created() {
       /** ----------------------------------底部按钮公用组件开始------------------------------------- */
-      window.showDialog=this.showDialog
-      window.choseLayerSwitching=this.choseLayerSwitching
+      window.showDialog = this.showDialog
+      window.choseLayerSwitching = this.choseLayerSwitching
       /** ----------------------------------底部按钮公用组件结束------------------------------------- */
     },
-		mounted() {
+    mounted() {
       this.getInit()
     },
-		data() {
-			return {
-				listCurrentIndex1:'',
-				listCurrentIndex2:'',
-				pickYear: new Date(), //选择年份
-        afforestationList:[],
-        AfforestationAreaList:[],
+    data() {
+      return {
+        listCurrentIndex1: '',
+        listCurrentIndex2: '',
+        pickYear: new Date(), //选择年份
+        afforestationList: [],
+        AfforestationAreaList: [],
         graphicsList: [],//地图区域
-				//左右缩进
-				indentStyle: '',
-				indentleft: '',
-				indentright: '',
-				indentText: '收起左右栏',
-				indentdisabled: false
+        //左右缩进
+        indentStyle: '',
+        indentleft: '',
+        indentright: '',
+        indentText: '收起左右栏',
+        indentdisabled: false
 
-			}
-		},
+      }
+    },
 
-		methods: {
+    methods: {
       /** ----------------------------------底部按钮公用组件开始------------------------------------- */
       showDialog(click) {
         if (click == 'eventLocation') {
@@ -119,124 +121,129 @@
       },
       //选择图层
       choseLayerSwitching(url) {
-        this.$refs.supermap.layerSwitching(url, true);
+        this.$refs.supermap.layerSwitching(url, true)
       },
       /** ----------------------------------底部按钮公用组件结束------------------------------------- */
 
       getInit() {
+        this.listCurrentIndex1=''
+        this.listCurrentIndex2=''
         let that = this
-        this.afforestationList=[];
-        this.AfforestationAreaList=[];
+        this.afforestationList = []
+        this.AfforestationAreaList = []
         //获取左侧菜单列表
         getAfforestation(this.pickYear.getYear() + 1900).then(res => {
-          this.afforestationList=res.data;
+          this.afforestationList = res.data
+          setTimeout(() => {
+            this.$refs.supermap.clearG()
+          }, 1000)
         })
       },
       getAfforestationArea(afforestationId) {
-		this.listCurrentIndex1 = afforestationId
+        this.listCurrentIndex1 = afforestationId
         let that = this
         //获取左侧菜单列表
         getAfforestationArea(afforestationId).then(res => {
-          this.AfforestationAreaList=res.data;
+          this.AfforestationAreaList = res.data
         })
       },
-      setGraphicsList(points){
-		this.listCurrentIndex2 = points
-        this.graphicsList=[]
-        if(points!=null&&points!=""){
-          this.graphicsList=JSON.parse(points);
+      setGraphicsList(points) {
+        this.listCurrentIndex2 = points
+        this.graphicsList = []
+        if (points != null && points != '') {
+          this.graphicsList = JSON.parse(points)
           this.$refs.supermap.clearG()
           this.$refs.supermap.setGraphicsList(this.graphicsList, 'red')
-        }else{
+        } else {
           this.$refs.supermap.clearG()
         }
       },
 
-			//吉祥物收起左右框
-			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 = '收起左右栏'
-				}
-			},
-			dropLocation(lat, lng) {
-				this.$refs.supermap.dropLocation(lat, lng)
-			},
-			/** ----------------------------------摄像头预览开始------------------------------------- */
-			alertLogin: function() {
-				this.$modal.msg("登录中....");
-			},
-			alertLoginSuccess: function() {
-				this.$modal.msgSuccess("登录成功!");
-			},
-			alertLoginFailed: function() {
-				this.$modal.msgError("登陆失败!");
-			},
-			alertReinstall: function() {
-				this.$modal.msgWarning("请重新安装客户端");
-			},
-			/** 预览按钮操作 */
-			preview(channelCode) {
-				getDahuaVideoServer().then(newResponse => {
-					this.ws.detectConnectQt().then(res => {
-						if (res) { // 连接客户端成功
-							this.alertLogin();
-							this.ws.login({
-								loginIp: newResponse.loginIp,
-								loginPort: newResponse.loginPort,
-								userName: newResponse.userName,
-								userPwd: newResponse.userPwd,
-								token: '',
-								https: 1
-							});
-							this.ws.on('loginState', (res) => {
-								this.isLogin = res;
-								console.log('---res-----', res);
-								if (res) {
-									this.alertLoginSuccess()
-									this.activePanel = 'key2'
-									this.realTimeVideoDialog(channelCode);
-								} else {
-									this.alertLoginFailed();
-								}
-							});
-						} else { // 连接客户端失败
-							this.alertReinstall();
-						}
-					});
-				});
-			},
-			realTimeVideoDialog(cameraParams) { // 调用弹窗实时播放接口
-				if (!this.isLogin) {
-					this.$Message.info('正在登陆客户端,请稍等......');
-					return false;
-				}
-				this.ws.openVideo(cameraParams);
-			},
-			/** ----------------------------------摄像头预览结束------------------------------------- */
-		}
-	}
+      //吉祥物收起左右框
+      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 = '收起左右栏'
+        }
+      },
+      dropLocation(lat, lng) {
+        this.$refs.supermap.dropLocation(lat, lng)
+      },
+      /** ----------------------------------摄像头预览开始------------------------------------- */
+      alertLogin: function() {
+        this.$modal.msg('登录中....')
+      },
+      alertLoginSuccess: function() {
+        this.$modal.msgSuccess('登录成功!')
+      },
+      alertLoginFailed: function() {
+        this.$modal.msgError('登陆失败!')
+      },
+      alertReinstall: function() {
+        this.$modal.msgWarning('请重新安装客户端')
+      },
+      /** 预览按钮操作 */
+      preview(channelCode) {
+        getDahuaVideoServer().then(newResponse => {
+          this.ws.detectConnectQt().then(res => {
+            if (res) { // 连接客户端成功
+              this.alertLogin()
+              this.ws.login({
+                loginIp: newResponse.loginIp,
+                loginPort: newResponse.loginPort,
+                userName: newResponse.userName,
+                userPwd: newResponse.userPwd,
+                token: '',
+                https: 1
+              })
+              this.ws.on('loginState', (res) => {
+                this.isLogin = res
+                console.log('---res-----', res)
+                if (res) {
+                  this.alertLoginSuccess()
+                  this.activePanel = 'key2'
+                  this.realTimeVideoDialog(channelCode)
+                } else {
+                  this.alertLoginFailed()
+                }
+              })
+            } else { // 连接客户端失败
+              this.alertReinstall()
+            }
+          })
+        })
+      },
+      realTimeVideoDialog(cameraParams) { // 调用弹窗实时播放接口
+        if (!this.isLogin) {
+          this.$Message.info('正在登陆客户端,请稍等......')
+          return false
+        }
+        this.ws.openVideo(cameraParams)
+      }
+      /** ----------------------------------摄像头预览结束------------------------------------- */
+    }
+  }
 </script>
 
 <style lang="scss" scoped>
-	@import '@/assets/styles/base.scss';
+  @import '@/assets/styles/base.scss';
 
-	.el-table__header {
-		width: auto !important;
-	}
+  .el-table__header {
+    width: auto !important;
+  }
 
-	.d-dialog-con {
-		position: absolute;
-		left: -19rem;
-		top: 0;
-	}
+  .d-dialog-con {
+    position: absolute;
+    left: -19rem;
+    top: 0;
+  }
 </style>

+ 19 - 19
src/views/event.vue

@@ -256,7 +256,7 @@
 					</el-tab-pane>
 				</el-tabs>
 			</el-dialog>
-			<el-dialog title="事件信息-处理中" :visible.sync="eventInfoVisible_Processed" v-if="eventInfoVisible_Processed"
+			<el-dialog title="事件信息" :visible.sync="eventInfoVisible_Processed" v-if="eventInfoVisible_Processed"
 				width="80%" @close="cancelEventShow()">
 				<div style="position:absolute; right: 0;top:60px; width:40%;">
 					<el-steps :space="200" :active=zt finish-status="success" align-center>
@@ -526,18 +526,7 @@
 				showZt: true,
 				zt: null,
 				fireReport: false,
-				optionsProcessed: [{
-						value: 'bj',
-						label: '办结'
-					}, {
-						value: 'zy',
-						label: '支援'
-					},
-					{
-						value: 'gd',
-						label: '归档'
-					}
-				],
+				optionsProcessed: [],
 				// 弹出层 基本信息
 				information: [{
 						name: '标题',
@@ -787,7 +776,8 @@
 					this.eventType = ''
 					this.deptName = ''
 					this.eventInfoVisible_notProcessed = false
-					cancelEventShow();
+					this.cancelEventShow();
+					this.getTodayEvent();
 				})
 			},
 			updateEventStatusProcessed() {
@@ -799,7 +789,8 @@
 					this.$modal.msgSuccess(response.msg)
 					this.eventStatus = ''
 					this.eventInfoVisible_Processed = false
-					cancelEventShow();
+					this.cancelEventShow();
+          this.getTodayEvent();
 				})
 
 			},
@@ -981,6 +972,10 @@
 				that.listEventPic = [];
 				that.url = '';
 				getForest(id).then(response => {
+          this.showZt=true
+          this.zt= null
+          this.fireReport= false
+          this.optionsProcessed=[{value: 'bj',label: '办结' }, {value: 'zy',label: '支援'},{value: 'gd',label: '归档'}]
 					let data = response.data
 					if (data.eventStatus != 'event_event_status_1') {
 						this.aniu = false
@@ -1140,14 +1135,17 @@
 							that.$refs.supermap.clearM(true)
 							that.$refs.supermap.setMarkers(that.markersList)
 						}, 1000)
-					}
+					}else{
+            setTimeout(() => {
+              that.$refs.supermap.clearM(false)
+              that.$refs.supermap.clearM(true)
+            }, 1000)
+          }
 				})
 			},
 			todayEventCountSetMarkers(eventStatus) {
 				this.iconCurrentIndex1 = eventStatus
-				if (eventStatus == "event_event_status_3") {
-					return
-				}
+				this.iconCurrentIndex2 = ''
 				//点击今日事件前三个按钮列表
 				let that = this
 				getEventStatusList(eventStatus).then(res => {
@@ -1176,6 +1174,7 @@
 								markersMap.icon = "sj-icon-map-wcl"
 							} else {
 								markersMap.icon = "sj-icon-map-ywc"
+                markersMap.click = "showEventInfo_Processed"
 							}
 							markersMap.parameter = res.data.eventList[i].id
 							markersMap.lng = res.data.eventList[i].longitude
@@ -1217,6 +1216,7 @@
 				})
 			},
 			todayEventSourcetSetMarkers(eventSource) {
+				this.iconCurrentIndex1 = ''
 				this.iconCurrentIndex2 = eventSource
 				//点击今日事件后三个按钮列表
 				let that = this

+ 23 - 21
src/views/forest.vue

@@ -312,7 +312,7 @@
 					<!-- <supermapNotProcessed ref="supermapNotProcessed"  style="width: 1000px;height: 1000px;" :mapDiv="'forestWarmSuperMap'" :mapSite="{doubleClickZoom:false}" :codes="['9fa5']" @preview="preview" :isSideBySide="false"></supermapNotProcessed> -->
 				</el-tabs>
 			</el-dialog>
-			<el-dialog title="事件信息-处理中" :visible.sync="eventInfoVisible_Processed" v-if="eventInfoVisible_Processed"
+			<el-dialog title="事件信息" :visible.sync="eventInfoVisible_Processed" v-if="eventInfoVisible_Processed"
 				width="80%" @close="cancelEventShow()">
 				<div style="position:absolute; right: 0;top:60px; width:40%;">
 					<el-steps :space="200" :active=zt finish-status="success" align-center>
@@ -608,19 +608,9 @@
 				showZt: true,
 				zt: null,
 				fireReport: false,
-				optionsProcessed: [{
-						value: 'bj',
-						label: '办结'
-					}, {
-						value: 'zy',
-						label: '支援'
-					},
-					{
-						value: 'gd',
-						label: '归档'
-					}
-				],
-				forestFarm: [{
+				optionsProcessed: [],
+				forestFarm: [
+				  {
 						name: '双辽市',
 						id: '',
 						child: [{
@@ -652,7 +642,8 @@
 					}
 				],
 				// 弹出层 基本信息
-				information: [{
+				information: [
+				  {
 						name: '标题',
 						id: '',
 						content: '某某某某某发现疑似火情'
@@ -1107,6 +1098,7 @@
 					this.deptName = ''
 					this.eventInfoVisible_notProcessed = false
 					this.cancelEventShow();
+					this.getTodayEvent();
 				})
 			},
 			setXsYc() {
@@ -1215,7 +1207,8 @@
 					this.$modal.msgSuccess(response.msg)
 					this.eventStatus = ''
 					this.eventInfoVisible_Processed = false
-					cancelEventShow();
+					this.cancelEventShow();
+          this.getTodayEvent()
 				})
 
 			},
@@ -1295,11 +1288,14 @@
 				that.url = '';
 				that.id = id;
 				getForest(id).then(response => {
+          this.showZt=true
+          this.zt= null
+          this.fireReport= false
+          this.optionsProcessed=[{value: 'bj',label: '办结' }, {value: 'zy',label: '支援'},{value: 'gd',label: '归档'}]
 					let data = response.data
 					if (data.eventStatus != 'event_event_status_1') {
 						this.aniu = false
 					}
-
 					if (data.eventStatus == 'event_event_status_6') {
 						this.optionsProcessed.splice(1, 2)
 						this.zt = 3
@@ -1477,14 +1473,19 @@
 							that.$refs.supermap.clearM(true)
 							that.$refs.supermap.setMarkers(that.markersList)
 						}, 1000)
-					}
+					}else{
+            setTimeout(() => {
+              that.$refs.supermap.clearM(false)
+              that.$refs.supermap.clearM(true)
+            }, 1000)
+          }
 				})
 			},
 			todayEventCountSetMarkers(eventStatus) {
 				this.iconCurrentIndex1 = eventStatus
-				if (eventStatus == "event_event_status_3") {
-					return
-				}
+				// if (eventStatus == "event_event_status_3") {
+				// 	return
+				// }
 				//点击今日事件前三个按钮列表
 				let that = this
 				getEventStatusList(eventStatus).then(res => {
@@ -1512,6 +1513,7 @@
 								markersMap.click = "showEventInfo_notProcessed"
 								markersMap.icon = "sj-icon-map-wcl"
 							} else {
+                markersMap.click = "showEventInfo_Processed"
 								markersMap.icon = "sj-icon-map-ywc"
 							}
 							markersMap.parameter = res.data.eventList[i].id

+ 43 - 36
src/views/leader.vue

@@ -15,7 +15,8 @@
           <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-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>
@@ -32,15 +33,16 @@
             </div>
           </div>
         </div>
-<!--        avatar: ""-->
-<!--        deptName: "锦程社区第一网格"-->
-<!--        nickName: "李猛"-->
-<!--        userId: 102-->
-<!--        userName: "limeng"-->
+        <!--        avatar: ""-->
+        <!--        deptName: "锦程社区第一网格"-->
+        <!--        nickName: "李猛"-->
+        <!--        userId: 102-->
+        <!--        userName: "limeng"-->
         <div class="forthis">
           <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="getLeaderTrack(item.userId)">
+              <div class="icon-con" :class="{on:listCurrentIndex1==item.userId}" v-for="(item,index) in peopleList"
+                   @click="getLeaderTrack(item.userId)">
                 <div class="icon icon-mid el-icon-user"></div>
                 <div class="icon-text personnel-name">
                   <h6>{{item.nickName}}</h6>
@@ -64,7 +66,8 @@
           <div class="i-list-con h-73">
 
             <div class="h-19 overflow-y">
-              <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-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>
@@ -90,7 +93,7 @@
 
 <script>
   import {
-    getForestLeader,getLeaderTrack,getPlanList
+    getForestLeader, getLeaderTrack, getPlanList
   } from '@/api/leader'
   import {
     getBaseInfo
@@ -111,9 +114,9 @@
     },
     data() {
       return {
-		iconCurrentIndex1:'',
-		listCurrentIndex1:'',
-		listCurrentIndex2:'',
+        iconCurrentIndex1: '1',
+        listCurrentIndex1: '',
+        listCurrentIndex2: '',
         //左右缩进
         indentStyle: '',
         indentleft: '',
@@ -124,8 +127,8 @@
         peopleList: [],//人员列表
         connectList: [],//画线
         xunLinListOne: [],//巡林计划
-        zrs:0,//总人数
-        zxrs:0,//在线人数
+        zrs: 0,//总人数
+        zxrs: 0//在线人数
       }
     },
     created() {
@@ -167,38 +170,42 @@
       //初始化
       getInit() {
         let that = this
+        this.iconCurrentIndex1 = '1'
+        this.listCurrentIndex1 = ''
+        this.listCurrentIndex2 = ''
         //获取左侧菜单列表
         getBaseInfo().then(res => {
           console.log(res.data)
           that.visuForestCloudRYBO = res.data.visuForestCloudRYBO
-          that.zrs=res.data.visuForestCloudRyZxBO.zrs;
-          that.zxrs=res.data.visuForestCloudRyZxBO.zxrs;
+          that.zrs = res.data.visuForestCloudRyZxBO.zrs
+          that.zxrs = res.data.visuForestCloudRyZxBO.zxrs
           this.personnelChart()
         })
         //获取巡林计划
         getPlanList().then(res => {
-          this.xunLinListOne=res.data
+          this.xunLinListOne = res.data
           console.log(res.data.visuForestCloudRYBO)
         })
       },
       //获取左侧人员列表
-      getForestLeader(linJob,linType) {
-		this.iconCurrentIndex1 = linJob
-        this.peopleList=[];
-        getForestLeader(linJob,linType).then(res => {
-          this.peopleList=res.data
+      getForestLeader(linJob, linType) {
+        this.listCurrentIndex1 = ''
+        this.listCurrentIndex2 = ''
+        this.iconCurrentIndex1 = linJob
+        this.peopleList = []
+        getForestLeader(linJob, linType).then(res => {
+          this.peopleList = res.data
         })
-		console.log( '56665464654564',this.peopleList)
-        this.connectList=[]
-        this.$refs.supermap.clearC();
+        this.connectList = []
+        this.$refs.supermap.clearC()
       },
       //点击左侧人员列表获取轨迹
       getLeaderTrack(userId) {
-		this.listCurrentIndex1 = userId
-        let that=this
-        this.connectList=[]
+        this.listCurrentIndex1 = userId
+        let that = this
+        this.connectList = []
         getLeaderTrack(userId).then(res => {
-          if(res.data!=null&&res.data.length>0){
+          if (res.data != null && res.data.length > 0) {
             for (let i = 0; i < res.data.length; i++) {
               let latlng = {
                 lat: res.data[i].latitude,
@@ -210,18 +217,18 @@
               that.$refs.supermap.clearC()
               that.$refs.supermap.setConnectList(this.connectList, 'red')
             }, 1000)
-          }else{
+          } 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.setConnectList(this.connectList, 'red')
+      setConnectList(points, planName) {
+        this.listCurrentIndex2 = planName
+        this.connectList = []
+        if (points != null && points != '') {
+          this.connectList = JSON.parse(points)
+          this.$refs.supermap.setConnectTwoList(this.connectList, 'red')
         }
       },