From 0039429882f8434000a0f61d6995324f1589633a Mon Sep 17 00:00:00 2001 From: seatonwan9 <seatonwan9@163.com> Date: 星期日, 30 五月 2021 13:36:06 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/components/panel/RightSearchPanel.vue | 172 ++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 120 insertions(+), 52 deletions(-) diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue index 9195d47..e0b822c 100644 --- a/src/components/panel/RightSearchPanel.vue +++ b/src/components/panel/RightSearchPanel.vue @@ -12,18 +12,19 @@ </div> </li> </ul> --> - <ul v-for="item in topicList" :key="item.name" + <ul v-for="item in list" :key="item.name" :class="item.checked?'module-wrap map-btn-active':'module-wrap map-btn-unactive'" @click="()=>{selected(item)}" v-show="item.isShow"> <el-tooltip :popper-class="'map-tooltip'" effect="dark" :content="item.name" placement="left"> <li> - <img src="../../assets/images/map-pages/icon/sl.png" class="icon"> + <!-- <img src="../../assets/images/map-pages/icon/sl.png" class="icon"> --> + <i class="icon iconfont" :class="item.icon"></i> </li> </el-tooltip> </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> @@ -50,14 +51,16 @@ <script> import EnvRiskSearch from './topicSearch/EnvRiskSearch' import DischargeSearch from './topicSearch/DischargeSearch' -import { TopicList } from '../../conf/Topic' +import { topicList } from '../../conf/Topic' import GasWasteSearch from '@components/panel/topicSearch/GasWasteSearch' import WaterWasteSearch from '@components/panel/topicSearch/WaterWasteSearch' import SolidWasteSearch from '@components/panel/topicSearch/SolidWasteSearch' import SewersSearch from '@components/panel/topicSearch/SewersSearch' import SoilGroundWaterSearch from '@components/panel/topicSearch/SoilGroundWaterSearch.vue' -import bus from '@/eventBus' +import PipeChangesSearch from '@components/panel/topicSearch/pipeChangesSearch.vue' +import PipeInformationSearch from '@components/panel/topicSearch/pipeInformationSearch.vue' +import EnterpriseEmergencySearch from './topicSearch/EnterpriseEmergencySearch' export default { name: 'MonitorPanel', @@ -66,13 +69,14 @@ WaterWasteSearch, SolidWasteSearch, EnvRiskSearch, - DischargeSearch + DischargeSearch, + EnterpriseEmergencySearch }, data () { return { isShow: true, topicMenu: [], - topicList: TopicList, + list: topicList, topicCheckedList: [], isPanelVisible: false, gcComp: SewersSearch, @@ -80,13 +84,16 @@ hbVisible: false, pkVisible: false, toggleMonitorStyle: 'right:0px', - title: '姹¢洦姘寸缃�', isCollapse: true, selectGroup: false } }, - computed: {}, + computed: { + serviceLayers () { + return this.$store.state.map.serviceLayers.LayerSewersLine + } + }, /* watch: { '$store.state.map.topic.topicCheckedList': function (newVal, oldVal) { console.log(oldVal) @@ -101,26 +108,46 @@ }) }) } - }, + }, */ methods: { handleClose (done) { console.log(done) }, setSearchPanelChange () { + // 鎼滅储闈㈡澘娌℃湁鏄剧ず鏃讹紝灏嗘墍鏈変富棰橀�夋嫨鐘舵�佽缃负false this.selectGroup = !this.selectGroup if (!this.selectGroup) { - this.topicList.forEach((itm) => { + this.list.forEach((itm) => { itm.checked = false }) } }, + unselected (val) { + // console.log(val) + this.selectGroup = true + this.list.forEach((itm) => { + if (itm.name === val.name) { + console.log(val.name) + itm.checked = false + itm.isShow = false + } + }) + }, selected (val) { // console.log(val) - this.title = val.name this.selectGroup = true - this.topicList.forEach((itm) => { - itm.checked = val.name === itm.name + this.list.forEach((itm) => { + if (itm.name === val.name) { + itm.isShow = true + itm.checked = true + } else { + itm.checked = false + } }) + this.setComp(val) + }, + setComp (val) { + this.title = val.name switch (val.name) { case '姹℃煋婧�': this.gcComp = DischargeSearch @@ -143,12 +170,18 @@ case '绠$嚎': this.gcComp = SewersSearch break + case '绠¢亾鍙樻洿': + this.gcComp = PipeChangesSearch + break + case '绠¢亾淇℃伅': + this.gcComp = PipeInformationSearch + break + case '浼佷笟搴旀��': + this.gcComp = EnterpriseEmergencySearch + break } }, handlePage (page) { - }, - handleGd () { - this.title = '绠¢亾淇℃伅鏌ヨ' }, toggleMonitorPanel () { this.isCollapse = !this.isCollapse @@ -190,31 +223,60 @@ // }) // } }, - defaultLastOne () { - let v = {} - this.topicList.forEach((item) => { - if (item.isShow) { - v = item + containsLayer (layer) { + if (layer) { + for (let i = 0; i < layer.length; i++) { + const lay = layer[i] + const checked = lay.checked + + for (let j = 0; j < this.list.length; j++) { + const topic = this.list[j] + if (lay.name === topic.name) { + if (lay.layers) { + const isChecked = this.isChecked(lay.layers) + if (isChecked) { + this.selected(topic) + } else { + this.unselected(topic) + } + } else if (checked) { + this.selected(topic) + } + break + } + } + this.containsLayer(lay.layers) } - }) - this.selected(v) + } + }, + isChecked (layers) { + for (let i = 0; i < layers.length; i++) { + const layer = layers[i] + const checked = layer.checked + if (checked) { + return true + } + if (layer.layers) { + return this.isChecked(layer.layers) + } + } + return false } }, mounted () { - const that = this - bus.$on('changeSearchBar', function (obj) { - // console.log(obj.checked, obj.name) - that.topicList.forEach((item) => { - if (item.name === obj.name) { - item.isShow = obj.checked - if (item.isShow) { - that.selected(item) - } else { - that.defaultLastOne() - } - } - }) - }) + /* bus.$on('changeSearchBar', (obj) => { + const topic = this.search(this.serviceLayers, obj) + console.log('====' + JSON.stringify(topic)) + }) */ + }, + watch: { + serviceLayers: { + handler: function (newVal, oldVal) { + this.containsLayer(newVal) + }, + immediate: true, + deep: true + } } } </script> @@ -233,7 +295,8 @@ .search-container { position: relative; //width: 1.79167rem; - width: 2.79167rem; + //width: 2.39167rem; + width: 2.3rem; /* height: 5.6475rem;*/ overflow: hidden; } @@ -253,10 +316,10 @@ cursor: pointer; position: relative; line-height: 0.15rem; - li { margin: 0.00521rem 0; text-align: center; + font-size: 20px; img { width: 0.1rem; @@ -275,7 +338,7 @@ //top: 10px; height: 0; position: absolute; - top: 0.42979rem; + top: 0.73979rem; right: 0.14583rem; z-index: 501; display: -webkit-box; @@ -306,8 +369,8 @@ background: @background-color4; color: @color-tool; position: absolute; - top: 24px; - right: 0.02rem; + top: 20px; + left: 0.02rem; border: none; //1px solid @color-tool; width: 0.2rem; height: 0.2rem; @@ -589,13 +652,12 @@ .environmental-risk-list { position: relative; - cursor: pointer; padding-left: 50px; padding-top: 5px; padding-bottom: 5px; color: @color-shadow; border-bottom: 1px solid @background-color-split; - + h3{ cursor: pointer;} .state { width: 30px; height: 30px; @@ -608,11 +670,13 @@ background: #0B3B6D; } } - .environmental-risk-list.hover, - .environmental-risk-list:hover { - color: @color-over; + .environmental-risk-list:hover{ background: @background-color; + } + .environmental-risk-list.hover h3, + .environmental-risk-list h3:hover { + color: @color-highlight; } input::-webkit-input-placeholder { @@ -670,12 +734,16 @@ } .footer-page { - position: absolute; + // position: absolute; background-color: transparent !important; - bottom: 10px !important; - margin-left: 0px; + // bottom: 10px !important; + // margin-left: 0px; border: none; - + margin: 0; + border-top: 1px solid rgba(0, 255, 246, 0.14); + .el-card__body{ + padding: 5px; + } .warnPagination { .btn-quicknext, .btn-quickprev { color: #e4e8f1 !important; -- Gitblit v1.8.0