mirror of
https://gitee.com/fantastic-admin/basic.git
synced 2024-12-05 21:47:55 +08:00
优化menu全局状态,合并setHeaderActived和switchHeaderActived两个action
This commit is contained in:
parent
4ab6d83c16
commit
af9eb0cb06
@ -179,8 +179,8 @@ const settings = ref(globalSettings)
|
||||
|
||||
watch(() => settings, () => {
|
||||
settingsStore.updateThemeSetting(settings.value)
|
||||
menuStore.switchHeaderActived(0)
|
||||
settings.value.menu.menuMode !== 'single' && menuStore.setHeaderActived(route.fullPath)
|
||||
menuStore.setActived(0)
|
||||
settings.value.menu.menuMode !== 'single' && menuStore.setActived(route.fullPath)
|
||||
}, {
|
||||
deep: true
|
||||
})
|
||||
|
@ -7,7 +7,7 @@
|
||||
<!-- 顶部模式 -->
|
||||
<div class="nav">
|
||||
<template v-for="(item, index) in menuStore.allMenus">
|
||||
<div v-if="item.children && item.children.length !== 0" :key="index" class="item" :class="{'active': index == menuStore.headerActived}" @click="switchMenu(index)">
|
||||
<div v-if="item.children && item.children.length !== 0" :key="index" class="item" :class="{'active': index == menuStore.actived}" @click="switchMenu(index)">
|
||||
<svg-icon v-if="item.meta.icon" :name="item.meta.icon" />
|
||||
<span v-if="item.meta.title">{{ item.meta.title }}</span>
|
||||
</div>
|
||||
|
@ -8,7 +8,7 @@
|
||||
<div
|
||||
v-if="item.children && item.children.length !== 0" :key="index" :class="{
|
||||
'item': true,
|
||||
'active': index === menuStore.headerActived
|
||||
'active': index === menuStore.actived
|
||||
}" :title="item.meta.title" @click="switchMenu(index)"
|
||||
>
|
||||
<svg-icon v-if="item.meta.icon" :name="item.meta.icon" />
|
||||
|
@ -90,7 +90,7 @@ function reload() {
|
||||
|
||||
provide('switchMenu', switchMenu)
|
||||
function switchMenu(index) {
|
||||
menuStore.switchHeaderActived(index)
|
||||
menuStore.setActived(index)
|
||||
if (settingsStore.menu.switchMainMenuAndPageJump) {
|
||||
if (isExternalLink(menuStore.sidebarMenusFirstDeepestPath)) {
|
||||
window.open(menuStore.sidebarMenusFirstDeepestPath, '_blank')
|
||||
|
@ -152,7 +152,7 @@ router.beforeEach(async(to, from, next) => {
|
||||
// 是否已根据权限动态生成并挂载路由
|
||||
if (routeOutsideStore.isGenerate) {
|
||||
// 导航栏如果不是 single 模式,则需要根据 path 定位主导航的选中状态
|
||||
settingsOutsideStore.menu.menuMode !== 'single' && menuOutsideStore.setHeaderActived(to.path)
|
||||
settingsOutsideStore.menu.menuMode !== 'single' && menuOutsideStore.setActived(to.path)
|
||||
if (to.name) {
|
||||
if (to.matched.length !== 0) {
|
||||
// 如果已登录状态下,进入登录页会强制跳转到控制台页面
|
||||
|
@ -34,7 +34,7 @@ export const useMenuStore = defineStore(
|
||||
'menu',
|
||||
{
|
||||
state: () => ({
|
||||
headerActived: 0
|
||||
actived: 0
|
||||
}),
|
||||
getters: {
|
||||
// 完整导航数据
|
||||
@ -54,7 +54,7 @@ export const useMenuStore = defineStore(
|
||||
},
|
||||
// 次导航数据
|
||||
sidebarMenus() {
|
||||
return this.allMenus.length > 0 ? this.allMenus[this.headerActived].children : []
|
||||
return this.allMenus.length > 0 ? this.allMenus[this.actived].children : []
|
||||
},
|
||||
// 次导航里第一个导航的路径
|
||||
sidebarMenusFirstDeepestPath() {
|
||||
@ -73,22 +73,23 @@ export const useMenuStore = defineStore(
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
// 根据路由判断属于哪个头部导航
|
||||
setHeaderActived(path) {
|
||||
const routeStore = useRouteStore()
|
||||
routeStore.routes.map((item, index) => {
|
||||
if (
|
||||
item.children.some(r => {
|
||||
return path.indexOf(r.path + '/') === 0 || path == r.path
|
||||
})
|
||||
) {
|
||||
this.headerActived = index
|
||||
}
|
||||
})
|
||||
},
|
||||
// 切换头部导航
|
||||
switchHeaderActived(index) {
|
||||
this.headerActived = index
|
||||
// 切换主导航
|
||||
setActived(data) {
|
||||
if (typeof data === 'number') {
|
||||
// 如果是 number 类型,则认为是主导航的索引
|
||||
this.actived = data
|
||||
} else {
|
||||
// 如果是 string 类型,则认为是路由,需要查找对应的主导航索引
|
||||
this.allMenus.map((item, index) => {
|
||||
if (
|
||||
item.children.some(r => {
|
||||
return data.indexOf(r.path + '/') === 0 || data == r.path
|
||||
})
|
||||
) {
|
||||
this.actived = index
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -56,7 +56,7 @@ export const useUserStore = defineStore(
|
||||
this.token = ''
|
||||
this.failure_time = ''
|
||||
routeStore.removeRoutes()
|
||||
menuStore.switchHeaderActived(0)
|
||||
menuStore.setActived(0)
|
||||
resolve()
|
||||
})
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user