From e48137c53bd78960f98434436cd2de3303ccf9e8 Mon Sep 17 00:00:00 2001
From: gaosp <gaosp>
Date: 星期二, 16 一月 2024 21:27:58 +0800
Subject: [PATCH] 更新样式

---
 src/container/home/index.vue |   63 ++++++++++++++++++++++++++++---
 1 files changed, 57 insertions(+), 6 deletions(-)

diff --git a/src/container/home/index.vue b/src/container/home/index.vue
index 7cae30b..a29f5de 100644
--- a/src/container/home/index.vue
+++ b/src/container/home/index.vue
@@ -2,13 +2,13 @@
     <Home>
         <template slot="menu">
             <div class="menu-container">
-                <ul>
+                <ul class="nav">
                     <li v-for="item in navs" :key="item.id" :class="activeId === item.id ? 'active' : ''" @click="goTo(item)">
                         <span>
                             {{ item.label }}
                             <i class="el-icon-caret-bottom" v-show="item.children && item.children.length > 0"></i>
                         </span>
-                        <ul v-if="activeId === item.id && showSub">
+                        <ul class="nav-sub" v-if="item.children && item.children.length > 0 && activeId === item.id && showSub">
                             <li v-for="child in item.children" @click="goTo(child)">{{ child.label }}</li>
                         </ul>
                     </li>
@@ -37,12 +37,14 @@
                 {
                     label: '鐘舵�佺洃鎺�',
                     pathName: '',
-                    id: 1
+                    id: 1,
+                    chilren: []
                 },
                 {
                     label: '澶у睆灞曠ず',
                     pathName: 'preview',
                     id: 2,
+                    chilren: []
                 },
                 {
                     label: '杞﹂棿鍦板浘',
@@ -116,11 +118,13 @@
                 {
                     label: '鐝璁剧疆',
                     id: 7,
+                    chilren: []
                 },
                 {
                     label: '宸ヤ欢淇℃伅',
                     pathName: 'component',
                     id: 8,
+                    chilren: []
                 },
                 {
                     label: '鏇村鑿滃崟',
@@ -147,6 +151,45 @@
     },
     computed: {
         ...mapGetters(['userInfo','workshopList'])
+    },
+    watch: {
+        workshopList() {
+            this.$set(this.navs,3 ,{
+                ...this.navs[3],
+                children: this.workshopList.map(item => {
+                    return {
+                        label: item.name,
+                        value: item.id,
+                        pathName: 'workshop',
+                        params: {
+                            id: item.id
+                        },
+                        query: {
+                            name: item.name
+                        }
+                    }
+                })
+            })
+        }
+    },
+    created () {
+        this.$set(this.navs, 3 ,{
+            ...this.navs[3],
+            children: this.workshopList.map(item => {
+                    return {
+                        label: item.name,
+                        value: item.id,
+                        pathName: 'workshop',
+                        params: {
+                            id: item.id
+                        },
+                        query: {
+                            name: item.name
+                        }
+                    }
+                })
+        })
+        // this.navs[3].children = workshopList
     },
     methods: {
         logout() {
@@ -189,9 +232,14 @@
         list-style: none;
         display: flex;
         & > li {
+            width: 112px;
+            height: 40px;
+            line-height: 38px;
+            text-align: center;
             cursor: pointer;
-            background: #27394E;
-            padding: 0 12px;
+            // background: #27394E;
+            background: url('./nav-li.png') 100% 100% no-repeat;
+            background-size: contain;
             white-space: nowrap;
             text-overflow: ellipsis;
             position: relative;
@@ -202,9 +250,12 @@
             // user-select:none;
         }
         & > li.active {
-            & > ul {
+            background: url('./nav-li-active.png') 100% 100% no-repeat;
+            background-size: contain;
+            & > ul.nav-sub {
                 padding: 0;
                 margin: 0;
+                margin-top: 5px;
                 padding-inline: 0;
                 list-style: none;
                 min-width: 100%;

--
Gitblit v1.9.3