From cb0e263d36be16efbfbbb27f02139749f7ef5c2c Mon Sep 17 00:00:00 2001 From: zhangshuaibao <15731629597@163.com> Date: 星期四, 01 四月 2021 09:54:39 +0800 Subject: [PATCH] 点击废水显示弹窗效果 --- src/components/LayerController/modules/LcServiceLayer.vue | 51 +++++++++++++++++++++++++++++++-------------------- 1 files changed, 31 insertions(+), 20 deletions(-) diff --git a/src/components/LayerController/modules/LcServiceLayer.vue b/src/components/LayerController/modules/LcServiceLayer.vue index cb9a7e8..01bfe83 100644 --- a/src/components/LayerController/modules/LcServiceLayer.vue +++ b/src/components/LayerController/modules/LcServiceLayer.vue @@ -1,17 +1,19 @@ <template> <div class="inner-panel"> + <div class="title"> + 鍥惧眰鎺у埗 + </div> <div class="wms-panel"> - <div v-for="item in mapConfig.ServiceLayers" :key="item.code" class="layerbox"> + <div v-for="item in serviceLayers" :key="item.code" class="layerbox"> <div><input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.checked" :value="item.code" - @change="swAllLayers(item)"/>{{ item.name }} <span @click="swFilter(item)" - class="btn-filter">杩囨护</span> + @change="swAllLayers(item)"/>{{ item.name }} </div> <div class="layerbox-item"> <div class="basemap-layer-item" v-for="itm in item.layers" :key="itm.code"><input type="checkbox" :name="'wmsSublayers_'+item.code+'_'+itm.code" :checked="itm.checked" :value="itm.code" - @change="swWmsLayer(itm)"/>{{ itm.sname }} + @change="swWmsLayer(itm)"/>{{ itm.name }} </div> </div> </div> @@ -21,9 +23,9 @@ </template> <script> -import WmsHelper from '../../helpers/WmsHelper' -import AjaxUtils from '@/utils/AjaxUtils' +import WfsHelper from '../../helpers/WfsHelper' import LcServiceLayerFilter from '@components/LayerController/modules/LcServiceLayerFilter' +import AjaxUtils from '../../../utils/AjaxUtils' export default { name: 'LcServiceLayer', @@ -34,8 +36,8 @@ } }, computed: { - mapConfig () { - return this.$store.state.map.mapConfig.mapConfig + serviceLayers () { + return this.$store.state.map.serviceLayers.LayerSewersLine } }, mounted () { @@ -52,13 +54,22 @@ this.updateWms() }, loadWfs () { - AjaxUtils.GetDataAsynByUrl('http://xearth.cn:6289/server/ogcserver/PipeLineTest/wfs?version=1.0.0&TYPENAME=pipeline&REQUEST=getfeature&OUTPUTFORMAT=json&maxFeatures=20000', {}, (res) => { - window.L.geoJSON(res).addTo(window.map) + var wfsHelper = new WfsHelper() + wfsHelper.addTypeName('绠$嚎鐐�') + wfsHelper.addEquals('pipename', '鐮旂┒闄�01璺痀S000001') + + AjaxUtils.GetDataAsynByUrl(wfsHelper.getUrl(), {}, (res) => { + console.log(res) }) }, swWmsLayer (itm) { itm.checked = !itm.checked - this.updateWms() + if (itm.checked) { + window.layerFactory.show(itm) + } else { + window.layerFactory.hide(itm) + } + // this.updateWms() }, swFilter (item) { this.layerFilterVisible = !this.layerFilterVisible @@ -68,7 +79,7 @@ }, updateWms () { var mapConfig = this.mapConfig - var wmsHelper = new WmsHelper() + var wmsHelper = new WfsHelper() wmsHelper.initMapConfig(mapConfig) var wmsLayersMap = wmsHelper.getWmsLayersMap() for (var k in wmsLayersMap) { @@ -86,23 +97,23 @@ <style scoped lang="less"> .inner-panel { - display: flex; - justify-content: center; - align-items: center; - + .title{ + color: #ffffff; + font-size: 16px; + font-weight: 600; + margin: 10px; + text-align: center; + } .btn-filter { cursor: pointer; color: #ffffff; } .wms-panel { - display: flex; - flex-flow: column; + width: 250px; .layerbox { width: 100%; - display: flex; - flex-flow: column; .layerbox-item { display: flex; -- Gitblit v1.8.0