From acf1cadd6e2af1f288192e02e5b8303841d85c4b Mon Sep 17 00:00:00 2001
From: chenzeping <ChenZeping02609@163.com>
Date: 星期三, 17 三月 2021 14:47:06 +0800
Subject: [PATCH] 功能弹出事件更改

---
 src/components/panel/ToolBoxPanel.vue |   71 ++++++++++++++++++++---------------
 1 files changed, 40 insertions(+), 31 deletions(-)

diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue
index 8d942da..2fdb720 100644
--- a/src/components/panel/ToolBoxPanel.vue
+++ b/src/components/panel/ToolBoxPanel.vue
@@ -1,13 +1,10 @@
 <template>
   <div class="left-top-toolbox-panel">
     <div class="specific-tools">
-      <el-button class="el-button-choice" @click="changeSelect" v-show="selectGroup">
-        <img src="@assets/images/map-pages/icon/toolbox/tool.png" alt="">
-        <span>宸ュ叿</span>
-      </el-button>
-      <el-button class="el-button-choice" @click="changeSelect" v-show="!selectGroup">
-        <img src="@assets/images/map-pages/icon/toolbox/Selecd/tool.png" alt="">
-        <a>宸ュ叿</a>
+      <el-button :class="selectGroup === true ?'active-button':''" class="el-button-choice"
+                 @mouseover.enter.native="changeSelectMouse">
+        <img src="@assets/images/map-pages/icon/toolbox/Selecd/tool.png" alt=""/>
+        <span class="span-default">宸ュ叿</span>
       </el-button>
       <transition name="animationChange">
         <el-row v-show="selectGroup" class="specific-tools-group">
@@ -95,6 +92,11 @@
       isShow: true,
       currentBaseMapCode: 'tianditu_img',
       basemapList: [],
+      selectGroup: false,
+      drawLayer: null,
+      map: null,
+      active: -1,
+      Selecd: -1,
       menuList: [
         {
           icon: plot,
@@ -239,13 +241,7 @@
             }
           ]
         }
-      ],
-      selectGroup: false,
-      drawLayer: null,
-      map: null,
-      // L: window.L,
-      active: -1,
-      Selecd: -1
+      ]
     }
   },
   computed: {
@@ -283,6 +279,9 @@
       })
     },
     changeChoose (index) {
+      if (this.active === index) {
+        console.log('鍙栨秷褰撳墠閫変腑鐘舵��')
+      }
       this.active = index
       if (this.drawLayer == null) {
         this.drawLayer = this.L.layerGroup().addTo(this.map)
@@ -368,12 +367,15 @@
     setLogic (layer) {
       layer.on('dblclick', this.L.DomEvent.stop).on('dblclick', layer.toggleEdit)
       layer.setStyle({
-        color: 'red'
+        color: 'yellow'
       })
     },
     changeSelect () {
-      this.selectGroup = !this.selectGroup
+      this.selectGroup = false
       this.isShow = !this.isShow
+    },
+    changeSelectMouse () {
+      this.selectGroup = true
     }
   }
 }
@@ -404,8 +406,9 @@
       margin: 0 0.015rem;
       width: 45px;
       height: 45px;
-      background: @background-color-tools;
-      border: none;
+      background: @background-color;
+      //border: 1px solid @color-shadow;
+      vertical-align: middle !important;
 
       .base-map-img {
         position: absolute;
@@ -420,14 +423,14 @@
         height: 22px;
       }
 
-      span {
-        display: block;
-        color: @color-tool;
-      }
-
-      a {
+      .span-default {
         display: block;
         color: @color-shadow;
+      }
+
+      span {
+        display: block;
+        color: @color-over;
       }
     }
 
@@ -437,8 +440,13 @@
       margin: 0 0.015rem;
       width: 45px;
       height: 45px;
-      background: @background-color-tools;
+      background: @background-color;
       border: 1px solid @color-shadow;
+    }
+
+    .active-button {
+      border: 0.00521rem solid #fff700;
+      box-shadow: 0 0 0.03rem #fff700;
     }
 
     .specific-tools-group {
@@ -464,7 +472,7 @@
           position: absolute;
           margin-left: 2px;
           background-color: rgba(0, 0, 0, .5);
-          color: white;
+          color: @color-over;
 
           .el-checkbox__label {
             padding-left: 5px !important;
@@ -503,14 +511,15 @@
 
         span {
           display: block;
+          color: @color-shadow;
         }
       }
-    }
 
-    .special-button {
-      width: 22.5px;
-      height: 45px;
-      color: @color-over;
+      .special-button {
+        width: 22px;
+        height: 45px;
+        color: @color-over;
+      }
     }
   }
 }

--
Gitblit v1.8.0