From be1f4296a09f907fd3218bc423d24b817a761229 Mon Sep 17 00:00:00 2001
From: Surpriseplus <845948745@qq.com>
Date: 星期四, 16 二月 2023 16:33:21 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.20.39:8989/r/LFWEB_NEW

---
 src/components/Screen/bottom.vue |  174 ++++++++++++++++++++++++++++++++++++++++++++++------------
 1 files changed, 138 insertions(+), 36 deletions(-)

diff --git a/src/components/Screen/bottom.vue b/src/components/Screen/bottom.vue
index be02463..1fba300 100644
--- a/src/components/Screen/bottom.vue
+++ b/src/components/Screen/bottom.vue
@@ -3,7 +3,13 @@
     <div class="bottom1">
       <div class="bottom11"></div>
       <div class="bottom12">
-        <div class="bottombtn">
+        <div
+          :class="currMenu == item.menuName ? 'active' : ''"
+          v-for="item in menuList"
+          :key="item.menuName"
+          class="bottombtn"
+          @click="handleMenuClick(item)"
+        >
           <el-popover
             popper-class="popover"
             placement="top"
@@ -17,26 +23,15 @@
               <div class="popover-content__list">
                 <div
                   class="popover-content__list__item"
-                  v-for="item in projectInfoList"
-                  :key="item.id"
-                  :class="currProject == item.name ? 'active' : ''"
+                  v-for="child in item.children"
+                  :key="child.id"
+                  :class="currProject == child.name ? 'active' : ''"
+                  @click="handlePopoverClick(child)"
                 >
-                  {{ item.name }}
+                  {{ child.name }}
                 </div>
               </div>
             </div>
-          </el-popover>
-        </div>
-        <div class="bottombtn">
-          <el-popover placement="top" width="100" trigger="click">
-            <!-- 鍐呭 -->
-            <span slot="reference">宸ョ▼灞曠ず</span>
-          </el-popover>
-        </div>
-        <div class="bottombtn">
-          <el-popover placement="top" width="100" trigger="click">
-            <!-- 鍐呭 -->
-            <span slot="reference">宸ョ▼宸¤</span>
           </el-popover>
         </div>
       </div>
@@ -55,23 +50,71 @@
     return {
       YXState: true,
       yxImg: require("../../assets/img/Screen/yximg.png"),
+      currMenu: "椤圭洰灞曠ず",
       currProject: "鍏ㄧ悆绠$綉鍥�",
-      projectInfoList: [
+      menuList: [
         {
-          name: "鍏ㄥ浗绠$綉鍥�",
-          id: "qggwt",
+          menuName: "椤圭洰灞曠ず",
+          children: [
+            {
+              name: "鍏ㄥ浗绠$綉鍥�",
+              id: "qggwt",
+            },
+            {
+              name: "鍏ㄧ悆绠$綉鍥�",
+              id: "qqgwt",
+            },
+            {
+              name: "鍏ㄥ浗椤圭洰",
+              id: "qgxm",
+            },
+            {
+              name: "鍏ㄧ悆椤圭洰",
+              id: "qqxm",
+            },
+          ],
         },
         {
-          name: "鍏ㄧ悆绠$綉鍥�",
-          id: "qqgwt",
+          menuName: "宸ョ▼灞曠ず",
+          children: [
+            {
+              name: "涓縿涓滅嚎绠¢亾宸ョ▼",
+              id: "zedx",
+            },
+            {
+              name: "瑗挎皵涓滆緭涓夌嚎涓柇绠¢亾宸ョ▼",
+              id: "xqds",
+            },
+            {
+              name: "涓紖澶╃劧姘旂閬撳伐绋�",
+              id: "zmtrq",
+            },
+            {
+              name: "灞变笢瀹樼綉鏂板共绾�",
+              id: "sdxgx",
+            },
+          ],
         },
         {
-          name: "鍏ㄥ浗椤圭洰",
-          id: "qgxm",
-        },
-        {
-          name: "鍏ㄧ悆椤圭洰",
-          id: "qqxm",
+          menuName: "宸ョ▼宸¤",
+          children: [
+            {
+              name: "涓縿涓滅嚎绠¢亾宸ョ▼",
+              id: "zedx",
+            },
+            {
+              name: "瑗挎皵涓滆緭涓夌嚎涓柇绠¢亾宸ョ▼",
+              id: "xqds",
+            },
+            {
+              name: "涓紖澶╃劧姘旂閬撳伐绋�",
+              id: "zmtrq",
+            },
+            {
+              name: "灞变笢瀹樼綉鏂板共绾�",
+              id: "sdxgx",
+            },
+          ],
         },
       ],
     }
@@ -91,6 +134,28 @@
         Viewer.imageryLayers._layers[3].show = true
       }
       this.YXState = !this.YXState
+    },
+    handleMenuClick(menu) {
+      this.currMenu = menu.menuName
+    },
+    handlePopoverClick(child) {
+      this.currProject = child.name
+    },
+
+    //椤圭洰灞曠ず
+    DisplayCurrentProject(parm) {
+      console.log(parm)
+      //鎵撳紑鎴栬�呭姞杞藉浘灞�
+
+      //椋炲埌鎸囧畾浣嶇疆
+    },
+
+    //宸ョ▼婕父椋炶
+    FlyCurrentProject(parm) {
+      console.log(parm)
+      //鎵撳紑鎴栬�呭姞杞藉浘灞�
+
+      //寮�濮嬮琛�
     },
   },
 }
@@ -140,7 +205,7 @@
     .bottombtn {
       height: 36px;
       width: 147px;
-      background: url(../../assets/img/Screen/centerbtn.png);
+      background: url(~@/assets/img/Screen/centerbtn.png);
       background-size: 100% 100%;
       background-repeat: no-repeat;
       font-size: 1rem;
@@ -150,6 +215,10 @@
       color: #fff;
       font-weight: 600;
       cursor: pointer;
+      &.active {
+        background: url(~@/assets/img/Screen/centerbtnc.png);
+        background-size: 100% 100%;
+      }
     }
   }
 
@@ -167,25 +236,58 @@
   }
 }
 .popover {
-  background-color: aqua;
-
+  display: flex;
+  justify-content: center;
+  width: 163px;
+  height: 239px;
+  background: url(~@/assets/img/Screen/centerTooltip.png);
+  background-size: 100% 100%;
+  border: none;
+  .popper__arrow {
+    display: none;
+  }
   .popover-content {
     &__header {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      text-align: center;
+      width: 130px;
+      height: 30px;
+      font-size: 18px;
+      color: #fff;
       &::before,
       &::after {
+        margin: 0 5px;
         content: "";
         display: inline-block;
-        background-color: aqua;
+        background-color: #466c99;
         border-radius: 50%;
-        width: 10px;
-        height: 10px;
+        width: 8px;
+        height: 8px;
       }
     }
     &__list {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-evenly;
+      height: 190px;
+
       &__item {
-        background-color: orange;
+        color: #fff;
+        width: 130px;
+        height: 30px;
+        line-height: 30px;
+        text-align: center;
+        // background-color: orange;
+        cursor: pointer;
+        background: url(~@/assets/img/Screen/btnbg.png);
+        background-size: 100% 100%;
+
         &.active {
-          background-color: aqua;
+          // background-color: aqua;
+          background: url(~@/assets/img/Screen/btnc.png);
+          background-size: 100% 100%;
         }
       }
     }

--
Gitblit v1.9.3