70 lines
1.7 KiB
TypeScript
70 lines
1.7 KiB
TypeScript
import type { Router, RouteLocationNormalized, NavigationGuardNext } from 'vue-router';
|
|
import { useTitle } from '@vueuse/core';
|
|
import { getToken } from '@/utils';
|
|
import { RouteNameMap } from './routes';
|
|
|
|
/**
|
|
* 路由守卫函数
|
|
* @param router - 路由实例
|
|
*/
|
|
export default function createRouterGuide(router: Router) {
|
|
router.beforeEach((to, from, next) => {
|
|
// 开始 loadingBar
|
|
window.$loadingBar?.start();
|
|
// 页面跳转逻辑
|
|
handleRouterAction(to, from, next);
|
|
});
|
|
router.afterEach(to => {
|
|
// 设置document title
|
|
useTitle(to.meta.title as string);
|
|
// 结束 loadingBar
|
|
window.$loadingBar?.finish();
|
|
});
|
|
}
|
|
|
|
function handleRouterAction(to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) {
|
|
const token = getToken();
|
|
const isLogin = Boolean(token);
|
|
const needLogin = Boolean(to.meta?.requiresAuth);
|
|
|
|
const routerAction: [boolean, () => void][] = [
|
|
// 已登录状态跳转登录页，跳转至首页
|
|
[
|
|
isLogin && to.name === RouteNameMap.get('login'),
|
|
() => {
|
|
next({ name: RouteNameMap.get('root') });
|
|
}
|
|
],
|
|
// 不需要登录权限的页面直接通行
|
|
[
|
|
!needLogin,
|
|
() => {
|
|
next();
|
|
}
|
|
],
|
|
// 未登录状态进入需要登录权限的页面
|
|
[
|
|
!isLogin && needLogin,
|
|
() => {
|
|
const redirectUrl = window.location.href;
|
|
next({ name: RouteNameMap.get('login'), query: { redirectUrl } });
|
|
}
|
|
],
|
|
// 登录状态进入需要登录权限的页面,直接通行
|
|
[
|
|
needLogin && isLogin,
|
|
() => {
|
|
next();
|
|
}
|
|
]
|
|
];
|
|
|
|
routerAction.some(item => {
|
|
const flag = item[0];
|
|
if (flag) {
|
|
item[1]();
|
|
}
|
|
return flag;
|
|
});
|
|
}
|