mirror of
https://github.com/un-pany/v3-admin-vite.git
synced 2025-04-21 03:19:19 +08:00
Compare commits
No commits in common. "main" and "v5.0.0-beta.3" have entirely different histories.
main
...
v5.0.0-bet
@ -1,7 +1,7 @@
|
||||
# 生产环境的环境变量（命名必须以 VITE_ 开头）
|
||||
|
||||
## 后端接口地址（如果解决跨域问题采用 CORS 就需要写绝对路径）
|
||||
VITE_BASE_URL = https://apifoxmock.com/m1/2930465-2145633-default/api/v1
|
||||
VITE_BASE_URL = https://mock.mengxuegu.com/mock/63218b5fb4c53348ed2bc212/api/v1
|
||||
|
||||
## 打包构建静态资源公共路径（例如部署到 https://un-pany.github.io/v3-admin-vite/ 域名下就需要填写 /v3-admin-vite/）
|
||||
VITE_PUBLIC_PATH = /v3-admin-vite/
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
# 预发布环境的环境变量（命名必须以 VITE_ 开头）
|
||||
|
||||
## 后端接口地址（如果解决跨域问题采用 CORS 就需要写绝对路径）
|
||||
VITE_BASE_URL = https://apifoxmock.com/m1/2930465-2145633-default/api/v1
|
||||
VITE_BASE_URL = https://mock.mengxuegu.com/mock/63218b5fb4c53348ed2bc212/api/v1
|
||||
|
||||
## 打包构建静态资源公共路径（例如部署到 https://un-pany.github.io/ 域名下就需要填写 /）
|
||||
VITE_PUBLIC_PATH = /
|
||||
|
||||
25
README.md
25
README.md
@ -11,7 +11,7 @@
|
||||
|
||||
## Introduction
|
||||
|
||||
V3 Admin Vite is a well-crafted backend management system template, built with popular technologies such as Vue3, Vite, TypeScript, and Element Plus
|
||||
V3 Admin Vite is a free and open-source foundational solution for backend management systems, based on popular technologies such as Vue3, Vite, TypeScript, Element Plus, and others
|
||||
|
||||
## Notifications
|
||||
|
||||
@ -27,9 +27,6 @@ V3 Admin Vite is a well-crafted backend management system template, built with p
|
||||
> [!TIP]
|
||||
> Paid services are officially launched! If you don’t want to do it yourself but want to remove TS or other modules, try the lazy package! [Click to check it out](https://github.com/un-pany/v3-admin-vite/issues/225)
|
||||
|
||||
> [!TIP]
|
||||
> If you have mobile web app needs, try the new open-source template. [MobVue](https://github.com/un-pany/mobvue)
|
||||
|
||||
## Usage
|
||||
|
||||
<details>
|
||||
@ -136,23 +133,21 @@ pnpm test
|
||||
|
||||
## Links
|
||||
|
||||
**Online Preview**: [github-pages](https://un-pany.github.io/v3-admin-vite)
|
||||
**Online Preview**：[github-pages](https://un-pany.github.io/v3-admin-vite)
|
||||
|
||||
**Chinese Documentation**: [link](https://juejin.cn/post/7089377403717287972)
|
||||
**Chinese Documentation**：[link](https://juejin.cn/post/7089377403717287972)
|
||||
|
||||
**Zero to Hero Tutorial**: [link](https://juejin.cn/column/7207659644487139387)
|
||||
|
||||
**Mobile Web App**: [mobvue](https://github.com/un-pany/mobvue)
|
||||
**Zero to Hero Tutorial**：[link](https://juejin.cn/column/7207659644487139387)
|
||||
|
||||
**Electron Desktop Version**: [v3-electron-vite](https://github.com/un-pany/v3-electron-vite)
|
||||
|
||||
**Chinese Repository**: [gitee](https://gitee.com/un-pany/v3-admin-vite)
|
||||
**Chinese Repository**：[gitee](https://gitee.com/un-pany/v3-admin-vite)
|
||||
|
||||
**Optional Group**: [check how to join](https://github.com/un-pany/v3-admin-vite/issues/191)
|
||||
**Optional Group**：[check how to join](https://github.com/un-pany/v3-admin-vite/issues/191)
|
||||
|
||||
**Donations**: [buy a coffee for the author](https://github.com/un-pany/v3-admin-vite/issues/69)
|
||||
**Donations**：[buy a coffee for the author](https://github.com/un-pany/v3-admin-vite/issues/69)
|
||||
|
||||
**Releases & Changelog**: [releases](https://github.com/un-pany/v3-admin-vite/releases)
|
||||
**Releases & Changelog**：[releases](https://github.com/un-pany/v3-admin-vite/releases)
|
||||
|
||||
## Features
|
||||
|
||||
@ -168,7 +163,7 @@ pnpm test
|
||||
|
||||
**User Management**: Login, logout demonstration
|
||||
|
||||
**Permission Management**: Page-level permissions (dynamic routing), button-level permissions (permission directives, permission functions), route guards
|
||||
**Permission Management**: Page-level permissions (dynamic routing), button-level permissions (directive permissions, permission functions), route guards
|
||||
|
||||
**Multiple Environments**: Development, staging, and production environments
|
||||
|
||||
@ -204,7 +199,7 @@ pnpm test
|
||||
|
||||
**CSS Variables**: Primarily controls layout and color in the project
|
||||
|
||||
**ESLint**: Code linting and formatting
|
||||
**ESlint**: Code linting and formatting
|
||||
|
||||
**Axios**: Sends network requests
|
||||
|
||||
|
||||
@ -11,7 +11,7 @@
|
||||
|
||||
## 简介
|
||||
|
||||
V3 Admin Vite 是一个精心制作的后台管理系统模板，基于 Vue3、Vite、TypeScript、Element Plus 等主流技术
|
||||
V3 Admin Vite 是一个免费开源的中后台管理系统基础解决方案，基于 Vue3、Vite、TypeScript、Element Plus 等主流技术
|
||||
|
||||
## 通知
|
||||
|
||||
@ -27,9 +27,6 @@ V3 Admin Vite 是一个精心制作的后台管理系统模板，基于 Vue3、V
|
||||
> [!TIP]
|
||||
> 正式推出付费服务，如果不想自己动手，但想移除 TS 或其他模块？试试懒人套餐！[点击看看](https://github.com/un-pany/v3-admin-vite/issues/225)
|
||||
|
||||
> [!TIP]
|
||||
> 如果你有移动端 H5 需求，试试新的开源模板。[MobVue](https://github.com/un-pany/mobvue)
|
||||
|
||||
## 使用
|
||||
|
||||
<details>
|
||||
@ -116,7 +113,7 @@ pnpm test
|
||||
|
||||
`fix` 修复错误
|
||||
|
||||
`perf` 性能优化
|
||||
`perf` 优化
|
||||
|
||||
`refactor` 重构代码
|
||||
|
||||
@ -142,9 +139,7 @@ pnpm test
|
||||
|
||||
**零基础教程**：[链接](https://juejin.cn/column/7207659644487139387)
|
||||
|
||||
**移动端 H5**：[mobvue](https://github.com/un-pany/mobvue)
|
||||
|
||||
**Electron 桌面版**：[v3-electron-vite](https://github.com/un-pany/v3-electron-vite)
|
||||
**Electron 桌面版**: [v3-electron-vite](https://github.com/un-pany/v3-electron-vite)
|
||||
|
||||
**国内仓库**：[gitee](https://gitee.com/un-pany/v3-admin-vite)
|
||||
|
||||
@ -160,15 +155,15 @@ pnpm test
|
||||
|
||||
**详细的注释**：各个配置项都写有尽可能详细的注释
|
||||
|
||||
**最新的依赖**：及时更新所有三方依赖至最新版
|
||||
**最新的依赖**: 及时更新所有三方依赖至最新版
|
||||
|
||||
**有一点规范**：代码风格统一、命名风格统一、注释风格统一
|
||||
**有一点规范**: 代码风格统一、命名风格统一、注释风格统一
|
||||
|
||||
## 内置功能
|
||||
|
||||
**用户管理**：登录、登出演示
|
||||
|
||||
**权限管理**：页面级权限（动态路由）、按钮级权限（权限指令、权限函数）、路由守卫
|
||||
**权限管理**：页面级权限（动态路由）、按钮级权限（指令权限、权限函数）、路由守卫
|
||||
|
||||
**多环境**：开发环境（development）、预发布环境（staging）、生产环境（production）
|
||||
|
||||
@ -178,9 +173,9 @@ pnpm test
|
||||
|
||||
**首页**：根据不同用户显示不同的 Dashboard 页面
|
||||
|
||||
**错误页**：403、404
|
||||
**错误页**: 403、404
|
||||
|
||||
**兼容移动端**：布局兼容移动端页面分辨率
|
||||
**兼容移动端**: 布局兼容移动端页面分辨率
|
||||
|
||||
**其他**：SVG 雪碧图、动态侧边栏、动态面包屑、标签页快捷导航、内容区放大与全屏、组合式函数
|
||||
|
||||
@ -190,7 +185,7 @@ pnpm test
|
||||
|
||||
**Element Plus**：Element UI 的 Vue3 版本
|
||||
|
||||
**Pinia**：传说中的 Vuex5
|
||||
**Pinia**: 传说中的 Vuex5
|
||||
|
||||
**Vite**：真的很快
|
||||
|
||||
@ -204,7 +199,7 @@ pnpm test
|
||||
|
||||
**CSS 变量**：主要控制项目的布局和颜色
|
||||
|
||||
**ESLint**：代码校验与格式化
|
||||
**ESlint**：代码校验与格式化
|
||||
|
||||
**Axios**：发送网络请求（已封装好）
|
||||
|
||||
|
||||
@ -36,8 +36,7 @@ export default antfu(
|
||||
"no-console": "off",
|
||||
"no-debugger": "off",
|
||||
"symbol-description": "off",
|
||||
"antfu/if-newline": "off",
|
||||
"unicorn/no-instanceof-builtins": "off"
|
||||
"antfu/if-newline": "off"
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
36
package.json
36
package.json
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "v3-admin-vite",
|
||||
"type": "module",
|
||||
"version": "5.0.0-beta.6",
|
||||
"version": "5.0.0-beta.3",
|
||||
"description": "A crafted admin template, built with Vue3, Vite, TypeScript, Element Plus, and more",
|
||||
"author": "pany <939630029@qq.com> (https://github.com/pany-ang)",
|
||||
"repository": "https://github.com/un-pany/v3-admin-vite",
|
||||
@ -16,9 +16,9 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@element-plus/icons-vue": "2.3.1",
|
||||
"axios": "1.8.4",
|
||||
"axios": "1.7.9",
|
||||
"dayjs": "1.11.13",
|
||||
"element-plus": "2.9.7",
|
||||
"element-plus": "2.9.3",
|
||||
"js-cookie": "3.0.5",
|
||||
"lodash-es": "4.17.21",
|
||||
"mitt": "3.0.1",
|
||||
@ -26,37 +26,37 @@
|
||||
"nprogress": "0.2.0",
|
||||
"path-browserify": "1.0.1",
|
||||
"path-to-regexp": "8.2.0",
|
||||
"pinia": "3.0.2",
|
||||
"pinia": "2.3.1",
|
||||
"screenfull": "6.0.2",
|
||||
"vue": "3.5.13",
|
||||
"vue-router": "4.5.0",
|
||||
"vxe-table": "4.6.25"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@antfu/eslint-config": "4.12.0",
|
||||
"@antfu/eslint-config": "4.1.1",
|
||||
"@types/js-cookie": "3.0.6",
|
||||
"@types/lodash-es": "4.17.12",
|
||||
"@types/node": "22.14.1",
|
||||
"@types/node": "22.13.1",
|
||||
"@types/nprogress": "0.2.3",
|
||||
"@types/path-browserify": "1.0.3",
|
||||
"@vitejs/plugin-vue": "5.2.3",
|
||||
"@vitejs/plugin-vue-jsx": "4.1.2",
|
||||
"@vitejs/plugin-vue": "5.2.1",
|
||||
"@vitejs/plugin-vue-jsx": "4.1.1",
|
||||
"@vue/test-utils": "2.4.6",
|
||||
"eslint": "9.24.0",
|
||||
"eslint": "9.19.0",
|
||||
"eslint-plugin-format": "1.0.1",
|
||||
"happy-dom": "17.4.4",
|
||||
"happy-dom": "17.0.0",
|
||||
"husky": "9.1.7",
|
||||
"lint-staged": "15.5.1",
|
||||
"lint-staged": "15.4.3",
|
||||
"sass": "1.78.0",
|
||||
"typescript": "5.8.3",
|
||||
"unocss": "66.1.0-beta.12",
|
||||
"unplugin-auto-import": "19.1.2",
|
||||
"typescript": "5.7.3",
|
||||
"unocss": "65.4.3",
|
||||
"unplugin-auto-import": "19.0.0",
|
||||
"unplugin-svg-component": "0.12.1",
|
||||
"unplugin-vue-components": "28.5.0",
|
||||
"vite": "6.3.2",
|
||||
"unplugin-vue-components": "28.0.0",
|
||||
"vite": "6.1.0",
|
||||
"vite-svg-loader": "5.1.0",
|
||||
"vitest": "3.1.1",
|
||||
"vue-tsc": "2.2.8"
|
||||
"vitest": "3.0.5",
|
||||
"vue-tsc": "2.2.0"
|
||||
},
|
||||
"lint-staged": {
|
||||
"*": "eslint --fix"
|
||||
|
||||
3311
pnpm-lock.yaml
generated
3311
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@ -38,9 +38,8 @@ body {
|
||||
background-color: var(--v3-body-bg-color);
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-family:
|
||||
Inter, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial,
|
||||
sans-serif;
|
||||
font-family: Inter, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑",
|
||||
Arial, sans-serif;
|
||||
@extend %scrollbar;
|
||||
}
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
import type { ElScrollbar } from "element-plus"
|
||||
import type { RouteRecordNameGeneric, RouteRecordRaw } from "vue-router"
|
||||
import type { RouteRecordName, RouteRecordRaw } from "vue-router"
|
||||
import { usePermissionStore } from "@/pinia/stores/permission"
|
||||
import { useDevice } from "@@/composables/useDevice"
|
||||
import { isExternal } from "@@/utils/validate"
|
||||
@ -20,7 +20,7 @@ const resultRef = ref<InstanceType<typeof Result> | null>(null)
|
||||
|
||||
const keyword = ref<string>("")
|
||||
const result = shallowRef<RouteRecordRaw[]>([])
|
||||
const activeRouteName = ref<RouteRecordNameGeneric | undefined>(undefined)
|
||||
const activeRouteName = ref<RouteRecordName | undefined>(undefined)
|
||||
/** 是否按下了上键或下键（用于解决和 mouseenter 事件的冲突） */
|
||||
const isPressUpOrDown = ref<boolean>(false)
|
||||
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<script lang="ts" setup>
|
||||
import type { RouteRecordNameGeneric, RouteRecordRaw } from "vue-router"
|
||||
import type { RouteRecordName, RouteRecordRaw } from "vue-router"
|
||||
|
||||
interface Props {
|
||||
data: RouteRecordRaw[]
|
||||
@ -9,7 +9,7 @@ interface Props {
|
||||
const props = defineProps<Props>()
|
||||
|
||||
/** 选中的菜单 */
|
||||
const modelValue = defineModel<RouteRecordNameGeneric | undefined>({ required: true })
|
||||
const modelValue = defineModel<RouteRecordName | undefined>({ required: true })
|
||||
|
||||
const instance = getCurrentInstance()
|
||||
|
||||
|
||||
@ -1,8 +1,24 @@
|
||||
<script lang="ts" setup>
|
||||
import type { ThemeName } from "@@/composables/useTheme"
|
||||
import { useTheme } from "@@/composables/useTheme"
|
||||
import { MagicStick } from "@element-plus/icons-vue"
|
||||
|
||||
const { themeList, activeThemeName, setTheme } = useTheme()
|
||||
|
||||
function handleChangeTheme({ clientX, clientY }: MouseEvent, themeName: ThemeName) {
|
||||
const maxRadius = Math.hypot(
|
||||
Math.max(clientX, window.innerWidth - clientX),
|
||||
Math.max(clientY, window.innerHeight - clientY)
|
||||
)
|
||||
const style = document.documentElement.style
|
||||
style.setProperty("--v3-theme-x", `${clientX}px`)
|
||||
style.setProperty("--v3-theme-y", `${clientY}px`)
|
||||
style.setProperty("--v3-theme-r", `${maxRadius}px`)
|
||||
const handler = () => {
|
||||
setTheme(themeName)
|
||||
}
|
||||
document.startViewTransition ? document.startViewTransition(handler) : handler()
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -20,7 +36,7 @@ const { themeList, activeThemeName, setTheme } = useTheme()
|
||||
v-for="(theme, index) in themeList"
|
||||
:key="index"
|
||||
:disabled="activeThemeName === theme.name"
|
||||
@click="(e: MouseEvent) => setTheme(e, theme.name)"
|
||||
@click="(e: MouseEvent) => handleChangeTheme(e, theme.name)"
|
||||
>
|
||||
<span>{{ theme.title }}</span>
|
||||
</el-dropdown-item>
|
||||
|
||||
@ -1,18 +1,18 @@
|
||||
import type { Handler } from "mitt"
|
||||
import type { RouteLocationNormalizedGeneric } from "vue-router"
|
||||
import type { RouteLocationNormalized } from "vue-router"
|
||||
import mitt from "mitt"
|
||||
|
||||
/** 回调函数的类型 */
|
||||
type Callback = (route: RouteLocationNormalizedGeneric) => void
|
||||
type Callback = (route: RouteLocationNormalized) => void
|
||||
|
||||
const emitter = mitt()
|
||||
|
||||
const key = Symbol("ROUTE_CHANGE")
|
||||
|
||||
let latestRoute: RouteLocationNormalizedGeneric
|
||||
let latestRoute: RouteLocationNormalized
|
||||
|
||||
/** 设置最新的路由信息，触发路由变化事件 */
|
||||
export function setRouteChange(to: RouteLocationNormalizedGeneric) {
|
||||
export function setRouteChange(to: RouteLocationNormalized) {
|
||||
// 触发事件
|
||||
emitter.emit(key, to)
|
||||
// 缓存最新的路由信息
|
||||
|
||||
@ -1,5 +1,4 @@
|
||||
import { getActiveThemeName, setActiveThemeName } from "@@/utils/cache/local-storage"
|
||||
import { setCssVar } from "@@/utils/css"
|
||||
|
||||
const DEFAULT_THEME_NAME = "normal"
|
||||
|
||||
@ -33,18 +32,8 @@ const themeList: ThemeList[] = [
|
||||
const activeThemeName = ref<ThemeName>(getActiveThemeName() || DEFAULT_THEME_NAME)
|
||||
|
||||
/** 设置主题 */
|
||||
function setTheme({ clientX, clientY }: MouseEvent, value: ThemeName) {
|
||||
const maxRadius = Math.hypot(
|
||||
Math.max(clientX, window.innerWidth - clientX),
|
||||
Math.max(clientY, window.innerHeight - clientY)
|
||||
)
|
||||
setCssVar("--v3-theme-x", `${clientX}px`)
|
||||
setCssVar("--v3-theme-y", `${clientY}px`)
|
||||
setCssVar("--v3-theme-r", `${maxRadius}px`)
|
||||
const handler = () => {
|
||||
activeThemeName.value = value
|
||||
}
|
||||
document.startViewTransition ? document.startViewTransition(handler) : handler()
|
||||
function setTheme(value: ThemeName) {
|
||||
activeThemeName.value = value
|
||||
}
|
||||
|
||||
/** 在 html 根元素上挂载 class */
|
||||
|
||||
@ -7,7 +7,7 @@ export function checkPermission(permissionRoles: string[]): boolean {
|
||||
const { roles } = useUserStore()
|
||||
return roles.some(role => permissionRoles.includes(role))
|
||||
} else {
|
||||
console.error("参数必须是一个数组且长度大于 0，参考：checkPermission(['admin', 'editor'])")
|
||||
console.error("参数必须是一个数组且长度大于 0，参考：checkPermission(['admin','editor'])")
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
@ -4,7 +4,7 @@ export function isArray<T>(arg: T) {
|
||||
}
|
||||
|
||||
/** 判断是否为字符串 */
|
||||
export function isString(str: unknown) {
|
||||
export function isString<T>(str: T) {
|
||||
return typeof str === "string" || str instanceof String
|
||||
}
|
||||
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
import type { TagView } from "@/pinia/stores/tags-view"
|
||||
import type { RouteLocationNormalizedGeneric, RouteRecordRaw, RouterLink } from "vue-router"
|
||||
import type { RouteLocationNormalizedLoaded, RouteRecordRaw, RouterLink } from "vue-router"
|
||||
import { usePermissionStore } from "@/pinia/stores/permission"
|
||||
import { useTagsViewStore } from "@/pinia/stores/tags-view"
|
||||
import { useRouteListener } from "@@/composables/useRouteListener"
|
||||
@ -77,7 +77,7 @@ function initTags() {
|
||||
}
|
||||
|
||||
/** 添加标签页 */
|
||||
function addTags(route: RouteLocationNormalizedGeneric) {
|
||||
function addTags(route: RouteLocationNormalizedLoaded) {
|
||||
if (route.name) {
|
||||
tagsViewStore.addVisitedView(route)
|
||||
tagsViewStore.addCachedView(route)
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div pa-20px h-full text-center flex select-none all:transition-400>
|
||||
<div uno-padding-20 h-full text-center flex select-none all:transition-400>
|
||||
<div ma>
|
||||
<div text-5xl fw100 animate-bounce-alt animate-count-infinite animate-duration-1s>
|
||||
UnoCSS
|
||||
@ -7,7 +7,7 @@
|
||||
<div op30 text-lg fw300 m1 dark:op60>
|
||||
该页面是一个 UnoCSS 的使用案例，其他页面依旧采用 Scss
|
||||
</div>
|
||||
<div m2 flex-x-center text-lg op30 hover="op80" dark:op60 dark:hover="op80">
|
||||
<div m2 uno-flex-x-center text-lg op30 hover="op80" dark:op60 dark:hover="op80">
|
||||
<a href="https://antfu.me/posts/reimagine-atomic-css-zh" target="_blank">
|
||||
推荐阅读：重新构想原子化 CSS
|
||||
</a>
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
import type { RouteLocationNormalizedGeneric } from "vue-router"
|
||||
import type { RouteLocationNormalized } from "vue-router"
|
||||
import { pinia } from "@/pinia"
|
||||
import { getCachedViews, getVisitedViews, setCachedViews, setVisitedViews } from "@@/utils/cache/local-storage"
|
||||
import { useSettingsStore } from "./settings"
|
||||
|
||||
export type TagView = Partial<RouteLocationNormalizedGeneric>
|
||||
export type TagView = Partial<RouteLocationNormalized>
|
||||
|
||||
export const useTagsViewStore = defineStore("tags-view", () => {
|
||||
const { cacheTagsView } = useSettingsStore()
|
||||
|
||||
@ -15,7 +15,7 @@ export const useUserStore = defineStore("user", () => {
|
||||
const settingsStore = useSettingsStore()
|
||||
|
||||
// 设置 Token
|
||||
const setToken = (value: string) => {
|
||||
const setToken = async (value: string) => {
|
||||
_setToken(value)
|
||||
token.value = value
|
||||
}
|
||||
@ -29,7 +29,7 @@ export const useUserStore = defineStore("user", () => {
|
||||
}
|
||||
|
||||
// 模拟角色变化
|
||||
const changeRoles = (role: string) => {
|
||||
const changeRoles = async (role: string) => {
|
||||
const newToken = `token-${role}`
|
||||
token.value = newToken
|
||||
_setToken(newToken)
|
||||
|
||||
@ -14,7 +14,7 @@ const permission: Directive = {
|
||||
const hasPermission = roles.some(role => permissionRoles.includes(role))
|
||||
hasPermission || el.parentNode?.removeChild(el)
|
||||
} else {
|
||||
throw new Error(`参数必须是一个数组且长度大于 0，参考：v-permission="['admin', 'editor']"`)
|
||||
throw new Error(`参数必须是一个数组且长度大于 0，参考：v-permission="['admin','editor']"`)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -9,11 +9,8 @@ import { getToken } from "@@/utils/cache/cookies"
|
||||
import NProgress from "nprogress"
|
||||
|
||||
NProgress.configure({ showSpinner: false })
|
||||
|
||||
const { setTitle } = useTitle()
|
||||
|
||||
const LOGIN_PATH = "/login"
|
||||
|
||||
export function registerNavigationGuard(router: Router) {
|
||||
// 全局前置守卫
|
||||
router.beforeEach(async (to, _from) => {
|
||||
@ -25,10 +22,10 @@ export function registerNavigationGuard(router: Router) {
|
||||
// 如果在免登录的白名单中，则直接进入
|
||||
if (isWhiteList(to)) return true
|
||||
// 其他没有访问权限的页面将被重定向到登录页面
|
||||
return LOGIN_PATH
|
||||
return "/login"
|
||||
}
|
||||
// 如果已经登录，并准备进入 Login 页面，则重定向到主页
|
||||
if (to.path === LOGIN_PATH) return "/"
|
||||
if (to.path === "/login") return "/"
|
||||
// 如果用户已经获得其权限角色
|
||||
if (userStore.roles.length !== 0) return true
|
||||
// 否则要重新获取权限角色
|
||||
@ -46,7 +43,7 @@ export function registerNavigationGuard(router: Router) {
|
||||
// 过程中发生任何错误，都直接重置 Token，并重定向到登录页面
|
||||
userStore.resetToken()
|
||||
ElMessage.error((error as Error).message || "路由守卫发生错误")
|
||||
return LOGIN_PATH
|
||||
return "/login"
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import type { RouteLocationNormalizedGeneric, RouteRecordNameGeneric } from "vue-router"
|
||||
import type { RouteLocationNormalized, RouteRecordNameGeneric } from "vue-router"
|
||||
|
||||
/** 免登录白名单（匹配路由 path） */
|
||||
const whiteListByPath: string[] = ["/login"]
|
||||
@ -7,7 +7,7 @@ const whiteListByPath: string[] = ["/login"]
|
||||
const whiteListByName: RouteRecordNameGeneric[] = []
|
||||
|
||||
/** 判断是否在白名单 */
|
||||
export function isWhiteList(to: RouteLocationNormalizedGeneric) {
|
||||
export function isWhiteList(to: RouteLocationNormalized) {
|
||||
// path 和 name 任意一个匹配上即可
|
||||
return whiteListByPath.includes(to.path) || whiteListByName.includes(to.name)
|
||||
}
|
||||
|
||||
2
types/auto/auto-imports.d.ts
vendored
2
types/auto/auto-imports.d.ts
vendored
@ -87,6 +87,6 @@ declare global {
|
||||
// for type re-export
|
||||
declare global {
|
||||
// @ts-ignore
|
||||
export type { Component, Slot, Slots, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
|
||||
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
|
||||
import('vue')
|
||||
}
|
||||
|
||||
1
types/auto/components.d.ts
vendored
1
types/auto/components.d.ts
vendored
@ -2,7 +2,6 @@
|
||||
// @ts-nocheck
|
||||
// Generated by unplugin-vue-components
|
||||
// Read more: https://github.com/vuejs/core/pull/3399
|
||||
// biome-ignore lint: disable
|
||||
export {}
|
||||
|
||||
/* prettier-ignore */
|
||||
|
||||
@ -1,25 +1,22 @@
|
||||
import { defineConfig, presetAttributify, presetWind3 } from "unocss"
|
||||
import { defineConfig, presetAttributify, presetUno } from "unocss"
|
||||
|
||||
export default defineConfig({
|
||||
// 预设
|
||||
presets: [
|
||||
// 属性化模式 & 无值的属性模式
|
||||
presetAttributify({
|
||||
prefix: "un-",
|
||||
prefixedOnly: false
|
||||
}),
|
||||
presetAttributify(),
|
||||
// 默认预设
|
||||
presetWind3({
|
||||
presetUno({
|
||||
important: "#app"
|
||||
})
|
||||
],
|
||||
// 自定义规则
|
||||
rules: [],
|
||||
rules: [["uno-padding-20", { padding: "20px" }]],
|
||||
// 自定义快捷方式
|
||||
shortcuts: {
|
||||
"wh-full": "w-full h-full",
|
||||
"flex-center": "flex justify-center items-center",
|
||||
"flex-x-center": "flex justify-center",
|
||||
"flex-y-center": "flex items-center"
|
||||
"uno-wh-full": "w-full h-full",
|
||||
"uno-flex-center": "flex justify-center items-center",
|
||||
"uno-flex-x-center": "flex justify-center",
|
||||
"uno-flex-y-center": "flex items-center"
|
||||
}
|
||||
})
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user