From 83d2044b6b47d26ff77ec25de8d6787ceaf83e3a Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期三, 31 三月 2021 17:00:39 +0800 Subject: [PATCH] 1 --- src/components/panel/ToolBoxPanel.vue | 50 +++++++++++++++++++++++++++++++++++++------------- 1 files changed, 37 insertions(+), 13 deletions(-) diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue index 8c8347c..36b950d 100644 --- a/src/components/panel/ToolBoxPanel.vue +++ b/src/components/panel/ToolBoxPanel.vue @@ -9,14 +9,16 @@ <transition name="animationChange"> <el-row v-show="selectGroup" class="specific-tools-group"> <el-popover + trigger="manual" placement="bottom" - trigger="click" :popper-class="'tools-panel-content'" v-for="(item,index) in menuList" :key="index" :width="item.index === '2'?230 : 150" + v-model="isShow[index]" > - <el-button slot="reference" class="el-button" :class="active === index ? 'tools-panel-choose':''" - @click="changeChoose(index)"> + <el-button slot="reference" class="el-button" + :class="active === index && checked? 'tools-panel-choose':''" + @click.native="changeChoose(index)"> <img :src="item.iconSelecd" alt="" v-if="active === index && checked"/> <img :src="item.icon" alt="" v-else/> <span v-if="active === index && checked">{{ item.label }}</span> @@ -24,13 +26,13 @@ </el-button> <el-button v-for="(itemT,indexT) in item.items" :key="indexT" @click="choiceItem(itemT,indexT)" v-show="item.index!=='2'"> - <img :src="itemT.iconChoose" :title="itemT.title" v-if="Selecd === indexT"/> - <img :src="itemT.icon" :title="itemT.title" v-else/> + <img :src="itemT.iconChoose" :title="itemT.title" v-if="Selecd === indexT && checkedItem" alt=""/> + <img :src="itemT.icon" :title="itemT.title" alt="" v-else/> </el-button> - <div class="base-map-inner-panel" v-show="!isShow&&item.index==='2'"> + <div class="base-map-inner-panel" v-show="item.index==='2'"> <div v-for="item in basemapList" :key="item.code" class="basemap-layer-item"> <img class="base-map-img" width="50" height="50" :src="item.conf.icon_actived" :title="item.name" - @click="changeBasemap(item)"/> + @click="changeBasemap(item)" alt=""/> <el-checkbox class="base-map-anno" name="basemap" v-model="item.conf.annotationCheck" label="鏍囨敞" @change="changeBasemap(item)"> </el-checkbox> @@ -83,6 +85,11 @@ import distance from '@assets/images/map-pages/icon/toolbox/juli.png' import mm from '@assets/images/map-pages/icon/toolbox/M2.png' +// 涓嬭浇 +import FullScreen from '@assets/images/map-pages/icon/toolbox/fullscreen.png' +import cross from '@assets/images/map-pages/icon/toolbox/cross.png' +import vertical from '@assets/images/map-pages/icon/toolbox/vertical.png' + // 娴嬮噺鐨勬柟娉� import Measure from '@/components/plugin/MeaSure' @@ -90,7 +97,7 @@ name: 'ToolBoxPanel', data () { return { - isShow: true, + isShow: [], currentBaseMapCode: 'tianditu_img', basemapList: [], selectGroup: false, @@ -98,9 +105,11 @@ drawLayerArray: [], map: null, active: -1, - Selecd: -1, checked: false, checkbutton: -1, + checkedItem: false, + Selecd: -1, + isSelecd: -1, menuList: [ { icon: plot, @@ -228,19 +237,19 @@ { index: '4-1', label: '鍏ㄥ睆', - icon: '', + icon: FullScreen, title: '鍏ㄥ睆' }, { index: '4-2', label: 'A4妯悜', - icon: '', + icon: cross, title: 'A4妯悜' }, { index: '4-3', label: 'A4绾靛悜', - icon: '', + icon: vertical, title: 'A4绾靛悜' } ] @@ -265,6 +274,7 @@ this.basemapList = this.basemapHelper.getBasemapList() }, changeBasemap (itm) { + this.active = -1 const code = itm.code this.basemapList.forEach((item) => { if (item.code === code) { @@ -287,8 +297,10 @@ this.drawLayer = this.L.layerGroup().addTo(this.map) } this.active = index + this.isShow[index] = !this.isShow[index] if (this.checkbutton === index) { this.checked = !this.checked + this.Selecd = -1 } else { if (this.checkbutton === -1) { this.checked = !this.checked @@ -300,6 +312,16 @@ }, choiceItem (itemT, indexT) { this.Selecd = indexT + if (this.isSelecd === indexT) { + this.checkedItem = !this.checkedItem + } else { + if (this.isSelecd === -1) { + this.checkedItem = !this.checkedItem + } else { + this.checkedItem = true + } + } + this.isSelecd = indexT switch (itemT.label) { case '鐐规爣缁�': var myIcon = this.L.icon({ @@ -377,6 +399,7 @@ printerY.printMap('A4Portrait page', '绾靛悜') break } + this.active = -1 }, setLogic () { this.drawLayer.on('dblclick', this.L.DomEvent.stop).on('dblclick', this.drawLayer.toggleEdit) @@ -391,7 +414,6 @@ }, changeSelectMouse () { this.selectGroup = true - this.checked = false } } } @@ -452,6 +474,7 @@ } .el-button-choice { + left: 500px; z-index: 999; padding: 0; margin: 0 0.015rem; @@ -527,6 +550,7 @@ display: block; color: @color-shadow; } + .default-span { display: block; color: @color-over; -- Gitblit v1.8.0