| | |
| | | </div> |
| | | <div class="wms-panel"> |
| | | <div v-for="item in serviceWmsLayerList" :key="item.code" class="layerbox"> |
| | | <div><input type="checkbox" name="wmsLayer" :value="item.code" @change="swAllLayers"/>{{item.name}}</div> |
| | | <div><input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.inLegend" :value="item.code" @change="swAllLayers(item)"/>{{item.name}} <span @click="swFilter(item)" class="btn-filter">过滤</span></div> |
| | | <div class="layerbox-item"> |
| | | <div class="basemap-layer-item" v-for="itm in item.layers" :key="itm.code"><input type="checkbox" name="wmsSublayers" :value="item.code" @change="swAllLayers"/>{{itm.sname}}</div> |
| | | <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}}</div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | ...mapState({ |
| | | serviceLayerHelper: (state) => { |
| | | return state.serviceLayerHelper; |
| | | }, |
| | | } |
| | | }), |
| | | }, |
| | | mounted() { |
| | | // console.log('03步骤:', this.helper) |
| | | }, |
| | | methods: { |
| | | ...mapMutations([]), |
| | | swAllLayers(){ |
| | | |
| | | ...mapMutations(['setSelectedServiceLayer','toggleServiceLayerFilter']), |
| | | swAllLayers(item){ |
| | | // eslint-disable-next-line no-debugger |
| | | item.inLegend = !item.inLegend |
| | | for(let i = 0, len = item.layers.length; i < len; ++i){ |
| | | item.layers[i].checked = item.inLegend |
| | | } |
| | | this.updateWms() |
| | | }, |
| | | swTileLayer(){ |
| | | console.log('该TILE方法未实现!') |
| | |
| | | swWmtsLayer(){ |
| | | console.log('该WMTS方法未实现!') |
| | | }, |
| | | swWmsLayer(){ |
| | | |
| | | swWmsLayer(itm){ |
| | | itm.checked = !itm.checked |
| | | this.updateWms() |
| | | }, |
| | | swFilter(item){ |
| | | this.$store.commit('setSelectedServiceLayer', item.code) |
| | | this.$store.commit('toggleServiceLayerFilter') |
| | | }, |
| | | updateServiceLayerList(){ |
| | | // eslint-disable-next-line no-debugger |
| | |
| | | this.serviceWmsLayerList.push(wmsCfg[i].config) |
| | | } |
| | | } |
| | | }, |
| | | updateWms(){ |
| | | |
| | | } |
| | | }, |
| | | watch: { |
| | |
| | | justify-content: center; |
| | | align-items: center; |
| | | |
| | | .btn-filter{ |
| | | cursor: pointer; |
| | | } |
| | | .wms-panel{ |
| | | display:flex; |
| | | flex-flow: column; |
| | |
| | | |
| | | .layerbox-item{ |
| | | display:flex; |
| | | flex-flow: row; |
| | | flex-flow: row wrap; |
| | | margin-left: 15px; |
| | | margin-top: 5px; |
| | | .basemap-layer-item{ |
| | | width: 50%; |
| | | } |