11

lkk

2025-03-31 bad2bc143be3f8ddb93a1c9f984127b3ccf43e8f

 src/layout/components/Sidebar/index.vue

@@ -2,6 +2,7 @@
    <div :class="{'has-logo':showLogo}" :style="{ backgroundColor: settings.sideTheme === 'theme-dark' ? variables.menuBackground : variables.menuLightBackground }">
        <logo v-if="showLogo" :collapse="isCollapse" />
        <el-scrollbar :class="settings.sideTheme" wrap-class="scrollbar-wrapper">
            <!--  :default-openeds="['/tijian']"    :default-openeds="defaultOpeneds" -->
            <el-menu
                :default-active="activeMenu"
                :collapse="isCollapse"
@@ -17,6 +18,7 @@
                    :key="route.path  + index"
                    :item="route"
                    :base-path="route.path"
                    :arrIndex="route.path"
                />
            </el-menu>
        </el-scrollbar>
@@ -24,6 +26,7 @@
</template>

<script>
import { getRouters } from '@/api/menu'
import { mapGetters, mapState } from "vuex";
import Logo from "./Logo";
import SidebarItem from "./SidebarItem";
@@ -31,18 +34,27 @@

export default {
    components: { SidebarItem, Logo },
    data() {
    return {
      defaultActive: [],
      defaultOpeneds: [],
      activeMenu: '',
    };
  },
    computed: {
        ...mapState(["settings"]),
        ...mapGetters(["sidebarRouters", "sidebar"]),
        activeMenu() {
            const route = this.$route;
            const { meta, path } = route;
            // if set path, the sidebar will highlight the path you set
            if (meta.activeMenu) {
                return meta.activeMenu;
            }
            return path;
        },
      
        // activeMenu() {
        //     const route = this.$route;
        //     const { meta, path } = route;
        //     console.log(meta,path)
        //     // if set path, the sidebar will highlight the path you set
        //     if (meta.activeMenu) {
        //         return meta.activeMenu;
        //     }
        //     return path;
        // },
        showLogo() {
            return this.$store.state.settings.sidebarLogo;
        },
@@ -52,6 +64,18 @@
        isCollapse() {
            return !this.sidebar.opened;
        }
    }
    },
    created() {
    this.route();
  },
    methods: {
        route(){
        getRouters().then(res => {
            this.defaultActive = res.data
            // this.defaultOpeneds = [this.defaultActive[0].path,this.defaultActive[0].path+"/"+this.defaultActive[0].children[0].path]
            this.activeMenu = this.defaultActive[0].path+"/"+this.defaultActive[0].children[0].path+"/"+this.defaultActive[0].children[0].children[0].path
        })
       },
    },
};
</script>