manHourHousekeeper/fhKeeper/formulahousekeeper/customerBuler-crm-h5/src/router.js

import { createRouter, createWebHistory } from "vue-router";
import useRouterStore from "@store/useRouterStore.js";
import { routerEventEmitter } from "@store/useRouterStore.js";

const routes = [
    {
        path: '/',
        redirect: '/login',
        component: () => import("@pages/login.vue")
    }, {
        path: '/login',
        name: 'login',
        meta: { title: '登录' },
        component: () => import("@pages/login.vue"),
    }, {
        path: '/home',
        name: 'home',
        meta: { title: '首页' },
        component: () => import("@pages/tabbar/home/index.vue"),
    }, {
        path: '/my',
        name: 'my',
        meta: { title: '我的' },
        component: () => import("@pages/tabbar/my/index.vue"),
    }, {
        path: '/news',
        name: 'news',
        meta: { title: '消息' },
        component: () => import("@pages/tabbar/news/index.vue"),
    }, {
        path: '/work',
        name: 'work',
        meta: { title: '工作' },
        component: () => import("@pages/tabbar/work/index.vue"),
    }, {
        path: '/moduleList',
        name: 'moduleList',
        meta: { title: '模块列表' },
        component: () => import("@pages/moduleList/moduleList.vue"),
    }, {
        path: '/details',
        name: 'details',
        meta: { title: '模块详情' },
        component: () => import("@pages/moduleDetails/index.vue"),
    }, {
        path: '/addEditor',
        name: 'addEditor',
        meta: { title: '模块新增编辑' },
        component: () => import("@pages/addEditor/index.vue"),
    }, {
        path: '/:pathMatch(.*)*',
        name: 'notFound',
        meta: { title: '404' },
        component: () => import("@pages/404.vue"),
    }
]

const router = createRouter({
    history: createWebHistory(),
    routes
});

window.addEventListener('load', () => {
    const routerStore = useRouterStore();
    const currentPage = routerStore.currentPages[routerStore.currentPages.length - 1];
    routerStore.resetCacheStatus();//刷新页面重置页面缓存状态
    if (currentPage?.params?.length) {
        const currentPageParams = currentPage.params[0];
        const eventName = Reflect.ownKeys(currentPageParams)[0];
        setTimeout(() => {
            if (routerEventEmitter.getListeners(`${location.pathname}.${eventName}`).length) {
                routerEventEmitter.emit(`${location.pathname}.${eventName}`, currentPageParams[eventName]);
            }
        }, 100)
    }
});

/*监听浏览器历史记录发生变化*/
window.addEventListener('popstate', (event) => {
    const routerStore = useRouterStore();
    const toPathName = event.state.current.slice(1);
    const backPathName = routerStore.currentPages[routerStore.currentPages.length - 2]?.pathName; //返回页面pathName
    const forwardPathName = routerStore.historyPages[0]?.pathName; //前进页pathName
    let currentPage = {}; //前进或者后退成功的页面
    if (toPathName == backPathName) { //浏览器返回上一级页面
        currentPage = { ...routerStore.currentPages[routerStore.currentPages.length - 2] }; //返回页路由
        routerStore.delete(1);
    } else if (toPathName == forwardPathName) {//浏览器前进
        const forwardPage = { ...routerStore.historyPages[0] }; //前进页路由
        routerStore.deleteHistory(toPathName, true);
        currentPage = forwardPage;
    }
    //页面再次刷新之后，页面缓存会清空，处理页面缓存清空之后传参失效问题
    if (!currentPage.cache) {
        const currentPageParams = currentPage.params[0] || {};
        const eventName = Reflect.ownKeys(currentPageParams)[0];
        setTimeout(() => {
            if (routerEventEmitter.getListeners(`${location.pathname}.${eventName}`).length) {
                routerEventEmitter.emit(`${location.pathname}.${eventName}`, currentPageParams[eventName]);
            }
        }, 100)
    }
});
export default router