图层控制联动效果。

chenyabin

2021-05-11 dd1f49d08fd83a900c08eb87c78a6d56b3ee3a50

图层控制联动效果。

 src/components/panel/RightSearchPanel.vue

@@ -24,7 +24,7 @@
            </ul>
          </div>
        </div>
        <div class="right-control" :class="[{ 'unfold': !isCollapse },{ 'shrink': isCollapse }] ">
        <div class="right-control" :class="[{ 'unfold': !isCollapse },{ 'shrink': isCollapse }] " v-if="gcComp!=''">
          <div class="panel-fold-btn" @click="toggleMonitorPanel">
            <div :class="[isCollapse? 'btn-stretch':'btn-shrink']"></div>
          </div>
@@ -219,6 +219,7 @@
    const that = this
    bus.$on('changeSearchBar', function (obj) {
      // console.log(obj.checked, obj.name)
      that.gcComp = ''
      that.topicList.forEach((item) => {
        if (item.name === obj.name) {
          item.isShow = obj.checked

 src/conf/Topic.js

@@ -16,56 +16,56 @@
  name: '污染源',
  id: 1,
  check: false,
  isShow: true,
  isShow: false,
  icon: 'iconwuranyuan',
  comp: ''
}, {
  name: '废水',
  id: 2,
  checked: false,
  isShow: true,
  isShow: false,
  icon: 'iconfs',
  comp: ''
}, {
  name: '废气',
  id: 3,
  checked: false,
  isShow: true,
  isShow: false,
  icon: 'iconfq',
  comp: ''
}, {
  name: '固废',
  id: 4,
  checked: false,
  isShow: true,
  isShow: false,
  icon: 'icongf_green2',
  comp: ''
}, {
  name: '环境风险',
  id: 5,
  checked: false,
  isShow: true,
  isShow: false,
  icon: 'iconditu',
  comp: ''
}, {
  name: '土壤及地下水',
  id: 6,
  checked: false,
  isShow: true,
  isShow: false,
  icon: 'icondxs_green',
  comp: ''
}, {
  name: '管线',
  id: 7,
  checked: false,
  isShow: true,
  isShow: false,
  icon: 'iconguanxianxuncha',
  comp: ''
}, {
  name: '企业应急',
  id: 8,
  checked: false,
  isShow: true,
  isShow: false,
  icon: 'iconguanxianyanghu',
  comp: ''
}/* {