web_dist/src/router/index.ts

//@ts-nocheck
/**
 * @description 所有人可使用的参数配置列表
 * @params hideMenu: 是否隐藏当前路由结点不在导航中展示
 * @params alwaysShow: 只有一个子路由时是否总是展示菜单，默认false
 */
import {createRouter, createWebHistory, RouteRecordRaw} from 'vue-router'
import store from '@/store'
import NProgress from '@/utils/system/nprogress'
import {changeTitle} from '@/utils/system/title'

// 动态路由相关引入数据
// 引入modules
import Dashboard from './modules/dashboard'
import {getUserMenu, IntergrationMenu} from "@/api/settings/menu-settings";
import {createVNode, defineComponent, h} from "vue";
import Layout from "@/layout/index.vue";
import {userInfoStore} from "@/utils/store-public";
import {stringIsBlank} from "@/utils/blank-utils";
import XEUtils from "xe-utils";

const whiteNameRouting = []

function dashboardRouter(data: Array<RouteRecordRaw>) {
    data.forEach((item) => {
        XEUtils.set(item, "meta.needToken", false)
        whiteNameRouting.push(item.path)
        if (item.children && item.children.length > 0) {
            dashboardRouter(item.children)
        }
    })
}

dashboardRouter(Dashboard)

const router = createRouter({
    history: createWebHistory(),
    routes: [...Dashboard],
})


const vueFile = import.meta.glob('../views/**/*.{vue,tsx}');
vueFile.EmptyRouter = import.meta.glob('../layout/EmptyRouter')['../layout/EmptyRouter']
vueFile.Layout = import.meta.glob('../layout/index.vue')['../layout/index.vue']

let asyncFinished = false
export const routerMenus = ref([])

async function beforeAddRoutes() {
    routerMenus.value = await getUserMenu()
    const routers = addRoutes(routerMenus.value)
    routers.forEach(item => {
        router.addRoute(item)
    })

    // 404 要添加到最后面才可以，不然一开始就会是 404
    router.addRoute({
        path: '/:path(.*)*',
        name: 'notFound',
        component: Layout,
        redirect: '/404',
        hideMenu: true,
    })
}

function createNameComponent(item) {
    return () => {
        return new Promise(resolve => {
            vueFile[`${item.component}`]().then(res => {
                const tmp = defineComponent({
                    name: item.name,
                    render() {
                        let children = [createVNode(res.default)]
                        const style = {
                            height: '100%',
                            width: '100%',
                        }
                        const props = {
                            style
                        }
                        if (item.mainCard) {
                            props.class = 'cy_card'
                        }
                        if (item.mainOverflowAuto) {
                            children = [
                                h('div', {
                                    style: {
                                        height: '100%',
                                        width: '100%',
                                        overflow: 'auto'
                                    }
                                }, [createVNode(res.default)])
                            ]
                        }
                        return h('div', props, children);
                    }
                })
                resolve(tmp)
            })
        })
    }
}

const capitalizeFirstLower = (word: string) => {
    return word.charAt(0).toLowerCase() + word.slice(1);
}

function addRoutes(menus: IntergrationMenu[]) {
    const routers: RouteRecordRaw[] = []
    menus.forEach(item => {
        const meta: { [key: string]: any } = {}
        for (let key in item) {
            if (key.startsWith("meta")) {
                const metaKey = capitalizeFirstLower(key.replace("meta", ""))
                meta[metaKey] = item[key]
            }
        }
        const data: RouteRecordRaw = {
            path: item.path + item.pathParams,
            name: item.name,
            redirect: item.redirect,
            meta: meta,
            component: createNameComponent(item)
        };
        if (item.children && item.children.length > 0) {
            data.children = addRoutes(item.children)
        }
        routers.push(data)
    })
    return routers
}


router.beforeEach(async (to, _from, next) => {
        NProgress.start();

        function tmpNext(...arg) {
            to.meta.title && changeTitle(to.meta.title)
            if (to.meta.needToken && stringIsBlank(userInfoStore.value.token)) {
                next('/login')
                return
            }
            next(...arg);
        }

        for (let i = 0; i < whiteNameRouting.length; i++) {
            const tmp: string = whiteNameRouting[i]
            if (tmp.startsWith(to.path)) {
                tmpNext()
                return
            }
        }

        if (!asyncFinished) {
            await beforeAddRoutes()
            tmpNext({path: to.path, query: to.query, replace: true});
            asyncFinished = true
        } else {
            tmpNext();
        }
    }
)

router.afterEach((to, _from) => {
    const keepAliveComponentsName = store.getters['keepAlive/keepAliveComponentsName'] || []
    const name = to.matched[to.matched.length - 1].components.default.name
    if (to.meta && to.meta.cache && name && !keepAliveComponentsName.includes(name)) {
        store.commit('keepAlive/addKeepAliveComponentsName', name)
    }
    NProgress.done()
})

export default router