From c7a549da66df42d4ec5c78ddf2cc138772616941 Mon Sep 17 00:00:00 2001 From: chenyabin <Chenab123!> Date: 星期一, 19 四月 2021 14:05:46 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/develop' into develop --- src/components/BaseNav/WasteGas/PublicTabs.vue | 45 src/components/BaseNav/PublicBounced/common/echarts/EChartsDate.vue | 72 +- src/conf/layers/LayerPipeLines.js | 6 src/components/BaseNav/PublicBounced/common/PublicChart.vue | 19 src/components/layer/src/layer.vue | 65 +- src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue | 127 ++- src/components/BaseNav/WasteGas/DayData.vue | 2 src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue | 5 src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue | 217 ++++-- src/components/BaseNav/WasteGas/RealTimeEcharts.vue | 6 src/components/BaseNav/PublicBounced/common/echarts/EChartsHour.vue | 43 src/components/BaseNav/PublicBounced/common/echarts/Echarts.vue | 5 src/components/BaseNav/WasteGas/WasteGasIndex.vue | 99 +++ src/components/BaseNav/WasteSolid/PublicTable.vue | 35 src/utils/utils.js | 35 + src/components/BaseNav/WasteSolid/WasteSolidIndex.vue | 21 src/components/BaseNav/PublicBounced/common/PublicDataStandard.vue | 45 + src/components/BaseNav/WasteSolid/PublicTabs.vue | 107 +- src/components/LayerController/logic/WasteGas.js | 69 + src/components/BaseNav/PublicVideo.vue | 90 +- src/components/LayerController/service/LayerFactory.js | 30 src/components/LayerController/LayerController.vue | 2 src/components/BaseNav/PublicBounced/PublicBounced.vue | 2 src/components/LayerController/modules/LcServiceLayer.vue | 2 /dev/null | 178 ----- src/components/LayerController/logic/PipeLineAnimal.js | 42 - src/components/panel/topicSearch/SewersSelect/AnalysisChoose/PublicWay.js | 427 ++++++++++++++ src/components/panel/topicSearch/SewersSearch.vue | 4 28 files changed, 1,130 insertions(+), 670 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue index 3665692..2ab8d04 100644 --- a/src/components/BaseNav/PublicBounced/PublicBounced.vue +++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue @@ -132,7 +132,7 @@ } .public-bounced-content { - padding: 0.1rem; + padding: 0.05rem; display: flex; //align-items: center; //justify-content: space-around; diff --git a/src/components/BaseNav/PublicBounced/common/PublicChart.vue b/src/components/BaseNav/PublicBounced/common/PublicChart.vue index d4654b2..d80b3ae 100644 --- a/src/components/BaseNav/PublicBounced/common/PublicChart.vue +++ b/src/components/BaseNav/PublicBounced/common/PublicChart.vue @@ -4,17 +4,11 @@ <div class="border_corner border_corner_right_top"></div> <div class="border_corner border_corner_left_bottom"></div> <div class="border_corner border_corner_right_bottom"></div> - <ul class="tab" v-show="this.$attrs.value === 'feiqi'"> + <ul class="tab"> <li :class="active==0?'hover':''" @click='tabTaggle("ECharts",0)'>瀹炴椂鏁版嵁</li> <li :class="active==1?'hover':''" @click='tabTaggle("EChartsHour",1)'>灏忔椂鏁版嵁</li> <li :class="active==2?'hover':''" @click='tabTaggle("EChartsDate",2)'>鏃ユ暟鎹�</li> <li :class="active==3?'hover':''" @click='tabTaggle("EChartsTable",3)'>浜哄伐鏁版嵁</li> - </ul> - <ul class="tab" v-show="this.$attrs.value !== 'feiqi'"> - <li :class="active==0?'hover':''" @click='tabTaggle("EChartsRealWasteWater",0)'>瀹炴椂鏁版嵁</li> - <li :class="active==1?'hover':''" @click='tabTaggle("EChartsHourWasteWater",1)'>灏忔椂鏁版嵁</li> - <li :class="active==2?'hover':''" @click='tabTaggle("EChartsDateWasteWater",2)'>鏃ユ暟鎹�</li> - <li :class="active==3?'hover':''" @click='tabTaggle("EChartsWasteWaterTable",3)'>浜哄伐鏁版嵁</li> </ul> <div class="legend" > <span >姝e父</span> @@ -34,22 +28,13 @@ import EChartsDate from './echarts/EChartsDate' import EChartsTable from './echarts/EChartsTable' -import EChartsRealWasteWater from './echarts/EChartsRealWasteWater' -import EChartsHourWasteWater from './echarts/EChartsHourWasteWater' -import EChartsDateWasteWater from './echarts/EChartsDateWasteWater' -import EChartsWasteWaterTable from './echarts/EChartsWasteWaterTable' - export default { name: 'PublicChart', components: { EChartsHour, EChartsDate, ECharts, - EChartsTable, - EChartsRealWasteWater, - EChartsHourWasteWater, - EChartsDateWasteWater, - EChartsWasteWaterTable + EChartsTable }, data () { return { diff --git a/src/components/BaseNav/PublicBounced/common/PublicDataStandard.vue b/src/components/BaseNav/PublicBounced/common/PublicDataStandard.vue new file mode 100644 index 0000000..a1a6ef4 --- /dev/null +++ b/src/components/BaseNav/PublicBounced/common/PublicDataStandard.vue @@ -0,0 +1,45 @@ +<template> + <div class="animation"> + <div class="information"> +<!-- <span class="grid-content">姘哀鍖栫墿 : <i style="color: #e8ee0b">29.93</i> 鏍囧噯 : <i style="color: #fff">100</i></span>--> +<!-- <span class="grid-content">浜屾哀鍖栫~ : <i style="color: #e8ee0b">17.34</i> 鏍囧噯 : <i style="color: #fff">50</i></span>--> +<!-- <span class="grid-content">鐑熷皹 : <i style="color: #e8ee0b">6.93</i> 鏍囧噯 : <i style="color: #fff">30</i></span>--> +<!-- <span class="grid-content">搴熸皵娴侀噺 : <i style="color: #e8ee0b">120343.18</i></span>--> + <span class="grid-content" v-for="item in dataStandard" :key="item.current.name">{{ item.current.name }} : + <i style="color: #e8ee0b">{{ item.current.val }}</i> {{ item.standard.name ?item.standard.name+':':'' }} <i style="color: #fff">{{ item.standard.val }}</i></span> + </div> + </div> +</template> + +<script> +export default { + name: 'PublicDataStandard', + props: { + dataStandard: { + type: Array, + default: () => { + return [] + } + } + } +} +</script> + +<style lang="less" scoped> +.animation { + .information { + padding: 0.02rem 0.04rem; + + .grid-content { + font-size: 0.08rem; + background-color: #2e4967; + text-align: center; + border-radius: 0.01rem; + height: 0.15rem; + line-height: 0.15rem; + margin-right: 0.04rem; + padding: 0 0.04rem + } + } +} +</style> diff --git a/src/components/BaseNav/PublicBounced/common/echarts/EChartsDate.vue b/src/components/BaseNav/PublicBounced/common/echarts/EChartsDate.vue index d22a3ce..438dcd0 100644 --- a/src/components/BaseNav/PublicBounced/common/echarts/EChartsDate.vue +++ b/src/components/BaseNav/PublicBounced/common/echarts/EChartsDate.vue @@ -1,14 +1,7 @@ <!-- 鏃ユ暟鎹� --> <template> <div id="Tab"> - <div class="animation"> - <div class="infomation"> - <span class="grid-content">姘哀鍖栫墿 :<i style="color: #e8ee0b">29.93</i> 鏍囧噯 : 100</span> - <span class="grid-content">浜屾哀鍖栫~ : <i style="color: #e8ee0b">17.34</i> 鏍囧噯 : 50</span> - <span class="grid-content">鐑熷皹 : <i style="color: #e8ee0b">6.93</i> 鏍囧噯 : 30</span> - <span class="grid-content">搴熸皵娴侀噺 : <i style="color: #e8ee0b">120343.18</i></span> - </div> - </div> +<public-data-standard :dataStandard = "dataStandard"></public-data-standard> <div class="form-echrts"> <div class="from-search"> <div class="pickerMon"> @@ -41,30 +34,32 @@ <div style="width:5rem;height:1.5rem;" id="echarts" ref="main"> </div> </div> - <!-- 鏄庣粏寮规 --> - <el-dialog :visible.sync="dialogVisible" - :append-to-body="true" - :title="this.$attrs.value==='feiqi'?this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName:this.$attrs.getWasteWaterMonitoringDetails[0].OnLineMonEmissPointName" - width="68%" - center - v-dialogDrag - > - <div class="el-dialog-div" style="height: 500px"> - <public-detailed-list v-bind="$attrs"></public-detailed-list> - </div> - </el-dialog> +<!-- <!– 鏄庣粏寮规 –>--> +<!-- <el-dialog :visible.sync="dialogVisible"--> +<!-- :append-to-body="true"--> +<!-- :title="this.$attrs.value==='feiqi'?this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName:this.$attrs.getWasteWaterMonitoringDetails[0].OnLineMonEmissPointName"--> +<!-- width="68%"--> +<!-- center--> +<!-- v-dialogDrag--> +<!-- >--> +<!-- <div class="el-dialog-div" style="height: 500px">--> +<!-- <public-detailed-list v-bind="$attrs"></public-detailed-list>--> +<!-- </div>--> +<!-- </el-dialog>--> </div> </template> <script> import mapApi from '@/api/mapApi' -import PublicDetailedList from '@components/BaseNav/PublicBounced/common/echarts/PublicDetailedList' +// import PublicDetailedList from '@components/BaseNav/PublicBounced/common/echarts/PublicDetailedList' import dayjs from 'dayjs' +import PublicDataStandard from '@components/BaseNav/PublicBounced/common/PublicDataStandard' export default { name: 'ECharts', components: { - PublicDetailedList + PublicDataStandard + // PublicDetailedList }, data () { return { @@ -78,6 +73,23 @@ timeEnd: '' }, info: this.series, + dataStandard: [{ + current: { name: '姘哀鍖栫墿1', val: 29.93 }, + standard: { name: '鏍囧噯', val: 100 } + }, + { + current: { name: '浜屾哀鍖栫~', val: 17.34 }, + standard: { name: '鏍囧噯', val: 50 } + }, + { + current: { name: '鐑熷皹', val: 6.93 }, + standard: { name: '鏍囧噯', val: 30 } + }, + { + current: { name: '搴熸皵娴侀噺', val: 120343.18 }, + standard: { name: '', val: null } + } + ], JsonDayCharts: { id: 'mychartsDay', title: '鍔犵儹鐐夌儫姘�', @@ -695,22 +707,6 @@ </script> <style scoped lang="less"> - -.animation { - .infomation { - padding: 0.02rem 0.04rem; - .grid-content { - font-size: 0.08rem; - background-color: #2e4967; - text-align: center; - border-radius: 0.01rem; - height: 0.15rem; - line-height: 0.15rem; - margin-right: 0.04rem; - padding:0 0.04rem - } - } -} .form-echrts { width: 100%; border-top: 1px solid #396d83; diff --git a/src/components/BaseNav/PublicBounced/common/echarts/EChartsHour.vue b/src/components/BaseNav/PublicBounced/common/echarts/EChartsHour.vue index c23fb93..927e8a3 100644 --- a/src/components/BaseNav/PublicBounced/common/echarts/EChartsHour.vue +++ b/src/components/BaseNav/PublicBounced/common/echarts/EChartsHour.vue @@ -1,14 +1,7 @@ <!-- 灏忔椂鏁版嵁 --> <template> <div id="Tab"> - <div class="infomation"> - <div> - <span class="grid-content">姘哀鍖栫墿 :<i style="color: #e8ee0b">29.93</i> 鏍囧噯 : 100</span> - <span class="grid-content">浜屾哀鍖栫~ : <i style="color: #e8ee0b">17.34</i> 鏍囧噯 : 50</span> - <span class="grid-content">鐑熷皹 : <i style="color: #e8ee0b">6.93</i> 鏍囧噯 : 30</span> - <span class="grid-content">搴熸皵娴侀噺 : <i style="color: #e8ee0b">120343.18</i></span> - </div> - </div> + <public-data-standard :dataStandard = "dataStandard"></public-data-standard> <div class="form-echrts"> <div class="from-search"> <div class="pickerMon"> @@ -48,9 +41,11 @@ // import mapApi from '@/api/mapApi' import PublicDetailedList from '@components/BaseNav/PublicBounced/common/echarts/PublicDetailedList' import dayjs from 'dayjs' +import PublicDataStandard from '@components/BaseNav/PublicBounced/common/PublicDataStandard' export default { name: 'ECharts', components: { + PublicDataStandard, PublicDetailedList }, data () { @@ -64,6 +59,23 @@ timeEnd: null }, myChart: null, + dataStandard: [{ + current: { name: '姘哀鍖栫墿1', val: 29.93 }, + standard: { name: '鏍囧噯', val: 100 } + }, + { + current: { name: '浜屾哀鍖栫~', val: 17.34 }, + standard: { name: '鏍囧噯', val: 50 } + }, + { + current: { name: '鐑熷皹', val: 6.93 }, + standard: { name: '鏍囧噯', val: 30 } + }, + { + current: { name: '搴熸皵娴侀噺', val: 120343.18 }, + standard: { name: '', val: null } + } + ], JsonCtarts: { id: 'mychart', title: '鍔犵儹鐐夌儫姘�', @@ -926,21 +938,6 @@ </script> <style scoped lang="less"> - .animation { - .infomation { - padding: 0.02rem 0.04rem; - .grid-content { - font-size: 0.08rem; - background-color: #2e4967; - text-align: center; - border-radius: 0.01rem; - height: 0.15rem; - line-height: 0.15rem; - margin-right: 0.04rem; - padding:0 0.04rem - } - } - } .form-echrts { width: 100%; border-top: 1px solid #396d83; diff --git a/src/components/BaseNav/PublicBounced/common/echarts/Echarts.vue b/src/components/BaseNav/PublicBounced/common/echarts/Echarts.vue index 2be904a..7a7d07e 100644 --- a/src/components/BaseNav/PublicBounced/common/echarts/Echarts.vue +++ b/src/components/BaseNav/PublicBounced/common/echarts/Echarts.vue @@ -36,9 +36,9 @@ </div> <div class="detailbtn" @click="onSubmit">鏌ヨ</div> </div> - <div style="width:5rem;height:1.5rem;" ref="echarts"> </div> - </div> + <div style="width:5rem;height:1.5rem;" ref="echarts"> </div> </div> + </div> </template> <script> @@ -1010,6 +1010,7 @@ this.IntervalEXHRealTimeDate() }, 15000) } + } } </script> diff --git a/src/components/BaseNav/PublicVideo.vue b/src/components/BaseNav/PublicVideo.vue index f87c2bb..9a6be4f 100644 --- a/src/components/BaseNav/PublicVideo.vue +++ b/src/components/BaseNav/PublicVideo.vue @@ -1,17 +1,14 @@ <template> - <div class="win"> - <!-- 鍥涗釜瑙掔殑杈规鏁堟灉 --> - <div class="border_corner border_corner_left_top"></div> - <div class="border_corner border_corner_right_top"></div> - <div class="border_corner border_corner_left_bottom"></div> - <div class="border_corner border_corner_right_bottom"></div> - <div class="main"> - <!-- <div class="main-video">--> + <div class="public-video"> + <span></span> + <span></span> + <span></span> + <span></span> + <div class="video-content"> <video controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> </video> - <!-- </div>--> </div> </div> </template> @@ -23,58 +20,55 @@ </script> <style scoped lang="less"> -.win { + +.public-video { position: relative; background-color: rgba(33, 41, 69, 0.9); - //height: 2rem; -} + .video-content { + border: 1px solid #396d83; + width: 2.5rem; + height: 2.5rem; -.main { - border: 1px solid #396d83; - width: 2.5rem; - height: 2.5rem; - video { - width: 100%; - height: 100%; - outline: none; + video { + width: 100%; + height: 100%; + outline: none; + } } } -.border_corner { - z-index: 999; +.public-video span { + padding: 6px; + border-style: solid; + border-color: #02a6b5; +} + +.public-video span:nth-child(1) { position: absolute; - width: 14px; - height: 14px; - background: rgba(0, 0, 0, 0); - border: 1px solid #47d5ea; + left: -1px; + top: -1px; + border-width: 1px 0 0 1px; } -.border_corner_left_top { - top: 0; - left: 0; - border-right: none; - border-bottom: none; +.public-video span:nth-child(2) { + position: absolute; + right: -1px; + top: -1px; + border-width: 1px 1px 0 0; } -.border_corner_right_top { - top: 0; - right: 0; - border-left: none; - border-bottom: none; +.public-video span:nth-child(3) { + position: absolute; + right: -1px; + bottom: -1px; + border-width: 0 1px 1px 0; } -.border_corner_left_bottom { - bottom: 0; - left: 0; - border-right: none; - border-top: none; -} - -.border_corner_right_bottom { - bottom: 0; - right: 0; - border-left: none; - border-top: none; +.public-video span:nth-child(4) { + position: absolute; + left: -1px; + bottom: -1px; + border-width: 0 0 1px 1px; } </style> diff --git a/src/components/BaseNav/WasteGas/DayData.vue b/src/components/BaseNav/WasteGas/DayData.vue index 88c0c2e..ee1def1 100644 --- a/src/components/BaseNav/WasteGas/DayData.vue +++ b/src/components/BaseNav/WasteGas/DayData.vue @@ -3,7 +3,7 @@ <div id="Tab"> <div class="animation"> <div class="infomation"> - <span class="grid-content">姘哀鍖栫墿 :<i style="color: #e8ee0b">29.93</i> 鏍囧噯 : 100</span> + <span class="grid-content">姘哀鍖栫墿 :<i style="color: #e8ee0b">29.93</i> 鏍囧噯 : <i style="color: #e8ee0b">100</i> </span> <span class="grid-content">浜屾哀鍖栫~ : <i style="color: #e8ee0b">17.34</i> 鏍囧噯 : 50</span> <span class="grid-content">鐑熷皹 : <i style="color: #e8ee0b">6.93</i> 鏍囧噯 : 30</span> <span class="grid-content">搴熸皵娴侀噺 : <i style="color: #e8ee0b">120343.18</i></span> diff --git a/src/components/BaseNav/WasteGas/Index.vue b/src/components/BaseNav/WasteGas/Index.vue deleted file mode 100644 index 1db65ea..0000000 --- a/src/components/BaseNav/WasteGas/Index.vue +++ /dev/null @@ -1,160 +0,0 @@ -<template> - <div class="win"> - <div class="border_corner border_corner_left_top"></div> - <div class="border_corner border_corner_right_top"></div> - <div class="border_corner border_corner_left_bottom"></div> - <div class="border_corner border_corner_right_bottom"></div> - <ul class="tab" v-show="this.$attrs.value !== 'feiqi'"> - <li :class="active==0?'hover':''" @click='tabTaggle("EChartsRealWasteWater",0)'>瀹炴椂鏁版嵁</li> - <li :class="active==1?'hover':''" @click='tabTaggle("EChartsHourWasteWater",1)'>灏忔椂鏁版嵁</li> - <li :class="active==2?'hover':''" @click='tabTaggle("EChartsDateWasteWater",2)'>鏃ユ暟鎹�</li> - <li :class="active==3?'hover':''" @click='tabTaggle("EChartsWasteWaterTable",3)'>浜哄伐鏁版嵁</li> - </ul> - <div class="legend" > - <span >姝e父</span> - <i style=" background: #4ec99c;"></i> - <span >棰勮</span> - <i style=" background: red;"></i> - <span >瓒呮爣</span> - <i style=" background: orange;"></i> - </div> - <component :is="currentTab" v-bind="$attrs" ref="Echats"></component> - </div> -</template> - -<script> -import ECharts from './echarts/Echarts' -import EChartsHour from './echarts/EChartsHour' -import EChartsDate from './echarts/EChartsDate' -import EChartsTable from './echarts/EChartsTable' - -import EChartsRealWasteWater from './echarts/EChartsRealWasteWater' -import EChartsHourWasteWater from './echarts/EChartsHourWasteWater' -import EChartsDateWasteWater from './echarts/EChartsDateWasteWater' -import EChartsWasteWaterTable from './echarts/EChartsWasteWaterTable' - -export default { - name: 'WasteGasIndex', - components: { - EChartsHour, - EChartsDate, - ECharts, - EChartsTable, - EChartsRealWasteWater, - EChartsHourWasteWater, - EChartsDateWasteWater, - EChartsWasteWaterTable - }, - data () { - return { - currentTab: this.current(), - active: '0' - } - }, - // updated () { - // this.$refs.Echats.DrawEXHRealTimeDateChart() - // }, - methods: { - tabTaggle (taggleMenu, num) { - this.currentTab = taggleMenu - this.active = num - }, - current (currentTab) { - if (this.$attrs.value === 'feishui') { - currentTab = 'EChartsRealWasteWater' - } else { - currentTab = 'ECharts' - } - return currentTab - } - } -} - -</script> - -<style scoped lang="less"> -.win { - position: relative; - background:@background-color; - border: 0.8px solid #396d83; -} - -.border_corner { - z-index: 999; - position: absolute; - width: 10px; - height: 10px; - background: rgba(0, 0, 0, 0); - border: 1.5px solid #47d5ea; -} - -.border_corner_left_top { - top: 0; - left: 0; - border-right: none; - border-bottom: none; -} - -.border_corner_right_top { - top: 0; - right: 0; - border-left: none; - border-bottom: none; -} - -.border_corner_left_bottom { - bottom: 0; - left: 0; - border-right: none; - border-top: none; -} - -.border_corner_right_bottom { - bottom: 0; - right: 0; - border-left: none; - border-top: none; -} - -.tab { - display: flex; - border-bottom: 1px solid #396d83; - padding:0.02rem 0.04rem; -} - -.tab li { - background-color: #243a55; - line-height:0.15rem; - height: 0.15rem; - text-align: center; - border-radius: 5px; - margin-right: 0.04rem; - padding:0 0.04rem; -} -.tab li.hover, -.tab li:hover { - background-color: #0e639e; - color: #fff; - cursor: pointer; -} -.legend{ - position: absolute; - top:0.05rem; - right: 0; - display: flex; - justify-items: center; -} -.legend i { - display: block; - width: 0.2rem; - height: 0.09rem; - margin:0 0.1rem 0 0.05rem; - border-radius: 0.02rem; -} -.legend span{ - line-height: 0.09rem; - height: 0.09rem; - font-size: 0.06rem; -} - -</style> diff --git a/src/components/BaseNav/WasteGas/PublicTabs.vue b/src/components/BaseNav/WasteGas/PublicTabs.vue index a0df48a..0e27c13 100644 --- a/src/components/BaseNav/WasteGas/PublicTabs.vue +++ b/src/components/BaseNav/WasteGas/PublicTabs.vue @@ -6,40 +6,45 @@ <div class="border_corner border_corner_right_bottom"></div> <div class="main"> <div class="main-matter"> - <div> - <ul> - <!-- <li>鍦烘墍鍚嶇О:{{ setSolidWaste.StoragePlaceName }}</li>--> - <!-- <li>璐瓨鑳藉姏:{{ setSolidWaste.StorageQty }}(鍚�)</li>--> - <!-- <li>鍓╀綑璐瓨鑳藉姏:{{ setSolidWaste.SurplusFloorArea }}(鍚�)</li>--> - <!-- <li>鍗犲湴闈㈢Н(銕�):{{ setSolidWaste.DesignFloorArea }}(銕�)</li>--> - <!-- <li>鏈�杩戣串瀛樻棩鏈�:{{ setSolidWaste.StorageDate }}</li>--> - <!-- <li class="lastli"></li>--> - <li v-for="(item,index) in tabList" :key="index"></li> - </ul> - </div> + <ul> + <li>鐩戞祴鐐瑰悕绉�:{{ storagePlaceId.Name }}</li> + <li>鐢熶骇鍗曚綅:{{ storagePlaceId.porltName }}</li> + <li>鎺掓斁绫诲瀷鍚嶇О:{{ storagePlaceId.MonTypeName }}</li> + <li>鎺掓斁鍘诲悜:{{ storagePlaceId.EmissDirecti }}</li> + <li>鎺у埗绾у埆鍚嶇О:{{ storagePlaceId.ContrLevelShowName }}</li> + <li>鍐�/澶栨帓鍙�:{{ storagePlaceId.OrOutPortName }}</li> + </ul> </div> </div> </div> </template> <script> + +// import mapApi from '@/api/mapApi' + export default { name: 'GasTable', - props: ['setSolidWaste', 'value', 'setWasteGasdata', 'setWasteWaterdata'], + props: ['storagePlaceId'], data () { return { tabList: [] } }, + mounted () { + this.$nextTick(() => { + // this.getTabsData() + }) + }, methods: { - // async getTabsData () { - // // 鍩烘湰淇℃伅 鍜� 璇︾粏淇℃伅 灞曠ず鏁版嵁鎵�闇�鍙傛暟 - // const dataValue = { - // StoragePlaceId: e.layer.options.totransferData.StoragePlaceId - // } - // // 鍩烘湰淇℃伅 tabs - // const resultBasic = await mapApi.getSolidWasteBaseInfo(dataValue) - // } + async refsDataTabs (data) { + console.log(data) + // const dataValue = { + // StoragePlaceId: data + // } + // const resultBasic = await mapApi.getWasteGasDetails(dataValue) + // console.log(resultBasic) + } } } </script> diff --git a/src/components/BaseNav/WasteGas/RealTimeEcharts.vue b/src/components/BaseNav/WasteGas/RealTimeEcharts.vue index 4bd9760..af14caa 100644 --- a/src/components/BaseNav/WasteGas/RealTimeEcharts.vue +++ b/src/components/BaseNav/WasteGas/RealTimeEcharts.vue @@ -2,9 +2,9 @@ <div id="Tab"> <div class="animation"> <div class="infomation"> - <span class="grid-content">姘哀鍖栫墿 :<i style="color: #e8ee0b">29.93</i> 鏍囧噯 : 100</span> - <span class="grid-content">浜屾哀鍖栫~ : <i style="color: #e8ee0b">17.34</i> 鏍囧噯 : 50</span> - <span class="grid-content">鐑熷皹 : <i style="color: #e8ee0b">6.93</i> 鏍囧噯 : 30</span> + <span class="grid-content">姘哀鍖栫墿 : <i style="color: #e8ee0b">29.93</i> 鏍囧噯 : <i style="color: #fff">100</i></span> + <span class="grid-content">浜屾哀鍖栫~ : <i style="color: #e8ee0b">17.34s</i> 鏍囧噯 : <i style="color: #fff">50</i></span> + <span class="grid-content">鐑熷皹 : <i style="color: #e8ee0b">6.93</i> 鏍囧噯 : <i style="color: #fff">30</i></span> <span class="grid-content">搴熸皵娴侀噺 : <i style="color: #e8ee0b">5.23</i></span> </div> </div> diff --git a/src/components/BaseNav/WasteGas/WasteGasIndex.vue b/src/components/BaseNav/WasteGas/WasteGasIndex.vue new file mode 100644 index 0000000..6e5886f --- /dev/null +++ b/src/components/BaseNav/WasteGas/WasteGasIndex.vue @@ -0,0 +1,99 @@ +<template> + <public-sector> + <template v-slot:tabs> + <public-tabs ref='refsTabsData' :storagePlaceId="storagePlaceId"></public-tabs> + </template> + <template v-slot:table> + <public-echarts ref="refsTableData"></public-echarts> + </template> + <template v-slot:video> + <public-video></public-video> + </template> + </public-sector> +</template> + +<script> + +import PublicTabs from '@components/BaseNav/WasteGas/PublicTabs' +import PublicEcharts from '@components/BaseNav/PublicBounced/common/PublicChart' +import PublicVideo from '@components/BaseNav/PublicVideo' +import PublicSector from '@components/BaseNav/PublicSector' + +export default { + name: 'WasteGasIndex', + props: ['storagePlaceId'], + components: { + PublicSector, + PublicTabs, + PublicEcharts, + PublicVideo + }, + mounted () { + console.log(this.storagePlaceId) + this.$nextTick(() => { + this.refsData() + }) + }, + data () { + return {} + }, + methods: { + refsData () { + const data = this.storagePlaceId + this.$refs.refsTabsData.refsDataTabs(data) + this.$refs.refsTableData.refsDataTable(data) + } + } +} +</script> + +<style lang="less" scoped> +.public-bounced { + z-index: 2000; + position: absolute; + top: 35%; + left: 20%; + + .public-bounced-title { + cursor: move; + height: 0.1rem; + padding: 10px 0; + display: flex; + align-items: center; + justify-content: space-between; + + span { + color: #f4f7ff; + margin: 0 15px; + font-size: 14px; + } + + i { + color: #C0C4CC; + margin: 0 15px; + font-size: 22px; + cursor: pointer; + } + + i:hover { + color: #00fff6; + } + } + + .public-bounced-content { + //padding: 0.1rem; + display: flex; + //align-items: center; + //justify-content: space-around; + + .public-bounced-content-left { + //width: 4.8rem; + } + + .public-bounced-content-right { + //width: 3rem; + margin-left: 0.1rem; + } + } +} +</style> diff --git a/src/components/BaseNav/WasteGas/flueGas.js b/src/components/BaseNav/WasteGas/flueGas.js deleted file mode 100644 index 0ab51b2..0000000 --- a/src/components/BaseNav/WasteGas/flueGas.js +++ /dev/null @@ -1,178 +0,0 @@ -import { FlueGas } from '@/api/request' -import defaultImg from '@assets/images/map-pages/basenav/flugas/green_airquality_2.png' -import Setting from '@assets/images/map-pages/basenav/flugas/green_airquality_3.png' -// 鍥剧墖 - -class AddGasHelper { - constructor (options) { - this.map = options.map - this.L = window.L - this.FlueGasLayerGroup = this.L.layerGroup().addTo(this.map) - this.FlueGasPopup = null - this.L.sgis = this.L.sgis || this.L - this.FlueGasMarkersLabels = [] - this.pulseHeighLightMarker = null - } - - // 鑾峰彇鏁版嵁 - requestData (data) { - FlueGas(data).then(res => { - console.log(res) - this.DrawFlueGasContent(res.Result.DataInfo) - }).catch(err => { - console.log(err) - }) - } - - // 鏍规嵁鑾峰彇鏁版嵁 鐢诲嚭 鍐呭 - DrawFlueGasContent (data) { - // 鍥炬爣鏍峰紡鎵╁睍 - var FlueGasIcon = this.PlueGasIcon() - - // //鍔犺浇鏁版嵁鍓嶅鏋滃瓨鍦ㄥ浘灞傜粍 閭d箞娓呴櫎鎺� - if (this.FlueGasLayerGroup) { - this.FlueGasLayerGroup.clearLayers() - } - for (let i = 0; i < data.length; i++) { - // 缁忕含搴� 浣嶇疆 - const positionX = data[i].Latitude - const positionY = data[i].Longitude - - // 鍒ゆ柇 缁忕含搴︿綅缃俊鎭槸鍚﹀瓨鍦� - // if (positionX != null && positionY != null) { - // 鐢ㄤ簬 鍒ゆ柇 => 鍒ゆ柇鏄惁灞曠ず鑴夊啿鏁堟灉 => temp(涓存椂) - const determineValueOne = data[i].LongDayWarning - var determineValueTwo = data[i].StorageQty - const positionArea = [positionX, positionY] - - // 鍥炬爣灞曠ず - var iconUrl = this.PlueGasIconUrl(determineValueOne, determineValueTwo, positionArea) - var Icon = new FlueGasIcon({ iconUrl: iconUrl }) - // var url = Icon.options.iconUrl - - const marker = this.L.marker([positionX, positionY], { icon: Icon }) - // const latlngs = positionArea[2] - // // 绾� - // var polyline = this.L.polyline(latlngs, { color: 'red' }).addTo(this.map) - // console.log(polyline) - // marker.bindPopup(() => { - // return this.FlueGasPopup.$el - // }, { - // className: 's-map-popup', - // minWidth: 1548, - // closeButton: true, - // autoClose: false - // }) - // 鍒掕繃鍑虹幇 灞曠ず鏁版嵁 - marker.bindTooltip(data[i].porltName, { - permanent: true, - offset: [0, -16], - direction: 'top', - className: '' - }) - // 鐐瑰嚮 浜嬩欢 - marker.on('click', (e) => { - try { - // console.log(e) - this.EffectOfPulse(e.target.getLatLng()) - this.FlueGasPopup.setData(data[i]) - // this.FlueGasPopup.setData(data[i]) - return this.FlueGasPopup.$el - } catch (error) { - console.log(error) - } - }) - // 璁剧疆鍐呭娣诲姞鍒板浘灞� - this.FlueGasLayerGroup.addLayer(marker) - // } - } - } - - // 鐐瑰嚮杩涜鐨� 鍐呭鐨勮缃� - SetPlueGasContent (config, containerPopup) { - this.FlueGasPopup = containerPopup - } - - // 鍥炬爣鏍峰紡鎵╁睍 => 鍏夊湀 鍥炬爣鑴夊啿 - PlueGasIcon () { - return this.L.Icon.extend({ - options: { - iconSize: [50, 50], - iconAnchor: [25, 25] - } - }) - } - - // 鏍规嵁绫诲瀷杩斿洖鍥剧墖鍔犺浇url - PlueGasIconUrl (determineValueOne, determineValueTwo, position) { - var EffectOfChange - if (determineValueOne === 1 || determineValueTwo === 1) { - EffectOfChange = defaultImg - this.EffectOfPulse(position, this.FlueGasMarkersLabels, this.pulseHeighLightMarker) - } else { - EffectOfChange = Setting - } - return EffectOfChange - } - - // 鑴夊啿鏁堟灉璁剧疆瀹炵幇 - EffectOfPulse (position, markers, layerGroup) { - // // 鍖哄垎鐩存帴鎵ц 鍜屽垽鏂墽琛岀殑涓嶅悓鍖哄埆 - var differentColor = '' - if (markers) { - differentColor = '#ff0000' - } else { - differentColor = '#98FB98' - } - // 鍧愭爣鏁版嵁锛氭姤璀︿紶杩涙潵鐨勬槸鏁扮粍 / 鐐瑰嚮浼犺繘鏉ョ殑鏄痮bject - var FinalPosition = position instanceof Array ? { - lat: position[0], - lng: position[1] - } : position - // 鎻掍欢 鏁堟灉瀹炵幇 - var pulsingIcon = this.L.icon.pulse({ - iconSize: [20, 20], - color: differentColor, - fillColor: '' - }) - if (markers) { - // markers.push(this.L.marker(FinalPosition, { icon: pulsingIcon })) - // this.L.layerGroup(markers).addLayer(layerGroup) - } else { - var picGroupMarker = new this.L.FeatureGroup() - this.L.marker(FinalPosition, { icon: pulsingIcon }).addTo(picGroupMarker) - this.pulseHeighLightMarker = picGroupMarker.addTo(this.FlueGasLayerGroup) - this.PulseCountSetting() - } - } - - PulseCountSetting () { - var HeightLightTime = 5 - var PulseNumber = 5 - const pulseinterver = setInterval(() => { - if (PulseNumber > 0) { - PulseNumber-- - } else { - this.pulseClear(pulseinterver) - PulseNumber = HeightLightTime - } - }, 1000) - } - - // 娓呴櫎 鍥惧眰 - pulseClear (pulseinterver) { - clearInterval(pulseinterver) - pulseinterver = null - - if (this.PlueGasLayerGroup) { - // this.PlueGasLayerGroup.clearLayers() - } else { - this.PlueGasLayerGroup = this.L.layerGroup().addTo(this.map) - } - if ((this.pulseHeighLightMarker)) { - this.pulseHeighLightMarker.remove() - } - } -} - -export default AddGasHelper diff --git a/src/components/BaseNav/WasteSolid/PublicTable.vue b/src/components/BaseNav/WasteSolid/PublicTable.vue index 3bc0315..51b8427 100644 --- a/src/components/BaseNav/WasteSolid/PublicTable.vue +++ b/src/components/BaseNav/WasteSolid/PublicTable.vue @@ -5,7 +5,7 @@ <span></span> <span></span> <div class="main-table"> - <el-table :data="listData" style="width: 100%" height="325px" :row-class-name="tableRowClassName"> + <el-table :data="listData" style="width: 100%" height="200px" :row-class-name="tableRowClassName"> <el-table-column v-for="(item, index) in listLabel" :key="index" :prop="item.prop" :label="item.label" :show-overflow-tooltip="true"></el-table-column> </el-table> @@ -56,7 +56,7 @@ }, mounted () { this.$nextTick(() => { - this.listData.push({}, {}, {}, {}, {}, {}) + // this.listData.push(this.listData2, {}, {}, {}, {}, {}) }) }, methods: { @@ -66,7 +66,6 @@ } const result = await mapApi.getSolidWasteDetail(StoragePlaceId) this.listData = result.Result.DataInfo[0] - console.log(this.listData) }, // 闅旇棰滆壊璁剧疆 tableRowClassName ({ @@ -85,9 +84,6 @@ </script> <style lang="less" scoped> -.main-table { - border: 1px #02a6b5 solid; -} /deep/ .el-table td { border-bottom: none !important; @@ -98,8 +94,8 @@ } /deep/ .el-table td { - height: 45px !important; - line-height: 45px !important; + height: 30px !important; + line-height: 30px !important; } /deep/ .el-table tbody tr:hover > td { @@ -109,16 +105,22 @@ .slotChildTable { position: relative; background: rgba(33, 41, 69, 0.9); - //border: 1px solid red; + + .main-table { + border: 1px #396d83 solid; + } +} + +.slotChildTable span { + padding: 6px; + border-style: solid; + border-color: #02a6b5; } .slotChildTable span:nth-child(1) { position: absolute; left: -1px; top: -1px; - padding: 10px; - border-style: solid; - border-color: #02a6b5; border-width: 1px 0 0 1px; } @@ -126,9 +128,6 @@ position: absolute; right: -1px; top: -1px; - padding: 10px; - border-style: solid; - border-color: #02a6b5; border-width: 1px 1px 0 0; } @@ -136,9 +135,6 @@ position: absolute; right: -1px; bottom: -1px; - padding: 10px; - border-style: solid; - border-color: #02a6b5; border-width: 0 1px 1px 0; } @@ -146,9 +142,6 @@ position: absolute; left: -1px; bottom: -1px; - padding: 10px; - border-style: solid; - border-color: #02a6b5; border-width: 0 0 1px 1px; } diff --git a/src/components/BaseNav/WasteSolid/PublicTabs.vue b/src/components/BaseNav/WasteSolid/PublicTabs.vue index c940a49..3f58a89 100644 --- a/src/components/BaseNav/WasteSolid/PublicTabs.vue +++ b/src/components/BaseNav/WasteSolid/PublicTabs.vue @@ -1,22 +1,18 @@ <template> - <div class="win"> - <div class="border_corner border_corner_left_top"></div> - <div class="border_corner border_corner_right_top"></div> - <div class="border_corner border_corner_left_bottom"></div> - <div class="border_corner border_corner_right_bottom"></div> - <div class="main"> - <div class="main-matter"> - <div> - <ul v-for="(item,index) in setSolidWaste" :key="index"> - <li>鍦烘墍鍚嶇О:{{ item.StoragePlaceName }}</li> - <li>璐瓨鑳藉姏:{{ item.StoragePlaceName }}</li> - <li>鍓╀綑璐瓨鑳藉姏:{{ item.StorageQty }}</li> - <li>鍗犲湴闈㈢Н(銕�):{{ item.SurplusFloorArea }}</li> - <li>鏈�杩戣串瀛樻棩鏈�:{{ item.DesignFloorArea }}</li> - <li class="lastli"></li> - </ul> - </div> - </div> + <div class="slotChildTabs"> + <span></span> + <span></span> + <span></span> + <span></span> + <div class="tabs-content"> + <ul v-for="(item,index) in setSolidWaste" :key="index"> + <li>鍦烘墍鍚嶇О:{{ item.StoragePlaceName }}</li> + <li>璐瓨鑳藉姏:{{ item.StoragePlaceName }}</li> + <li>鍓╀綑璐瓨鑳藉姏:{{ item.StorageQty }}</li> + <li>鍗犲湴闈㈢Н(銕�):{{ item.SurplusFloorArea }}</li> + <li>鏈�杩戣串瀛樻棩鏈�:{{ item.DesignFloorArea }}</li> + <li class="lastli"></li> + </ul> </div> </div> </template> @@ -33,7 +29,7 @@ }, mounted () { this.$nextTick(() => { - this.refsDataTabs() + // this.refsDataTabs() }) }, methods: { @@ -50,33 +46,27 @@ <style scoped lang="less"> -.win { +.slotChildTabs { position: relative; - margin-bottom: 0.04rem; + margin-bottom: 0.1rem; background-color: @background-color; -} -.main { - - .main-matter { + .tabs-content { font-size: 0.06rem; font-weight: normal; padding: 0.04rem 0; border: 1px solid #396d83; ul { - //width: 100%; - //height: 100%; display: flex; align-items: center; justify-content: space-around; flex-wrap: wrap; - margin-bottom: -0.04rem; li { margin-bottom: 0.04rem; text-align: center; - min-width: 31%; + min-width: 30%; background-color: #243a55; color: #00d0f9; border-radius: 0.02rem; @@ -92,40 +82,43 @@ } } -.border_corner { - z-index: 999; +.slotChildTabs span:nth-child(1) { position: absolute; - width: 10px; - height: 10px; - background: rgba(0, 0, 0, 0); - border: 1px solid #47d5ea; + left: -1px; + top: -1px; + padding: 6px; + border-style: solid; + border-color: #02a6b5; + border-width: 1px 0 0 1px; } -.border_corner_left_top { - top: 0; - left: 0; - border-right: none; - border-bottom: none; +.slotChildTabs span:nth-child(2) { + position: absolute; + right: -1px; + top: -1px; + padding: 6px; + border-style: solid; + border-color: #02a6b5; + border-width: 1px 1px 0 0; } -.border_corner_right_top { - top: 0; - right: 0; - border-left: none; - border-bottom: none; +.slotChildTabs span:nth-child(3) { + position: absolute; + right: -1px; + bottom: -1px; + padding: 6px; + border-style: solid; + border-color: #02a6b5; + border-width: 0 1px 1px 0; } -.border_corner_left_bottom { - bottom: 0; - left: 0; - border-right: none; - border-top: none; -} - -.border_corner_right_bottom { - bottom: 0; - right: 0; - border-left: none; - border-top: none; +.slotChildTabs span:nth-child(4) { + position: absolute; + left: -1px; + bottom: -1px; + padding: 6px; + border-style: solid; + border-color: #02a6b5; + border-width: 0 0 1px 1px; } </style> diff --git a/src/components/BaseNav/WasteSolid/WasteSolidIndex.vue b/src/components/BaseNav/WasteSolid/WasteSolidIndex.vue index 89c6c51..4db2008 100644 --- a/src/components/BaseNav/WasteSolid/WasteSolidIndex.vue +++ b/src/components/BaseNav/WasteSolid/WasteSolidIndex.vue @@ -34,30 +34,13 @@ }) }, data () { - return { - displayContentTabs: [{ - StoragePlaceId: 0, - StoragePlaceName: '鍙栨按鍗曞厓骞叉偿鏆傚瓨搴�', - DesignFloorArea: 0.024, - StorageQty: 0.016, - SurplusFloorArea: 0.018, - StorageDate: '2021-01-17' - }] - } + return {} }, methods: { refsData () { const data = this.storagePlaceId this.$refs.refsTabsData.refsDataTabs(data) this.$refs.refsTableData.refsDataTable(data) - }, - // 鍥哄簾鐩稿叧淇℃伅璁剧疆 - setData (title, dataBasic, dataDetailed, value) { - this.flag = true - this.value = value - this.displayContentTitle = title - this.displayContentTab = dataBasic[0] - this.displayContentTable = dataDetailed[0] } } } @@ -97,7 +80,7 @@ } .public-bounced-content { - padding: 0.1rem; + //padding: 0.1rem; display: flex; //align-items: center; //justify-content: space-around; diff --git a/src/components/LayerController/LayerController.vue b/src/components/LayerController/LayerController.vue index 027798e..3a49054 100644 --- a/src/components/LayerController/LayerController.vue +++ b/src/components/LayerController/LayerController.vue @@ -283,7 +283,7 @@ color:@color; } .legend-content{ - width: 1.79167rem; + //width: 1.79167rem; } } diff --git a/src/components/LayerController/logic/PipeLineAnimal.js b/src/components/LayerController/logic/PipeLineAnimal.js index f712d96..e9cabbe 100644 --- a/src/components/LayerController/logic/PipeLineAnimal.js +++ b/src/components/LayerController/logic/PipeLineAnimal.js @@ -11,20 +11,22 @@ for (var i = 0; i < layers.length; i++) { const config = layers[i] const code = config.code + const styles = config.styles // window.layerFactory.show(config) const layer = window.layerFactory.layers[code] if (layer) { if (layer.eachLayer) { layer.eachLayer(function (layer) { + var newStyles = Object.assign(STYLES, styles) layer.setStyle({ - fill: STYLES.FILL, - weight: STYLES.WEIGHT, - fillColor: STYLES.FILL_COLOR, - color: STYLES.COLOR, - fillOpacity: STYLES.FILL_OPACITY, - opacity: STYLES.OPACITY, - dashArray: STYLES.DASH_ARRAY, - dashSpeed: STYLES.DASH_SPPED + fill: newStyles.FILL, + weight: newStyles.WEIGHT, + fillColor: newStyles.FILL_COLOR, + color: newStyles.COLOR, + fillOpacity: newStyles.FILL_OPACITY, + opacity: newStyles.OPACITY, + dashArray: newStyles.DASH_ARRAY, + dashSpeed: newStyles.DASH_SPPED }) }) // 閲嶆柊娣诲姞鍒板湴鍥句笂锛屽姩鐢绘墠鏈夋晥鏋� @@ -33,33 +35,9 @@ } } } - /* window.$layer.iframe({ - content: { - content: publicBounced, - parent: this, - data: { - info: this.info, - fn: () => { - alert(1) - } - } - }, - area: ['901px', '101px'], - title: '杩欐槸涓�涓爣棰樿繖鏄竴涓爣棰樿繖鏄竴涓爣棰樿繖鏄竴涓爣棰�', - maxmin: true, - shade: false, - shadeClose: false, - scrollbar: false, - resize: true, - btn: ['a', 'b'], - cancel: () => { - alert(2110) - } - }) */ } this.destory = () => { - console.log('destory!!!') const layers = LayerPipeLines.layers for (var i = 0; i < layers.length; i++) { const config = layers[i] diff --git a/src/components/LayerController/logic/WasteGas.js b/src/components/LayerController/logic/WasteGas.js index 022588c..60bf0ef 100644 --- a/src/components/LayerController/logic/WasteGas.js +++ b/src/components/LayerController/logic/WasteGas.js @@ -11,7 +11,8 @@ // const ImagBright = '/assets/images/map/exhaust/fq_bright_green.png' const mapApi = require('../../../api/mapApi').default -const publicBounced = require('../../BaseNav/PublicBounced/PublicBounced').default +// const publicBounced = require('../../BaseNav/PublicBounced/PublicBounced').default +const WasteGasIndex = require('../../BaseNav/WasteGas/WasteGasIndex').default // const WasteGasChats = require('./WasteGasChats').default module.exports = function () { /** @@ -61,34 +62,48 @@ const dataValue = { StoragePlaceId: e.layer.options.test.StoragePlaceId } - console.log(dataValue) - const GasOnlinedata = { - onLineMonEmissPointId: '23', - monItemId: '28,31', - beginTime: '2020-04-06 15:13:20', - endTime: '2020-04-07 15:13:20', - dataType: '1' - } - const GasManualData = { - companyId: '3900100145', - labMonPointId: '219', - beginTime: '2020-04-06 15:13:20', - endTime: ' 2020-04-07 15:13:20' - } - const ManualData = await mapApi.getWasteGasManualData(GasManualData) - console.log(ManualData) - const Mondata = await mapApi.getWasteGasMonData(GasOnlinedata) - // console.log(Mondata) + // console.log(e.layer.options.test.EpsGisMonPointId) + const title = e.layer.options.test.Name + const res = e.layer.options.test + console.log(res) + // const GasOnlinedata = { + // onLineMonEmissPointId: '23', + // monItemId: '28,31', + // beginTime: '2020-04-06 15:13:20', + // endTime: '2020-04-07 15:13:20', + // dataType: '1' + // } + // const GasManualData = { + // companyId: '3900100145', + // labMonPointId: '219', + // beginTime: '2020-04-06 15:13:20', + // endTime: ' 2020-04-07 15:13:20' + // } + // const ManualData = await mapApi.getWasteGasManualData(GasManualData) + // console.log(ManualData) + // const Mondata = await mapApi.getWasteGasMonData(GasOnlinedata) + // // console.log(Mondata) const result = await mapApi.getWasteGasDetails(dataValue) - // console.log(result.Result.DataInfo) - const PublicBounced = window.Vue.extend(publicBounced) - const instance = new PublicBounced() - // console.log(e.layer.options.test) - instance.$mount() - document.body.appendChild(instance.$el) - instance.setGasData(e.layer.options.test, result.Result.DataInfo, Mondata.Result.DataInfo, ManualData.Result.DataInfo, 'feiqi') + console.log(result.Result.DataInfo) + // const PublicBounced = window.Vue.extend(publicBounced) + // const instance = new PublicBounced() + // // console.log(e.layer.options.test) + // instance.$mount() + // document.body.appendChild(instance.$el) + // instance.setGasData(e.layer.options.test, result.Result.DataInfo, Mondata.Result.DataInfo, ManualData.Result.DataInfo, 'feiqi') + window.$layer.open({ + content: { + content: WasteGasIndex, // 缁勪欢 + parent: this, // 鐖剁粍浠� + data: { // 浼犻�掔殑鍙傛暟 + storagePlaceId: res + } + }, + title: title // 鏍囬 + }) + // console.log(e.layer.options.totransferData.EpsGisMonPointId) this.setPanTo(e.latlng, 150) - console.log(e.latlng) + // console.log(e.latlng) } // 涓嶅悓绫诲瀷鍥剧墖鍔犺浇 this.differentTypes = (ContrLevel) => { diff --git a/src/components/LayerController/modules/LcServiceLayer.vue b/src/components/LayerController/modules/LcServiceLayer.vue index 153db9d..961561c 100644 --- a/src/components/LayerController/modules/LcServiceLayer.vue +++ b/src/components/LayerController/modules/LcServiceLayer.vue @@ -95,7 +95,7 @@ .wms-panel-scrollbar{ height: 457px; - width: 100%; + width: 2.5rem; font-size: 14px; } .layerbox { diff --git a/src/components/LayerController/service/LayerFactory.js b/src/components/LayerController/service/LayerFactory.js index d475fb6..9b05042 100644 --- a/src/components/LayerController/service/LayerFactory.js +++ b/src/components/LayerController/service/LayerFactory.js @@ -2,7 +2,7 @@ import BusiLayerService from './BusiLayerService' import WmsLayerService from './WmsLayerService' import EventLayerService from './EventLayerService' - +import { clone } from '../../../utils/utils' class LayerFactory { constructor (options) { this.L = options.L @@ -112,15 +112,37 @@ hide (config) { var layer = this.layers[config.code] layer && this.map.removeLayer(layer) - this.load(config) + // this.load(config) } toggle (code) { } - flyByLayerId (code, id) { - const layer = this.layers[code] + /** + * + * 鏍规嵁浼犵殑 feature瀵硅薄瀹氫綅 + * @param code + * @param feature + */ + flyByFeature (feature, code) { + const type = feature.geometry.type + var point = [] + switch (type) { + case 'Point': + point = clone(feature.geometry.coordinates) + break + case 'MultiLineString': + var coordinates = feature.geometry.coordinates + point = clone(coordinates[parseInt(coordinates.length / 2)][0]) + break + } + window.map.flyTo(point.reverse(), 15) + code && this.openPopup(code, feature.id) + } + + openPopup (layerId, id) { + const layer = this.layers[layerId] if (layer.eachLayer) { layer.eachLayer(function (layer) { diff --git a/src/components/layer/src/layer.vue b/src/components/layer/src/layer.vue index e726598..2b233d7 100644 --- a/src/components/layer/src/layer.vue +++ b/src/components/layer/src/layer.vue @@ -1,7 +1,7 @@ <template> <div class="public-bounced map-background" v-drag :style="style"> <div class="public-bounced-title panel-title" ref="publicBounced"> - <span>{{title}}</span> + <span>{{ title }}</span> <i class="el-icon-circle-close" @click="close"></i> </div> <div class="public-bounced-content" :id="id"> @@ -27,8 +27,7 @@ } } }, - computed: { - }, + computed: {}, mounted () { }, methods: { @@ -71,11 +70,11 @@ </script> <style lang="less" scoped> - .public-bounced { - z-index: 2000; - position: absolute; - top: 35%; - left: 20%; +.public-bounced { + z-index: 2000; + position: absolute; + top: 35%; + left: 20%; .public-bounced-title { cursor: move; @@ -85,38 +84,38 @@ align-items: center; justify-content: space-between; - span { - color: #f4f7ff; - margin: 0 15px; - font-size: 14px; - } + span { + color: #f4f7ff; + margin: 0 15px; + font-size: 14px; + } - i { - color: #C0C4CC; - margin: 0 15px; - font-size: 22px; - cursor: pointer; - } + i { + color: #C0C4CC; + margin: 0 15px; + font-size: 22px; + cursor: pointer; + } - i:hover { - color: #00fff6; - } + i:hover { + color: #00fff6; + } } .public-bounced-content { - padding: 0.1rem; + //padding: 0.1rem; display: flex; - //align-items: center; - //justify-content: space-around; + //align-items: center; + //justify-content: space-around; - .public-bounced-content-left { - //width: 4.8rem; - } + .public-bounced-content-left { + //width: 4.8rem; + } - .public-bounced-content-right { - //width: 3rem; - margin-left: 0.1rem; + .public-bounced-content-right { + //width: 3rem; + margin-left: 0.1rem; + } } - } - } +} </style> diff --git a/src/components/panel/topicSearch/SewersSearch.vue b/src/components/panel/topicSearch/SewersSearch.vue index 006b073..e44b703 100644 --- a/src/components/panel/topicSearch/SewersSearch.vue +++ b/src/components/panel/topicSearch/SewersSearch.vue @@ -142,9 +142,7 @@ } }, handleLocation (val) { - const bound = this.L.geoJSON([val], {}).getBounds() - window.map.flyToBounds(bound) - window.layerFactory.flyByLayerId(this.form.dataType.code, val.id) + window.layerFactory.flyByFeature(val, this.form.dataType.code) // layer && layer.openPopup() }, btnAffiliatedFacilities (item) { diff --git a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue index 89504b1..7eb985a 100644 --- a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue +++ b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue @@ -1,90 +1,109 @@ <template> <div class="connectivity"> <el-row> - <el-button type="primary" size="mini">璧峰绠℃</el-button> - <el-button type="primary" size="mini">缁撴潫绠℃</el-button> - <el-button type="primary" size="mini">杩為�氭�у垎鏋�</el-button> - <el-button type="primary" size="mini">娓呴櫎</el-button> + <el-button type="primary" size="mini" @click="linkClickStart" title="鍦板浘涓婄偣鍑婚�夋嫨闇�瑕佽繘琛岃繛閫氬垎鏋愮殑绠℃">璧峰绠℃</el-button> + <el-button type="primary" size="mini" @click="linkClickEnd" title="鍦板浘涓婄偣鍑讳笌鎵�閫夌娈佃繛閫氱娈�">缁撴潫绠℃</el-button> + <el-button type="primary" size="mini" @click="linkQuery" title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">杩為�氭�у垎鏋�</el-button> + <el-button type="primary" size="mini" @click="linkClear" title="鏍规嵁璧峰銆佺粨鏉熺娈佃繘琛岃繛閫氭�у垎鏋�">娓呴櫎</el-button> </el-row> <el-card class="box-card"> - <span class="clearfix">璧峰绠℃</span> - <el-table - :data="tableData" - style="width: 100%"> - <el-table-column - prop="date" - label="绠$嚎绫诲瀷"> - </el-table-column> - <el-table-column - prop="name" - label="绠$嚎鍚嶇О"> - </el-table-column> - <el-table-column - prop="province" - label="璧风偣缂栧彿"> - </el-table-column> - <el-table-column - prop="city" - label="缁堢偣缂栧彿"> - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔"> - </el-table-column> - </el-table> - <span class="clearfix">缁撴潫绠℃</span> - <el-table - :data="tableData" - style="width: 100%"> - <el-table-column - prop="date" - label="绠$嚎绫诲瀷"> - </el-table-column> - <el-table-column - prop="name" - label="绠$嚎鍚嶇О"> - </el-table-column> - <el-table-column - prop="province" - label="璧风偣缂栧彿"> - </el-table-column> - <el-table-column - prop="city" - label="缁堢偣缂栧彿"> - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔"> - </el-table-column> - </el-table> - <span class="clearfix">鍒嗘瀽缁撴灉</span> - <el-table - :data="tableData" - style="width: 100%"> - <el-table-column - prop="date" - label="绠$嚎绫诲瀷"> - </el-table-column> - <el-table-column - prop="name" - label="绠$嚎鍚嶇О"> - </el-table-column> - <el-table-column - prop="province" - label="璧风偣缂栧彿"> - </el-table-column> - <el-table-column - prop="city" - label="缁堢偣缂栧彿"> - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔"> - </el-table-column> - </el-table> + <el-scrollbar style="height:2rem"> + <span class="clearfix">璧峰绠℃</span> + <el-table + ref="singleTable" + highlight-current-row + :data="tableData" + max-height="200" + style="width: 100%" size="mini"> + <el-table-column + prop="lineloopna" + label="绠$嚎绫诲瀷" + > + </el-table-column> + <el-table-column + sortable + width="100" + prop="pipecode" + label="绠$嚎鍚嶇О" + > + </el-table-column> + <el-table-column + sortable + width="100" + prop="startpoint" + label="璧风偣缂栧彿" + > + </el-table-column> + <el-table-column + sortable + width="100" + prop="endpointnu" + label="缁堢偣缂栧彿" + > + </el-table-column> + <el-table-column + class-name="fixed-tablea" + fixed="right" + label="鎿嶄綔" + > + <template slot-scope="scope"> + <el-button @click="linkSelectStart(scope.row)" type="text" size="small">閫夋嫨</el-button> + </template> + </el-table-column> + </el-table> + <span class="clearfix">缁撴潫绠℃</span> + <el-table + :data="tableData" + style="width: 100%"> + <el-table-column + prop="date" + label="绠$嚎绫诲瀷"> + </el-table-column> + <el-table-column + prop="name" + label="绠$嚎鍚嶇О"> + </el-table-column> + <el-table-column + prop="province" + label="璧风偣缂栧彿"> + </el-table-column> + <el-table-column + prop="city" + label="缁堢偣缂栧彿"> + </el-table-column> + <el-table-column + class-name="fixed-table" + fixed="right" + label="鎿嶄綔"> + </el-table-column> + </el-table> + <span class="clearfix">鍒嗘瀽缁撴灉</span> + <el-table + :data="tableData" + style="width: 100%"> + <el-table-column + prop="date" + label="绠$嚎绫诲瀷"> + </el-table-column> + <el-table-column + prop="name" + label="绠$嚎鍚嶇О"> + </el-table-column> + <el-table-column + prop="province" + label="璧风偣缂栧彿"> + </el-table-column> + <el-table-column + prop="city" + label="缁堢偣缂栧彿"> + </el-table-column> + <el-table-column + class-name="fixed-table" + fixed="right" + label="鎿嶄綔"> + </el-table-column> + </el-table> + </el-scrollbar> </el-card> </div> </template> @@ -94,11 +113,45 @@ name: 'Connectivity', data () { return { + // 杩為�氭�� + linkType: 1, // 1 杩為�氭�ц捣濮嬬娈� 0 杩為�氭�х粨鏉熺娈� 鐢ㄦ潵鍒ゆ柇鏄偣鍑讳簡璧峰 杩樻槸缁撴潫绠℃ tableData: [] + } + }, + methods: { + // 鍦板浘鐐瑰嚮璧峰绠℃ + linkClickStart () { + console.log('鍦板浘鐐瑰嚮璧峰绠℃') + this.linkType = 1 + // this.selectPipeLine() + }, + // 鍦板浘鐐瑰嚮缁撴潫绠℃ + linkClickEnd () { + console.log('鍦板浘鐐瑰嚮缁撴潫绠℃') + this.linkType = 0 + // this.selectPipeLine() + }, + // 杩為�氭�у垎鏋� + linkQuery () { + console.log('鐐瑰嚮杩為�氭�у垎鏋�') + }, + // 娓呴櫎鍔熻兘 + linkClear () { + console.log('鐐瑰嚮娓呴櫎') + }, + // 閫夋嫨璧峰绠℃ + linkSelectStart () { + console.log('閫夋嫨璧峰绠℃') } } } </script> <style lang="less" scoped> +/deep/ .fixed-tablea { + background: rgba(0, 16, 30, 1) !important; +} +/deep/ .el-table__fixed-right::before { + background: none; +} </style> diff --git a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/PublicWay.js b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/PublicWay.js new file mode 100644 index 0000000..63d8e26 --- /dev/null +++ b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/PublicWay.js @@ -0,0 +1,427 @@ +// export default { +// handleClick (tab, event) { +// console.log(tab, event) +// this.clearLinkPipe() +// this.clearLX() +// this.linkClear() +// this.jdmClear() +// this.bgFm = [] +// this.bgPipeLine = [] +// this.tableData = [] +// this.tableDataLiuxiang = [] +// this.tableDataLinkStart = [] +// this.tableDataLinkEnd = [] +// this.tableDataLinkResult = [] +// }, +// linkClickStart () { +// console.log('鍦板浘鐐瑰嚮璧峰绠℃') +// this.linkType = 1 +// this.selectPipeLine() +// }, +// linkClickEnd () { +// console.log('鍦板浘鐐瑰嚮缁撴潫绠℃') +// this.linkType = 0 +// this.selectPipeLine() +// }, +// linkSelectStart (e) { +// console.log('閫夋嫨璧峰绠℃') +// console.log(e) +// this.$refs.singleTable.setCurrentRow(e) +// this.currentSelectStart = e +// if (this.currentSelectStartLine != null) { +// this.currentSelectStartLine.remove() +// this.currentSelectStartLine = null +// } +// const geom = JSON.parse(e.geomText) +// this.currentSelectStartLine = L.geoJSON(geom, { +// style: function (feature) { +// return { color: 'rgba(0,255,0,.6)' } +// } +// }).addTo(this.map) +// this.map.panInsideBounds(this.currentSelectStartLine.getBounds()) +// }, +// linkSelectEnd (e) { +// console.log('閫夋嫨缁撴潫绠℃') +// console.log(e) +// this.currentSelectEnd = e +// +// if (this.currentSelectEndLine != null) { +// this.currentSelectEndLine.remove() +// this.currentSelectEndLine = null +// } +// +// const geom = JSON.parse(e.geomText) +// this.currentSelectEndLine = L.geoJSON(geom, { +// style: function (feature) { +// return { color: 'rgba(200,0,200,.6)' } +// } +// }).addTo(this.map) +// this.map.panInsideBounds(this.currentSelectEndLine.getBounds()) +// }, +// linkResultSelect (e) { +// console.log('杩為�氭�у垎鏋愮粨鏋滃垪琛ㄧ偣鍑�') +// console.log(e) +// +// const geom = JSON.parse(e.geomText) +// if (this.currentSelectResultLine != null) { +// this.currentSelectResultLine.remove() +// this.currentSelectResultLine = null +// } +// this.currentSelectResultLine = L.geoJSON(geom, { +// style: function (feature) { +// return { +// color: 'rgba(255,0,0,.6)', +// weight: 6 +// } +// } +// }).addTo(this.map) +// this.map.panInsideBounds(this.currentSelectResultLine.getBounds()) +// }, +// // 杩為�氭�ф煡璇� +// async linkQuery () { +// this.tableDataLinkResult = [] +// if (this.linkPipeline.length > 1) { +// this.linkPipeline.forEach((itm) => { +// itm.remove() +// }) +// this.linkPipeline = [] +// } +// if (this.currentSelectStart === null || this.currentSelectEnd === null) { +// this.$message('璇烽�夋嫨璧峰绠℃鍜岀粨鏉熺娈�') +// return +// } +// const param = { +// startLineID: this.currentSelectStart.id, +// endLineID: this.currentSelectEnd.id +// } +// +// const res = await api.findConnectedPipelines(param) +// +// if (res.data.length === 0) { +// this.$message('娌℃湁鎵惧埌杩為�氱殑绠℃') +// this.currentLinkIsTrue = '涓嶈繛閫�' +// return +// } +// this.tableDataLinkResult = res.data +// this.currentLinkIsTrue = '杩為��' +// const linkPipe = [] +// res.data.forEach((itm, idx) => { +// const geom = JSON.parse(itm.geomText) +// const points = [] +// geom.coordinates.forEach((it, id) => { +// points.push(it.reverse()) +// }) +// +// linkPipe.push(points) +// }) +// +// linkPipe.forEach((itm, idx) => { +// const param1 = { +// points: itm, +// option: { +// dashArray: '15 15', +// dashSpeed: -30, +// color: '#ffff00' +// } +// } +// const line = main.createFlowLine(param1) +// this.linkPipeline.push(line) +// }) +// }, +// +// linkClear () { +// if (this.currentSelectStartLine != null) { +// this.currentSelectStartLine.remove() +// this.currentSelectStartLine = null +// } +// if (this.currentSelectEndLine != null) { +// this.currentSelectEndLine.remove() +// this.currentSelectEndLine = null +// } +// if (this.currentSelectResultLine != null) { +// this.currentSelectResultLine.remove() +// this.currentSelectResultLine = null +// } +// if (this.bgMarker != null) { +// this.bgMarker.remove() +// this.bgMarker = null +// } +// }, +// lxResultSelect () { +// console.log('杩為�氭�у垎鏋愮粨鏋滃垪琛ㄧ偣鍑�') +// console.log(e) +// +// const geom = JSON.parse(e.geomText) +// if (this.currentSelectResultLine != null) { +// this.currentSelectResultLine.remove() +// this.currentSelectResultLine = null +// } +// this.currentSelectResultLine = L.geoJSON(geom, { +// style: function (feature) { +// return { color: 'rgba(0,250,255,.6)' } +// } +// }).addTo(this.map) +// this.map.panInsideBounds(this.currentSelectResultLine.getBounds()) +// }, +// async lxQuery (e) { +// this.clearLinkPipe() +// const param = { +// lineNodeID: e.startpoint +// } +// const res = await api.findFlowDirection(param) +// +// this.lxTableDataResult = res.data +// const linkPipe = [] +// res.data.forEach((itm, idx) => { +// const geom = JSON.parse(itm.geomText) +// const points = [] +// geom.coordinates.forEach((it, id) => { +// points.push(it.reverse()) +// }) +// +// linkPipe.push(points) +// }) +// +// linkPipe.forEach((itm, idx) => { +// const param1 = { +// points: itm, +// option: { +// dashArray: '15 15', +// dashSpeed: -30, +// color: '#ffff00' +// } +// } +// const line = main.createFlowLine(param1) +// this.linkPipeline.push(line) +// }) +// }, +// +// bgClick () { +// this.selectPipeLine() +// }, +// async bgSelect (e) { +// console.log('閫夋嫨鐖嗙绠℃') +// console.log(e) +// this.bgFm = [] +// if (this.bgMarker != null) { +// this.bgMarker.remove() +// this.bgMarker = null +// } +// +// if (this.currentSelectEndLine != null) { +// this.currentSelectEndLine.remove() +// this.currentSelectEndLine = null +// } +// this.clearLinkPipe() +// const geom = JSON.parse(e.geomText) +// this.currentSelectEndLine = L.geoJSON(geom, { +// style: function (feature) { +// return { color: 'rgba(200,0,200,.6)' } +// } +// }).addTo(this.map) +// this.map.panInsideBounds(this.currentSelectEndLine.getBounds()) +// +// const param = { +// lineID: e.id +// } +// const res = await api.findLeakages(param) +// console.log(res) +// +// const len = res.data.length +// if (len === 0) { +// this.$message('鏈壘鍒伴渶瑕佸叧闂殑闃�闂�') +// +// return +// } +// res.data.reverse() +// this.bgFm = res.data +// +// this.bgPoint = res.data[0].startControlPoint +// +// const point = JSON.parse(this.bgPoint.geomText) +// +// const p = [point.coordinates[1], point.coordinates[0]] +// +// this.bgMarker = main.createFlowMarker(p) +// this.bgMarker.bindTooltip(this.bgPoint.pointnumbe) +// this.bgMarker.addTo(this.map) +// this.map.flyTo(p) +// +// const linkPipe = [] +// res.data.forEach((itm, idx) => { +// const geom = JSON.parse(itm.geomText) +// const points = [] +// geom.coordinates.forEach((it, id) => { +// points.push(it.reverse()) +// }) +// +// linkPipe.push(points) +// }) +// +// linkPipe.forEach((itm, idx) => { +// const param1 = { +// points: itm, +// option: { +// dashArray: '15 15', +// dashSpeed: -30, +// color: '#ffff00' +// } +// } +// const line = main.createFlowLine(param1) +// this.linkPipeline.push(line) +// }) +// }, +// bgFmClick (e) { +// console.log('鐐瑰嚮褰卞搷鐨勯榾闂�') +// console.log(e) +// const point = [e.data[0][0], e.data[0][1]] +// const marker = main.createFlowMarker(point) +// marker.addTo(this.map) +// this.map.flyTo(point, 16) +// }, +// // 娴佸悜鍦板浘涓婄偣鍑� +// selectPipeLine () { +// this.map.on('click', this.selectClick) +// }, +// // 鍦板浘涓婄偣鍑诲洖璋� +// selectClick (e) { +// this.map.off('click', this.selectClick) +// const point = [e.latlng.lng, e.latlng.lat] +// console.log(point) +// this.getPipeLine(point) +// }, +// +// // 娴佸悜鏁版嵁璇锋眰 +// async getPipeLine (point) { +// const param = { +// x: point[0], +// y: point[1], +// radius: 3 +// } +// +// const res = await api.getPipeline(param) +// // 3 娴佸悜 +// +// if (this.activeName === 'first') { +// if (this.linkType) { +// this.tableDataLinkStart = res.data +// } else { +// this.tableDataLinkEnd = res.data +// } +// } else if (this.activeName === 'second') { +// this.bgPipeLine = res.data +// } else if (this.activeName === 'third') { +// this.tableDataLiuxiang = res.data +// } else if (this.activeName === 'fourth') { +// +// } +// +// console.log(res) +// }, +// // 娴佸悜-绠$嚎閫夋嫨 +// selectRowLiuXiang (e) { +// // 閫夋嫨瑕佹樉绀虹殑娴佸悜绾� +// console.log('閫夋嫨瑕佹樉绀虹殑娴佸悜绾�') +// console.log(e) +// }, +// lxHandleClick (e) { +// console.log('姝f祦鍚戞樉绀�') +// console.log(e) +// +// this.clearLX() +// const param = { +// points: e.data, +// option: { +// dashArray: '15 15', +// dashSpeed: -30 +// } +// } +// this.flowPipeLine = main.createFlowLine(param) +// }, +// clearLinkPipe () { +// if (this.linkPipeline.length > 0) { +// this.linkPipeline.forEach((itm, idx) => { +// itm.remove() +// }) +// } +// this.linkPipeline = [] +// }, +// clearLX () { +// if (this.flowPipeLine != null) { +// this.flowPipeLine.remove() +// this.flowPipeLine = null +// } +// }, +// lxHandleClick2 (e) { +// console.log('閫嗘祦鍚戞樉绀�') +// console.log(e) +// if (this.flowPipeLine != null) { +// this.flowPipeLine.remove() +// this.flowPipeLine = null +// } +// const param = { +// points: e.data, +// option: { +// dashArray: '15 15', +// dashSpeed: 30 +// } +// } +// this.flowPipeLine = main.createFlowLine(param) +// }, +// // 妯柇闈㈡暟鎹姹� +// async getHdmPoint (line) { +// console.log('妯柇闈㈢殑缁樺埗绾�') +// console.table(line) +// this.hdmParam = { +// x1: line[0].lng, +// y1: line[0].lat, +// x2: line[1].lng, +// y2: line[1].lat +// } +// }, +// // 妯柇闈㈤�夋嫨鍚� 鍥捐〃灞曠ず +// async selectRow (e) { +// console.log(e) +// // 3. 浣跨敤鍒氭寚瀹氱殑閰嶇疆椤瑰拰鏁版嵁锛屾樉绀哄浘琛� +// +// const option = { +// xAxis: { +// type: 'category', +// data: ['浜�1', '浜�2', '浜�3', '浜�4', '浜�5', '浜�6', '浜�7'] +// }, +// yAxis: { +// type: 'value' +// }, +// series: [{ +// data: [820, 932, 901, 934, 1290, 1330, 1320], +// type: 'line' +// }] +// } +// +// this.myChartShow = true +// this.myChart.setOption(option) +// }, +// drawLine () { +// console.log('drawLine') +// if (this.measure === null) { +// this.measure = new DrawLine(this.map) +// } +// this.measure.destory() +// this.measure.init() +// }, +// async jdmQuery () { +// if (this.hdmParam == null) { +// this.$message('璇峰厛鍦ㄥ湴鍥句笂缁樺埗鎴柇绾�') +// return +// } +// const res = await api.getCrossSection(this.hdmParam) +// console.log(res) +// // debugger +// }, +// jdmClear () { +// this.hdmParam = null +// if (this.measure != null) { +// this.measure.destory() +// } +// } +// } diff --git a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue index f973a19..c1deb22 100644 --- a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue +++ b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue @@ -2,72 +2,89 @@ <div class="connectivity"> <el-row> <span class="tube-span">鐖嗙(鐩稿叧寮�鍏�)</span> - <el-button type="primary" size="mini">閫夋嫨绠$嚎</el-button> - <el-button type="primary" size="mini">娓呴櫎</el-button> + <el-button type="primary" size="mini" @click="bgClick">閫夋嫨绠$嚎</el-button> + <el-button type="primary" size="mini" @click="handleClick('czp')">娓呴櫎</el-button> </el-row> <el-card class="box-card"> - <span class="clearfix">鍙戠敓鐖嗚鐨勭娈�</span> - <el-table - :data="tableData" - style="width: 100%"> - <el-table-column - prop="date" - label="绠$嚎绫诲瀷"> - </el-table-column> - <el-table-column - prop="name" - label="绠$嚎鍚嶇О"> - </el-table-column> - <el-table-column - prop="province" - label="璧风偣缂栧彿"> - </el-table-column> - <el-table-column - prop="city" - label="缁堢偣缂栧彿"> - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔"> - </el-table-column> - </el-table> - <span class="clearfix">闇�瑕佸叧闂殑闃�闂�</span> - <el-table - :data="tableData" - style="width: 100%"> - <el-table-column - prop="date" - label="绠$嚎绫诲瀷"> - </el-table-column> - <el-table-column - prop="name" - label="绠$嚎鍚嶇О"> - </el-table-column> - <el-table-column - prop="province" - label="璧风偣缂栧彿"> - </el-table-column> - <el-table-column - prop="city" - label="缁堢偣缂栧彿"> - </el-table-column> - <el-table-column - class-name="fixed-table" - fixed="right" - label="鎿嶄綔"> - </el-table-column> - </el-table> + <el-scrollbar style="height:350px"> + <span class="clearfix">鍙戠敓鐖嗚鐨勭娈�</span> + <el-table + :data="tableData" + style="width: 100%"> + <el-table-column + prop="date" + label="绠$嚎绫诲瀷"> + </el-table-column> + <el-table-column + prop="name" + label="绠$嚎鍚嶇О"> + </el-table-column> + <el-table-column + prop="province" + label="璧风偣缂栧彿"> + </el-table-column> + <el-table-column + prop="city" + label="缁堢偣缂栧彿"> + </el-table-column> + <el-table-column + class-name="fixed-table" + fixed="right" + label="鎿嶄綔"> + </el-table-column> + </el-table> + <span class="clearfix">闇�瑕佸叧闂殑闃�闂�</span> + <el-table + :data="tableData" + style="width: 100%"> + <el-table-column + prop="date" + label="绠$嚎绫诲瀷"> + </el-table-column> + <el-table-column + prop="name" + label="绠$嚎鍚嶇О"> + </el-table-column> + <el-table-column + prop="province" + label="璧风偣缂栧彿"> + </el-table-column> + <el-table-column + prop="city" + label="缁堢偣缂栧彿"> + </el-table-column> + <el-table-column + class-name="fixed-table" + fixed="right" + label="鎿嶄綔"> + </el-table-column> + </el-table> + </el-scrollbar> </el-card> </div> </template> <script> + +// import PublicWay from '@components/panel/topicSearch/SewersSelect/AnalysisChoose/PublicWay' + export default { name: 'Tube', data () { return { - tableData: [] + tableData: [], + tube: [] + } + }, + methods: { + // 閫夋寚绠$嚎 + bgClick () { + this.selectPipeLine() + }, + // 娓呮缁樺埗 + handleClick (val) { + console.log(val) + // PublicWay.handleClick(val) } } } diff --git a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue index 3d3d000..6e9c12e 100644 --- a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue +++ b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue @@ -23,8 +23,10 @@ import Flow from '@components/panel/topicSearch/SewersSelect/AnalysisChoose/Flow' import CrossSectional from '@components/panel/topicSearch/SewersSelect/AnalysisChoose/CrossSectional' +// import PublicWay from '@components/panel/topicSearch/SewersSelect/AnalysisChoose/PublicWay' + export default { - name: 'SewersFirstTab', + name: 'SewersAnalysis', components: { Connectivity, Tube, @@ -39,6 +41,7 @@ methods: { handleClick (tab, event) { console.log(tab, event) + // PublicWay.handleClick(tab, event) } } } diff --git a/src/conf/layers/LayerPipeLines.js b/src/conf/layers/LayerPipeLines.js index 4686fd6..016ba63 100644 --- a/src/conf/layers/LayerPipeLines.js +++ b/src/conf/layers/LayerPipeLines.js @@ -19,7 +19,7 @@ sname: '绠$綉', checked: false, // wfs: WFS_URL + '?TYPENAME=绠$綉&FILTER=<Filter xmlns="http://www.opengis.net/ogc"><PropertyIsEqualTo><PropertyName>mediumtype</PropertyName><Literal>闆ㄦ按绠$嚎</Literal></PropertyIsEqualTo></Filter>', - wfs: 'http://xearth.cn:6240/geoserver/sewer/wfs?typeName=sewer:pipeline&maxFeatures=50&outputFormat=application%2Fjson&cql_filter=linenumtype=\'闆ㄦ按绠$嚎\'', + wfs: 'http://xearth.cn:6240/geoserver/sewer/wfs?typeName=sewer:pipeline&maxFeatures=500&outputFormat=application%2Fjson&cql_filter=linenumtype=\'闆ㄦ按绠$嚎\'', icon: 'sewers/闆ㄦ按绾�.png', color: '#0070ff', minZoom: 13, @@ -43,7 +43,7 @@ checked: false, minZoom: 13, color: '#ffaa00', - wfs: 'http://xearth.cn:6240/geoserver/sewer/wfs?typeName=sewer:pipeline&maxFeatures=50&outputFormat=application%2Fjson&cql_filter=mediumtype=\'鍚补姹℃按\'', + wfs: 'http://xearth.cn:6240/geoserver/sewer/wfs?typeName=sewer:pipeline&maxFeatures=500&outputFormat=application%2Fjson&cql_filter=mediumtype=\'鍚补姹℃按\'', styles: { COLOR: '#ffaa00', FILL_COLOR: '#ffaa00' @@ -96,7 +96,7 @@ checked: false, minZoom: 13, color: '#a8a800', - wfs: 'http://xearth.cn:6240/geoserver/sewer/wfs?typeName=sewer:pipeline&maxFeatures=50&outputFormat=application%2Fjson&cql_filter=mediumtype=\'鐢熶骇姹℃按\'', + wfs: 'http://xearth.cn:6240/geoserver/sewer/wfs?typeName=sewer:pipeline&maxFeatures=500&outputFormat=application%2Fjson&cql_filter=mediumtype=\'鐢熶骇姹℃按\'', styles: { COLOR: '#a8a800', FILL_COLOR: '#a8a800' diff --git a/src/utils/utils.js b/src/utils/utils.js index 8ace9bb..4fbfed4 100644 --- a/src/utils/utils.js +++ b/src/utils/utils.js @@ -22,3 +22,38 @@ // eslint-disable-next-line no-unreachable return url + '\n' + arg + '\n' + argValue } + +/** + * 澶嶅埗瀵硅薄 + * @param obj + * @returns {{}} + */ +export function clone (obj) { + var o + // 濡傛灉 浠栨槸瀵硅薄object鐨勮瘽 , 鍥犱负null,object,array 涔熸槸'object'; + if (typeof obj === 'object') { + // 濡傛灉 浠栨槸绌虹殑璇� + if (obj === null) { + o = null + } else { + // 濡傛灉 浠栨槸鏁扮粍arr鐨勮瘽 + if (obj instanceof Array) { + o = [] + for (var i = 0, len = obj.length; i < len; i++) { + o.push(clone(obj[i])) + } + } else { + // 濡傛灉 浠栨槸瀵硅薄object鐨勮瘽 + o = {} + for (var j in obj) { + o[j] = clone(obj[j]) + } + } + } + } else { + o = obj + } + return o +} + +export default clone -- Gitblit v1.8.0