From d96de2f15f91d4e40562b27f2b6f2de3c700821d Mon Sep 17 00:00:00 2001 From: chenzeping <ChenZeping02609@163.com> Date: 星期一, 15 三月 2021 18:19:37 +0800 Subject: [PATCH] 修改左上角功能实现部分 --- src/components/panel/ToolBoxPanel.vue | 45 ++++++++++++++++++++++++++++++--------------- 1 files changed, 30 insertions(+), 15 deletions(-) diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue index 1bc1804..7707776 100644 --- a/src/components/panel/ToolBoxPanel.vue +++ b/src/components/panel/ToolBoxPanel.vue @@ -9,7 +9,7 @@ <el-row v-show="selectGroup" class="specific-tools-group"> <el-popover placement="bottom" - width="200" + width="" trigger="click" :popper-class="'tools-panel-content'" v-for="(item,index) in menuList" :key="index" @@ -19,7 +19,9 @@ <span>{{ item.label }}</span> </el-button> <el-button v-for="(itemT,indexT) in item.items" :key="indexT"> - <i class="el-icon-s-tools"></i> + <!-- <i class="el-icon-s-tools"></i>--> + <img :src="itemT.icon" alt=""/> + <!-- <span>{{ itemT.label }}</span>--> </el-button> </el-popover> </el-row> @@ -31,10 +33,17 @@ </template> <script> -import circle from '@assets/images/map-pages/icon/toolbox/biaohui.png' -import location from '@assets/images/map-pages/icon/toolbox/celiang1.png' -import polygon from '@assets/images/map-pages/icon/toolbox/ditu.png' +import plot from '@assets/images/map-pages/icon/toolbox/biaohui.png' +import polygon from '@assets/images/map-pages/icon/toolbox/celiang1.png' +import location from '@assets/images/map-pages/icon/toolbox/ditu.png' import fullscreen from '@assets/images/map-pages/icon/toolbox/xiazai.png' + +// 鏍囩粯鐨勫彲閫夋嫨鏁版嵁 +import marker from '@assets/images/map-pages/icon/toolbox/map.png' +import line from '@assets/images/map-pages/icon/toolbox/line.png' +import polygonJ from '@assets/images/map-pages/icon/toolbox/polygon.png' +import polygonS from '@assets/images/map-pages/icon/toolbox/ju.png' +import polygonY from '@assets/images/map-pages/icon/toolbox/circle.png' // import square from '@/assets/images/map-pages/icon/toolbox/square.png' // 娴嬮噺鐨勬柟娉� @@ -52,29 +61,34 @@ return { menuList: [ { - icon: circle, + icon: plot, label: '鏍囩粯', index: '1', items: [ { index: '1-1', - label: '鐐规爣缁�' + label: '鐐规爣缁�', + icon: marker }, { index: '1-2', - label: '绾挎爣缁�' - }, - { - index: '1-3', - label: '鍦嗗舰' + label: '绾挎爣缁�', + icon: line }, { index: '1-4', - label: '澶氳竟褰�' + label: '澶氳竟褰�', + icon: polygonJ }, { index: '1-5', - label: '鐭╁舰' + label: '鐭╁舰', + icon: polygonS + }, + { + index: '1-3', + label: '鍦嗗舰', + icon: polygonY } ] }, @@ -253,6 +267,7 @@ height: 45px; background: @background-color-tools; border: none; + box-shadow: 0 0 0.03rem #00fff6; img { width: 22px; @@ -262,7 +277,7 @@ span { display: block; font-size: 0.012rem; - color: @color-over; + color: @color-tool; } } -- Gitblit v1.8.0