|
@@ -59,33 +59,12 @@
|
|
|
</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">
|
|
|
- <div class="icon icon-mid el-icon-user"></div>
|
|
|
- <div class="icon-text">
|
|
|
- <h5>林长</h5>
|
|
|
- <h6>888888</h6>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div class="d-l-con-icon" v-for="(item,index) in visuForestCloudRYBO">
|
|
|
<div class="icon-con w-50">
|
|
|
<div class="icon icon-mid el-icon-user"></div>
|
|
|
<div class="icon-text">
|
|
|
- <h5>护林员</h5>
|
|
|
- <h6>453</h6>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="icon-con w-50 m-btm-no">
|
|
|
- <div class="icon icon-mid el-icon-user"></div>
|
|
|
- <div class="icon-text">
|
|
|
- <h5>警员</h5>
|
|
|
- <h6>500</h6>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="icon-con w-50 m-btm-no">
|
|
|
- <div class="icon icon-mid el-icon-user"></div>
|
|
|
- <div class="icon-text">
|
|
|
- <h5>技术员</h5>
|
|
|
- <h6>453</h6>
|
|
|
+ <h5>{{item.job}}</h5>
|
|
|
+ <h6>{{item.number}}</h6>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -423,6 +402,9 @@
|
|
|
import {
|
|
|
getTodayEvent,getEventStatusList,getEventSourceList,getEventListByDeptIdList
|
|
|
} from '@/api/event'
|
|
|
+ import {
|
|
|
+ getBaseInfo
|
|
|
+ } from '@/api/forest'
|
|
|
|
|
|
import supermap from '@/components/supermap' //超图
|
|
|
import vheader from '@/components/v-header.vue' //一体化共用头部
|
|
@@ -441,12 +423,14 @@
|
|
|
// })
|
|
|
},
|
|
|
mounted() {
|
|
|
+ this.getBaseInfo()
|
|
|
this.getTodayEvent()
|
|
|
- this.cameraChat()
|
|
|
this.personnelChart()
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ visuForestCloudRYBO:[],//人员类型列表
|
|
|
+ sourceData:[],
|
|
|
todayEventCountList: [],//今日事件列表
|
|
|
todayEventSourcetList: [],//今日事件列表
|
|
|
todayEventCountDeptList: [],//事件分布
|
|
@@ -459,7 +443,7 @@
|
|
|
eventInfoVisible2: false,
|
|
|
activeName: 'info',
|
|
|
radio: '1',
|
|
|
- forestInfo: '林区⾯积189平⽅公⾥,林场30个,⽹格员3000名,救援设备50套,救援队伍5支',
|
|
|
+ forestInfo: '',//基本情况
|
|
|
forestFarm: [{
|
|
|
name: '双辽市',
|
|
|
id: '',
|
|
@@ -623,16 +607,7 @@
|
|
|
const dfColor = ['#92E1FF', '#0097FB', '#30ECA6', '#FFC227', '#FF4848'];
|
|
|
myChart.setOption({
|
|
|
dataset: {
|
|
|
- source: [
|
|
|
- ["类型1", 1200],
|
|
|
- ["类型2", 1000],
|
|
|
- ["类型3", 746],
|
|
|
- ["类型4", 636],
|
|
|
- ["类型5", 581],
|
|
|
- ["类型6", 426],
|
|
|
- ["类型7", 326]
|
|
|
-
|
|
|
- ],
|
|
|
+ source: this.sourceData,
|
|
|
},
|
|
|
tooltip: {
|
|
|
trigger: 'item',
|
|
@@ -860,6 +835,78 @@
|
|
|
showEventInfo2() {
|
|
|
this.eventInfoVisible2 = true
|
|
|
},
|
|
|
+ getBaseInfo() {
|
|
|
+ let that = this
|
|
|
+ that.sourceData = [];
|
|
|
+ //获取左侧菜单列表
|
|
|
+ getBaseInfo().then(res => {
|
|
|
+ that.forestInfo = res.data.baseinfo.baseinfo;//基本情况
|
|
|
+
|
|
|
+
|
|
|
+ if (res.data.VisuForestCloudTodaySjfbBO!=null&&res.data.VisuForestCloudTodaySjfbBO.length>0){
|
|
|
+ for (let i = 0; i < res.data.VisuForestCloudTodaySjfbBO.length; i++) {
|
|
|
+ let aa=[res.data.VisuForestCloudTodaySjfbBO[i].deptName,res.data.VisuForestCloudTodaySjfbBO[i].deptCount];
|
|
|
+ that.sourceData.push(aa);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ that.markersList = [];
|
|
|
+ let markersMap = {
|
|
|
+ lng: 124.59,
|
|
|
+ lat: 43.02,
|
|
|
+ icon: 'marker',
|
|
|
+ bindPopupHtml: '',
|
|
|
+ click: '',
|
|
|
+ keepBindPopup: false,
|
|
|
+ isAggregation: true
|
|
|
+ }
|
|
|
+ if(res.data.visuForestVgdEventBOList!=null&&res.data.visuForestVgdEventBOList.length>0){
|
|
|
+ for (let i = 0; i < res.data.visuForestVgdEventBOList.length; i++) {
|
|
|
+ markersMap.lng = res.data.visuForestVgdEventBOList[i].longitude
|
|
|
+ markersMap.lat =res.data.visuForestVgdEventBOList[i].latitude
|
|
|
+ markersMap.bindPopupHtml = '<div class="map-tip">' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>经纬度:' +res.data.visuForestVgdEventBOList[i].longitude + ',' +res.data.visuForestVgdEventBOList[i]
|
|
|
+ .latitude + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>事件名称:' +res.data.visuForestVgdEventBOList[i].eventTitle + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '<span>' +
|
|
|
+ ' <div class="d-l-con">' +
|
|
|
+ ' <div class="d-l-l-text">' +
|
|
|
+ ' <h4>事件时间:' +res.data.visuForestVgdEventBOList[i].reportTime + '</h4>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </div>' +
|
|
|
+ ' </span>' +
|
|
|
+ '</div>';
|
|
|
+ that.markersList.push(markersMap)
|
|
|
+ }
|
|
|
+ setTimeout(() => {
|
|
|
+ that.$refs.supermap.clearM(false)
|
|
|
+ that.$refs.supermap.setMarkers(that.markersList)
|
|
|
+ }, 1000);
|
|
|
+ }
|
|
|
+
|
|
|
+ that.visuForestCloudRYBO=res.data.visuForestCloudRYBO;
|
|
|
+ // VisuForestCloudTodaySjfbBO: (2) [{…}, {…}]
|
|
|
+ // baseinfo: {baseinfo: '子挖的'}基本情况
|
|
|
+ // cameraList: (2) [{…}, {…}]
|
|
|
+ // visuForestCloudRYBO: (3) [{…}, {…}, {…}]
|
|
|
+ // visuForestCloudTodaySjlyBOList: (3) [{…}, {…}, {…}]
|
|
|
+ // visuForestCloudTodayTjBO: {wclCount: '82', clzCount: '0', ybjCount: '0'}
|
|
|
+ // visuForestVgdEventBOList
|
|
|
+ this.cameraChat();
|
|
|
+ })
|
|
|
+ },
|
|
|
getTodayEvent() {
|
|
|
let that = this
|
|
|
//获取右侧菜单列表
|