layout布局修改，标签卡，列表组件封装

hejianhao

2025-03-31 8790f99a94733c7c3836706c75a77f9bbb15c2ca

 src/router/index.js

@@ -13,17 +13,19 @@
/**
 *  path: "/login",   ------页面地址
    component: () => import("../views/login"),  ------组件地址
    name: "Login",  ------组件名称 缓存时需要 唯一性
    meta: {
      title: "登录",    ------页面标题
      icon: "el-icon-user-solid",  ------菜单图标
      oneself: true,  ------是否在单独页面打开
      hide: true,  ------是否隐藏改菜单
      keepAlive: true,  ------是否缓存
    }
 */

const routes = [
    {
        path: "",
        path: "/",
        redirect: "login",
        component: Layouts,
        children: [
@@ -33,9 +35,26 @@
                    title: "登录",
                    oneself: true,
                    hide: true,
                    privilege: 'login'
                },
                component: () => import("../views/login"),
            },
            {
                path: "/projectList",
                meta: {
                    title: "项目组管理",
                },
                component: Parent,
                children: [
                    {
                        path: "list",
                        name: "ProjectList",
                        meta: {
                            title: "项目组管理",
                            keepAlive: true,
                        },
                        component: () => import("../views/projectList"),
                    }
                ]
            },
        ],
    },
@@ -50,27 +69,48 @@
// 前置路由拦截器
router.beforeEach((to, from, next) => {
    // 设置当前页签名称
    document.title = to.meta.title || '职评网管理系统';
    // 没有登录并且要去的页面不是登录页面，在强制跳转到登录
    if (to.path === "/login") {
        localStorage.removeItem('userInfo')
        next()
    } else if (!localStorage.getItem('userInfo')) {
        next('/login')
    } else {
        // 判断是否拥有要跳转菜单权限
        let menus = store.state.menus
    document.title = to.meta.title || '实验室流程';

        // console.log(store.state.menus);
        // console.log(to.meta);
        // console.log(to.meta.hasOwnProperty('privilege'));
        // console.log(!menus.includes(to.meta.privilege));
        
        if (to.meta.hasOwnProperty('privilege') && !menus.includes(to.meta.privilege)) {
            return
        }
        next()
    // 判断是否需要缓存
    if (to.meta.keepAlive) {
        store.commit('SET_KEEPALIVELIST', [...store.state.keepAliveList, to.name])
    }
    // 设置标签列表
    if (!to.meta.hide || !to.meta.oneself) {
        // 判断是否存在
        let isExist = store.state.tagList.some(item => item.path === to.path)
        if (!isExist) {
            store.commit('SET_TAGLIST', [...store.state.tagList, to])
        }
    }
    next()

    // 没有登录并且要去的页面不是登录页面，在强制跳转到登录
    // if (to.path === "/login") {
    //     localStorage.removeItem('userInfo')
    //     next()
    // } else if (!localStorage.getItem('userInfo')) {
    //     next('/login')
    // } else {
    //     // 判断是否拥有要跳转菜单权限
    //     let menus = store.state.menus
    //     if (to.meta.hasOwnProperty('privilege') && !menus.includes(to.meta.privilege)) {
    //         return
    //     }
    // 设置标签列表
    // if (!to.meta.hide || !to.meta.oneself) {
    //     // 判断是否存在
    //     let isExist = store.state.tagList.some(item => item.path === to.path)
    //     if (!isExist) {
    //         store.commit('SET_TAGLIST', [...store.state.tagList, to])
    //     }
    // }
    //     // 判断是否需要缓存
    //     if (to.meta.keepAlive) {
    //         store.commit('SET_KEEPALIVELIST', [...store.state.keepAliveList, to.name])
    //     }
    //     next()
    // }
});

export default router;