policeSecurity/securityManagement/src/router/index.ts

import {createRouter, createWebHistory} from "vue-router";
import {staticRouter} from "@/router/staticRouters.ts";
import {message, Modal} from "ant-design-vue";
import {useUserStore} from "@/stores/modules/userStore.ts";
import {ROUTER_WHITE_LIST} from "@/config";

/**
 * createWebHistory & createWebHashHistory
 * createWebHistory: 路径不带#号，但需要后端进行配置（如nginx配置:try_files $uri $uri/ /index.html last;）
 * createWebHashHistory: 路径带#号 这部分 URL 从未被发送到服务器，所以它不需要在服务器层面上进行任何特殊处理，影响SEO
 */
const router = createRouter({
    history: createWebHistory(),
    routes: [...staticRouter],
    strict: false,
    scrollBehavior: () => ({left: 0, top: 0})
});

router.beforeEach(async (to, from, next) => {
    Modal.destroyAll();
    //判断访问的是不是登录页
    const userStore = useUserStore();
    if (to.path.toLocaleLowerCase() === '/login' && userStore.getTokenInfo?.value) {
        //如果已登录 且访问login页面 直接返回当前页面
        await message.warn('当前已登录，请先退出账号');
        return next(from.fullPath)
    }
    //判断访问路径是不是白名单d
    if (ROUTER_WHITE_LIST.includes(to.path)) {
        return next();
    }
    // 不在白名单内需要查看是否携带token 没有token需要返回登录页进行登录
    if (!userStore.getTokenInfo?.value) {
        await message.warn('未找到token，请重新登陆!')
        return next('/login');
    }
    //放行
    return next();
})

router.onError(error => {
    console.error("路由错误", error.message);
})

export default router