/**
|
* 路由配置
|
* 支持动态菜单路由注册
|
*/
|
import { createRouter, createWebHashHistory } from 'vue-router';
|
import type { RouteRecordRaw } from 'vue-router';
|
import { useMenuStore } from '@/store/modules/menu';
|
import { transformMenuToRoutes } from '@/utils/menuTransform';
|
|
const routes: RouteRecordRaw[] = [
|
{
|
path: '/login',
|
name: 'Login',
|
component: () => import('@/views/login/index.vue'),
|
meta: { anonymous: true },
|
},
|
{
|
path: '/',
|
name: 'root',
|
component: () => import('@/layouts/MainLayout.vue'),
|
redirect: '/home',
|
children: [
|
{ path: '/home', name: 'Home', component: () => import('@/views/dashboard/index.vue'), meta: { title: '首页', icon: 'el-icon-home' } },
|
],
|
},
|
{ path: '/:pathMatch(.*)*', redirect: '/home' },
|
];
|
|
const router = createRouter({
|
history: createWebHashHistory(),
|
routes,
|
});
|
|
/**
|
* 动态注册路由
|
*/
|
export async function registerDynamicRoutes() {
|
const menuStore = useMenuStore();
|
|
if (!menuStore.loaded) {
|
await menuStore.loadMenus();
|
}
|
|
const dynamicRoutes = transformMenuToRoutes(menuStore.menus);
|
const rootRoute = router.getRoutes().find((r) => r.name === 'root');
|
if (!rootRoute) return;
|
|
dynamicRoutes.forEach((route) => {
|
const exists = router.getRoutes().some((r) => r.name === route.name);
|
if (!exists && route.name) {
|
router.addRoute('root', route);
|
}
|
});
|
|
return dynamicRoutes;
|
}
|
|
router.beforeEach(async (to, from, next) => {
|
if (to.meta?.anonymous) {
|
return next();
|
}
|
|
const userStr = localStorage.getItem('user');
|
if (!userStr) {
|
return next('/login');
|
}
|
|
const menuStore = useMenuStore();
|
if (!menuStore.loaded) {
|
try {
|
await registerDynamicRoutes();
|
} catch (error) {
|
console.error('注册动态路由失败:', error);
|
}
|
}
|
|
next();
|
});
|
|
export { router };
|
export default router;
|
