Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetw...

徐旺旺

2021-04-22 ac41dd3a9b8632c9cbda389012a85de87135ed47

 src/components/LayerController/modules/LcServiceLayerFilter.vue

@@ -9,7 +9,7 @@
                    <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
                                   @change="swAllSubFilter(filter)"><label
                                :title="filter.name">{{filter.name}}</label>
                        </div>
                    </div>
@@ -20,16 +20,12 @@
</template>

<script>
import { mapMutations } from 'vuex'
import { LayerSewersPoint } from '@src/conf/layers/LayerSewers'

export default {
  name: 'LcServiceLayerFilter',
  components: { },
  data () {
    return {
      visible: {},
      layerSewersPoint: LayerSewersPoint,
      layers: [],
      filterConfig: [] // 附属要素
    }
@@ -43,12 +39,26 @@
    }
  },
  methods: {
    ...mapMutations([]),
    swAllSubFilter (item) {
      // eslint-disable-next-line no-debugger
      item.checked = !item.checked
      // window.serviceLayerHelper.loadLayers()
      this.toggleLayer(item)
      this.swLayers(item.layers, item.checked)
    },
    swLayers (layers, checked) {
      if (layers) {
        for (let i = 0, len = layers.length; i < len; ++i) {
          var layer = layers[i]
          layer.checked = checked
          this.toggleLayer(layer)
          if (layer.layers) {
            this.swLayers(layer.layers, checked)
          }
        }
      }
    },
    // todo 还需要优化，在有多个需要子图层独立弹窗情况下无效
    // 监听上级图层存在独立弹窗的选中情况
    toggle (serviceLayers) {
      if (serviceLayers) {
        for (var i = 0; i < serviceLayers.length; i++) {
@@ -76,8 +86,7 @@
        }
      }
    },
    swSubFilter (url, item) {
      item.checked = !item.checked
    toggleLayer (item) {
      if (item.checked) {
        window.layerFactory.show(item)
      } else {
@@ -101,7 +110,6 @@

<style scoped lang="less">
    .inner-panel {
        color: #90c8e0;
        font-size: 13px;
        position: absolute;
        left: 1.82167rem;
@@ -110,27 +118,28 @@
        .filter-group {
            display: flex;
            flex-flow: row;

            .filter-item {
                width: 0.6rem;
                height: 100%;
                margin-right: 5px;

                background-color: @background-color;
                box-shadow: 0 0 0.03rem #00fff6;
                border-radius: 0.03rem;
                .title {
                    height: 25px;
                    background-color: #091331;
                    border: 1px solid #10488c;
                    border-bottom:1px solid @background-color-split;
                    padding: 5px 0;
                    background-color: @background-color;
                }

                .content {
                    background-color: rgba(44, 62, 80, 0.6);
                    border: 1px solid #10488c;
                    max-height: 200px;
                    padding-bottom: 5px;
                    //overflow-y: hidden;
                }

                //
              input[type="checkbox"]{width:10px;height:10px;display: inline-block;text-align: center;vertical-align: middle; line-height: 10px;position: relative;}
              input[type="checkbox"]::before{content: "";position: absolute;top: 0;left: 0;background: #fff;width: 100%;height: 100%;border: 1px solid #d9d9d9}
              input[type="checkbox"]:checked::before{content: "\2713";background-color: @color-highlight;position: absolute;top: 0;left: 0;width:100%;border: 1px solid #fff700;color:@background-color;font-size: 10px;font-weight: bold;}
              //
                //::-webkit-scrollbar {
                //    width: 7px;
                //    height: 5px !important;