优化
This commit is contained in:
@@ -1,106 +1,60 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
import { useRoute, useRouter } from 'vue-router'
|
import { useRoute } from 'vue-router'
|
||||||
import { useUserStore } from '@/stores/user'
|
import { useUserStore } from '@/stores/user'
|
||||||
|
import { navConfig, navIcons } from '@/router'
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const router = useRouter()
|
|
||||||
const userStore = useUserStore()
|
const userStore = useUserStore()
|
||||||
|
|
||||||
// 单色 SVG 图标（填充 currentColor，可继承文本色）
|
function filterVisibleGroups(config, isLoggedIn) {
|
||||||
const icons = {
|
return config
|
||||||
home: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="M3 10.5 12 3l9 7.5"/><path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-7"/></svg>',
|
.filter(group => !group.requiresAuth || isLoggedIn)
|
||||||
grid: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>',
|
.map(group => ({
|
||||||
text: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="M4 7h16"/><path d="M4 12h10"/><path d="M4 17h14"/></svg>',
|
...group,
|
||||||
mic: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><rect x="9" y="2" width="6" height="11" rx="3"/><path d="M5 10a7 7 0 0 0 14 0"/><path d="M12 19v3"/></svg>',
|
items: group.items.filter(item => !item.requiresAuth || isLoggedIn)
|
||||||
wave: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="M2 12s2-4 5-4 3 8 6 8 3-8 6-8 3 4 3 4"/></svg>',
|
}))
|
||||||
user: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><circle cx="12" cy="7" r="4"/><path d="M5.5 21a8.38 8.38 0 0 1 13 0"/></svg>',
|
.filter(group => group.items.length > 0)
|
||||||
video: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="m22 8-6 4 6 4V8Z"/><rect x="2" y="6" width="14" height="12" rx="2" ry="2"/></svg>',
|
|
||||||
folder: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"/></svg>',
|
|
||||||
scissors: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><circle cx="6" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M8.59 13.51 15.42 17.49"/><path d="M15.41 6.51 8.59 10.49"/></svg>'
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const items = computed(() => {
|
const visibleNavConfig = computed(() => {
|
||||||
// 小标题（功能） + 模块（子菜单）的形式；使用单色 SVG 图标
|
return filterVisibleGroups(navConfig, userStore.isLoggedIn)
|
||||||
const allItems = [
|
|
||||||
{
|
|
||||||
title: '功能',
|
|
||||||
children: [
|
|
||||||
// { name: '首页', label: '首页', icon: 'home' },
|
|
||||||
{ name: '对标分析', label: '对标分析', icon: 'grid' },
|
|
||||||
{ name: '文案创作', label: '文案创作', icon: 'text' },
|
|
||||||
{ name: '热点预测', label: '热点趋势', icon: 'text' },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '数字人',
|
|
||||||
children: [
|
|
||||||
{ name: '人声克隆', label: '人声克隆', icon: 'mic' },
|
|
||||||
{ name: '数字人生成', label: "数字人", icon: "user" },
|
|
||||||
// { name: '数字人视频', label: '数字人视频', icon: 'video' },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '素材库',
|
|
||||||
children: [
|
|
||||||
{ name: '素材列表', label: '素材列表', icon: 'grid' },
|
|
||||||
{ name: '智能混剪', label: '智能混剪', icon: 'scissors' },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '任务管理',
|
|
||||||
children: [
|
|
||||||
{ name: '任务中心', label: '任务中心', icon: 'video', params: { type: 'mix-task' } },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '系统',
|
|
||||||
children: [
|
|
||||||
{ name: '风格设置', label: '风格设置', icon: 'text' },
|
|
||||||
]
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
// 如果未登录，过滤掉"系统"菜单组
|
|
||||||
if (!userStore.isLoggedIn) {
|
|
||||||
return allItems.filter(item => item.title !== '系统')
|
|
||||||
}
|
|
||||||
|
|
||||||
return allItems
|
|
||||||
})
|
})
|
||||||
|
|
||||||
function go(item) {
|
|
||||||
if (item.params) {
|
|
||||||
router.push({ name: item.name, params: item.params })
|
|
||||||
} else {
|
|
||||||
router.push({ name: item.name })
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<aside class="sidebar">
|
<aside class="sidebar">
|
||||||
<nav class="sidebar__nav">
|
<nav class="sidebar__nav">
|
||||||
<div v-for="group in items" :key="group.title" class="nav-group">
|
<div v-for="group in visibleNavConfig" :key="group.group" class="nav-group">
|
||||||
<div class="nav-group__title">{{ group.title }}</div>
|
<div class="nav-group__title">{{ group.group }}</div>
|
||||||
<button v-for="it in group.children" :key="it.name" class="nav-item" :class="{ 'is-active': route.name === it.name }" @click="go(it)">
|
<router-link
|
||||||
<span class="nav-item__icon" aria-hidden="true" v-html="icons[it.icon]"></span>
|
v-for="item in group.items"
|
||||||
<span class="nav-item__label">{{ it.label }}</span>
|
:key="item.name"
|
||||||
</button>
|
:to="{ name: item.name, ...(item.params && { params: item.params }) }"
|
||||||
|
class="nav-item"
|
||||||
|
:class="{ 'is-active': route.name === item.name }"
|
||||||
|
custom
|
||||||
|
v-slot="{ navigate }"
|
||||||
|
>
|
||||||
|
<button class="nav-item" @click="navigate">
|
||||||
|
<span class="nav-item__icon" v-html="navIcons[item.icon]"></span>
|
||||||
|
<span class="nav-item__label">{{ item.name }}</span>
|
||||||
|
</button>
|
||||||
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
</aside>
|
</aside>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.sidebar {
|
.sidebar {
|
||||||
position: sticky;
|
position: sticky;
|
||||||
top: 70px; /* 与 TopNav 高度一致 */
|
top: 70px;
|
||||||
height: calc(100vh - 70px);
|
height: calc(100vh - 70px);
|
||||||
width: 220px;
|
width: 220px;
|
||||||
border-right: 1px solid var(--color-border);
|
border-right: 1px solid var(--color-border);
|
||||||
background: var(--color-surface);
|
background: var(--color-surface);
|
||||||
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar__nav {
|
.sidebar__nav {
|
||||||
@@ -110,7 +64,12 @@ function go(item) {
|
|||||||
gap: 6px;
|
gap: 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-group { display: flex; flex-direction: column; gap: 6px; }
|
.nav-group {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
.nav-group__title {
|
.nav-group__title {
|
||||||
height: 30px;
|
height: 30px;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -155,7 +114,15 @@ function go(item) {
|
|||||||
color: var(--color-blue-800);
|
color: var(--color-blue-800);
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-item__icon { width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; }
|
.nav-item__icon {
|
||||||
.nav-item__label { font-size: 14px; }
|
width: 18px;
|
||||||
</style>
|
height: 18px;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav-item__label {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@@ -3,84 +3,139 @@ import { useUserStore } from '@/stores/user'
|
|||||||
import tokenManager from '@gold/utils/token-manager'
|
import tokenManager from '@gold/utils/token-manager'
|
||||||
import MainLayout from '@/layouts/MainLayout.vue'
|
import MainLayout from '@/layouts/MainLayout.vue'
|
||||||
|
|
||||||
|
// ============ 导航配置（统一定义） ============
|
||||||
|
const navConfig = [
|
||||||
|
{
|
||||||
|
group: '功能',
|
||||||
|
order: 1,
|
||||||
|
items: [
|
||||||
|
{ name: '对标分析', path: 'content-style/benchmark', icon: 'grid', component: () => import('../views/content-style/Benchmark.vue') },
|
||||||
|
{ name: '文案创作', path: 'content-style/copywriting', icon: 'text', component: () => import('../views/content-style/Copywriting.vue') },
|
||||||
|
{ name: '热点趋势', path: 'trends/forecast', icon: 'text', component: () => import('../views/trends/Forecast.vue') },
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
group: '数字人',
|
||||||
|
order: 2,
|
||||||
|
items: [
|
||||||
|
{ name: '数字人', path: 'digital-human/kling', icon: 'user', component: () => import('../views/kling/IdentifyFace.vue') },
|
||||||
|
{ name: '人声克隆', path: 'digital-human/voice-copy', icon: 'mic', component: () => import('../views/dh/VoiceCopy.vue') },
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
group: '素材库',
|
||||||
|
order: 3,
|
||||||
|
items: [
|
||||||
|
{ name: '素材列表', path: 'material/list', icon: 'grid', component: () => import('../views/material/MaterialListNew.vue') },
|
||||||
|
{ name: '智能混剪', path: 'material/mix', icon: 'scissors', component: () => import('../views/material/Mix.vue') },
|
||||||
|
{ name: '任务中心', path: 'system/task-management/:type', icon: 'video', component: () => import('../views/system/task-management/layout/TaskLayout.vue'), requiresAuth: true, params: { type: 'mix-task' } },
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
group: '系统',
|
||||||
|
order: 4,
|
||||||
|
requiresAuth: true,
|
||||||
|
items: [
|
||||||
|
{ name: '风格设置', path: 'system/style-settings', icon: 'text', component: () => import('../views/system/style-settings/index.vue') },
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
// 导航图标定义
|
||||||
|
const navIcons = {
|
||||||
|
home: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="M3 10.5 12 3l9 7.5"/><path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-7"/></svg>',
|
||||||
|
grid: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>',
|
||||||
|
text: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="M4 7h16"/><path d="M4 12h10"/><path d="M4 17h14"/></svg>',
|
||||||
|
mic: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><rect x="9" y="2" width="6" height="11" rx="3"/><path d="M5 10a7 7 0 0 0 14 0"/><path d="M12 19v3"/></svg>',
|
||||||
|
wave: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="M2 12s2-4 5-4 3 8 6 8 3-8 6-8 3 4 3 4"/></svg>',
|
||||||
|
user: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><circle cx="12" cy="7" r="4"/><path d="M5.5 21a8.38 8.38 0 0 1 13 0"/></svg>',
|
||||||
|
video: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="m22 8-6 4 6 4V8Z"/><rect x="2" y="6" width="14" height="12" rx="2" ry="2"/></svg>',
|
||||||
|
folder: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><path d="M4 20h16a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.93a2 2 0 0 1-1.66-.9l-.82-1.2A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z"/></svg>',
|
||||||
|
scissors: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" width="18" height="18"><circle cx="6" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M8.59 13.51 15.42 17.49"/><path d="M15.41 6.51 8.59 10.49"/></svg>'
|
||||||
|
}
|
||||||
|
|
||||||
|
// ============ 辅助函数 ============
|
||||||
|
function findOrCreateParentRoute(routes, parentPath) {
|
||||||
|
let parentRoute = routes.find(r => r.path === parentPath)
|
||||||
|
if (!parentRoute) {
|
||||||
|
parentRoute = { path: parentPath, children: [], meta: {} }
|
||||||
|
routes.push(parentRoute)
|
||||||
|
}
|
||||||
|
return parentRoute
|
||||||
|
}
|
||||||
|
|
||||||
|
function addChildRoute(parentRoute, path, name, component, meta) {
|
||||||
|
parentRoute.children.push({ path, name, component, meta })
|
||||||
|
}
|
||||||
|
|
||||||
|
function setDefaultRedirect(parentRoute, redirectPath) {
|
||||||
|
if (!parentRoute.children.some(c => c.path === '')) {
|
||||||
|
parentRoute.children.unshift({ path: '', redirect: redirectPath })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// ============ 从导航配置生成路由 ============
|
||||||
|
function buildRoutesFromNav(config) {
|
||||||
|
const parentRoutes = []
|
||||||
|
|
||||||
|
config.forEach(group => {
|
||||||
|
group.items.forEach(item => {
|
||||||
|
const [parentPath, ...childSegments] = item.path.split('/')
|
||||||
|
const childPath = childSegments.join('/') || ''
|
||||||
|
const parentRoute = findOrCreateParentRoute(parentRoutes, parentPath)
|
||||||
|
|
||||||
|
parentRoute.meta.navGroup = group.group
|
||||||
|
parentRoute.meta.navGroupOrder = group.order
|
||||||
|
if (group.requiresAuth) {
|
||||||
|
parentRoute.meta.requiresAuth = true
|
||||||
|
}
|
||||||
|
|
||||||
|
addChildRoute(parentRoute, childPath, item.name, item.component, {
|
||||||
|
navIcon: item.icon,
|
||||||
|
navLabel: item.name,
|
||||||
|
requiresAuth: item.requiresAuth
|
||||||
|
})
|
||||||
|
|
||||||
|
setDefaultRedirect(parentRoute, `/${item.path}`)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
const hiddenRoutes = [
|
||||||
|
{ path: 'trends/heat', name: '热度分析', component: () => import('../views/trends/Heat.vue'), meta: { hidden: true } },
|
||||||
|
{ path: 'material/mix-task', name: '混剪任务', component: () => import('../views/material/MixTaskList.vue'), meta: { hidden: true } },
|
||||||
|
{ path: 'material/group', name: '素材分组', component: () => import('../views/material/MaterialGroup.vue'), meta: { hidden: true } }
|
||||||
|
]
|
||||||
|
|
||||||
|
hiddenRoutes.forEach(route => {
|
||||||
|
const [parentPath, childPath] = route.path.split('/')
|
||||||
|
const parentRoute = findOrCreateParentRoute(parentRoutes, parentPath)
|
||||||
|
addChildRoute(parentRoute, childPath, route.name, route.component, route.meta)
|
||||||
|
})
|
||||||
|
|
||||||
|
return parentRoutes
|
||||||
|
}
|
||||||
|
|
||||||
const routes = [
|
const routes = [
|
||||||
// 登录页面 - 独立渲染，不使用Layout
|
// 登录页面
|
||||||
{
|
{
|
||||||
path: '/login',
|
path: '/login',
|
||||||
name: '登录',
|
name: '登录',
|
||||||
component: () => import('../views/auth/Login.vue'),
|
component: () => import('../views/auth/Login.vue'),
|
||||||
meta: {
|
meta: { requiresAuth: false }
|
||||||
requiresAuth: false
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
// 主布局路由 - 所有需要Layout的页面都在这里
|
// 主布局
|
||||||
{
|
{
|
||||||
path: '/',
|
path: '/',
|
||||||
component: MainLayout,
|
component: MainLayout,
|
||||||
redirect: '/content-style/benchmark',
|
redirect: '/content-style/benchmark',
|
||||||
children: [
|
children: buildRoutesFromNav(navConfig),
|
||||||
{
|
meta: { requiresAuth: true }
|
||||||
path: 'content-style',
|
|
||||||
name: '内容风格分析',
|
|
||||||
children: [
|
|
||||||
{ path: '', redirect: '/content-style/benchmark' },
|
|
||||||
{ path: 'benchmark', name: '对标分析', component: () => import('../views/content-style/Benchmark.vue') },
|
|
||||||
{ path: 'copywriting', name: '文案创作', component: () => import('../views/content-style/Copywriting.vue') },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'trends',
|
|
||||||
name: '热点趋势分析',
|
|
||||||
children: [
|
|
||||||
{ path: '', redirect: '/trends/heat' },
|
|
||||||
{ path: 'heat', name: '热度分析', component: () => import('../views/trends/Heat.vue') },
|
|
||||||
{ path: 'forecast', name: '热点预测', component: () => import('../views/trends/Forecast.vue') },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'digital-human',
|
|
||||||
name: '数字人',
|
|
||||||
children: [
|
|
||||||
{ path: '', redirect: '/digital-human/voice-copy' },
|
|
||||||
{ path: 'kling', name: '数字人生成', component: () => import('../views/kling/IdentifyFace.vue') },
|
|
||||||
{ path: 'voice-copy', name: '人声克隆', component: () => import('../views/dh/VoiceCopy.vue') },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'material',
|
|
||||||
name: '素材库',
|
|
||||||
children: [
|
|
||||||
{ path: '', redirect: '/material/list' },
|
|
||||||
{ path: 'list', name: '素材列表', component: () => import('../views/material/MaterialListNew.vue') },
|
|
||||||
{ path: 'mix', name: '智能混剪', component: () => import('../views/material/Mix.vue') },
|
|
||||||
{ path: 'mix-task', name: '混剪任务', component: () => import('../views/material/MixTaskList.vue') },
|
|
||||||
{ path: 'group', name: '素材分组', component: () => import('../views/material/MaterialGroup.vue') },
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'system',
|
|
||||||
name: '系统',
|
|
||||||
children: [
|
|
||||||
{ path: '', redirect: '/system/style-settings' },
|
|
||||||
{ path: 'style-settings', name: '风格设置', component: () => import('../views/system/style-settings/index.vue') },
|
|
||||||
{
|
|
||||||
path: 'task-management/:type',
|
|
||||||
name: '任务中心',
|
|
||||||
component: () => import('../views/system/task-management/layout/TaskLayout.vue')
|
|
||||||
}
|
|
||||||
],
|
|
||||||
meta: {
|
|
||||||
requiresAuth: true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
],
|
|
||||||
meta: {
|
|
||||||
requiresAuth: true
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
]
|
]
|
||||||
|
|
||||||
|
// 导出配置供 SidebarNav 使用
|
||||||
|
export { navConfig, navIcons }
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
history: createWebHistory(import.meta.env.BASE_URL),
|
history: createWebHistory(import.meta.env.BASE_URL),
|
||||||
routes,
|
routes,
|
||||||
@@ -91,23 +146,17 @@ router.beforeEach(async (to, from, next) => {
|
|||||||
const userStore = useUserStore()
|
const userStore = useUserStore()
|
||||||
const authenToken = tokenManager.getAccessToken()
|
const authenToken = tokenManager.getAccessToken()
|
||||||
|
|
||||||
// 路由访问控制
|
|
||||||
if (to.meta.requiresAuth && !authenToken) {
|
if (to.meta.requiresAuth && !authenToken) {
|
||||||
// 需要认证但未登录，跳转到登录页并记录当前路径
|
next({ path: '/login', query: { redirect: to.fullPath } })
|
||||||
next({
|
|
||||||
path: '/login',
|
|
||||||
query: { redirect: to.fullPath }
|
|
||||||
})
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
// 已登录用户访问登录页，重定向到首页
|
|
||||||
if (to.path === '/login' && authenToken) {
|
if (to.path === '/login' && authenToken) {
|
||||||
next({ path: '/content-style/benchmark', replace: true })
|
next({ path: '/content-style/benchmark', replace: true })
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
if (authenToken && !userStore.isLoggedIn.value) {
|
if (authenToken && !userStore.isLoggedIn) {
|
||||||
userStore.fetchUserInfo()
|
userStore.fetchUserInfo()
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -115,4 +164,3 @@ router.beforeEach(async (to, from, next) => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
export default router
|
export default router
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user