From bc1bacba044c4dd3d3e0cd5470c6188cd5e2bc12 Mon Sep 17 00:00:00 2001 From: 徐旺旺 <11530253@qq.com> Date: 星期三, 07 四月 2021 11:31:10 +0800 Subject: [PATCH] 附属设施、环保设施 独立显示 --- src/components/LayerController/modules/LcServiceLayerFilter.vue | 81 ++++++++++++++++++++++++++-------------- 1 files changed, 53 insertions(+), 28 deletions(-) diff --git a/src/components/LayerController/modules/LcServiceLayerFilter.vue b/src/components/LayerController/modules/LcServiceLayerFilter.vue index 4b68c97..ffc77a5 100644 --- a/src/components/LayerController/modules/LcServiceLayerFilter.vue +++ b/src/components/LayerController/modules/LcServiceLayerFilter.vue @@ -1,18 +1,19 @@ <template> <div class="inner-panel"> <div class="filter-group"> - <div v-for="item in pointLayers" :key="item.code" class="filter-item"> + <div v-for="item in layers" :key="item.code" class="filter-item"> <div class="title"><input type="checkbox" :value="item.code" :checked="item.checked" @change="swAllSubFilter(item)">{{item.name}} </div> - <el-scrollbar style="height:100%"> - <div class="content"> - <div v-for="filter in item.layers" :key="filter.code"> - <input type="checkbox" :value="filter.code" :checked="filter.checked" @change="swSubFilter(item.url,filter)"><label - :title="filter.name">{{filter.name}}</label> + <el-scrollbar style="height:100%"> + <div class="content"> + <div v-for="filter in item.layers" :key="filter.code"> + <input type="checkbox" :value="filter.code" :checked="filter.checked" + @change="swSubFilter(item.url,filter)"><label + :title="filter.name">{{filter.name}}</label> + </div> </div> - </div> - </el-scrollbar> + </el-scrollbar> </div> </div> </div> @@ -20,45 +21,58 @@ <script> import { mapMutations } from 'vuex' +import { LayerSewersPoint } from '@src/conf/layers/LayerSewers' export default { name: 'LcServiceLayerFilter', - components: {}, + components: { }, data () { return { visible: {}, + layerSewersPoint: LayerSewersPoint, + layers: [], filterConfig: [] // 闄勫睘瑕佺礌 } }, computed: { + serviceLayers () { + return this.$store.state.map.serviceLayers.LayerSewersLine + }, config () { return this.$store.state.map.config - }, - pointLayers () { - // 鏍规嵁绾垮浘灞傞�変腑鎯呭喌锛屾樉绀烘垨闅愯棌鐐瑰浘灞傞潰鏉� - var serviceLayers = this.config.mapConfig.Layers.LayerSewersLine // 涓�绾у浘灞� - var checkedLayers = window.serviceLayerHelper.getCheckedLayers(serviceLayers) - var pointLayers = this.config.mapConfig.Layers.layerSewersPoint // 浜岀骇鍥惧眰 - return pointLayers.filter(function (layer) { - var code = layer.code - for (var i = 0; i < checkedLayers.length; i++) { - var checkedLayer = checkedLayers[i] - if (checkedLayer.childLayer.indexOf(code) >= 0) { - return checkedLayer - } - } - }) } - }, - mounted () { - // this.filterConfig = window.serviceLayerHelper.getWMSConfig().filtersGroup }, methods: { ...mapMutations([]), swAllSubFilter (item) { item.checked = !item.checked - console.log(item) // window.serviceLayerHelper.loadLayers() + }, + // todo 杩橀渶瑕佷紭鍖栵紝鍦ㄦ湁澶氫釜闇�瑕佸瓙鍥惧眰鐙珛寮圭獥鎯呭喌涓嬫棤鏁� + toggle (serviceLayers) { + for (var i = 0; i < serviceLayers.length; i++) { + var serviceLayer = serviceLayers[i] + var childLayer = serviceLayer.childLayer + if (childLayer) { + if (this.checkChecked(serviceLayer.layers)) { + this.layers = childLayer + } else { + this.layers = [] + } + break + } else { + this.toggle(serviceLayer.layers) + } + } + }, + checkChecked (serviceLayers) { + for (var i = 0; i < serviceLayers.length; i++) { + var serviceLayer = serviceLayers[i] + var checked = serviceLayer.checked + if (checked) { + return true + } + } }, swSubFilter (url, item) { item.checked = !item.checked @@ -68,6 +82,16 @@ window.serviceLayerHelper.removeLayer(item) } // window.serviceLayerHelper.loadLayers() + } + }, + watch: { + // 姝ゅ闇�瑕佹繁搴︾洃鍚浘灞傞�変腑鐘舵�侊紝浣跨敤computed鏃犳晥 + '$store.state.map.serviceLayers.LayerSewersLine': { + handler: function (val) { + this.toggle(val) + }, + immediate: true, + deep: true } } } @@ -106,6 +130,7 @@ max-height: 200px; //overflow-y: hidden; } + // //::-webkit-scrollbar { // width: 7px; -- Gitblit v1.8.0