xueyawen
/
vue3-element-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

去除系统首页菜单栏，系统首页页面需要auth

This commit is contained in:
xueyawen 2025-02-25 15:06:22 +08:00
parent 4963ddf511
commit 12df1dfa6d
4 changed files with 693 additions and 621 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
components.d.ts vendored
View File

@ -13,7 +13,9 @@ declare module '@vue/runtime-core' {
ElCard: typeof import('element-plus/es')['ElCard']
ElCascader: typeof import('element-plus/es')['ElCascader']
ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
ElCheckboxGroup: typeof import('element-plus/es')['ElCheckboxGroup']
ElCol: typeof import('element-plus/es')['ElCol']
ElColorPicker: typeof import('element-plus/es')['ElColorPicker']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
ElDescriptions: typeof import('element-plus/es')['ElDescriptions']
ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
@ -33,9 +35,13 @@ declare module '@vue/runtime-core' {
ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElProgress: typeof import('element-plus/es')['ElProgress']
ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRate: typeof import('element-plus/es')['ElRate']
ElRow: typeof import('element-plus/es')['ElRow']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElStatistic: typeof import('element-plus/es')['ElStatistic']
ElSlider: typeof import('element-plus/es')['ElSlider']
ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTable: typeof import('element-plus/es')['ElTable']
@ -45,7 +51,9 @@ declare module '@vue/runtime-core' {
ElTag: typeof import('element-plus/es')['ElTag']
ElTimeline: typeof import('element-plus/es')['ElTimeline']
ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
ElTimePicker: typeof import('element-plus/es')['ElTimePicker']
ElTooltip: typeof import('element-plus/es')['ElTooltip']
ElTransfer: typeof import('element-plus/es')['ElTransfer']
ElUpload: typeof import('element-plus/es')['ElUpload']
Header: typeof import('./src/components/header.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']

288
src/components/header.vue
View File

@ -1,204 +1,216 @@
<template>
<div class="header">
<!-- 折叠按钮 -->
<div class="header-left">
<img class="logo" src="../assets/img/logo.svg" alt="" />
<div class="web-title">后台管理系统</div>
<div class="collapse-btn" @click="collapseChage">
<el-icon v-if="sidebar.collapse">
<Expand />
</el-icon>
<el-icon v-else>
<Fold />
</el-icon>
</div>
</div>
<div class="header-right">
<div class="header-user-con">
<div class="btn-icon" @click="router.push('/theme')">
<el-tooltip effect="dark" content="设置主题" placement="bottom">
<i class="el-icon-lx-skin"></i>
</el-tooltip>
</div>
<div class="btn-icon" @click="router.push('/ucenter')">
<el-tooltip
effect="dark"
:content="message ? `有${message}条未读消息` : `消息中心`"
placement="bottom"
>
<i class="el-icon-lx-notice"></i>
</el-tooltip>
<span class="btn-bell-badge" v-if="message"></span>
</div>
<div class="btn-icon" @click="setFullScreen">
<el-tooltip effect="dark" content="全屏" placement="bottom">
<i class="el-icon-lx-full"></i>
</el-tooltip>
</div>
<!-- 用户头像 -->
<el-avatar class="user-avator" :size="30" :src="imgurl" />
<!-- 用户名下拉菜单 -->
<el-dropdown class="user-name" trigger="click" @command="handleCommand">
<span class="el-dropdown-link">
{{ username }}
<el-icon class="el-icon--right">
<arrow-down />
</el-icon>
</span>
<template #dropdown>
<el-dropdown-menu>
<a href="https://github.com/lin-xin/vue-manage-system" target="_blank">
<el-dropdown-item>项目仓库</el-dropdown-item>
</a>
<a href="https://lin-xin.gitee.io/example/vuems-doc/" target="_blank">
<el-dropdown-item>官方文档</el-dropdown-item>
</a>
<el-dropdown-item command="user">个人中心</el-dropdown-item>
<el-dropdown-item divided command="loginout">退出登录</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
</div>
<div class="header">
<!-- 折叠按钮 -->
<div class="header-left">
<img class="logo" src="../assets/img/logo.svg" alt="" />
<div class="web-title" @click="showDashboard">后台管理系统</div>
<div class="collapse-btn" @click="collapseChage">
<el-icon v-if="sidebar.collapse">
<Expand />
</el-icon>
<el-icon v-else>
<Fold />
</el-icon>
</div>
</div>
<div class="header-right">
<div class="header-user-con">
<div class="btn-icon" @click="router.push('/theme')">
<el-tooltip effect="dark" content="设置主题" placement="bottom">
<i class="el-icon-lx-skin"></i>
</el-tooltip>
</div>
<div class="btn-icon" @click="router.push('/ucenter')">
<el-tooltip
effect="dark"
:content="message ? `有${message}条未读消息` : `消息中心`"
placement="bottom"
>
<i class="el-icon-lx-notice"></i>
</el-tooltip>
<span class="btn-bell-badge" v-if="message"></span>
</div>
<div class="btn-icon" @click="setFullScreen">
<el-tooltip effect="dark" content="全屏" placement="bottom">
<i class="el-icon-lx-full"></i>
</el-tooltip>
</div>
<!-- 用户头像 -->
<el-avatar class="user-avator" :size="30" :src="imgurl" />
<!-- 用户名下拉菜单 -->
<el-dropdown class="user-name" trigger="click" @command="handleCommand">
<span class="el-dropdown-link">
{{ username }}
<el-icon class="el-icon--right">
<arrow-down />
</el-icon>
</span>
<template #dropdown>
<el-dropdown-menu>
<a
href="https://github.com/lin-xin/vue-manage-system"
target="_blank"
>
<el-dropdown-item>项目仓库</el-dropdown-item>
</a>
<a
href="https://lin-xin.gitee.io/example/vuems-doc/"
target="_blank"
>
<el-dropdown-item>官方文档</el-dropdown-item>
</a>
<el-dropdown-item command="user">个人中心</el-dropdown-item>
<el-dropdown-item divided command="loginout"
>退出登录</el-dropdown-item
>
</el-dropdown-menu>
</template>
</el-dropdown>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { onMounted } from 'vue';
import { useSidebarStore } from '../store/sidebar';
import { useRouter } from 'vue-router';
import imgurl from '../assets/img/img.jpg';
import { onMounted } from "vue";
import { useSidebarStore } from "../store/sidebar";
import { useRouter } from "vue-router";
import imgurl from "../assets/img/img.jpg";
const username: string | null = localStorage.getItem('vuems_name');
const username: string | null = localStorage.getItem("vuems_name");
const message: number = 2;
const sidebar = useSidebarStore();
// 侧边栏折叠
const collapseChage = () => {
sidebar.handleCollapse();
sidebar.handleCollapse();
};
onMounted(() => {
if (document.body.clientWidth < 1500) {
collapseChage();
}
if (document.body.clientWidth < 1500) {
collapseChage();
}
});
// 用户名下拉菜单选择事件
const router = useRouter();
const showDashboard = () => {
router.push("/");
};
const handleCommand = (command: string) => {
if (command == 'loginout') {
localStorage.removeItem('vuems_name');
router.push('/login');
} else if (command == 'user') {
router.push('/ucenter');
}
if (command == "loginout") {
localStorage.removeItem("vuems_name");
router.push("/login");
} else if (command == "user") {
router.push("/ucenter");
}
};
const setFullScreen = () => {
if (document.fullscreenElement) {
document.exitFullscreen();
} else {
document.body.requestFullscreen.call(document.body);
}
if (document.fullscreenElement) {
document.exitFullscreen();
} else {
document.body.requestFullscreen.call(document.body);
}
};
</script>
<style scoped>
.header {
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
width: 100%;
height: 70px;
color: var(--header-text-color);
background-color: var(--header-bg-color);
border-bottom: 1px solid #ddd;
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
width: 100%;
height: 70px;
color: var(--header-text-color);
background-color: var(--header-bg-color);
border-bottom: 1px solid #ddd;
}
.header-left {
display: flex;
align-items: center;
padding-left: 20px;
height: 100%;
display: flex;
align-items: center;
padding-left: 20px;
height: 100%;
}
.logo {
width: 35px;
width: 35px;
}
.web-title {
margin: 0 40px 0 10px;
font-size: 22px;
margin: 0 40px 0 10px;
font-size: 22px;
cursor: pointer;
}
.collapse-btn {
display: flex;
justify-content: center;
align-items: center;
height: 100%;
padding: 0 10px;
cursor: pointer;
opacity: 0.8;
font-size: 22px;
display: flex;
justify-content: center;
align-items: center;
height: 100%;
padding: 0 10px;
cursor: pointer;
opacity: 0.8;
font-size: 22px;
}
.collapse-btn:hover {
opacity: 1;
opacity: 1;
}
.header-right {
float: right;
padding-right: 50px;
float: right;
padding-right: 50px;
}
.header-user-con {
display: flex;
height: 70px;
align-items: center;
display: flex;
height: 70px;
align-items: center;
}
.btn-fullscreen {
transform: rotate(45deg);
margin-right: 5px;
font-size: 24px;
transform: rotate(45deg);
margin-right: 5px;
font-size: 24px;
}
.btn-icon {
position: relative;
width: 30px;
height: 30px;
text-align: center;
cursor: pointer;
display: flex;
align-items: center;
color: var(--header-text-color);
margin: 0 5px;
font-size: 20px;
position: relative;
width: 30px;
height: 30px;
text-align: center;
cursor: pointer;
display: flex;
align-items: center;
color: var(--header-text-color);
margin: 0 5px;
font-size: 20px;
}
.btn-bell-badge {
position: absolute;
right: 4px;
top: 0px;
width: 8px;
height: 8px;
border-radius: 4px;
background: #f56c6c;
color: var(--header-text-color);
position: absolute;
right: 4px;
top: 0px;
width: 8px;
height: 8px;
border-radius: 4px;
background: #f56c6c;
color: var(--header-text-color);
}
.user-avator {
margin: 0 10px 0 20px;
margin: 0 10px 0 20px;
}
.el-dropdown-link {
color: var(--header-text-color);
cursor: pointer;
display: flex;
align-items: center;
color: var(--header-text-color);
cursor: pointer;
display: flex;
align-items: center;
}
.el-dropdown-menu__item {
text-align: center;
text-align: center;
}
</style>

426
src/components/menu.ts
View File

@ -1,221 +1,215 @@
import { Menus } from '@/types/menu';
import { Menus } from "@/types/menu";
export const menuData: Menus[] = [
{
id: '0',
title: '系统首页',
index: '/dashboard',
icon: 'Odometer',
},
{
id: '1',
title: '系统管理',
index: '1',
icon: 'HomeFilled',
{
id: "1",
title: "系统管理",
index: "1",
icon: "HomeFilled",
children: [
{
id: "11",
pid: "1",
index: "/system-user",
title: "用户管理",
},
{
id: "12",
pid: "1",
index: "/system-role",
title: "角色管理",
},
{
id: "13",
pid: "1",
index: "/system-menu",
title: "菜单管理",
},
],
},
{
id: "2",
title: "组件",
index: "2-1",
icon: "Calendar",
children: [
{
id: "21",
pid: "3",
index: "/form",
title: "表单",
},
{
id: "22",
pid: "3",
index: "/upload",
title: "上传",
},
{
id: "23",
pid: "2",
index: "/carousel",
title: "走马灯",
},
{
id: "24",
pid: "2",
index: "/calendar",
title: "日历",
},
{
id: "25",
pid: "2",
index: "/watermark",
title: "水印",
},
{
id: "26",
pid: "2",
index: "/tour",
title: "分布引导",
},
{
id: "27",
pid: "2",
index: "/steps",
title: "步骤条",
},
{
id: "28",
pid: "2",
index: "/statistic",
title: "统计",
},
{
id: "29",
pid: "3",
index: "29",
title: "三级菜单",
children: [
{
id: '11',
pid: '1',
index: '/system-user',
title: '用户管理',
},
{
id: '12',
pid: '1',
index: '/system-role',
title: '角色管理',
},
{
id: '13',
pid: '1',
index: '/system-menu',
title: '菜单管理',
},
{
id: "291",
pid: "29",
index: "/editor",
title: "富文本编辑器",
},
{
id: "292",
pid: "29",
index: "/markdown",
title: "markdown编辑器",
},
],
},
{
id: '2',
title: '组件',
index: '2-1',
icon: 'Calendar',
children: [
{
id: '21',
pid: '3',
index: '/form',
title: '表单',
},
{
id: '22',
pid: '3',
index: '/upload',
title: '上传',
},
{
id: '23',
pid: '2',
index: '/carousel',
title: '走马灯',
},
{
id: '24',
pid: '2',
index: '/calendar',
title: '日历',
},
{
id: '25',
pid: '2',
index: '/watermark',
title: '水印',
},
{
id: '26',
pid: '2',
index: '/tour',
title: '分布引导',
},
{
id: '27',
pid: '2',
index: '/steps',
title: '步骤条',
},
{
id: '28',
pid: '2',
index: '/statistic',
title: '统计',
},
{
id: '29',
pid: '3',
index: '29',
title: '三级菜单',
children: [
{
id: '291',
pid: '29',
index: '/editor',
title: '富文本编辑器',
},
{
id: '292',
pid: '29',
index: '/markdown',
title: 'markdown编辑器',
},
],
},
],
},
{
id: '3',
title: '表格',
index: '3',
icon: 'Calendar',
children: [
{
id: '31',
pid: '3',
index: '/table',
title: '基础表格',
},
{
id: '32',
pid: '3',
index: '/table-editor',
title: '可编辑表格',
},
{
id: '33',
pid: '3',
index: '/import',
title: '导入Excel',
},
{
id: '34',
pid: '3',
index: '/export',
title: '导出Excel',
},
],
},
{
id: '4',
icon: 'PieChart',
index: '4',
title: '图表',
children: [
{
id: '41',
pid: '4',
index: '/schart',
title: 'schart图表',
},
{
id: '42',
pid: '4',
index: '/echarts',
title: 'echarts图表',
},
],
},
{
id: '5',
icon: 'Guide',
index: '/icon',
title: '图标',
permiss: '5',
},
{
id: '7',
icon: 'Brush',
index: '/theme',
title: '主题',
},
{
id: '6',
icon: 'DocumentAdd',
index: '6',
title: '附加页面',
children: [
{
id: '61',
pid: '6',
index: '/ucenter',
title: '个人中心',
},
{
id: '62',
pid: '6',
index: '/login',
title: '登录',
},
{
id: '63',
pid: '6',
index: '/register',
title: '注册',
},
{
id: '64',
pid: '6',
index: '/reset-pwd',
title: '重设密码',
},
{
id: '65',
pid: '6',
index: '/403',
title: '403',
},
{
id: '66',
pid: '6',
index: '/404',
title: '404',
},
],
},
},
],
},
{
id: "3",
title: "表格",
index: "3",
icon: "Calendar",
children: [
{
id: "31",
pid: "3",
index: "/table",
title: "基础表格",
},
{
id: "32",
pid: "3",
index: "/table-editor",
title: "可编辑表格",
},
{
id: "33",
pid: "3",
index: "/import",
title: "导入Excel",
},
{
id: "34",
pid: "3",
index: "/export",
title: "导出Excel",
},
],
},
{
id: "4",
icon: "PieChart",
index: "4",
title: "图表",
children: [
{
id: "41",
pid: "4",
index: "/schart",
title: "schart图表",
},
{
id: "42",
pid: "4",
index: "/echarts",
title: "echarts图表",
},
],
},
{
id: "5",
icon: "Guide",
index: "/icon",
title: "图标",
permiss: "5",
},
{
id: "7",
icon: "Brush",
index: "/theme",
title: "主题",
},
{
id: "6",
icon: "DocumentAdd",
index: "6",
title: "附加页面",
children: [
{
id: "61",
pid: "6",
index: "/ucenter",
title: "个人中心",
},
{
id: "62",
pid: "6",
index: "/login",
title: "登录",
},
{
id: "63",
pid: "6",
index: "/register",
title: "注册",
},
{
id: "64",
pid: "6",
index: "/reset-pwd",
title: "重设密码",
},
{
id: "65",
pid: "6",
index: "/403",
title: "403",
},
{
id: "66",
pid: "6",
index: "/404",
title: "404",
},
],
},
];

590
src/router/index.ts
View File

@ -1,293 +1,351 @@
import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router';
import { usePermissStore } from '../store/permiss';
import Home from '../views/home.vue';
import NProgress from 'nprogress';
import 'nprogress/nprogress.css';
import { createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router";
import { usePermissStore } from "../store/permiss";
import Home from "../views/home.vue";
import NProgress from "nprogress";
import "nprogress/nprogress.css";
const routes: RouteRecordRaw[] = [
{
path: '/',
redirect: '/dashboard',
},
{
path: '/',
name: 'Home',
component: Home,
children: [
{
path: '/dashboard',
name: 'dashboard',
meta: {
title: '系统首页',
noAuth: true,
},
component: () => import(/* webpackChunkName: "dashboard" */ '../views/dashboard.vue'),
},
{
path: '/system-user',
name: 'system-user',
meta: {
title: '用户管理',
permiss: '11',
},
component: () => import(/* webpackChunkName: "system-user" */ '../views/system/user.vue'),
},
{
path: '/system-role',
name: 'system-role',
meta: {
title: '角色管理',
permiss: '12',
},
component: () => import(/* webpackChunkName: "system-role" */ '../views/system/role.vue'),
},
{
path: '/system-menu',
name: 'system-menu',
meta: {
title: '菜单管理',
permiss: '13',
},
component: () => import(/* webpackChunkName: "system-menu" */ '../views/system/menu.vue'),
},
{
path: '/table',
name: 'basetable',
meta: {
title: '基础表格',
permiss: '31',
},
component: () => import(/* webpackChunkName: "table" */ '../views/table/basetable.vue'),
},
{
path: '/table-editor',
name: 'table-editor',
meta: {
title: '可编辑表格',
permiss: '32',
},
component: () => import(/* webpackChunkName: "table-editor" */ '../views/table/table-editor.vue'),
},
{
path: '/schart',
name: 'schart',
meta: {
title: 'schart图表',
permiss: '41',
},
component: () => import(/* webpackChunkName: "schart" */ '../views/chart/schart.vue'),
},
{
path: '/echarts',
name: 'echarts',
meta: {
title: 'echarts图表',
permiss: '42',
},
component: () => import(/* webpackChunkName: "echarts" */ '../views/chart/echarts.vue'),
},
{
path: "/",
redirect: "/dashboard",
},
{
path: "/",
name: "Home",
component: Home,
children: [
{
path: "/dashboard",
name: "dashboard",
meta: {
title: "系统首页",
},
component: () =>
import(/* webpackChunkName: "dashboard" */ "../views/dashboard.vue"),
},
{
path: "/system-user",
name: "system-user",
meta: {
title: "用户管理",
permiss: "11",
},
component: () =>
import(
/* webpackChunkName: "system-user" */ "../views/system/user.vue"
),
},
{
path: "/system-role",
name: "system-role",
meta: {
title: "角色管理",
permiss: "12",
},
component: () =>
import(
/* webpackChunkName: "system-role" */ "../views/system/role.vue"
),
},
{
path: "/system-menu",
name: "system-menu",
meta: {
title: "菜单管理",
permiss: "13",
},
component: () =>
import(
/* webpackChunkName: "system-menu" */ "../views/system/menu.vue"
),
},
{
path: "/table",
name: "basetable",
meta: {
title: "基础表格",
permiss: "31",
},
component: () =>
import(
/* webpackChunkName: "table" */ "../views/table/basetable.vue"
),
},
{
path: "/table-editor",
name: "table-editor",
meta: {
title: "可编辑表格",
permiss: "32",
},
component: () =>
import(
/* webpackChunkName: "table-editor" */ "../views/table/table-editor.vue"
),
},
{
path: "/schart",
name: "schart",
meta: {
title: "schart图表",
permiss: "41",
},
component: () =>
import(/* webpackChunkName: "schart" */ "../views/chart/schart.vue"),
},
{
path: "/echarts",
name: "echarts",
meta: {
title: "echarts图表",
permiss: "42",
},
component: () =>
import(
/* webpackChunkName: "echarts" */ "../views/chart/echarts.vue"
),
},
{
path: '/icon',
name: 'icon',
meta: {
title: '图标',
permiss: '5',
},
component: () => import(/* webpackChunkName: "icon" */ '../views/pages/icon.vue'),
},
{
path: '/ucenter',
name: 'ucenter',
meta: {
title: '个人中心',
},
component: () => import(/* webpackChunkName: "ucenter" */ '../views/pages/ucenter.vue'),
},
{
path: '/editor',
name: 'editor',
meta: {
title: '富文本编辑器',
permiss: '291',
},
component: () => import(/* webpackChunkName: "editor" */ '../views/pages/editor.vue'),
},
{
path: '/markdown',
name: 'markdown',
meta: {
title: 'markdown编辑器',
permiss: '292',
},
component: () => import(/* webpackChunkName: "markdown" */ '../views/pages/markdown.vue'),
},
{
path: '/export',
name: 'export',
meta: {
title: '导出Excel',
permiss: '34',
},
component: () => import(/* webpackChunkName: "export" */ '../views/table/export.vue'),
},
{
path: '/import',
name: 'import',
meta: {
title: '导入Excel',
permiss: '33',
},
component: () => import(/* webpackChunkName: "import" */ '../views/table/import.vue'),
},
{
path: '/theme',
name: 'theme',
meta: {
title: '主题设置',
permiss: '7',
},
component: () => import(/* webpackChunkName: "theme" */ '../views/pages/theme.vue'),
},
{
path: '/calendar',
name: 'calendar',
meta: {
title: '日历',
permiss: '24',
},
component: () => import(/* webpackChunkName: "calendar" */ '../views/element/calendar.vue'),
},
{
path: '/watermark',
name: 'watermark',
meta: {
title: '水印',
permiss: '25',
},
component: () => import(/* webpackChunkName: "watermark" */ '../views/element/watermark.vue'),
},
{
path: '/carousel',
name: 'carousel',
meta: {
title: '走马灯',
permiss: '23',
},
component: () => import(/* webpackChunkName: "carousel" */ '../views/element/carousel.vue'),
},
{
path: '/tour',
name: 'tour',
meta: {
title: '分步引导',
permiss: '26',
},
component: () => import(/* webpackChunkName: "tour" */ '../views/element/tour.vue'),
},
{
path: '/steps',
name: 'steps',
meta: {
title: '步骤条',
permiss: '27',
},
component: () => import(/* webpackChunkName: "steps" */ '../views/element/steps.vue'),
},
{
path: '/form',
name: 'forms',
meta: {
title: '表单',
permiss: '21',
},
component: () => import(/* webpackChunkName: "form" */ '../views/element/form.vue'),
},
{
path: '/upload',
name: 'upload',
meta: {
title: '上传',
permiss: '22',
},
component: () => import(/* webpackChunkName: "upload" */ '../views/element/upload.vue'),
},
{
path: '/statistic',
name: 'statistic',
meta: {
title: '统计',
permiss: '28',
},
component: () => import(/* webpackChunkName: "statistic" */ '../views/element/statistic.vue'),
},
],
},
{
path: '/login',
{
path: "/icon",
name: "icon",
meta: {
title: '登录',
noAuth: true,
title: "图标",
permiss: "5",
},
component: () => import(/* webpackChunkName: "login" */ '../views/pages/login.vue'),
},
{
path: '/register',
component: () =>
import(/* webpackChunkName: "icon" */ "../views/pages/icon.vue"),
},
{
path: "/ucenter",
name: "ucenter",
meta: {
title: '注册',
noAuth: true,
title: "个人中心",
},
component: () => import(/* webpackChunkName: "register" */ '../views/pages/register.vue'),
},
{
path: '/reset-pwd',
component: () =>
import(
/* webpackChunkName: "ucenter" */ "../views/pages/ucenter.vue"
),
},
{
path: "/editor",
name: "editor",
meta: {
title: '重置密码',
noAuth: true,
title: "富文本编辑器",
permiss: "291",
},
component: () => import(/* webpackChunkName: "reset-pwd" */ '../views/pages/reset-pwd.vue'),
},
{
path: '/403',
component: () =>
import(/* webpackChunkName: "editor" */ "../views/pages/editor.vue"),
},
{
path: "/markdown",
name: "markdown",
meta: {
title: '没有权限',
noAuth: true,
title: "markdown编辑器",
permiss: "292",
},
component: () => import(/* webpackChunkName: "403" */ '../views/pages/403.vue'),
},
{
path: '/404',
component: () =>
import(
/* webpackChunkName: "markdown" */ "../views/pages/markdown.vue"
),
},
{
path: "/export",
name: "export",
meta: {
title: '找不到页面',
noAuth: true,
title: "导出Excel",
permiss: "34",
},
component: () => import(/* webpackChunkName: "404" */ '../views/pages/404.vue'),
component: () =>
import(/* webpackChunkName: "export" */ "../views/table/export.vue"),
},
{
path: "/import",
name: "import",
meta: {
title: "导入Excel",
permiss: "33",
},
component: () =>
import(/* webpackChunkName: "import" */ "../views/table/import.vue"),
},
{
path: "/theme",
name: "theme",
meta: {
title: "主题设置",
permiss: "7",
},
component: () =>
import(/* webpackChunkName: "theme" */ "../views/pages/theme.vue"),
},
{
path: "/calendar",
name: "calendar",
meta: {
title: "日历",
permiss: "24",
},
component: () =>
import(
/* webpackChunkName: "calendar" */ "../views/element/calendar.vue"
),
},
{
path: "/watermark",
name: "watermark",
meta: {
title: "水印",
permiss: "25",
},
component: () =>
import(
/* webpackChunkName: "watermark" */ "../views/element/watermark.vue"
),
},
{
path: "/carousel",
name: "carousel",
meta: {
title: "走马灯",
permiss: "23",
},
component: () =>
import(
/* webpackChunkName: "carousel" */ "../views/element/carousel.vue"
),
},
{
path: "/tour",
name: "tour",
meta: {
title: "分步引导",
permiss: "26",
},
component: () =>
import(/* webpackChunkName: "tour" */ "../views/element/tour.vue"),
},
{
path: "/steps",
name: "steps",
meta: {
title: "步骤条",
permiss: "27",
},
component: () =>
import(/* webpackChunkName: "steps" */ "../views/element/steps.vue"),
},
{
path: "/form",
name: "forms",
meta: {
title: "表单",
permiss: "21",
},
component: () =>
import(/* webpackChunkName: "form" */ "../views/element/form.vue"),
},
{
path: "/upload",
name: "upload",
meta: {
title: "上传",
permiss: "22",
},
component: () =>
import(
/* webpackChunkName: "upload" */ "../views/element/upload.vue"
),
},
{
path: "/statistic",
name: "statistic",
meta: {
title: "统计",
permiss: "28",
},
component: () =>
import(
/* webpackChunkName: "statistic" */ "../views/element/statistic.vue"
),
},
],
},
{
path: "/login",
meta: {
title: "登录",
noAuth: true,
},
{ path: '/:path(.*)', redirect: '/404' },
component: () =>
import(/* webpackChunkName: "login" */ "../views/pages/login.vue"),
},
{
path: "/register",
meta: {
title: "注册",
noAuth: true,
},
component: () =>
import(/* webpackChunkName: "register" */ "../views/pages/register.vue"),
},
{
path: "/reset-pwd",
meta: {
title: "重置密码",
noAuth: true,
},
component: () =>
import(
/* webpackChunkName: "reset-pwd" */ "../views/pages/reset-pwd.vue"
),
},
{
path: "/403",
meta: {
title: "没有权限",
noAuth: true,
},
component: () =>
import(/* webpackChunkName: "403" */ "../views/pages/403.vue"),
},
{
path: "/404",
meta: {
title: "找不到页面",
noAuth: true,
},
component: () =>
import(/* webpackChunkName: "404" */ "../views/pages/404.vue"),
},
{ path: "/:path(.*)", redirect: "/404" },
];
const router = createRouter({
history: createWebHashHistory(),
routes,
history: createWebHashHistory(),
routes,
});
router.beforeEach((to, from, next) => {
NProgress.start();
const role = localStorage.getItem('vuems_name');
const permiss = usePermissStore();
NProgress.start();
const role = localStorage.getItem("vuems_name");
const permiss = usePermissStore();
if (!role && to.meta.noAuth !== true) {
next('/login');
} else if (typeof to.meta.permiss == 'string' && !permiss.key.includes(to.meta.permiss)) {
// 如果没有权限，则进入403
next('/403');
} else {
next();
}
if (!role && to.meta.noAuth !== true) {
next("/login");
} else if (
typeof to.meta.permiss == "string" &&
!permiss.key.includes(to.meta.permiss)
) {
// 如果没有权限，则进入403
next("/403");
} else {
next();
}
});
router.afterEach(() => {
NProgress.done();
NProgress.done();
});
export default router;