gaosp
2024-01-19 5b9a1d6cb3a7d59c8f2de83c495bba1a069b2723
src/container/home/index.vue
@@ -3,12 +3,12 @@
        <template slot="menu">
            <div class="menu-container">
                <ul class="nav">
                    <li v-for="item in navs" :key="item.id" :class="activeId === item.id ? 'active' : ''" @click="goTo(item)">
                    <li v-for="item in userMenu" :key="item.label" :class="activeId === item.label ? 'active' : ''" @click="goTo(item)">
                        <span>
                            {{ item.label }}
                            <i class="el-icon-caret-bottom" v-show="item.children && item.children.length > 0"></i>
                        </span>
                        <ul class="nav-sub" v-if="item.children && item.children.length > 0 && activeId === item.id && showSub">
                        <ul class="nav-sub" v-if="item.children && item.children.length > 0 && activeId === item.label && showSub">
                            <li v-for="child in item.children" @click="goTo(child)">{{ child.label }}</li>
                        </ul>
                    </li>
@@ -150,7 +150,7 @@
        }
    },
    computed: {
        ...mapGetters(['userInfo','workshopList'])
        ...mapGetters(['userInfo','workshopList','userMenu'])
    },
    watch: {
        workshopList() {
@@ -199,19 +199,19 @@
            })
        },
        goTo (item) {
            if (item.id) {
                if (item.id === this.activeId) {
            if (item.children && item.children.length > 0) { // 有子菜单
                if (item.label === this.activeId) {
                    this.showSub = !this.showSub
                } else {
                    this.showSub = true
                }
                this.activeId = item.id || this.activeId
                if(item.pathName) {
                    this.$router.push({name: item.pathName,params: item.params,query: item.query})
                }
            } else if(item.pathName){//二级菜单
                this.activeId = item.label || this.activeId
            } else if (item.pathName && item.children && item.children.length === 0) { //父菜单
                this.activeId = item.label || this.activeId
                this.$router.push({name: item.pathName,params: item.params,query: item.query})
            } else if(item.href) {
            } else if(item.pathName){ //二级菜单
                this.$router.push({name: item.pathName,params: item.params,query: item.query})
            } else if(item.href) {// 打开新页
                window.open(item.href)
            }
        },
@@ -265,13 +265,17 @@
                z-index: 999;
                background: rgba(0,0,0,.5);
                text-align: center;
                border: 1px solid #0170bc;
                // border: 1px solid #0170bc;
                li {
                    padding: 4px;
                    margin: 0;
                    color: #FFF;
                    background: url('./nav-li.png') 100% 100% no-repeat;
                    background-size: contain;
                }
                li:hover {
                    background: url('./nav-li-active.png') 100% 100% no-repeat;
                    background-size: contain;
                    color: #68D9FF;
                }
            }