From 3ca24d97c52399dcbd93165bf5c01e2ee2af7823 Mon Sep 17 00:00:00 2001
From: chenzeping <ChenZeping02609@163.com>
Date: 星期一, 15 三月 2021 09:13:48 +0800
Subject: [PATCH] 修改功能样式

---
 src/components/panel/ToolBoxPanel.vue |  203 ++++++++++++++++++++++++++++++--------------------
 1 files changed, 123 insertions(+), 80 deletions(-)

diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue
index 74a25e2..92aeed5 100644
--- a/src/components/panel/ToolBoxPanel.vue
+++ b/src/components/panel/ToolBoxPanel.vue
@@ -8,8 +8,6 @@
                mode="horizontal"
                :collapse="isCollapse"
                unique-opened
-               @open="handleOpen"
-               @close="handleClose"
                @select="handleSelect"
                v-show='selectGroup'
       >
@@ -46,85 +44,115 @@
     return {
       menuList: [
         {
-          title: circle,
-          alt: '鏍囩粯',
+          icon: circle,
+          label: '鏍囩粯',
+          index: '1',
           items: [
             {
-              headings: '鐐规爣缁�'
+              index: '1-1',
+              label: '鐐规爣缁�'
             },
             {
-              headings: '绾挎爣缁�'
+              index: '1-2',
+              label: '绾挎爣缁�'
             },
             {
-              headings: '闈㈡爣缁�',
+              index: '1-3',
+              label: '闈㈡爣缁�',
               items: [
-                { headings: '鍦嗗舰' },
-                { headings: '澶氳竟褰�' },
-                { headings: '鐭╁舰' }
-              ]
-            }
-          ]
-        },
-        // {
-        //   title: square,
-        //   alt: '鏍囨敞',
-        //   items: [
-        //     { headings: '鐐规爣娉�' },
-        //     { headings: '绾挎爣娉�' },
-        //     { headings: '闈㈡爣娉�' },
-        //     { headings: '鏂囧瓧鏍囨敞' },
-        //     { headings: '鍥炬爣鏍囨敞' }
-        //   ]
-        // },
-        // {
-        //   title: legend,
-        //   alt: '娴嬮噺',
-        //   items: [
-        //     { headings: '璺濈娴嬮噺' },
-        //     { headings: '闈㈢Н娴嬮噺' }
-        //   ]
-        // },
-        {
-          title: location,
-          alt: '鍒囨崲搴曞浘',
-          items: [
-            {
-              headings: '褰卞儚鍥�',
-              items: [
-                { headings: '褰卞儚妯欐敞' }
-              ]
-            },
-            {
-              headings: '鐭㈤噺鍥�',
-              items: [
-                { headings: '鐭㈤噺妯欐敞' }
-              ]
-            },
-            {
-              headings: '鍦板舰鍥�',
-              items: [
-                { headings: '鍦板舰妯欐敞' }
+                {
+                  index: '1-3-1',
+                  label: '鍦嗗舰'
+                },
+                {
+                  index: '1-3-2',
+                  label: '澶氳竟褰�'
+                },
+                {
+                  index: '1-3-3',
+                  label: '鐭╁舰'
+                }
               ]
             }
           ]
         },
         {
-          title: polygon,
-          alt: '绠$綉',
+          icon: location,
+          label: '鍒囨崲搴曞浘',
+          index: '2',
           items: [
-            { headings: '杩為�氭�у垎鏋�' },
-            { headings: '鐖嗙鍒嗘瀽' },
-            { headings: '娴佸悜鍒嗘瀽' },
-            { headings: '妯柇闈㈠垎鏋�' }
+            {
+              label: '褰卞儚鍥�',
+              index: '2-1',
+              items: [
+                {
+                  index: '2-1-1',
+                  label: '褰卞儚妯欐敞'
+                }
+              ]
+            },
+            {
+              label: '鐭㈤噺鍥�',
+              index: '2-2',
+              items: [
+                {
+                  index: '2-2-1',
+                  label: '鐭㈤噺妯欐敞'
+                }
+              ]
+            },
+            {
+              label: '鍦板舰鍥�',
+              index: '2-3',
+              items: [
+                {
+                  index: '2-3-1',
+                  label: '鍦板舰妯欐敞'
+                }
+              ]
+            }
           ]
         },
         {
-          title: fullscreen,
-          alt: '涓嬭浇',
+          icon: polygon,
+          label: '绠$綉',
+          index: '3',
           items: [
-            { headings: '鍏ㄥ睆' },
-            { headings: 'A4妯悜' },
-            { headings: 'A4绾靛悜' }
+            {
+              index: '3-1',
+              label: '杩為�氭�у垎鏋�'
+            },
+            {
+              index: '3-2',
+              label: '鐖嗙鍒嗘瀽'
+            },
+            {
+              index: '3-3',
+              label: '娴佸悜鍒嗘瀽'
+            },
+            {
+              index: '3-4',
+              label: '妯柇闈㈠垎鏋�'
+            }
+          ]
+        },
+        {
+          icon: fullscreen,
+          label: '涓嬭浇',
+          index: '4',
+          items: [
+            {
+              index: '4-1',
+              label: '鍏ㄥ睆'
+            },
+            {
+              index: '4-2',
+              label: 'A4妯悜'
+            },
+            {
+              index: '4-3',
+              label: 'A4绾靛悜'
+            }
           ]
         }
       ],
@@ -142,19 +170,10 @@
     },
     handleClose () {
     },
-    handleSelect (index, indexPath) {
-
-    },
-    gitBounced (params) {
-      this.bouncedText = params
-    },
-    changeSelect () {
-      this.selectGroup = !this.selectGroup
-    },
-    handleSelects (command) {
-      console.log(command)
-      switch (command) {
-        case '鍏ㄥ睆':
+    handleSelect (index) {
+      console.log(index)
+      switch (index) {
+        case '4-1':
           // this.map.toggleFullscreen()
           var printer = this.L.easyPrint({
             sizeModes: ['Current', 'A4Landscape', 'A4Portrait'],
@@ -212,13 +231,18 @@
           Measure.startMeasureArea(this.map, this.L)
           break
       }
+    },
+    gitBounced (params) {
+      this.bouncedText = params
+    },
+    changeSelect () {
+      this.selectGroup = !this.selectGroup
     }
   }
 }
 </script>
 
 <style lang="less">
-
 .lefttop-toolbox-panel {
   position: absolute;
   left: 15px;
@@ -231,7 +255,6 @@
     line-height: 55px;
     display: flex;
     align-items: center;
-    justify-content: space-around;
 
     .init-choose {
       background: #305B62;
@@ -246,12 +269,21 @@
     }
 
     .el-menu {
-      width: 80%;
+      width: 100%;
       background: none;
       z-index: 1;
       border: none;
       background: #305B62;
       border-radius: 50px;
+      //margin-left: -30px;
+
+      .el-icon-arrow-down:before {
+        content: " ";
+      }
+
+      .el-submenu__title:focus, .el-submenu__title:hover {
+        background: none;
+      }
     }
   }
 
@@ -279,4 +311,15 @@
   //}
 
 }
+.el-menu--horizontal {
+  .el-menu--popup {
+    min-width: 100px;
+    .el-menu-item {
+      min-width: 50px;
+    }
+  }
+}
+ul {
+  padding-inline-start: 0;
+}
 </style>

--
Gitblit v1.8.0