diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue index bcaf8ea..4332d3e 100644 --- a/src/views/sponeScreen/HaiMianScreen/index.vue +++ b/src/views/sponeScreen/HaiMianScreen/index.vue @@ -156,33 +156,6 @@ ]); NewFiberMapUtils.removeByIds(Object.values(NewFiberMapUtils.defaultParams.keys)); if (id == 4) { - bus.emit('setIniteLayer', [ - { - layername: 'YSBZ', - show: false, - }, - { - layername: 'WSBZ', - show: false, - }, - { - layername: 'sewageFactory', - show: false, - }, - { - layername: 'ysLine1', //雨水管网 - show: false, - }, - { - layername: 'hsLine1', //合流管网 - show: false, - }, - { - layername: 'pipeline_info_flow', //管网流向 - show: false, - }, - ]); - //NewFiberMapUtils.defaultPreventWaterlogging(newfiberMap); } if (id == 5) NewFiberMapUtils.defaultPatrolDemo(newfiberMap); } @@ -210,11 +183,24 @@ //地图点击 const mapClick = (point, properties) => { console.log('地图点击---', properties); - bus.emit('popupcontent', { - popupShow: true, - point: point, - popupInfo: properties, - }); + // 管网监测点 + if (properties.type == 'pipeMonitor') { + bus.emit('pipeMonitorBus', properties); + } + if ( + properties.siteType == 'rain' || + properties.type == 'waterCourse' || + properties.type == 'YSBZ' || + properties.type == 'WSBZ' || + properties.type == 'combineBengZhan' || + properties.type == 'sewageFactory' + ) { + bus.emit('popupcontent', { + popupShow: true, + point: point, + popupInfo: properties, + }); + } }; //鼠标移入 const moveOn = (point, properties) => { diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue index bcaf8ea..4332d3e 100644 --- a/src/views/sponeScreen/HaiMianScreen/index.vue +++ b/src/views/sponeScreen/HaiMianScreen/index.vue @@ -156,33 +156,6 @@ ]); NewFiberMapUtils.removeByIds(Object.values(NewFiberMapUtils.defaultParams.keys)); if (id == 4) { - bus.emit('setIniteLayer', [ - { - layername: 'YSBZ', - show: false, - }, - { - layername: 'WSBZ', - show: false, - }, - { - layername: 'sewageFactory', - show: false, - }, - { - layername: 'ysLine1', //雨水管网 - show: false, - }, - { - layername: 'hsLine1', //合流管网 - show: false, - }, - { - layername: 'pipeline_info_flow', //管网流向 - show: false, - }, - ]); - //NewFiberMapUtils.defaultPreventWaterlogging(newfiberMap); } if (id == 5) NewFiberMapUtils.defaultPatrolDemo(newfiberMap); } @@ -210,11 +183,24 @@ //地图点击 const mapClick = (point, properties) => { console.log('地图点击---', properties); - bus.emit('popupcontent', { - popupShow: true, - point: point, - popupInfo: properties, - }); + // 管网监测点 + if (properties.type == 'pipeMonitor') { + bus.emit('pipeMonitorBus', properties); + } + if ( + properties.siteType == 'rain' || + properties.type == 'waterCourse' || + properties.type == 'YSBZ' || + properties.type == 'WSBZ' || + properties.type == 'combineBengZhan' || + properties.type == 'sewageFactory' + ) { + bus.emit('popupcontent', { + popupShow: true, + point: point, + popupInfo: properties, + }); + } }; //鼠标移入 const moveOn = (point, properties) => { diff --git a/src/views/sponeScreen/gisMF/cesiumPopup.vue b/src/views/sponeScreen/gisMF/cesiumPopup.vue index 89bb3ff..0fc3740 100644 --- a/src/views/sponeScreen/gisMF/cesiumPopup.vue +++ b/src/views/sponeScreen/gisMF/cesiumPopup.vue @@ -147,8 +147,7 @@ 搜索 - -
+
@@ -162,10 +161,10 @@ start-placeholder="开始时间" end-placeholder="结束时间" size="small" - style="width: 240px" + style="width: 200px" @change="changeDate" /> - +
@@ -210,9 +209,47 @@ getSuperViseData(); }; -// 水位计弹窗内容 +// 河道水位计弹窗内容 function changeDateSW() { - getSuperViseData(); + setTimeout(() => { + getRiverData(); + }); +} + +// 河道echarts +let chartRiver = null; +async function getRiverData() { + if (!!chartRiver) chartRiver.dispose(); + chartRiver = echarts.init(document.getElementById('chartHistoryZM')); + let params = { + startTime: allData.dateTime[0], + endTime: allData.dateTime[1], + stCode: allData.dataList['stCode'], + }; + dataOption.value = []; + let res = await graphicReport(params); + if (res && res.code == 200) { + let datas = res.data; + if (datas.propertyMonitorXList.length == 0) return; + // echarts赋值 + chartOption.floodOneMapFXYP.xAxis[0].data = datas.propertyMonitorXList; //x轴 + chartOption.floodOneMapFXYP.series[0].data = datas.propertyMonitorList[0].ylist; //当前水位 + // chartOption.floodOneMapFXYP.series[1].markLine.data[0].yAxis = 12; //设防水位 + // chartOption.floodOneMapFXYP.series[1].markLine.data[0].label.formatter = '设防水位 ' + 12 + 'm'; + let arrs2 = []; + datas.propertyMonitorXList.map(item => { + arrs2.push(22); + }); + // chartOption.floodOneMapFXYP.series[1].data = arrs2; //河床高度 + + if (datas.propertyMonitorXList.length == 0) { + chartOption.floodOneMapFXYP.graphic.invisible = false; //暂无数据 + } else { + chartOption.floodOneMapFXYP.graphic.invisible = true; //暂无数据 + } + chartRiver.clear(); + chartRiver.setOption(chartOption.floodOneMapFXYP); + } } // 降雨趋势折线图 @@ -297,7 +334,6 @@ console.log('popup接收地图标注点值---', params); allData.dataList = params.popupInfo; let pipePopupDiv = document.getElementById('cesiumPopupID'); - console.log(Terraformer.WKT.parse(allData.dataList.geometry)); let popupCenter = Terraformer.WKT.parse(allData.dataList.geometry).coordinates; window.window.pipePopup = new mapboxL7.Popup({ html: pipePopupDiv, @@ -312,7 +348,7 @@ newfiberMapbox.addPopup(pipePopup); newfiberMapbox.map.easeTo({ center: [popupCenter[0], popupCenter[1] + 0.005], - zoom: 15, + zoom: 16, }); allData.popupShow = true; if (allData.dataList.siteType == 'rain') changeDate(); //雨量站曲线图 @@ -335,14 +371,13 @@ display: none; } .cesiumPopup { - width: 500px; - height: 300px; + position: absolute; padding: 10px; background: #003b6d; border: 1px solid #6acefe; - z-index: 999; - #chartPopupRainC { - width: 100%; + #chartPopupRainC, + #chartHistoryZM { + width: 400px; height: 200px; margin-top: 10px; } @@ -372,8 +407,8 @@ } .PopupClosed { position: absolute; - margin-left: 450px; - height: 22px; + top: 15px; + right: 20px; z-index: 9999; cursor: pointer; } diff --git a/src/views/sponeScreen/HaiMianScreen/index.vue b/src/views/sponeScreen/HaiMianScreen/index.vue index bcaf8ea..4332d3e 100644 --- a/src/views/sponeScreen/HaiMianScreen/index.vue +++ b/src/views/sponeScreen/HaiMianScreen/index.vue @@ -156,33 +156,6 @@ ]); NewFiberMapUtils.removeByIds(Object.values(NewFiberMapUtils.defaultParams.keys)); if (id == 4) { - bus.emit('setIniteLayer', [ - { - layername: 'YSBZ', - show: false, - }, - { - layername: 'WSBZ', - show: false, - }, - { - layername: 'sewageFactory', - show: false, - }, - { - layername: 'ysLine1', //雨水管网 - show: false, - }, - { - layername: 'hsLine1', //合流管网 - show: false, - }, - { - layername: 'pipeline_info_flow', //管网流向 - show: false, - }, - ]); - //NewFiberMapUtils.defaultPreventWaterlogging(newfiberMap); } if (id == 5) NewFiberMapUtils.defaultPatrolDemo(newfiberMap); } @@ -210,11 +183,24 @@ //地图点击 const mapClick = (point, properties) => { console.log('地图点击---', properties); - bus.emit('popupcontent', { - popupShow: true, - point: point, - popupInfo: properties, - }); + // 管网监测点 + if (properties.type == 'pipeMonitor') { + bus.emit('pipeMonitorBus', properties); + } + if ( + properties.siteType == 'rain' || + properties.type == 'waterCourse' || + properties.type == 'YSBZ' || + properties.type == 'WSBZ' || + properties.type == 'combineBengZhan' || + properties.type == 'sewageFactory' + ) { + bus.emit('popupcontent', { + popupShow: true, + point: point, + popupInfo: properties, + }); + } }; //鼠标移入 const moveOn = (point, properties) => { diff --git a/src/views/sponeScreen/gisMF/cesiumPopup.vue b/src/views/sponeScreen/gisMF/cesiumPopup.vue index 89bb3ff..0fc3740 100644 --- a/src/views/sponeScreen/gisMF/cesiumPopup.vue +++ b/src/views/sponeScreen/gisMF/cesiumPopup.vue @@ -147,8 +147,7 @@ 搜索 - -
+
@@ -162,10 +161,10 @@ start-placeholder="开始时间" end-placeholder="结束时间" size="small" - style="width: 240px" + style="width: 200px" @change="changeDate" /> - +
@@ -210,9 +209,47 @@ getSuperViseData(); }; -// 水位计弹窗内容 +// 河道水位计弹窗内容 function changeDateSW() { - getSuperViseData(); + setTimeout(() => { + getRiverData(); + }); +} + +// 河道echarts +let chartRiver = null; +async function getRiverData() { + if (!!chartRiver) chartRiver.dispose(); + chartRiver = echarts.init(document.getElementById('chartHistoryZM')); + let params = { + startTime: allData.dateTime[0], + endTime: allData.dateTime[1], + stCode: allData.dataList['stCode'], + }; + dataOption.value = []; + let res = await graphicReport(params); + if (res && res.code == 200) { + let datas = res.data; + if (datas.propertyMonitorXList.length == 0) return; + // echarts赋值 + chartOption.floodOneMapFXYP.xAxis[0].data = datas.propertyMonitorXList; //x轴 + chartOption.floodOneMapFXYP.series[0].data = datas.propertyMonitorList[0].ylist; //当前水位 + // chartOption.floodOneMapFXYP.series[1].markLine.data[0].yAxis = 12; //设防水位 + // chartOption.floodOneMapFXYP.series[1].markLine.data[0].label.formatter = '设防水位 ' + 12 + 'm'; + let arrs2 = []; + datas.propertyMonitorXList.map(item => { + arrs2.push(22); + }); + // chartOption.floodOneMapFXYP.series[1].data = arrs2; //河床高度 + + if (datas.propertyMonitorXList.length == 0) { + chartOption.floodOneMapFXYP.graphic.invisible = false; //暂无数据 + } else { + chartOption.floodOneMapFXYP.graphic.invisible = true; //暂无数据 + } + chartRiver.clear(); + chartRiver.setOption(chartOption.floodOneMapFXYP); + } } // 降雨趋势折线图 @@ -297,7 +334,6 @@ console.log('popup接收地图标注点值---', params); allData.dataList = params.popupInfo; let pipePopupDiv = document.getElementById('cesiumPopupID'); - console.log(Terraformer.WKT.parse(allData.dataList.geometry)); let popupCenter = Terraformer.WKT.parse(allData.dataList.geometry).coordinates; window.window.pipePopup = new mapboxL7.Popup({ html: pipePopupDiv, @@ -312,7 +348,7 @@ newfiberMapbox.addPopup(pipePopup); newfiberMapbox.map.easeTo({ center: [popupCenter[0], popupCenter[1] + 0.005], - zoom: 15, + zoom: 16, }); allData.popupShow = true; if (allData.dataList.siteType == 'rain') changeDate(); //雨量站曲线图 @@ -335,14 +371,13 @@ display: none; } .cesiumPopup { - width: 500px; - height: 300px; + position: absolute; padding: 10px; background: #003b6d; border: 1px solid #6acefe; - z-index: 999; - #chartPopupRainC { - width: 100%; + #chartPopupRainC, + #chartHistoryZM { + width: 400px; height: 200px; margin-top: 10px; } @@ -372,8 +407,8 @@ } .PopupClosed { position: absolute; - margin-left: 450px; - height: 22px; + top: 15px; + right: 20px; z-index: 9999; cursor: pointer; } diff --git a/src/views/sponeScreen/waterFlood/index.vue b/src/views/sponeScreen/waterFlood/index.vue index da6f0c2..6571abb 100644 --- a/src/views/sponeScreen/waterFlood/index.vue +++ b/src/views/sponeScreen/waterFlood/index.vue @@ -54,7 +54,7 @@ import MonitorBZ from '@/views/sponeScreen/waterFlood/pumpMonitor.vue'; //泵站运行监控 import MonitorEquip from '@/views/sponeScreen/waterFlood/equipMonitor.vue'; //监测设备 import HeadRain from '@/views/sponeScreen/waterFlood/futureRain.vue'; //降雨预报 -import { onBeforeUnmount } from 'vue'; +import { nextTick, onBeforeUnmount } from 'vue'; import bus from '@/bus/index'; const { proxy } = getCurrentInstance(); @@ -92,6 +92,10 @@ wscObj.value = params; showWSC.value = true; }); + // 管网监测点 + bus.on('pipeMonitorBus', params => { + showPipe.value = true; + }); setTimeout(() => { // newfiberMap.setView({ // lng: 114.342, @@ -107,7 +111,6 @@ zoom: 12.9, pitch: 55, }); - bus.emit('setIniteLayer', [ { layername: 'YSBZ', //雨水泵站 @@ -118,6 +121,10 @@ show: false, }, { + layername: 'sewageFactory', //污水处理厂 + show: false, + }, + { layername: 'ysLine1', //雨水管网 show: false, }, @@ -143,6 +150,7 @@ onBeforeUnmount(() => { bus.off('checkBZGYT'); bus.off('checkWSCGYT'); + bus.off('pipeMonitorBus'); });