diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-water.svg b/src/icons/svg/icon-water.svg new file mode 100644 index 0000000..74281e8 --- /dev/null +++ b/src/icons/svg/icon-water.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-water.svg b/src/icons/svg/icon-water.svg new file mode 100644 index 0000000..74281e8 --- /dev/null +++ b/src/icons/svg/icon-water.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/valve.svg b/src/icons/svg/valve.svg new file mode 100644 index 0000000..30921cb --- /dev/null +++ b/src/icons/svg/valve.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-water.svg b/src/icons/svg/icon-water.svg new file mode 100644 index 0000000..74281e8 --- /dev/null +++ b/src/icons/svg/icon-water.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/valve.svg b/src/icons/svg/valve.svg new file mode 100644 index 0000000..30921cb --- /dev/null +++ b/src/icons/svg/valve.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js index e4027ad..9a5b623 100644 --- a/src/router/modules/marsMap.js +++ b/src/router/modules/marsMap.js @@ -79,7 +79,7 @@ }, { path: '/pipeTopic', name: 'PipeTopic', - component: () => import('@/views/maps/mapOverview'), + component: () => import('@/views/maps/pipeOverview'), meta: { title: '管网分布', icon: '' } }, { path: '/hcaTopic', diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-water.svg b/src/icons/svg/icon-water.svg new file mode 100644 index 0000000..74281e8 --- /dev/null +++ b/src/icons/svg/icon-water.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/valve.svg b/src/icons/svg/valve.svg new file mode 100644 index 0000000..30921cb --- /dev/null +++ b/src/icons/svg/valve.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js index e4027ad..9a5b623 100644 --- a/src/router/modules/marsMap.js +++ b/src/router/modules/marsMap.js @@ -79,7 +79,7 @@ }, { path: '/pipeTopic', name: 'PipeTopic', - component: () => import('@/views/maps/mapOverview'), + component: () => import('@/views/maps/pipeOverview'), meta: { title: '管网分布', icon: '' } }, { path: '/hcaTopic', diff --git a/src/views/maps/components/highConsequenceDialog.vue b/src/views/maps/components/highConsequenceDialog.vue new file mode 100644 index 0000000..1e3c3a4 --- /dev/null +++ b/src/views/maps/components/highConsequenceDialog.vue @@ -0,0 +1,163 @@ + + + + + + diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-water.svg b/src/icons/svg/icon-water.svg new file mode 100644 index 0000000..74281e8 --- /dev/null +++ b/src/icons/svg/icon-water.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/valve.svg b/src/icons/svg/valve.svg new file mode 100644 index 0000000..30921cb --- /dev/null +++ b/src/icons/svg/valve.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js index e4027ad..9a5b623 100644 --- a/src/router/modules/marsMap.js +++ b/src/router/modules/marsMap.js @@ -79,7 +79,7 @@ }, { path: '/pipeTopic', name: 'PipeTopic', - component: () => import('@/views/maps/mapOverview'), + component: () => import('@/views/maps/pipeOverview'), meta: { title: '管网分布', icon: '' } }, { path: '/hcaTopic', diff --git a/src/views/maps/components/highConsequenceDialog.vue b/src/views/maps/components/highConsequenceDialog.vue new file mode 100644 index 0000000..1e3c3a4 --- /dev/null +++ b/src/views/maps/components/highConsequenceDialog.vue @@ -0,0 +1,163 @@ + + + + + + diff --git a/src/views/maps/components/threatDialog.vue b/src/views/maps/components/threatDialog.vue new file mode 100644 index 0000000..5770a1b --- /dev/null +++ b/src/views/maps/components/threatDialog.vue @@ -0,0 +1,152 @@ + + + + + + diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-water.svg b/src/icons/svg/icon-water.svg new file mode 100644 index 0000000..74281e8 --- /dev/null +++ b/src/icons/svg/icon-water.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/valve.svg b/src/icons/svg/valve.svg new file mode 100644 index 0000000..30921cb --- /dev/null +++ b/src/icons/svg/valve.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js index e4027ad..9a5b623 100644 --- a/src/router/modules/marsMap.js +++ b/src/router/modules/marsMap.js @@ -79,7 +79,7 @@ }, { path: '/pipeTopic', name: 'PipeTopic', - component: () => import('@/views/maps/mapOverview'), + component: () => import('@/views/maps/pipeOverview'), meta: { title: '管网分布', icon: '' } }, { path: '/hcaTopic', diff --git a/src/views/maps/components/highConsequenceDialog.vue b/src/views/maps/components/highConsequenceDialog.vue new file mode 100644 index 0000000..1e3c3a4 --- /dev/null +++ b/src/views/maps/components/highConsequenceDialog.vue @@ -0,0 +1,163 @@ + + + + + + diff --git a/src/views/maps/components/threatDialog.vue b/src/views/maps/components/threatDialog.vue new file mode 100644 index 0000000..5770a1b --- /dev/null +++ b/src/views/maps/components/threatDialog.vue @@ -0,0 +1,152 @@ + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index ee505b9..bd2d294 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -1,18 +1,591 @@ diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-water.svg b/src/icons/svg/icon-water.svg new file mode 100644 index 0000000..74281e8 --- /dev/null +++ b/src/icons/svg/icon-water.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/valve.svg b/src/icons/svg/valve.svg new file mode 100644 index 0000000..30921cb --- /dev/null +++ b/src/icons/svg/valve.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js index e4027ad..9a5b623 100644 --- a/src/router/modules/marsMap.js +++ b/src/router/modules/marsMap.js @@ -79,7 +79,7 @@ }, { path: '/pipeTopic', name: 'PipeTopic', - component: () => import('@/views/maps/mapOverview'), + component: () => import('@/views/maps/pipeOverview'), meta: { title: '管网分布', icon: '' } }, { path: '/hcaTopic', diff --git a/src/views/maps/components/highConsequenceDialog.vue b/src/views/maps/components/highConsequenceDialog.vue new file mode 100644 index 0000000..1e3c3a4 --- /dev/null +++ b/src/views/maps/components/highConsequenceDialog.vue @@ -0,0 +1,163 @@ + + + + + + diff --git a/src/views/maps/components/threatDialog.vue b/src/views/maps/components/threatDialog.vue new file mode 100644 index 0000000..5770a1b --- /dev/null +++ b/src/views/maps/components/threatDialog.vue @@ -0,0 +1,152 @@ + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index ee505b9..bd2d294 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -1,18 +1,591 @@ diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 2e99a0e..0c774ac 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -5,7 +5,7 @@ --> @@ -36,9 +39,13 @@ import SelectButton from '@/components/SelectTool/components/selectButton' import LayoutMap from '../../layout/layoutMap' import SelectRoute from './components/selectRoute' +import ThreatDialog from './components/threatDialog' +import HighConsequenceDialog from './components/highConsequenceDialog' export default { name: 'WaterThreat', components: { + HighConsequenceDialog, + ThreatDialog, SelectRoute, LayoutMap, Map, @@ -61,7 +68,7 @@ sinkThreatShow: false, // 显示塌陷隐患位置 boardData: { name: '巡检人员', - value: 196 + value: 6 }, // 统计版展示数据 threatLevel: { '1': 'A级', @@ -79,6 +86,7 @@ { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } ], + routeData: [], // 巡检人员数据 highConsequence: [], // 高后果区列表 constructionThreatArea: [], // 第三方施工隐患列表 waterThreatArea: [], // 水保隐患列表 @@ -103,13 +111,55 @@ // this.addHcaPosition() // 添加管理处 this.addStation() + this.addRoute() // this.addStationDiv() // 添加水保隐患隐患点 // this.addWaterThreatPosition() }, // 添加巡线人员位置 addRoute() { - + const { mars3d, Cesium } = this + // 创建DIV数据图层 + var graphicLayer = new mars3d.layer.DivLayer() + this.routeLayer = graphicLayer + this.map.addLayer(graphicLayer) + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + }) + graphicLayer.bindPopup(event => { + const route = event.graphic.attr + const lastPosition = route.lineTrackingList[0] + const html = + '
姓名:' + route.name + + '
所属管理处:' + route['depname'] + + '
电话:' + route['phone'] + + '
站名:' + route['unitname'] + + '
时间:' + lastPosition.locationdate + + '
gps状态:' + lastPosition['gprs'] + '
' + return html + }) + axios.get('static/config/patrolReal.json').then((res) => { + res = res.data + if (res.code === 200) { + this.routeData = res.data + this.boardData.value = this.routeData.length + for (const route of this.routeData) { + const lastPosition = route.lineTrackingList[0] + const graphic = new mars3d.graphic.DivGraphic({ + position: [lastPosition.lon, lastPosition.lat, 10000], + style: { + html: '', + distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000), // 按视距距离显示 + horizontalOrigin: Cesium.HorizontalOrigin.CENTER, + verticalOrigin: Cesium.VerticalOrigin.CENTER + }, + attr: route, + pointerEvents: true // false时不允许拾取和触发任意鼠标事件,但可以穿透div缩放地球 + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 高后果区位置 addHcaPosition() { @@ -118,6 +168,10 @@ var graphicLayer = new mars3d.layer.DivLayer() this.hcaLayer = graphicLayer this.map.addLayer(graphicLayer) + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + this.$refs.hcaDialog.initDialog(event.graphic.attr) + }) axios.get('static/config/highConsequence.json').then((res) => { res = res.data if (res.code === 200) { @@ -133,6 +187,10 @@ // 创建DIV数据图层 var graphicLayer = new mars3d.layer.DivLayer() this.waterThreatLayer = graphicLayer + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + this.$refs.threatDialog.initDialog(event.graphic.attr) + }) this.map.addLayer(graphicLayer) axios.get('static/config/waterThreat.json').then((res) => { res = res.data @@ -149,6 +207,10 @@ // 创建DIV数据图层 var graphicLayer = new mars3d.layer.DivLayer() this.constructionThreatLayer = graphicLayer + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + this.$refs.threatDialog.initDialog(event.graphic.attr) + }) this.map.addLayer(graphicLayer) axios.get('static/config/threat.json').then((res) => { res = res.data @@ -166,23 +228,23 @@ var graphicLayer = new mars3d.layer.DivLayer() this.sinkThreatLayer = graphicLayer this.map.addLayer(graphicLayer) - axios.get('static/config/waterThreat.json').then((res) => { + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + this.$refs.threatDialog.initDialog(event.graphic.attr) + }) + axios.get('static/config/sinkThreat.json').then((res) => { res = res.data if (res.code === 200) { // 过滤掉经度为null的 this.sinkThreatArea = res.data.filter(item => item['经度'] !== null) - this.addFeatures(graphicLayer, this.sinkThreatArea, 'sinkThreat', '#fe48fe') + this.addFeatures(graphicLayer, this.sinkThreatArea, 'sinkThreat', '#2c06a1') } }) }, // 添加隐患点: type类型,arr数组, clr颜色 addFeatures(graphicLayer, arr, type, clr) { const { mars3d, Cesium } = this - // 创建DIV数据图层 - // 在layer上绑定监听事件 - graphicLayer.on(mars3d.EventType.click, function(event) { - console.log('监听layer,单击了矢量对象', event) - }) + // 创建DIV数据图层\ for (var i = 0, len = arr.length; i < len; i++) { const item = arr[i] var jd = item['经度'] @@ -216,39 +278,19 @@ }, tooltip: station.name }) - debugger graphicLayer.addGraphic(graphic) } - // const stationLayer = new mars3d.layer.ModelLayer({ - // name: '管理处', - // url: './static/gltf/output/guanlizhan.gltf', - // style: { - // scale: 20, - // heading: 90, - // minimumPixelSize: 30, - // clampToGround: true - // }, - // positions: this.manageStations.map(item => { - // return { lng: item.x, lat: item.y, alt: 0 } - // }) - // }) - // stationLayer.bindTooltip((event) => { - // const attr = event.graphic.attr - // debugger - // return attr.name - // }) - // this.stationLayer = stationLayer - // this.map.addLayer(stationLayer) }, // 选框发生变化 selectChange({ area }) { + debugger area = area === '全部' ? '' : area // 查询数据 let count = 0 - for (const hca of this.highConsequence) { + for (const item of this.routeData) { let flag = true // 标记是否合格 // 比较区域 - if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) { + if (area && item['depname'] && item['depname'].indexOf(area) === -1) { flag = false } if (flag) { @@ -344,11 +386,11 @@ if (show) { // 移除 this.stationShow = false this.map.removeLayer(this.stationLayer, true) - this.map.removeLayer(this.graphicLayer, true) + // this.map.removeLayer(this.graphicLayer, true) } else { this.stationShow = true this.addStation() - this.addStationDiv() + // this.addStationDiv() } }, showRoute(show) { diff --git a/src/icons/svg/icon-earthquake.svg b/src/icons/svg/icon-earthquake.svg new file mode 100644 index 0000000..be0e38d --- /dev/null +++ b/src/icons/svg/icon-earthquake.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-overview.svg b/src/icons/svg/icon-overview.svg index a2f9449..d8cdde2 100644 --- a/src/icons/svg/icon-overview.svg +++ b/src/icons/svg/icon-overview.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-station2.svg b/src/icons/svg/icon-station2.svg new file mode 100644 index 0000000..457cafd --- /dev/null +++ b/src/icons/svg/icon-station2.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/icon-user.svg b/src/icons/svg/icon-user.svg index fc00eca..73e8cee 100644 --- a/src/icons/svg/icon-user.svg +++ b/src/icons/svg/icon-user.svg @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file diff --git a/src/icons/svg/icon-water.svg b/src/icons/svg/icon-water.svg new file mode 100644 index 0000000..74281e8 --- /dev/null +++ b/src/icons/svg/icon-water.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/icons/svg/valve.svg b/src/icons/svg/valve.svg new file mode 100644 index 0000000..30921cb --- /dev/null +++ b/src/icons/svg/valve.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/router/modules/marsMap.js b/src/router/modules/marsMap.js index e4027ad..9a5b623 100644 --- a/src/router/modules/marsMap.js +++ b/src/router/modules/marsMap.js @@ -79,7 +79,7 @@ }, { path: '/pipeTopic', name: 'PipeTopic', - component: () => import('@/views/maps/mapOverview'), + component: () => import('@/views/maps/pipeOverview'), meta: { title: '管网分布', icon: '' } }, { path: '/hcaTopic', diff --git a/src/views/maps/components/highConsequenceDialog.vue b/src/views/maps/components/highConsequenceDialog.vue new file mode 100644 index 0000000..1e3c3a4 --- /dev/null +++ b/src/views/maps/components/highConsequenceDialog.vue @@ -0,0 +1,163 @@ + + + + + + diff --git a/src/views/maps/components/threatDialog.vue b/src/views/maps/components/threatDialog.vue new file mode 100644 index 0000000..5770a1b --- /dev/null +++ b/src/views/maps/components/threatDialog.vue @@ -0,0 +1,152 @@ + + + + + + diff --git a/src/views/maps/pipeOverview.vue b/src/views/maps/pipeOverview.vue index ee505b9..bd2d294 100644 --- a/src/views/maps/pipeOverview.vue +++ b/src/views/maps/pipeOverview.vue @@ -1,18 +1,591 @@ diff --git a/src/views/maps/routeTopic.vue b/src/views/maps/routeTopic.vue index 2e99a0e..0c774ac 100644 --- a/src/views/maps/routeTopic.vue +++ b/src/views/maps/routeTopic.vue @@ -5,7 +5,7 @@ --> @@ -36,9 +39,13 @@ import SelectButton from '@/components/SelectTool/components/selectButton' import LayoutMap from '../../layout/layoutMap' import SelectRoute from './components/selectRoute' +import ThreatDialog from './components/threatDialog' +import HighConsequenceDialog from './components/highConsequenceDialog' export default { name: 'WaterThreat', components: { + HighConsequenceDialog, + ThreatDialog, SelectRoute, LayoutMap, Map, @@ -61,7 +68,7 @@ sinkThreatShow: false, // 显示塌陷隐患位置 boardData: { name: '巡检人员', - value: 196 + value: 6 }, // 统计版展示数据 threatLevel: { '1': 'A级', @@ -79,6 +86,7 @@ { 'x': 113.038394, 'y': 35.850111, 'z': 0, 'name': '长晋管理处' }, { 'x': 111.491467, 'y': 36.064572, 'z': 0, 'name': '临汾管理处' } ], + routeData: [], // 巡检人员数据 highConsequence: [], // 高后果区列表 constructionThreatArea: [], // 第三方施工隐患列表 waterThreatArea: [], // 水保隐患列表 @@ -103,13 +111,55 @@ // this.addHcaPosition() // 添加管理处 this.addStation() + this.addRoute() // this.addStationDiv() // 添加水保隐患隐患点 // this.addWaterThreatPosition() }, // 添加巡线人员位置 addRoute() { - + const { mars3d, Cesium } = this + // 创建DIV数据图层 + var graphicLayer = new mars3d.layer.DivLayer() + this.routeLayer = graphicLayer + this.map.addLayer(graphicLayer) + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + }) + graphicLayer.bindPopup(event => { + const route = event.graphic.attr + const lastPosition = route.lineTrackingList[0] + const html = + '
姓名:' + route.name + + '
所属管理处:' + route['depname'] + + '
电话:' + route['phone'] + + '
站名:' + route['unitname'] + + '
时间:' + lastPosition.locationdate + + '
gps状态:' + lastPosition['gprs'] + '
' + return html + }) + axios.get('static/config/patrolReal.json').then((res) => { + res = res.data + if (res.code === 200) { + this.routeData = res.data + this.boardData.value = this.routeData.length + for (const route of this.routeData) { + const lastPosition = route.lineTrackingList[0] + const graphic = new mars3d.graphic.DivGraphic({ + position: [lastPosition.lon, lastPosition.lat, 10000], + style: { + html: '', + distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 2000000), // 按视距距离显示 + horizontalOrigin: Cesium.HorizontalOrigin.CENTER, + verticalOrigin: Cesium.VerticalOrigin.CENTER + }, + attr: route, + pointerEvents: true // false时不允许拾取和触发任意鼠标事件,但可以穿透div缩放地球 + }) + graphicLayer.addGraphic(graphic) + } + } + }) }, // 高后果区位置 addHcaPosition() { @@ -118,6 +168,10 @@ var graphicLayer = new mars3d.layer.DivLayer() this.hcaLayer = graphicLayer this.map.addLayer(graphicLayer) + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + this.$refs.hcaDialog.initDialog(event.graphic.attr) + }) axios.get('static/config/highConsequence.json').then((res) => { res = res.data if (res.code === 200) { @@ -133,6 +187,10 @@ // 创建DIV数据图层 var graphicLayer = new mars3d.layer.DivLayer() this.waterThreatLayer = graphicLayer + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + this.$refs.threatDialog.initDialog(event.graphic.attr) + }) this.map.addLayer(graphicLayer) axios.get('static/config/waterThreat.json').then((res) => { res = res.data @@ -149,6 +207,10 @@ // 创建DIV数据图层 var graphicLayer = new mars3d.layer.DivLayer() this.constructionThreatLayer = graphicLayer + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + this.$refs.threatDialog.initDialog(event.graphic.attr) + }) this.map.addLayer(graphicLayer) axios.get('static/config/threat.json').then((res) => { res = res.data @@ -166,23 +228,23 @@ var graphicLayer = new mars3d.layer.DivLayer() this.sinkThreatLayer = graphicLayer this.map.addLayer(graphicLayer) - axios.get('static/config/waterThreat.json').then((res) => { + graphicLayer.on(mars3d.EventType.click, event => { + console.log('监听layer,单击了矢量对象', event) + this.$refs.threatDialog.initDialog(event.graphic.attr) + }) + axios.get('static/config/sinkThreat.json').then((res) => { res = res.data if (res.code === 200) { // 过滤掉经度为null的 this.sinkThreatArea = res.data.filter(item => item['经度'] !== null) - this.addFeatures(graphicLayer, this.sinkThreatArea, 'sinkThreat', '#fe48fe') + this.addFeatures(graphicLayer, this.sinkThreatArea, 'sinkThreat', '#2c06a1') } }) }, // 添加隐患点: type类型,arr数组, clr颜色 addFeatures(graphicLayer, arr, type, clr) { const { mars3d, Cesium } = this - // 创建DIV数据图层 - // 在layer上绑定监听事件 - graphicLayer.on(mars3d.EventType.click, function(event) { - console.log('监听layer,单击了矢量对象', event) - }) + // 创建DIV数据图层\ for (var i = 0, len = arr.length; i < len; i++) { const item = arr[i] var jd = item['经度'] @@ -216,39 +278,19 @@ }, tooltip: station.name }) - debugger graphicLayer.addGraphic(graphic) } - // const stationLayer = new mars3d.layer.ModelLayer({ - // name: '管理处', - // url: './static/gltf/output/guanlizhan.gltf', - // style: { - // scale: 20, - // heading: 90, - // minimumPixelSize: 30, - // clampToGround: true - // }, - // positions: this.manageStations.map(item => { - // return { lng: item.x, lat: item.y, alt: 0 } - // }) - // }) - // stationLayer.bindTooltip((event) => { - // const attr = event.graphic.attr - // debugger - // return attr.name - // }) - // this.stationLayer = stationLayer - // this.map.addLayer(stationLayer) }, // 选框发生变化 selectChange({ area }) { + debugger area = area === '全部' ? '' : area // 查询数据 let count = 0 - for (const hca of this.highConsequence) { + for (const item of this.routeData) { let flag = true // 标记是否合格 // 比较区域 - if (area && hca['所属管理处'] && hca['所属管理处'].indexOf(area) === -1) { + if (area && item['depname'] && item['depname'].indexOf(area) === -1) { flag = false } if (flag) { @@ -344,11 +386,11 @@ if (show) { // 移除 this.stationShow = false this.map.removeLayer(this.stationLayer, true) - this.map.removeLayer(this.graphicLayer, true) + // this.map.removeLayer(this.graphicLayer, true) } else { this.stationShow = true this.addStation() - this.addStationDiv() + // this.addStationDiv() } }, showRoute(show) { diff --git a/src/views/system/resource/editResource.vue b/src/views/system/resource/editResource.vue index a824bdd..2a22a73 100644 --- a/src/views/system/resource/editResource.vue +++ b/src/views/system/resource/editResource.vue @@ -50,6 +50,11 @@ + + + + +