From 447b0a01c659f63216a70ba055c3c4279f16c7f6 Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期二, 16 三月 2021 16:43:09 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' --- src/components/panel/ToolBoxPanel.vue | 70 ++++++++++++++++++++++++++++++++--- 1 files changed, 64 insertions(+), 6 deletions(-) diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue index a6dd8d1..9448ccf 100644 --- a/src/components/panel/ToolBoxPanel.vue +++ b/src/components/panel/ToolBoxPanel.vue @@ -8,7 +8,7 @@ <el-row v-show="selectGroup" class="specific-tools-group"> <el-popover placement="bottom" - width="" + width="100%" trigger="click" :popper-class="'tools-panel-content'" v-for="(item,index) in menuList" :key="index" @@ -18,9 +18,18 @@ <img :src="item.icon" alt=""/> <span>{{ item.label }}</span> </el-button> - <el-button v-for="(itemT,indexT) in item.items" :key="indexT" @click="choiceItem(itemT)"> - <img :src="itemT.icon" :title="itemT.title"/> + <el-button v-for="(itemT,indexT) in item.items" :key="indexT" @click="choiceItem(itemT)" v-show="item.index!=='2'"> + <img :src="itemT.icon" :title="itemT.title" v-show="item.index!=='2'"/> </el-button> + <div class="base-map-inner-panel" v-show="isShow&&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)"/> + <el-checkbox class="base-map-anno" name="basemap" v-model="item.conf.annotationCheck" + label="鏍囨敞" @change="changeBasemap(item)"> + </el-checkbox> + </div> + </div> </el-popover> <el-button @click="changeSelect" class="special-button"> <i :class="selectGroup === false ? 'el-icon-d-arrow-right':'el-icon-d-arrow-left'"></i> @@ -55,6 +64,9 @@ // components: { BaseNavMenuItem }, data () { return { + isShow: true, + currentBaseMapCode: 'tianditu_img', + basemapList: [], menuList: [ { icon: plot, @@ -182,7 +194,40 @@ active: 0 } }, + computed: { + basemapHelper () { + return this.$store.state.map.basemapHelper + } + }, + watch: { + basemapHelper (newVal) { + if (newVal != null) { + this.updateBasemapList() + } + } + }, methods: { + updateBasemapList () { + this.basemapList = this.basemapHelper.getBasemapList() + }, + changeBasemap (itm) { + const code = itm.code + this.basemapList.forEach((item) => { + if (item.code === code) { + console.log(this.currentBaseMapCode) + if (this.currentBaseMapCode == null || this.currentBaseMapCode !== code) { + this.currentBaseMapCode = code + this.basemapHelper.showBasemap(item.code, item.conf.annotationCheck, true) + } else { + this.basemapHelper.showBasemap(item.code, item.conf.annotationCheck, false) + } + + this.basemapHelper.getBasemapList().forEach((item) => { + item.layer.bringToBack() + }) + } + }) + }, changeChoose (index) { this.active = index }, @@ -314,6 +359,7 @@ // 宸︿笂鍔熻兘鎺у埗 changeSelect () { this.selectGroup = !this.selectGroup + this.isShow = !this.isShow } } } @@ -328,16 +374,20 @@ .specific-tools { display: flex; - align-items: center; - justify-content: space-evenly; - .el-button { + z-index: 999; padding: 0; margin: 0 0.015rem; width: 45px; height: 45px; background: @background-color-tools; border: none; + .base-map-img{ + position: absolute; + } + .base-map-img:hover{ + cursor:pointer; + } img { width: 22px; @@ -352,6 +402,7 @@ } .specific-tools-group { + z-index: 1; .tools-panel-choose { border: none; box-shadow: 0 0 0.03rem @color-shadow; @@ -374,4 +425,11 @@ } } } +.isD-enter-active, .isD-leave-active{ + transition: all 0.5s; +} +.isD-enter, .isD-leave-to{ + opacity: 0; + transform: translateX(-100px); +} </style> -- Gitblit v1.8.0