소스 검색

Merge remote-tracking branch 'origin/visu_water' into visu_water

wang_xy 2 년 전
부모
커밋
6e4bbc7a25

+ 30 - 0
src/api/bigdata.js

@@ -58,6 +58,22 @@ export function getG4() {
   })
 }
 
+// 偷钓偷捕事件分析
+export function get5() {
+  return request({
+    url: '/center-water/VisuForestCloudBigDataController/getEventDeptStatistics',
+    method: 'post',
+  })
+}
+
+// 水利事件分析
+export function get6() {
+  return request({
+    url: '/center-water/VisuForestCloudBigDataController/getEventTypeRadar',
+    method: 'post',
+  })
+}
+
 //林场分布统计
 export function getLcfbtj() {
   return request({
@@ -124,6 +140,20 @@ export function getSjqs(param) {
   })
 }
 
+//事件趋势
+export function getWaterSjqs(param) {
+  //暂时传当年,以后再说
+  if (param == null) {
+    let myDate = new Date();
+    param = {day: myDate.getFullYear()}
+  }
+  return request({
+    url: '/center-water/VisuForestCloudBigDataController/getEventWaterTrend',
+    data: param,
+    method: 'post'
+  })
+}
+
 //网格分布
 export function getWgfb() {
   return request({

+ 8 - 0
src/api/datacenter.js

@@ -8,6 +8,14 @@ export function getResource() {
   })
 }
 
+// 获取左侧菜单列表
+export function getWaterDataGather() {
+  return request({
+    url: '/center-water/VisuForestDataCenterController/getWaterDataGather',
+    method: 'post',
+  })
+}
+
 //点击左侧菜单列表查询落点
 export function getResourcePoint(resourceTable) {
   return request({

+ 1 - 1
src/api/leader.js

@@ -22,7 +22,7 @@ export function getLeaderTrack(trackById) {
     method: 'get',
   })
 }
-// 巡计划
+// 巡查监测点计划
 export function getPlanList(trackById) {
   return request({
     url: '/center-water/VisuForestLeaderController/getPlanList',

+ 33 - 0
src/assets/iconfont/iconfont.css

@@ -202,6 +202,39 @@
   content: "\e930";
 }
 
+/* 酸碱度 */
+.sj-icon-ph:before {
+  content: "\e73f";
+}
+/* 温度 */
+.sj-icon-temperature:before {
+  content: "\e633";
+}
+/* 浊度 */
+.sj-icon-turbidity:before {
+  content: "\e672";
+}
+/* 溶解氧 */
+.sj-icon-dissolve:before {
+  content: "\e61b";
+}
+/* 氨氮 */
+.sj-icon-ammoniaNitrogen:before {
+  content: "\e930";
+}
+/* ORP */
+.sj-icon-orp:before {
+  content: "\e629";
+}
+/* 流速 */
+.sj-icon-flow:before {
+  content: "\e61f";
+}
+/* 液位 */
+.sj-icon-level:before {
+  content: "\e63d";
+}
+
 /* 状态 */
 /* 未处理 */
 .sj-icon-wcl:before {

+ 11 - 11
src/components/vBottomMenu.vue

@@ -447,17 +447,17 @@
 						icon: 'iconfont sj-icon-clgj',
 						click: 'editableLayers'
 					},
-					{
-						name: '林班',
-						icon: 'iconfont sj-icon-lbzy',
-						click: 'forestban'
-					},
-
-					{
-						name: '林场',
-						icon: 'iconfont sj-icon-lczy',
-						click: 'forestchang'
-					},
+					// {
+					// 	name: '林班',
+					// 	icon: 'iconfont sj-icon-lbzy',
+					// 	click: 'forestban'
+					// },
+          //
+					// {
+					// 	name: '林场',
+					// 	icon: 'iconfont sj-icon-lczy',
+					// 	click: 'forestchang'
+					// },
 					{
 						name: '电视墙',
 						icon: 'el-icon-s-grid',

+ 1 - 1
src/permission.js

@@ -8,7 +8,7 @@ import { isRelogin } from '@/utils/request'
 
 NProgress.configure({ showSpinner: false })
 
-const whiteList = ['/login', '/auth-redirect', '/bind', '/register','/integrated/index','/integrated/bigdata','/integrated/forest', '/integrated/fire-forest', '/integrated/monitor','/integrated/date','/integrated/dialog']
+const whiteList = ['/login', '/auth-redirect', '/bind', '/register','/integrated/index','/integrated/bigdata','/integrated/water', '/integrated/fire-forest', '/integrated/monitor','/integrated/date','/integrated/dialog']
 
 router.beforeEach((to, from, next) => {
   NProgress.start()

+ 46 - 28
src/router/index.js

@@ -31,13 +31,13 @@ import Layout from '@/layout'
 // 公共路由(可视化首页头部链接)
 export const constantRoutes = [{
 		path: '/',
-		redirect: 'forest',
+		redirect: 'water',
 	},
 	{
 		//水利中心
-		path: '/forest',
-		name: 'forest',
-		component: () => import('@/views/forest'),
+		path: '/water',
+		name: 'water',
+		component: () => import('@/views/water'),
 		meta: {
 			title: '水利云图'
 		}
@@ -59,14 +59,15 @@ export const constantRoutes = [{
 		meta: {
 			title: '监控中心'
 		}
-	}, {
-		path: '/disaster',
-		name: 'disaster',
-		component: () => import('@/views/disaster'),
-		meta: {
-			title: '灾后评估'
-		}
 	},
+  // {
+	// 	path: '/disaster',
+	// 	name: 'disaster',
+	// 	component: () => import('@/views/disaster'),
+	// 	meta: {
+	// 		title: '灾后评估'
+	// 	}
+	// },
   {
 		path: '/leader',
 		name: 'leader',
@@ -74,15 +75,16 @@ export const constantRoutes = [{
 		meta: {
 			title: '网格化'
 		}
-	}, {
-		path: '/afforestation',
-		name: 'afforestation',
-		component: () => import('@/views/afforestation'),
-		meta: {
-			title: '植树造林'
-		}
 	},
   // {
+	// 	path: '/afforestation',
+	// 	name: 'afforestation',
+	// 	component: () => import('@/views/afforestation'),
+	// 	meta: {
+	// 		title: '植树造林'
+	// 	}
+	// },
+  // {
   //   path: '/',
   //   name: '',
   //   component: () => import('@/views/animal'),
@@ -90,12 +92,20 @@ export const constantRoutes = [{
   //     title: '动物保护'
   //   }
   // },
+  // {
+  //   path: '/',
+  //   name: '',
+  //   component: () => import('@/views/animal'),
+  //   meta: {
+  //     title: '珍惜古树'
+  //   }
+  // },
   {
-    path: '/',
-    name: '',
-    component: () => import('@/views/animal'),
+    path: '/gather',
+    name: 'gather',
+    component: () => import('@/views/gather'),
     meta: {
-      title: '珍惜古树'
+      title: '监测分析'
     }
   },
   {
@@ -113,13 +123,13 @@ export const constantRoutes = [{
 // 公共路由
 export const constantRoutesNew = [{
 		path: '/',
-		redirect: 'forest',
+		redirect: 'water',
 	},
 	{
 		//水利中心
-		path: '/forest',
-		name: 'forest',
-		component: () => import('@/views/forest'),
+		path: '/water',
+		name: 'water',
+		component: () => import('@/views/water'),
 		meta: {
 			title: '水利云图'
 		}
@@ -183,6 +193,14 @@ export const constantRoutesNew = [{
     }
   },
   {
+    path: '/gather',
+    name: 'gather',
+    component: () => import('@/views/gather'),
+    meta: {
+      title: '监测分析'
+    }
+  },
+  {
     path: '/bigdata',
     name: 'bigdata',
     component: () => import('@/views/bigdata/bigdata'),
@@ -216,8 +234,8 @@ export const constantRoutesNew = [{
 		redirect: 'index',
 		children: [{
 			path: 'forest',
-			component: () => import('@/views/forest'),
-			name: 'forest',
+			component: () => import('@/views/water'),
+			name: 'water',
 			meta: {
 				title: '首页',
 				icon: 'dashboard',

+ 38 - 17
src/views/bigdata/bigdata.vue

@@ -78,7 +78,8 @@
         </div>
         <div class="b-con">
           <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
-            <span>事件趋势</span>
+            <!--<span>事件趋势</span>-->
+            <span>偷砂采石事件分析</span>
           </div>
           <chartEventTrend></chartEventTrend>
           <strong></strong>
@@ -92,11 +93,23 @@
           </div>
           <chartGridDistribution></chartGridDistribution>
         </div>
-        <div class="b-con">
+        <!--<div class="b-con">
           <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
             <span>天气趋势</span>
           </div>
           <chartWeatherTrends></chartWeatherTrends>
+        </div>-->
+        <div class="b-con mg-b-20 b-49">
+          <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
+            <span>偷钓偷捕事件分析</span>
+          </div>
+          <chartPitG5></chartPitG5>
+        </div>
+        <div class="b-con mg-b-20 b-49">
+          <div class="b-tit"><img src="@/assets/images/integrated/bigdata-tit-icon.png">
+            <span>水利事件分析</span>
+          </div>
+          <chartPitG6></chartPitG6>
         </div>
       </div>
       <!-- 第五纵向-->
@@ -184,6 +197,8 @@ import chartPitG1 from './chart-pit' //17 闸口资源统计、、
 import chartPitG2 from './chart-firecontrol' //18 水利工程资源统计、、
 import chartPitG3 from './chart-hydrant' //19 河段资源统计、、
 import chartPitG4 from './chart-waterintake' //20 河流资源统计、、
+import chartPitG5 from './chart-farmtype' //21 偷钓偷捕事件分析、、
+import chartPitG6 from './chart-waterTotal' //22 水利事件分析、、
 
 import {getRlt} from '@/api/bigdata'
 
@@ -209,6 +224,8 @@ export default {
     chartPitG2,
     chartPitG3,
     chartPitG4,
+    chartPitG5,
+    chartPitG6,
   },
   data() {
 
@@ -217,7 +234,7 @@ export default {
       navbar: [
         {
           //水利中心
-          path: '/forest',
+          path: '/water',
           name: '水利云图'
         },
         {
@@ -230,25 +247,29 @@ export default {
           path: '/monitor',
           name: '监控中心'
         },
-        {
-          path: '/disaster',
-          name: '灾后评估'
-        },
+        // {
+        //   path: '/disaster',
+        //   name: '灾后评估'
+        // },
         {
           path: '/leader',
           name: '网格化'
         },
+        // {
+        //   path: '/afforestation',
+        //   name: '植树造林'
+        // },
+        // {
+        //   path: '/',
+        //   name: '动物保护'
+        // },
+        // {
+        //   path: '/',
+        //   name: '珍惜古树'
+        // },
         {
-          path: '/afforestation',
-          name: '植树造林'
-        },
-        {
-          path: '/',
-          name: '动物保护'
-        },
-        {
-          path: '/',
-          name: '珍惜古树'
+          path: '/gather',
+          name: '监测分析'
         },
         {
           path: '/bigdata',

+ 1 - 0
src/views/bigdata/chart-event.vue

@@ -34,6 +34,7 @@ export default {
     getEventSourceAndTypeStatistics() {
       let that = this
       getEventSourceAndTypeStatistics({ day: that.year }).then(res => {
+        console.log("事件来源,类型统计", res);
         this.optionData=res.data.source
         this.option2Data=res.data.type
         that.myEcharts()

+ 12 - 1
src/views/bigdata/chart-eventTrend.vue

@@ -9,6 +9,7 @@
 <script>
   import * as echarts from 'echarts';
   import {getSjqs} from '@/api/bigdata.js'
+  import {getWaterSjqs} from '@/api/bigdata.js'
 
 
   export default {
@@ -21,7 +22,8 @@
       }
     },
     mounted() {
-      this.sjqs()
+      // this.sjqs()
+      this.getWaterSjqs()
 
     },
 
@@ -35,6 +37,15 @@
           that.myEcharts()
         })
       },
+      getWaterSjqs() {
+        let that = this
+        getWaterSjqs().then(resp => {
+          console.log("偷砂采石事件分析", resp.data)
+          that.data_month = resp.data.month
+          that.data_num = resp.data.num
+          that.myEcharts()
+        })
+      },
 
       myEcharts() {
         let that = this

+ 118 - 0
src/views/bigdata/chart-farmtype.vue

@@ -0,0 +1,118 @@
+<!-- **************************************NO.9 散养户、养殖场养殖种类*************************************** -->
+<template>
+	<div class="chart-container">
+		<div id="chartPitG5" style="width: 100%; height:23vh;">
+		</div>
+	</div>
+</template>
+
+<script>
+	import * as echarts from 'echarts';
+  import {get5} from '@/api/bigdata.js'
+	export default {
+		name: 'chartPitG5',
+		data() {
+			return {
+        data: [],
+        source: [],
+				count: 0
+			}
+		},
+		mounted() {
+			// this.myEcharts()
+      this.getPitG5();
+		},
+
+		methods: {
+      getPitG5(){
+        let that = this
+        get5().then(resp =>{
+          console.log("偷钓偷捕事件分析", resp.data)
+          that.source = resp.data
+          that.data = []
+          for (let i = 0; i < resp.data.length; i++) {
+            that.data.push(resp.data[i].name)
+          }
+          // that.data_name = resp.data.name
+          // that.data_value = resp.data.value
+          that.myEcharts()
+        })
+      },
+			// 出处 http://192.144.199.210:8080/editor/index.html?chart_id=smh2KYnoCMWnT1IN
+
+			myEcharts() {
+        let that = this
+
+				var chartDom = document.getElementById('chartPitG5');
+				var myChart = echarts.init(chartDom);
+				var color = ['#37a2da','#32c5e9','#9fe6b8','#ffdb5c','#ff9f7f','#fb7293','#e7bcf3','#8378ea'];
+				var option;
+				option = {
+				    color:color,
+				    tooltip : {
+				        formatter: "{b}:{c}%"
+				    },
+
+
+				    legend: {
+						textStyle:{
+							color:'#fffff',
+							fontSize:10
+						},
+						itemWidth:15,
+				        orient: 'vertical',
+				        left: '10%',
+						top:'5%',
+				        data: that.data
+				        // data: ['一般修剪', '浇水', '除草', '绿篱修剪', '病虫害防治', '施肥', '伐除', '其他']
+				    },
+				    series: [
+				        {
+				            name: '',
+				            type: 'pie',
+				            radius: '80%',
+				            center: ['65%', '48%'],
+				            data: that.source,
+                  // data:[
+				          //       {value:40, name:'一般修剪'},
+				          //       {value:30, name:'浇水'},
+				          //       {value:25, name:'除草'},
+				          //       {value:18, name:'绿篱修剪'},
+				          //       {value:10, name:'病虫害防治'},
+				          //       {value:5, name:'施肥'},
+				          //       {value:4, name:'伐除'},
+				          //       {value:3, name:'其他'}
+				          //   ],
+				            emphasis: {
+				                itemStyle: {
+				                    shadowBlur: 10,
+				                    shadowOffsetX: 0,
+				                    shadowColor: 'rgba(0, 0, 0, 0.5)'
+				                }
+				            },
+				            label: {
+				                normal: {
+				                    show: false,
+				                }
+				            }
+				        }
+				    ]
+				};
+				option && myChart.setOption(option);
+			},
+
+		},
+
+
+	}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+	.chart-container {
+		width: 100%;
+		height: auto;
+		position: relative;
+		padding-bottom: 10px;
+		display: flex;
+	}
+</style>

+ 176 - 0
src/views/bigdata/chart-waterTotal.vue

@@ -0,0 +1,176 @@
+<!-- **************************************NO.14 泡沫液*************************************** -->
+<template>
+	<div class="chart-container">
+		<div id="chartPitG6" style="width: 100%; height:23vh;">
+		</div>
+	</div>
+</template>
+
+<script>
+	import * as echarts from 'echarts';
+  import {get6} from '@/api/bigdata.js'
+
+	export default {
+		name: 'chartPitG6',
+		data() {
+			return {
+				count: 0,
+        data_name: [],
+        data_value: [],
+			}
+		},
+		mounted() {
+		  this.getPitG6();
+		},
+
+		methods: {
+		  getPitG6(){
+        let that = this
+        get6().then(resp =>{
+          console.log("水利事件分析", resp.data)
+          that.source = resp.data
+          that.data_name = resp.data.eventtype
+          that.data_value = resp.data.num
+          that.myEcharts()
+        })
+      },
+      // 出处 http://192.144.199.210:8080/editor/index.html?chart_id=ELjN7o3m72tLtmbv
+      myEcharts() {
+        var chartDom = document.getElementById('chartPitG6');
+        var myChart = echarts.init(chartDom);
+        var option;
+        option = {
+          color: ['#3D91F7', '#61BE67'],
+          tooltip: {},
+          legend: {
+            show: true,
+            icon: "circle",
+            bottom: 30,
+            center: 0,
+            itemWidth: 14,
+            itemHeight: 14,
+            itemGap: 21,
+            orient: "horizontal",
+            data: ['a', 'b'],
+            textStyle: {
+              color: '#8C8C8C'
+            },
+          },
+
+          radar: {
+            // shape: 'circle',
+            radius: '80%',
+            triggerEvent: true,
+            name: {
+              textStyle: {
+                color: '#fff',
+                fontSize: '10',
+                borderRadius: 3,
+                padding: [3, 5]
+              }
+            },
+            nameGap: '2',
+            indicator: that.data_name,
+            // indicator: [{ //[4300, 10000, 28000, 35000, 50000, 19000, 21000]
+            //   name: '型号1',
+            //   max: 6500
+            // },
+            //   {
+            //     name: '型号2',
+            //     max: 16000
+            //   },
+            //   {
+            //     name: '型号3',
+            //     max: 30000
+            //   },
+            //   {
+            //     name: '型号4',
+            //     max: 38000
+            //   },
+            //   {
+            //     name: '型号5',
+            //     max: 52000
+            //   },
+            //   {
+            //     name: '型号6',
+            //     max: 25000
+            //   },
+            //   {
+            //     name: '型号7',
+            //     max: 25000
+            //   }
+            // ],
+            splitArea: {
+              areaStyle: {
+                color: [
+                  'rgba(222,134,85, 0.1)', 'rgba(222,134,85, 0.2)',
+                  'rgba(222,134,85, 0.4)', 'rgba(222,134,85, 0.6)',
+                  'rgba(222,134,85, 0.8)', 'rgba(222,134,85, 1)'
+                ].reverse()
+              }
+            },
+            // axisLabel:{//展示刻度
+            //     show: true
+            // },
+            axisLine: { //指向外圈文本的分隔线样式
+              lineStyle: {
+                color: 'rgba(0,0,0,0)'
+              }
+            },
+            splitLine: {
+              lineStyle: {
+                width: 2,
+                color: [
+                  'rgba(224,134,82, 0.1)', 'rgba(224,134,82, 0.2)',
+                  'rgba(224,134,82, 0.4)', 'rgba(224,134,82, 0.6)',
+                  'rgba(224,134,82, 0.8)', 'rgba(224,134,82, 1)'
+                ].reverse()
+              }
+            },
+
+          },
+
+          series: [{
+            name: '型号统计',
+            type: 'radar',
+            //areaStyle: {normal: {}},
+            areaStyle: {
+              normal: {
+                color: 'rgba(252,211,3, 0.3)'
+              }
+            },
+            symbolSize: 0,
+            lineStyle: {
+              normal: {
+                color: 'rgba(252,211,3, 1)',
+                width: 1
+              }
+            },
+            data: [{
+              value: that.data_value,
+              // value: [4300, 10000, 28000, 35000, 50000, 19000, 21000],
+              name: '型号统计',
+
+
+
+            }]
+          }]
+        };
+        option && myChart.setOption(option);
+      },
+
+		},
+
+
+	}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+	.chart-container {
+		width: 100%;
+		height: auto;
+		position: relative;
+		padding-bottom: 10px;
+		display: flex;
+	}
+</style>

+ 1 - 1
src/views/bigdata/chart-weatherStation.vue

@@ -118,7 +118,7 @@
 				              type: 'bar',
 				              yAxisIndex: 1,
 				              barWidth: "10%",
-				              data: [150, 298, 206, 75, 154]
+				              data: that.data_value
 				          }
 				      ],
 				      itemStyle: {

+ 1 - 1
src/views/bigdata/tabbar.vue

@@ -136,7 +136,7 @@
       zhxx() {
         let that = this
         getZhxx().then(resp => {
-          console.log("hhh",resp)
+          console.log("综合信息", resp.data)
           that.regionNum = resp.data.data
         })
       },

+ 1 - 1
src/views/datacenter.vue

@@ -455,7 +455,7 @@ export default {
                 '<span>' +
                 '                  <div class="d-l-con">' +
                 '                  <div class="d-l-l-text">' +
-                '                  <h4>排污口名称:' + res.data.resourceList[i].联系电话 +
+                '                  <h4>排污口名称:' + res.data.resourceList[i].name +
                 '</h4>' +
                 '                </div>' +
                 '                </div>' +

+ 886 - 0
src/views/gather.vue

@@ -0,0 +1,886 @@
+<!--信息中心-->
+<template>
+  <div class="visual-con">
+    <!--头部-->
+    <vheader></vheader>
+    <!--主体-->
+    <div class="visual-body">
+      <!-- 左侧 -->
+      <div class="leftbar w-10" :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="i-list-con h-78">
+              <div class="d-l-con-icon">
+                <div class="icon-con" :class="{on:iconCurrentIndex==item.resourceTable}"
+                     v-for="(item,index) in resourcesList"
+                     v-on:click="indentleftSetMarkers(item.resourceTable)">
+                  <div class="iconfont icon icon-normal" :class="item.icon"></div>
+                  <div class="icon-text">
+                    <h6>{{ item.count }}</h6>
+                    <h5>{{ item.resourceName }}</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>
+      <!--      <button @click="showEventInfo1" style="position: absolute; right: 50%;top: 45%;z-index: 1000;">弹层事件演示用按钮-->
+      <!--      </button>-->
+      <!-- 右侧 -->
+      <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="overflow-y" style="height: 39vh">
+                <div class="d-l-con" :class="{on:listCurrentIndex==item.deptId}"
+                     v-for="(item,index) in deptGroupList"
+                     v-on:click="indentleftByDeptIdSetMarkers(item.deptId)">
+                  <div class="d-l-l-text">
+                    <i class="i-small"></i>
+                    <h4>{{ item.deptName }}</h4>
+                  </div>
+                  <div class="d-l-l-count">{{ item.count }}</div>
+                </div>
+              </div>
+              <div class="overflow-y" style="height: 34vh;">
+                <div id="data-chart" style="width: 100%;height:34vh;"></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>
+</template>
+
+<script>
+import {
+  getWaterDataGather,
+  getResourcePoint,
+  getResourcePointByDeptId
+} from '@/api/datacenter'
+
+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' //电视墙弹窗
+
+// import echarts from 'echarts'
+let echarts = require('echarts')
+export default {
+  components: {
+    supermap,
+    vheader,
+    vBottomMenu,
+    eventLocation,
+    TVWall
+  },
+  created() {
+    /** ----------------------------------底部按钮公用组件开始------------------------------------- */
+    window.showDialog = this.showDialog
+    window.choseLayerSwitching = this.choseLayerSwitching
+    window.choseLayerSwitchingList = this.choseLayerSwitchingList
+    /** ----------------------------------底部按钮公用组件结束------------------------------------- */
+  },
+  mounted() {
+    this.getResource()
+  },
+  data() {
+    return {
+      iconCurrentIndex: '',
+      listCurrentIndex: '',
+      markersList: [],
+      iframeBoo: true,
+      open: false,
+      iframeVue: null,
+      activeName: 'info',
+      radio: '1',
+      //类型
+      resourceTable: '',
+      //左侧资源
+      resourcesList: [],
+      //右侧资源
+      deptGroupList: [],
+      source: [],
+      //左右缩进
+      indentStyle: '',
+      indentleft: '',
+      indentright: '',
+      indentText: '收起左右栏',
+      indentdisabled: false
+
+    }
+  },
+
+  methods: {
+    /** ----------------------------------底部按钮公用组件开始------------------------------------- */
+    showDialog(click) {
+      if (click == 'eventLocation') {
+        this.$refs.eventLocation.showEventLocation()
+        this.$refs.supermap.isEditableLayers = false
+        this.$refs.bottomMenu.showChild = false
+      } else if (click == 'editableLayers') {
+        this.$refs.bottomMenu.showChild = 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
+        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
+      }
+    },
+    //选择图层
+    choseLayerSwitching(url, isClear) {
+      this.$refs.supermap.layerSwitching(url, isClear)
+    },
+    //选择图层(传递数组)
+    choseLayerSwitchingList(urlList) {
+      this.$refs.supermap.layerSwitchingList(urlList)
+    },
+    /** ----------------------------------底部按钮公用组件结束------------------------------------- */
+    //数据分布chart
+    dataChat() {
+      // 基于准备好的dom,初始化echarts实例
+      let myChart = echarts.init(document.getElementById('data-chart'))
+      // 绘制图表
+      const dfColor = ['#92E1FF', '#0097FB', '#30ECA6', '#FFC227', '#FF4848']
+      myChart.setOption({
+        dataset: {
+          source: this.source
+        },
+        tooltip: {
+          trigger: 'item'
+
+        },
+        grid: {
+          top: '5%',
+          left: '2%',
+          // right: "4%",
+          bottom: '-15%',
+          width: '75%',
+          containLabel: true
+        },
+        xAxis: {
+          show: false,
+          type: 'value'
+        },
+        yAxis: {
+          type: 'category', // 不设置类目轴,抽离的dataset数据展示不出来
+          inverse: true,
+          axisLabel: {
+            show: true,
+            textStyle: {
+              color: '#5deaff',
+              fontSize: '12'
+            }
+          },
+          splitLine: {
+            show: false
+          },
+          axisTick: {
+            show: false
+          },
+          axisLine: {
+            show: false
+          }
+        },
+
+        series: [{
+
+          type: 'bar',
+          animationCurve: 'easeOutBack',
+          barWidth: 5,
+          label: {
+            show: true,
+            position: 'right',
+            offset: [0, 0],
+            color: '#88dfd5',
+            // fontSize: "12",
+            style: {
+              fill: '#fff'
+            }
+          },
+          backgroundBar: {
+            show: true,
+            style: {
+              fill: 'rgba(97,152,255,0.20)'
+            }
+          },
+          barStyle: {
+            stroke: 'rgba(41,244,236,1)'
+          },
+          gradient: {
+            color: ['rgba(41,244,236,1)', 'rgba(41,244,236,0)']
+          },
+          itemStyle: {
+            label: {
+              show: true
+            },
+            labelLine: {
+              show: false
+            },
+            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
+              offset: 0,
+              color: 'rgba(41,244,236,0)'
+            },
+              {
+                offset: 1,
+                color: 'rgba(41,244,236,.5)'
+              }
+            ]),
+            borderColor: '#a2f9f7',
+            shadowBlur: 16,
+            shadowColor: '#a2f9f7'
+          }
+        }]
+      })
+
+    },
+
+    //吉祥物收起左右框
+    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 = '收起左右栏'
+      }
+    },
+
+    // 弹层方法
+    // 弹层方法
+    showEventInfo1() {
+      this.eventInfoVisible1 = true
+    },
+    showEventInfo2() {
+      this.eventInfoVisible2 = true
+    },
+    getResource() {
+      let that = this
+      //获取左侧菜单列表
+      getWaterDataGather().then(res => {
+        that.resourcesList = res.data
+        //截取data.resourceTable字段中“_”分隔符最后一个作为关键字,重新拼接成前端需要的图标:class,格式sj-icon-xxxx,将其set回原数组
+        res.data.forEach(function(data, index) {
+          that.$set(that.resourcesList[index], 'icon', 'sj' + '-' + 'icon' + '-' + data
+            .resourceTable.split('_').slice(-1))
+        })
+        console.log(that.resourcesList)
+
+      })
+    },
+    indentleftSetMarkers(resourceTable) {
+      this.iconCurrentIndex = resourceTable
+      let that = this
+      that.resourceTable = resourceTable
+      that.markersList = []
+      that.source = []
+      //点击左侧地图落点
+      getResourcePoint(resourceTable).then(res => {
+        that.deptGroupList = res.data.deptGroupList
+        if (res.data.deptGroupList != null && res.data.deptGroupList.length > 0) {
+          for (let i = 0; i < res.data.deptGroupList.length; i++) {
+            let aa = [res.data.deptGroupList[i].deptName, res.data.deptGroupList[i].count]
+            that.source.push(aa)
+          }
+        }
+        if (res.data.resourceList != null && res.data.resourceList.length > 0) {
+          for (let i = 0; i < res.data.resourceList.length; i++) {
+            let markersMap = {
+              lng: 124.59,
+              lat: 43.02,
+              icon: 'marker',
+              bindPopupHtml: '',
+              click: '',
+              keepBindPopup: false,
+              isAggregation: false
+            }
+            if (resourceTable == 'ph') { //酸碱度
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-weatherstation'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>酸碱度:' + res.data.resourceList[i].ph +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (resourceTable == 'temperature') { //温度
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-farm'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>温度:' + res.data.resourceList[i].temperature + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (resourceTable == 'turbidity') { //浊度
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-landing'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>浊度:' + res.data.resourceList[i].turbidity +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (resourceTable == 'dissolve') { //溶解氧
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-channel'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>溶解氧:' + res.data.resourceList[i].dissolve +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (resourceTable == 'ammoniaNitrogen') { //氨氮
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-checkpoint'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>氨氮:' + res.data.resourceList[i].ammoniaNitrogen +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (resourceTable == 'orp') { //ORP
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-waterintake'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>ORP:' + res.data.resourceList[i].orp +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (resourceTable == 'flow') { //流速
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-watercrane'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>流速:' + res.data.resourceList[i].flow +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (resourceTable == 'level') { //液位
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-firehydrant'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>液位:' + res.data.resourceList[i].level +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            }
+            that.markersList.push(markersMap)
+          }
+        }
+        this.dataChat()
+        that.$refs.supermap.clearM(false)
+        that.$refs.supermap.setMarkers(that.markersList)
+      })
+    },
+    indentleftByDeptIdSetMarkers(deptId) {
+      this.listCurrentIndex = deptId
+      let that = this
+      //点击左侧地图落点
+      getResourcePointByDeptId(that.resourceTable, deptId).then(res => {
+        that.markersList = []
+        if (res.data.resourceList != null && res.data.resourceList.length > 0) {
+          for (let i = 0; i < res.data.resourceList.length; i++) {
+            let markersMap = {
+              lng: 124.59,
+              lat: 43.02,
+              icon: 'marker',
+              bindPopupHtml: '',
+              click: '',
+              keepBindPopup: false,
+              isAggregation: false
+            }
+            if (that.resourceTable == 'centerdata_t_forest_weatherstation') { //气象站
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-weatherstation'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>地址:' + res.data.resourceList[i].weatherstationAddress +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].weatherstationPerson +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].weatherstationTel +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (that.resourceTable == 'centerdata_t_forest_farm') { //林场
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-farm'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>林场名称:' + res.data.resourceList[i].farmName + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].farmPerson + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].farmTel + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (that.resourceTable == 'centerdata_t_forest_landing') { //起降点
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-landing'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>起降点名称:' + res.data.resourceList[i].landingName +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].landingPerson +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].landingTel + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (that.resourceTable == 'centerdata_t_forest_channel') { //水源渠道
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-channel'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>渠道名称:' + res.data.resourceList[i].channelName +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].channelPerson +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].channelTel + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (that.resourceTable == 'centerdata_t_forest_checkpoint') { //防火检查站
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-checkpoint'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>检查站名称:' + res.data.resourceList[i].checkpointName +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>地址:' + res.data.resourceList[i].checkpointAddress +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].checkpointPerson +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].checkpointTel +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (that.resourceTable == 'centerdata_t_forest_waterintake') { //取水口
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-waterintake'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>取水口名称:' + res.data.resourceList[i].waterintakeName +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].waterintakePerson +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].waterintakeTel +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (that.resourceTable == 'centerdata_t_forest_watercrane') { //水鹤
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-watercrane'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>水鹤名称:' + res.data.resourceList[i].watercraneName +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].watercranePerson +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].watercraneTel +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (that.resourceTable == 'centerdata_t_forest_firehydrant') { //消火栓
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-firehydrant'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>消火栓名称:' + res.data.resourceList[i].firehydrantName +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>地址:' + res.data.resourceList[i].firehydrantAddress +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].firehydrantPerson +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].firehydrantTel +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            } else if (that.resourceTable == 'centerdata_t_forest_fireteam') { //森林防火队
+              markersMap.icon = 'sj-icon-map-centerdata-t-forest-fireteam'
+              markersMap.lng = res.data.resourceList[i].longitude
+              markersMap.lat = res.data.resourceList[i].latitude
+              markersMap.bindPopupHtml = '<div class="map-tip">' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>经纬度:' + res.data.resourceList[i].longitude + ',' + res
+                  .data.resourceList[i].latitude + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>森林防火队名称:' + res.data.resourceList[i].fireteamName +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>联系人:' + res.data.resourceList[i].fireteamPerson +
+                '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span>' +
+                '<span>' +
+                '                  <div class="d-l-con">' +
+                '                  <div class="d-l-l-text">' +
+                '                  <h4>电话:' + res.data.resourceList[i].fireteamTel + '</h4>' +
+                '                </div>' +
+                '                </div>' +
+                '                </span></div>'
+            }
+            that.markersList.push(markersMap)
+          }
+        }
+        that.$refs.supermap.clearM(false)
+        that.$refs.supermap.setMarkers(that.markersList)
+      })
+    }
+
+  }
+}
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+@import '@/assets/styles/base.scss';
+</style>

+ 2 - 1
src/views/leader.vue

@@ -68,7 +68,8 @@
           <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>
+              <!--<span>巡林计划</span>-->
+              <span>巡查监测点计划</span>
               <dv-decoration-3 style="width:150px;height:15px;margin-right: 1rem;"/>
             </div>
             <div class="i-list-con h-73">

src/views/forest.vue → src/views/water.vue