117 lines
3.7 KiB
TypeScript
117 lines
3.7 KiB
TypeScript
import { createRouter, createWebHashHistory } from "vue-router";
|
||
import { GlobalStore } from "@/stores";
|
||
import { AuthStore } from "@/stores/modules/auth";
|
||
import { LOGIN_URL, ROUTER_WHITE_LIST } from "@/config/config";
|
||
import { initDynamicRouter } from "@/routers/modules/dynamicRouter";
|
||
import { staticRouter, errorRouter } from "@/routers/modules/staticRouter";
|
||
import NProgress from "@/config/nprogress";
|
||
import { HOME_URL } from "@/enums/Home";
|
||
// import path from "path";
|
||
|
||
/**
|
||
* @description 动态路由参数配置简介 📚
|
||
* @param path ==> 菜单路径
|
||
* @param name ==> 菜单别名
|
||
* @param redirect ==> 重定向地址
|
||
* @param component ==> 视图文件路径
|
||
* @param meta ==> 菜单信息
|
||
* @param meta.icon ==> 菜单图标
|
||
* @param meta.title ==> 菜单标题
|
||
* @param meta.activeMenu ==> 当前路由为详情页时，需要高亮的菜单
|
||
* @param meta.isLink ==> 是否外链
|
||
* @param meta.isHide ==> 是否隐藏
|
||
* @param meta.isFull ==> 是否全屏(示例：数据大屏页面)
|
||
* @param meta.isAffix ==> 是否固定在 tabs nav
|
||
* @param meta.isKeepAlive ==> 是否缓存
|
||
* */
|
||
const router = createRouter({
|
||
history: createWebHashHistory(),
|
||
routes: [...staticRouter, ...errorRouter],
|
||
strict: false,
|
||
scrollBehavior: () => ({ left: 0, top: 0 })
|
||
});
|
||
|
||
/**
|
||
* @description 路由拦截 beforeEach
|
||
* */
|
||
router.beforeEach(async (to, from, next) => {
|
||
const globalStore = GlobalStore();
|
||
// 解决首次跳转失败
|
||
let freeToken = window.location.href.indexOf("token") != -1;
|
||
if (freeToken) {
|
||
globalStore.token = window.location.href.split("token=")[1];
|
||
}
|
||
console.log("免登录", freeToken, globalStore.token);
|
||
// 1.NProgress 开始
|
||
NProgress.start();
|
||
|
||
// 2.动态设置标题
|
||
const title = import.meta.env.VITE_GLOB_APP_TITLE;
|
||
// document.title = to.meta.title ? `${to.meta.title} - ${title}` : title;
|
||
document.title = to.meta.title ? `${to.meta.title} ` : title;
|
||
|
||
// 3.判断是访问登陆页，有 Token 就在当前页面，没有 Token 重置路由并放行到登陆页
|
||
if (to.path === LOGIN_URL) {
|
||
console.log("判断是访问登陆页，有:", from.fullPath);
|
||
console.log("判断是访问登陆页，globalStore.token有:", globalStore.token);
|
||
|
||
if (globalStore.token) return next(from.fullPath);
|
||
// resetRouter();//重置路由
|
||
return next();
|
||
}
|
||
|
||
// 4.判断访问页面是否在路由白名单地址中，如果存在直接放行
|
||
if (ROUTER_WHITE_LIST.includes(to.path)) return next();
|
||
|
||
// 5.判断是否有 Token，没有重定向到 login
|
||
if (!globalStore.token) return next({ path: LOGIN_URL, replace: true });
|
||
// if (to.path === "/") return next({ path: LOGIN_URL, replace: true });
|
||
|
||
// 6.如果没有菜单列表，就重新请求菜单列表并添加动态路由
|
||
const authStore = AuthStore();
|
||
authStore.setRouteName(to.name as string);
|
||
if (!authStore.authMenuListGet.length) {
|
||
await initDynamicRouter();
|
||
if (globalStore.accountType && globalStore.accountType !== 1 && to.fullPath === HOME_URL[0]) {
|
||
next(HOME_URL[globalStore.accountType - 1]);
|
||
}
|
||
return next({ ...to, replace: true });
|
||
}
|
||
console.log("路由跳转结束");
|
||
|
||
// 7.正常访问页面
|
||
next();
|
||
});
|
||
|
||
/**
|
||
* @description 重置路由
|
||
* */
|
||
export const resetRouter = () => {
|
||
const authStore = AuthStore();
|
||
console.log("重置路由跳转结束:", authStore.flatMenuListGet);
|
||
|
||
authStore.flatMenuListGet.forEach(route => {
|
||
const { name } = route;
|
||
if (name && router.hasRoute(name)) router.removeRoute(name);
|
||
});
|
||
};
|
||
|
||
/**
|
||
* @description 路由跳转结束
|
||
* */
|
||
router.afterEach(() => {
|
||
console.log("路由跳转结束");
|
||
|
||
NProgress.done();
|
||
});
|
||
|
||
/**
|
||
* @description 路由跳转错误
|
||
* */
|
||
router.onError(error => {
|
||
NProgress.done();
|
||
console.warn("路由错误", error.message);
|
||
});
|
||
|
||
export default router;
|