yangys
2024-01-16 30ab871400e5064bc38085ef64931b8dc1f64fb9
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%;