mirror of
https://github.com/pure-admin/pure-admin-thin.git
synced 2025-12-14 22:30:31 +08:00
Compare commits
12 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
b3cbdd6e87 | ||
|
|
b5f0ca52ce | ||
|
|
6110be29a1 | ||
|
|
d53496e495 | ||
|
|
1bafbeaab7 | ||
|
|
9a802296c7 | ||
|
|
e183ea75a0 | ||
|
|
969775c7cf | ||
|
|
841c5bd53a | ||
|
|
761b0e5ec2 | ||
|
|
b811256830 | ||
|
|
6019739c16 |
@@ -1,14 +1,8 @@
|
||||
# 项目本地运行端口号
|
||||
# 平台本地运行端口号
|
||||
VITE_PORT = 8848
|
||||
|
||||
# 开发环境读取配置文件路径
|
||||
VITE_PUBLIC_PATH = /
|
||||
|
||||
# 开发环境代理
|
||||
VITE_PROXY_DOMAIN = /api
|
||||
|
||||
# 开发环境路由历史模式
|
||||
# 开发环境路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）
|
||||
VITE_ROUTER_HISTORY = "hash"
|
||||
|
||||
# 开发环境后端地址
|
||||
VITE_PROXY_DOMAIN_REAL = "http://127.0.0.1:3000"
|
||||
@@ -1,15 +1,9 @@
|
||||
# 线上环境项目打包路径
|
||||
# 线上环境平台打包路径
|
||||
VITE_PUBLIC_PATH = /
|
||||
|
||||
# 线上环境路由历史模式
|
||||
# 线上环境路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）
|
||||
VITE_ROUTER_HISTORY = "hash"
|
||||
|
||||
# 线上环境后端地址
|
||||
VITE_PROXY_DOMAIN_REAL = ""
|
||||
|
||||
# 是否为打包后的文件提供传统浏览器兼容性支持 支持 true 不支持 false
|
||||
VITE_LEGACY = false
|
||||
|
||||
# 是否在打包时使用cdn替换本地库 替换 true 不替换 false
|
||||
VITE_CDN = false
|
||||
|
||||
|
||||
12
.env.staging
12
.env.staging
@@ -4,19 +4,13 @@ NODE_ENV=production
|
||||
|
||||
VITE_PUBLIC_PATH = /
|
||||
|
||||
# 线上环境路由历史模式
|
||||
# 预发布环境路由历史模式（Hash模式传"hash"、HTML5模式传"h5"、Hash模式带base参数传"hash,base参数"、HTML5模式带base参数传"h5,base参数"）
|
||||
VITE_ROUTER_HISTORY = "hash"
|
||||
|
||||
# 线上环境后端地址
|
||||
VITE_PROXY_DOMAIN_REAL = ""
|
||||
|
||||
# 是否为打包后的文件提供传统浏览器兼容性支持 支持 true 不支持 false
|
||||
VITE_LEGACY = false
|
||||
|
||||
# 是否在打包时使用cdn替换本地库 替换 true 不替换 false
|
||||
VITE_CDN = false
|
||||
VITE_CDN = true
|
||||
|
||||
# 是否启用gzip压缩或brotli压缩（分两种情况，删除原始文件和不删除原始文件）
|
||||
# 压缩时不删除原始文件的配置：gzip、brotli、both（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
|
||||
# 压缩时删除原始文件的配置：gzip-clear、brotli-clear、both-clear（同时开启 gzip 与 brotli 压缩）、none（不开启压缩，默认）
|
||||
VITE_COMPRESSION = "none"
|
||||
VITE_COMPRESSION = "both-clear"
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
public
|
||||
dist
|
||||
*.d.ts
|
||||
/src/assets
|
||||
package.json
|
||||
.eslintrc.js
|
||||
.prettierrc.js
|
||||
|
||||
1
.vscode/extensions.json
vendored
1
.vscode/extensions.json
vendored
@@ -7,7 +7,6 @@
|
||||
"bradlc.vscode-tailwindcss",
|
||||
"dbaeumer.vscode-eslint",
|
||||
"esbenp.prettier-vscode",
|
||||
"lokalise.i18n-ally",
|
||||
"redhat.vscode-yaml",
|
||||
"csstools.postcss",
|
||||
"mikestead.dotenv",
|
||||
|
||||
8
.vscode/settings.json
vendored
8
.vscode/settings.json
vendored
@@ -27,13 +27,5 @@
|
||||
"editor.codeActionsOnSave": {
|
||||
"source.fixAll.eslint": true
|
||||
},
|
||||
"i18n-ally.localesPaths": "locales",
|
||||
"i18n-ally.keystyle": "nested",
|
||||
"i18n-ally.sortKeys": true,
|
||||
"i18n-ally.namespace": true,
|
||||
"i18n-ally.enabledParsers": ["yaml", "js"],
|
||||
"i18n-ally.sourceLanguage": "en",
|
||||
"i18n-ally.displayLanguage": "zh-CN",
|
||||
"i18n-ally.enabledFrameworks": ["vue"],
|
||||
"iconify.excludes": ["el"]
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<h1>vue-pure-admin Lite Edition</h1>
|
||||
<h1>vue-pure-admin Lite Edition（no i18n version）</h1>
|
||||
|
||||
[](LICENSE)
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
|
||||
## introduce
|
||||
|
||||
The lite version is based on the shelf extracted from [vue-pure-admin](https://github.com/xiaoxian521/vue-pure-admin), which contains the main functions and is more suitable for actual project development, the packaged size is only `3MB`, and will permanently sync the full version of the code
|
||||
The Lite version is based on the shelf extracted from [vue-pure-admin](https://github.com/xiaoxian521/vue-pure-admin), including the main functions, which is more suitable for actual project development, and the packaged size is lower than ` 3MB`, and will permanently sync the full version of the code. After enabling `brotli` compression and `cdn` to replace the native library mode, the package size is less than `500kb`
|
||||
|
||||
## Supporting Video
|
||||
|
||||
@@ -15,9 +15,8 @@ The lite version is based on the shelf extracted from [vue-pure-admin](https://g
|
||||
|
||||
## Docs
|
||||
|
||||
- [Click me to view the domestic documentation site](http://yiming_chang.gitee.io/pure-admin-doc)
|
||||
- [Click me to view foreign document site 1](https://xiaoxian521.github.io/pure-admin-doc)
|
||||
- [Click me to view foreign document site 2](https://pure-admin-doc.vercel.app)
|
||||
- [Click me to view the domestic documentation site](https://yiming_chang.gitee.io/pure-admin-doc)
|
||||
- [Click me to view foreign document site](https://xiaoxian521.github.io/pure-admin-doc)
|
||||
|
||||
## Usage
|
||||
|
||||
@@ -42,7 +41,6 @@ bilibili: https://www.bilibili.com/video/BV1534y1S7HV/
|
||||
## ⚠️ Attention
|
||||
|
||||
- The Lite version does not accept any issues and prs. If you have any questions, please go to the full version https://github.com/xiaoxian521/vue-pure-admin/issues/new/choose to mention, thank you! ! !
|
||||
- Don't use the `delete-i18n` branch code, this branch is just for you to completely delete the internationalized references, it won't sync the code! ! ! [Completely remove the internationalization tutorial](https://www.bilibili.com/video/BV1Ru411B7k3/), please be sure to use the code from the `main` branch! ! !
|
||||
|
||||
## License
|
||||
|
||||
|
||||
14
README.md
14
README.md
@@ -1,4 +1,4 @@
|
||||
<h1>vue-pure-admin精简版</h1>
|
||||
<h1>vue-pure-admin精简版（非国际化版本）</h1>
|
||||
|
||||
[](LICENSE)
|
||||
|
||||
@@ -6,7 +6,11 @@
|
||||
|
||||
## 介绍
|
||||
|
||||
精简版是基于 [vue-pure-admin](https://github.com/xiaoxian521/vue-pure-admin) 提炼出的架子，包含主体功能，更适合实际项目开发，打包后的大小仅 `3MB`，并且会永久同步完整版的代码
|
||||
精简版是基于 [vue-pure-admin](https://github.com/xiaoxian521/vue-pure-admin) 提炼出的架子，包含主体功能，更适合实际项目开发，打包后的大小低于 `3MB`，并且会永久同步完整版的代码。开启 `brotli` 压缩和 `cdn` 替换本地库模式后，打包大小低于 `500kb`
|
||||
|
||||
## 版本选择
|
||||
|
||||
当前是非国际化版本哦，如果您需要国际化版本 [请点击](https://github.com/xiaoxian521/pure-admin-thin/tree/i18n)
|
||||
|
||||
## 配套视频
|
||||
|
||||
@@ -15,9 +19,8 @@
|
||||
|
||||
## 配套文档
|
||||
|
||||
- [点我查看国内文档站](http://yiming_chang.gitee.io/pure-admin-doc)
|
||||
- [点我查看国外文档站 1](https://xiaoxian521.github.io/pure-admin-doc)
|
||||
- [点我查看国外文档站 2](https://pure-admin-doc.vercel.app)
|
||||
- [点我查看国内文档站](https://yiming_chang.gitee.io/pure-admin-doc)
|
||||
- [点我查看国外文档站](https://xiaoxian521.github.io/pure-admin-doc)
|
||||
|
||||
## 维护者
|
||||
|
||||
@@ -54,7 +57,6 @@ pnpm remove 包名
|
||||
## ⚠️ 注意
|
||||
|
||||
- 精简版不接受任何 `issues` 和 `pr`，如果有问题请到完整版 [issues](https://github.com/xiaoxian521/vue-pure-admin/issues/new/choose) 去提，谢谢！！！
|
||||
- 不要使用 `delete-i18n` 分支代码，这个分支只是给你们完全删除国际化的参考，不会同步代码的！！！ [完全删除国际化教程](https://www.bilibili.com/video/BV1Ru411B7k3/) ，请务必使用 `main` 分支的代码！！！
|
||||
|
||||
## 许可证
|
||||
|
||||
|
||||
@@ -20,11 +20,6 @@ export const cdn = importToCDN({
|
||||
var: "VueRouter",
|
||||
path: "vue-router.global.min.js"
|
||||
},
|
||||
{
|
||||
name: "vue-i18n",
|
||||
var: "VueI18n",
|
||||
path: "vue-i18n.runtime.global.prod.min.js"
|
||||
},
|
||||
// 项目中没有直接安装vue-demi，但是pinia用到了，所以需要在引入pinia前引入vue-demi（https://github.com/vuejs/pinia/blob/v2/packages/pinia/package.json#L77）
|
||||
{
|
||||
name: "vue-demi",
|
||||
|
||||
@@ -1,13 +1,10 @@
|
||||
/** 处理环境变量 */
|
||||
const warpperEnv = (envConf: Recordable): ViteEnv => {
|
||||
/** 此处为默认值，无需修改 */
|
||||
/** 此处为默认值 */
|
||||
const ret: ViteEnv = {
|
||||
VITE_PORT: 8848,
|
||||
VITE_PUBLIC_PATH: "",
|
||||
VITE_PROXY_DOMAIN: "",
|
||||
VITE_PROXY_DOMAIN_REAL: "",
|
||||
VITE_ROUTER_HISTORY: "",
|
||||
VITE_LEGACY: false,
|
||||
VITE_CDN: false,
|
||||
VITE_COMPRESSION: "none"
|
||||
};
|
||||
@@ -30,14 +27,9 @@ const warpperEnv = (envConf: Recordable): ViteEnv => {
|
||||
return ret;
|
||||
};
|
||||
|
||||
/** 跨域代理重写 */
|
||||
const regExps = (value: string, reg: string): string => {
|
||||
return value.replace(new RegExp(`^${reg}`, "g"), "");
|
||||
};
|
||||
|
||||
/** 环境变量 */
|
||||
/** 获取环境变量 */
|
||||
const loadEnv = (): ViteEnv => {
|
||||
return import.meta.env;
|
||||
};
|
||||
|
||||
export { warpperEnv, regExps, loadEnv };
|
||||
export { warpperEnv, loadEnv };
|
||||
|
||||
25
build/optimize.ts
Normal file
25
build/optimize.ts
Normal file
@@ -0,0 +1,25 @@
|
||||
/**
|
||||
* 此文件作用于 `vite.config.ts` 的 `optimizeDeps.include` 依赖预构建配置项
|
||||
* 依赖预构建，`vite` 启动时会将下面 include 里的模块，编译成 esm 格式并缓存到 node_modules/.vite 文件夹，页面加载到对应模块时如果浏览器有缓存就读取浏览器缓存，如果没有会读取本地缓存并按需加载
|
||||
* 尤其当您禁用浏览器缓存时（这种情况只应该发生在调试阶段）必须将对应模块加入到 include里，否则会遇到开发环境切换页面卡顿的问题（vite 会认为它是一个新的依赖包会重新加载并强制刷新页面），因为它既无法使用浏览器缓存，又没有在本地 node_modules/.vite 里缓存
|
||||
* 温馨提示：如果您使用的第三方库是全局引入，也就是引入到 src/main.ts 文件里，就不需要再添加到 include 里了，因为 vite 会自动将它们缓存到 node_modules/.vite
|
||||
*/
|
||||
export const include = [
|
||||
"qs",
|
||||
"mitt",
|
||||
"dayjs",
|
||||
"axios",
|
||||
"pinia",
|
||||
"lodash",
|
||||
"echarts",
|
||||
"xe-utils",
|
||||
"vxe-table",
|
||||
"js-cookie",
|
||||
"lodash-es",
|
||||
"@vueuse/core",
|
||||
"lodash-unified",
|
||||
"@ctrl/tinycolor",
|
||||
"@pureadmin/utils",
|
||||
"responsive-storage",
|
||||
"element-resize-detector"
|
||||
];
|
||||
@@ -1,23 +1,19 @@
|
||||
import { cdn } from "./cdn";
|
||||
import { resolve } from "path";
|
||||
import vue from "@vitejs/plugin-vue";
|
||||
import { viteBuildInfo } from "./info";
|
||||
import svgLoader from "vite-svg-loader";
|
||||
import legacy from "@vitejs/plugin-legacy";
|
||||
import vueJsx from "@vitejs/plugin-vue-jsx";
|
||||
import VueMacros from "unplugin-vue-macros/vite";
|
||||
import { viteMockServe } from "vite-plugin-mock";
|
||||
import { configCompressPlugin } from "./compress";
|
||||
import VueI18n from "@intlify/vite-plugin-vue-i18n";
|
||||
// import ElementPlus from "unplugin-element-plus/vite";
|
||||
import { visualizer } from "rollup-plugin-visualizer";
|
||||
import removeConsole from "vite-plugin-remove-console";
|
||||
import themePreprocessorPlugin from "@pureadmin/theme";
|
||||
import DefineOptions from "unplugin-vue-define-options/vite";
|
||||
import { genScssMultipleScopeVars } from "../src/layout/theme";
|
||||
|
||||
export function getPluginsList(
|
||||
command: string,
|
||||
VITE_LEGACY: boolean,
|
||||
VITE_CDN: boolean,
|
||||
VITE_COMPRESSION: ViteCompression
|
||||
) {
|
||||
@@ -25,17 +21,11 @@ export function getPluginsList(
|
||||
const lifecycle = process.env.npm_lifecycle_event;
|
||||
return [
|
||||
vue(),
|
||||
// https://github.com/intlify/bundle-tools/tree/main/packages/vite-plugin-vue-i18n
|
||||
VueI18n({
|
||||
runtimeOnly: true,
|
||||
compositionOnly: true,
|
||||
include: [resolve("locales/**")]
|
||||
}),
|
||||
// jsx、tsx语法支持
|
||||
vueJsx(),
|
||||
VITE_CDN ? cdn : null,
|
||||
configCompressPlugin(VITE_COMPRESSION),
|
||||
DefineOptions(),
|
||||
VueMacros(),
|
||||
// 线上环境删除console
|
||||
removeConsole({ external: ["src/assets/iconfont/iconfont.js"] }),
|
||||
viteBuildInfo(),
|
||||
@@ -67,13 +57,6 @@ export function getPluginsList(
|
||||
`,
|
||||
logger: false
|
||||
}),
|
||||
// 是否为打包后的文件提供传统浏览器兼容性支持
|
||||
VITE_LEGACY
|
||||
? legacy({
|
||||
targets: ["ie >= 11"],
|
||||
additionalLegacyPolyfills: ["regenerator-runtime/runtime"]
|
||||
})
|
||||
: null,
|
||||
// 打包分析
|
||||
lifecycle === "report"
|
||||
? visualizer({ open: true, brotliSize: true, filename: "report.html" })
|
||||
|
||||
@@ -1,43 +0,0 @@
|
||||
buttons:
|
||||
hsLoginOut: LoginOut
|
||||
hsfullscreen: FullScreen
|
||||
hsexitfullscreen: ExitFullscreen
|
||||
hsrefreshRoute: RefreshRoute
|
||||
hslogin: Login
|
||||
hsadd: Add
|
||||
hsmark: Mark/Cancel
|
||||
hssave: Save
|
||||
hssearch: Search
|
||||
hsexpendAll: Expand All
|
||||
hscollapseAll: Collapse All
|
||||
hssystemSet: Open ProjectConfig
|
||||
hsdelete: Delete
|
||||
hsreload: Reload
|
||||
hscloseCurrentTab: Close CurrentTab
|
||||
hscloseLeftTabs: Close LeftTabs
|
||||
hscloseRightTabs: Close RightTabs
|
||||
hscloseOtherTabs: Close OtherTabs
|
||||
hscloseAllTabs: Close AllTabs
|
||||
hswholeFullScreen: Whole FullScreen
|
||||
hswholeExitFullScreen: Whole ExitFullScreen
|
||||
hscontentFullScreen: Content FullScreen
|
||||
hscontentExitFullScreen: Content ExitFullScreen
|
||||
menus:
|
||||
hshome: Home
|
||||
hslogin: Login
|
||||
hsabnormal: Abnormal Page
|
||||
hsfourZeroFour: "404"
|
||||
hsfourZeroOne: "403"
|
||||
hsFive: "500"
|
||||
permission: Permission Manage
|
||||
permissionPage: Page Permission
|
||||
permissionButton: Button Permission
|
||||
status:
|
||||
hsLoad: Loading...
|
||||
login:
|
||||
username: Username
|
||||
password: Password
|
||||
login: Login
|
||||
usernameReg: Please enter username
|
||||
passwordReg: Please enter password
|
||||
passwordRuleReg: The password format should be any combination of 8-18 digits
|
||||
@@ -1,43 +0,0 @@
|
||||
buttons:
|
||||
hsLoginOut: 退出系统
|
||||
hsfullscreen: 全屏
|
||||
hsexitfullscreen: 退出全屏
|
||||
hsrefreshRoute: 刷新路由
|
||||
hslogin: 登录
|
||||
hsadd: 新增
|
||||
hsmark: 标记/取消
|
||||
hssave: 保存
|
||||
hssearch: 搜索
|
||||
hsexpendAll: 全部展开
|
||||
hscollapseAll: 全部折叠
|
||||
hssystemSet: 打开项目配置
|
||||
hsdelete: 删除
|
||||
hsreload: 重新加载
|
||||
hscloseCurrentTab: 关闭当前标签页
|
||||
hscloseLeftTabs: 关闭左侧标签页
|
||||
hscloseRightTabs: 关闭右侧标签页
|
||||
hscloseOtherTabs: 关闭其他标签页
|
||||
hscloseAllTabs: 关闭全部标签页
|
||||
hswholeFullScreen: 整体页面全屏
|
||||
hswholeExitFullScreen: 整体页面退出全屏
|
||||
hscontentFullScreen: 内容区全屏
|
||||
hscontentExitFullScreen: 内容区退出全屏
|
||||
menus:
|
||||
hshome: 首页
|
||||
hslogin: 登录
|
||||
hsabnormal: 异常页面
|
||||
hsfourZeroFour: "404"
|
||||
hsfourZeroOne: "403"
|
||||
hsFive: "500"
|
||||
permission: 权限管理
|
||||
permissionPage: 页面权限
|
||||
permissionButton: 按钮权限
|
||||
status:
|
||||
hsLoad: 加载中...
|
||||
login:
|
||||
username: 账号
|
||||
password: 密码
|
||||
login: 登录
|
||||
usernameReg: 请输入账号
|
||||
passwordReg: 请输入密码
|
||||
passwordRuleReg: 密码格式应为8-18位数字、字母、符号的任意两种组合
|
||||
@@ -10,7 +10,7 @@ import { MockMethod } from "vite-plugin-mock";
|
||||
const permissionRouter = {
|
||||
path: "/permission",
|
||||
meta: {
|
||||
title: "menus.permission",
|
||||
title: "权限管理",
|
||||
icon: "lollipop",
|
||||
rank: 10
|
||||
},
|
||||
@@ -19,15 +19,15 @@ const permissionRouter = {
|
||||
path: "/permission/page/index",
|
||||
name: "PermissionPage",
|
||||
meta: {
|
||||
roles: ["admin", "common"],
|
||||
title: "menus.permissionPage"
|
||||
title: "页面权限",
|
||||
roles: ["admin", "common"]
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/permission/button/index",
|
||||
name: "PermissionButton",
|
||||
meta: {
|
||||
title: "menus.permissionButton",
|
||||
title: "按钮权限",
|
||||
roles: ["admin", "common"],
|
||||
auths: ["btn_add", "btn_edit", "btn_delete"]
|
||||
}
|
||||
|
||||
@@ -10,8 +10,8 @@ export default [
|
||||
return {
|
||||
success: true,
|
||||
data: {
|
||||
accessToken: "eyJhbGciOiJIUzUxMiJ9.admin",
|
||||
refreshToken: "eyJhbGciOiJIUzUxMiJ9.adminRefresh",
|
||||
accessToken: "eyJhbGciOiJIUzUxMiJ9.newAdmin",
|
||||
refreshToken: "eyJhbGciOiJIUzUxMiJ9.newAdminRefresh",
|
||||
// `expires`选择这种日期格式是为了方便调试，后端直接设置时间戳或许更方便（每次都应该递增）。如果后端返回的是时间戳格式，前端开发请来到这个目录`src/utils/auth.ts`，把第`38`行的代码换成expires = data.expires即可。
|
||||
expires: "2023/10/30 23:59:59"
|
||||
}
|
||||
|
||||
89
package.json
89
package.json
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "pure-admin-thin",
|
||||
"version": "3.6.2",
|
||||
"version": "3.8.5",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "NODE_OPTIONS=--max-old-space-size=4096 vite",
|
||||
@@ -11,6 +11,7 @@
|
||||
"preview": "vite preview",
|
||||
"preview:build": "pnpm build && vite preview",
|
||||
"typecheck": "tsc --noEmit && vue-tsc --noEmit --skipLibCheck",
|
||||
"svgo": "svgo -f src/assets/svg -o src/assets/svg",
|
||||
"cloc": "NODE_OPTIONS=--max-old-space-size=4096 cloc . --exclude-dir=node_modules --exclude-lang=YAML",
|
||||
"clean:cache": "rm -rf node_modules && rm -rf .eslintcache && pnpm install",
|
||||
"lint:eslint": "eslint --cache --max-warnings 0 \"{src,mock,build}/**/*.{vue,js,ts,tsx}\" --fix",
|
||||
@@ -29,19 +30,17 @@
|
||||
],
|
||||
"dependencies": {
|
||||
"@ctrl/tinycolor": "^3.4.1",
|
||||
"@pureadmin/components": "^1.1.0",
|
||||
"@pureadmin/descriptions": "^1.1.0",
|
||||
"@pureadmin/table": "^1.2.0",
|
||||
"@pureadmin/utils": "^1.1.5",
|
||||
"@vueuse/core": "^9.4.0",
|
||||
"@vueuse/motion": "^2.0.0-beta.12",
|
||||
"@vueuse/shared": "^9.4.0",
|
||||
"@pureadmin/table": "^1.8.0",
|
||||
"@pureadmin/utils": "^1.6.7",
|
||||
"@vueuse/core": "^9.6.0",
|
||||
"@vueuse/motion": "2.0.0-beta.12",
|
||||
"animate.css": "^4.1.1",
|
||||
"axios": "^1.1.3",
|
||||
"dayjs": "^1.11.4",
|
||||
"echarts": "^5.3.3",
|
||||
"element-plus": "^2.2.16",
|
||||
"element-resize-detector": "^1.2.3",
|
||||
"axios": "^1.2.0",
|
||||
"dayjs": "^1.11.6",
|
||||
"echarts": "^5.4.0",
|
||||
"element-plus": "^2.2.25",
|
||||
"element-resize-detector": "^1.2.4",
|
||||
"js-cookie": "^3.0.1",
|
||||
"lodash": "^4.17.21",
|
||||
"lodash-es": "^4.17.21",
|
||||
@@ -50,79 +49,77 @@
|
||||
"mockjs": "^1.1.0",
|
||||
"nprogress": "^0.2.0",
|
||||
"path": "^0.12.7",
|
||||
"pinia": "^2.0.21",
|
||||
"pinia": "^2.0.26",
|
||||
"qs": "^6.11.0",
|
||||
"resize-observer-polyfill": "^1.5.1",
|
||||
"responsive-storage": "^2.1.0",
|
||||
"vue": "^3.2.40",
|
||||
"vue-i18n": "^9.2.2",
|
||||
"vue": "^3.2.45",
|
||||
"vue-router": "^4.1.6",
|
||||
"vue-types": "^4.2.1",
|
||||
"vxe-table": "^4.3.2",
|
||||
"xe-utils": "^3.5.6"
|
||||
"vxe-table": "^4.3.6",
|
||||
"xe-utils": "^3.5.7"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@commitlint/cli": "13.1.0",
|
||||
"@commitlint/config-conventional": "13.1.0",
|
||||
"@iconify-icons/ep": "^1.2.7",
|
||||
"@iconify-icons/ri": "^1.2.3",
|
||||
"@iconify/vue": "^3.2.1",
|
||||
"@intlify/vite-plugin-vue-i18n": "^6.0.3",
|
||||
"@iconify/vue": "^4.0.0",
|
||||
"@pureadmin/theme": "^2.4.0",
|
||||
"@types/element-resize-detector": "1.1.3",
|
||||
"@types/js-cookie": "^3.0.1",
|
||||
"@types/lodash": "^4.14.180",
|
||||
"@types/lodash-es": "^4.17.6",
|
||||
"@types/mockjs": "1.0.3",
|
||||
"@types/node": "14.14.14",
|
||||
"@types/mockjs": "^1.0.7",
|
||||
"@types/node": "^18.11.9",
|
||||
"@types/nprogress": "0.2.0",
|
||||
"@types/qs": "^6.9.7",
|
||||
"@typescript-eslint/eslint-plugin": "^5.10.2",
|
||||
"@typescript-eslint/parser": "^5.10.2",
|
||||
"@vitejs/plugin-legacy": "^2.2.0",
|
||||
"@vitejs/plugin-vue": "^3.1.2",
|
||||
"@vitejs/plugin-vue-jsx": "^2.0.1",
|
||||
"@typescript-eslint/eslint-plugin": "^5.42.1",
|
||||
"@typescript-eslint/parser": "^5.42.1",
|
||||
"@vitejs/plugin-legacy": "^2.3.1",
|
||||
"@vitejs/plugin-vue": "^3.2.0",
|
||||
"@vitejs/plugin-vue-jsx": "^2.1.1",
|
||||
"@vue/eslint-config-prettier": "^7.0.0",
|
||||
"@vue/eslint-config-typescript": "^10.0.0",
|
||||
"@vue/runtime-core": "^3.2.40",
|
||||
"autoprefixer": "^10.4.12",
|
||||
"@vue/eslint-config-typescript": "^11.0.2",
|
||||
"@vue/runtime-core": "^3.2.45",
|
||||
"autoprefixer": "^10.4.13",
|
||||
"cloc": "^2.10.0",
|
||||
"cssnano": "^5.1.13",
|
||||
"cssnano": "^5.1.14",
|
||||
"eslint": "^8.8.0",
|
||||
"eslint-plugin-prettier": "^4.0.0",
|
||||
"eslint-plugin-vue": "^8.4.1",
|
||||
"eslint-plugin-vue": "^9.7.0",
|
||||
"font-awesome": "^4.7.0",
|
||||
"husky": "^7.0.4",
|
||||
"lint-staged": "11.1.2",
|
||||
"picocolors": "^1.0.0",
|
||||
"postcss": "^8.4.17",
|
||||
"postcss": "^8.4.18",
|
||||
"postcss-html": "^1.5.0",
|
||||
"postcss-import": "^15.0.0",
|
||||
"postcss-scss": "^4.0.5",
|
||||
"prettier": "^2.5.1",
|
||||
"pretty-quick": "3.1.1",
|
||||
"rimraf": "3.0.2",
|
||||
"rollup-plugin-visualizer": "^5.8.2",
|
||||
"sass": "^1.53.0",
|
||||
"sass-loader": "^13.0.2",
|
||||
"rollup-plugin-visualizer": "^5.8.3",
|
||||
"sass": "^1.56.1",
|
||||
"sass-loader": "^13.2.0",
|
||||
"stylelint": "^14.3.0",
|
||||
"stylelint-config-html": "^1.0.0",
|
||||
"stylelint-config-prettier": "^9.0.3",
|
||||
"stylelint-config-recommended": "^6.0.0",
|
||||
"stylelint-config-standard": "^24.0.0",
|
||||
"stylelint-config-recommended": "^9.0.0",
|
||||
"stylelint-config-standard": "^29.0.0",
|
||||
"stylelint-order": "^5.0.0",
|
||||
"tailwindcss": "^3.2.1",
|
||||
"terser": "^5.15.0",
|
||||
"typescript": "^4.7.4",
|
||||
"unplugin-vue-define-options": "0.7.3",
|
||||
"vite": "^3.1.8",
|
||||
"svgo": "^3.0.2",
|
||||
"tailwindcss": "^3.2.4",
|
||||
"terser": "^5.15.1",
|
||||
"typescript": "^4.9.3",
|
||||
"unplugin-vue-macros": "^1.0.3",
|
||||
"vite": "3.1.8",
|
||||
"vite-plugin-cdn-import": "^0.3.5",
|
||||
"vite-plugin-compression": "^0.5.1",
|
||||
"vite-plugin-mock": "^2.9.6",
|
||||
"vite-plugin-remove-console": "^1.1.0",
|
||||
"vite-plugin-remove-console": "^1.3.0",
|
||||
"vite-svg-loader": "^3.6.0",
|
||||
"vue-eslint-parser": "^8.2.0",
|
||||
"vue-tsc": "^0.40.13"
|
||||
"vue-eslint-parser": "^9.1.0",
|
||||
"vue-tsc": "^1.0.9"
|
||||
},
|
||||
"pnpm": {
|
||||
"peerDependencyRules": {
|
||||
|
||||
2374
pnpm-lock.yaml
generated
2374
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@@ -1,11 +1,10 @@
|
||||
{
|
||||
"Version": "3.6.2",
|
||||
"Version": "3.8.5",
|
||||
"Title": "PureAdmin",
|
||||
"FixedHeader": true,
|
||||
"HiddenSideBar": false,
|
||||
"MultiTagsCache": false,
|
||||
"KeepAlive": true,
|
||||
"Locale": "zh",
|
||||
"Layout": "vertical",
|
||||
"Theme": "default",
|
||||
"DarkMode": false,
|
||||
@@ -15,5 +14,6 @@
|
||||
"SidebarStatus": true,
|
||||
"EpThemeColor": "#409EFF",
|
||||
"ShowLogo": true,
|
||||
"ShowModel": "smart"
|
||||
"ShowModel": "smart",
|
||||
"MenuArrowIconNoTransition": true
|
||||
}
|
||||
|
||||
@@ -8,7 +8,6 @@
|
||||
import { defineComponent } from "vue";
|
||||
import { ElConfigProvider } from "element-plus";
|
||||
import zhCn from "element-plus/lib/locale/lang/zh-cn";
|
||||
import en from "element-plus/lib/locale/lang/en";
|
||||
export default defineComponent({
|
||||
name: "app",
|
||||
components: {
|
||||
@@ -16,7 +15,7 @@ export default defineComponent({
|
||||
},
|
||||
computed: {
|
||||
currentLocale() {
|
||||
return this.$storage.locale?.locale === "zh" ? zhCn : en;
|
||||
return zhCn;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { http } from "../utils/http";
|
||||
import { http } from "@/utils/http";
|
||||
|
||||
type Result = {
|
||||
success: boolean;
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { http } from "../utils/http";
|
||||
import { http } from "@/utils/http";
|
||||
|
||||
export type UserResult = {
|
||||
success: boolean;
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 23 KiB |
@@ -1 +1 @@
|
||||
<svg t="1636193306629" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1847" width="32" height="32"><path d="M410.558481 0.10861C410.558481 211.083075 109.682285 361.860579 109.682285 633.656511c0 174.943176 134.703259 316.787527 300.876196 316.787527s300.876197-141.817198 300.876197-316.787527C711.407525 361.751969 410.558481 210.974465 410.558481 0.10861z" fill="#386BF3" p-id="1848"></path><path d="M613.468671 73.664572c0 211.055922-300.876197 361.914883-300.876196 633.547901 0 174.943176 134.703259 316.787527 300.876196 316.787527s300.876197-141.817198 300.876197-316.787527c-0.054305-271.633018-300.876197-422.491979-300.876197-633.547901z" fill="#C3D2FB" p-id="1849"></path><path d="M312.592475 707.212473c0-183.713414 137.635722-312.171612 226.72288-441.390078 81.701694 106.111739 172.119322 218.740063 172.119323 367.725506a309.755045 309.755045 0 0 1-291.074166 316.516003 323.114046 323.114046 0 0 1-107.768037-242.851431z" fill="#303F5B" p-id="1850"></path></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" class="icon" viewBox="0 0 1024 1024"><path fill="#386BF3" d="M410.558.109c0 210.974-300.876 361.752-300.876 633.548 0 174.943 134.704 316.787 300.876 316.787s300.877-141.817 300.877-316.787C711.408 361.752 410.558 210.974 410.558.109z"/><path fill="#C3D2FB" d="M613.469 73.665c0 211.055-300.877 361.914-300.877 633.547C312.592 882.156 447.296 1024 613.47 1024s300.876-141.817 300.876-316.788C914.29 435.58 613.469 284.72 613.469 73.665z"/><path fill="#303F5B" d="M312.592 707.212c0-183.713 137.636-312.171 226.723-441.39 81.702 106.112 172.12 218.74 172.12 367.726A309.755 309.755 0 0 1 420.36 950.064a323.114 323.114 0 0 1-107.769-242.852z"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 712 B |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 14 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 10 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 11 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 13 KiB |
@@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M2.88 18.054a35.897 35.897 0 0 1 8.531-16.32.8.8 0 0 1 1.178 0c.166.18.304.332.413.455a35.897 35.897 0 0 1 8.118 15.865c-2.141.451-4.34.747-6.584.874l-2.089 4.178a.5.5 0 0 1-.894 0l-2.089-4.178a44.019 44.019 0 0 1-6.584-.874zm6.698-1.123l1.157.066L12 19.527l1.265-2.53 1.157-.066a42.137 42.137 0 0 0 4.227-.454A33.913 33.913 0 0 0 12 4.09a33.913 33.913 0 0 0-6.649 12.387c1.395.222 2.805.374 4.227.454zM12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"><path fill="none" d="M0 0h24v24H0z"/><path d="M2.88 18.054a35.897 35.897 0 0 1 8.531-16.32.8.8 0 0 1 1.178 0c.166.18.304.332.413.455a35.897 35.897 0 0 1 8.118 15.865c-2.141.451-4.34.747-6.584.874l-2.089 4.178a.5.5 0 0 1-.894 0l-2.089-4.178a44.019 44.019 0 0 1-6.584-.874zm6.698-1.123 1.157.066L12 19.527l1.265-2.53 1.157-.066a42.137 42.137 0 0 0 4.227-.454A33.913 33.913 0 0 0 12 4.09a33.913 33.913 0 0 0-6.649 12.387c1.395.222 2.805.374 4.227.454zM12 15a3 3 0 1 1 0-6 3 3 0 0 1 0 6zm0-2a1 1 0 1 0 0-2 1 1 0 0 0 0 2z"/></svg>
|
||||
|
Before Width: | Height: | Size: 608 B After Width: | Height: | Size: 588 B |
@@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16"><path fill="none" d="M0 0h24v24H0z"/><path d="M11.38 2.019a7.5 7.5 0 1 0 10.6 10.6C21.662 17.854 17.316 22 12.001 22 6.477 22 2 17.523 2 12c0-5.315 4.146-9.661 9.38-9.981z"/></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M11.38 2.019a7.5 7.5 0 1 0 10.6 10.6C21.662 17.854 17.316 22 12.001 22 6.477 22 2 17.523 2 12c0-5.315 4.146-9.661 9.38-9.981z"/></svg>
|
||||
|
Before Width: | Height: | Size: 263 B After Width: | Height: | Size: 263 B |
@@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="16" height="16"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12zM11 1h2v3h-2V1zm0 19h2v3h-2v-3zM3.515 4.929l1.414-1.414L7.05 5.636 5.636 7.05 3.515 4.93zM16.95 18.364l1.414-1.414 2.121 2.121-1.414 1.414-2.121-2.121zm2.121-14.85l1.414 1.415-2.121 2.121-1.414-1.414 2.121-2.121zM5.636 16.95l1.414 1.414-2.121 2.121-1.414-1.414 2.121-2.121zM23 11v2h-3v-2h3zM4 11v2H1v-2h3z"/></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0z"/><path d="M12 18a6 6 0 1 1 0-12 6 6 0 0 1 0 12zM11 1h2v3h-2V1zm0 19h2v3h-2v-3zM3.515 4.929l1.414-1.414L7.05 5.636 5.636 7.05 3.515 4.93zM16.95 18.364l1.414-1.414 2.121 2.121-1.414 1.414-2.121-2.121zm2.121-14.85 1.414 1.415-2.121 2.121-1.414-1.414 2.121-2.121zM5.636 16.95l1.414 1.414-2.121 2.121-1.414-1.414 2.121-2.121zM23 11v2h-3v-2h3zM4 11v2H1v-2h3z"/></svg>
|
||||
|
Before Width: | Height: | Size: 480 B After Width: | Height: | Size: 480 B |
@@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--ant-design" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 1024 1024"><path fill="currentColor" d="M864 170h-60c-4.4 0-8 3.6-8 8v518H310v-73c0-6.7-7.8-10.5-13-6.3l-141.9 112a8 8 0 0 0 0 12.6l141.9 112c5.3 4.2 13 .4 13-6.3v-75h498c35.3 0 64-28.7 64-64V178c0-4.4-3.6-8-8-8z"></path></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" aria-hidden="true" class="iconify iconify--ant-design" viewBox="0 0 1024 1024"><path fill="currentColor" d="M864 170h-60c-4.4 0-8 3.6-8 8v518H310v-73c0-6.7-7.8-10.5-13-6.3l-141.9 112a8 8 0 0 0 0 12.6l141.9 112c5.3 4.2 13 .4 13-6.3v-75h498c35.3 0 64-28.7 64-64V178c0-4.4-3.6-8-8-8z"/></svg>
|
||||
|
Before Width: | Height: | Size: 448 B After Width: | Height: | Size: 352 B |
@@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" class="re-screen" color="#00000073" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16"><g fill="currentColor"><path d="M3.5 4H1V3h2V1h1v2.5l-.5.5zM13 3V1h-1v2.5l.5.5H15V3h-2zm-1 9.5V15h1v-2h2v-1h-2.5l-.5.5zM1 12v1h2v2h1v-2.5l-.5-.5H1zm11-1.5l-.5.5h-7l-.5-.5v-5l.5-.5h7l.5.5v5zM10 7H6v2h4V7z"></path></g></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" class="re-screen" color="#00000073" viewBox="0 0 16 16"><path fill="currentColor" d="M3.5 4H1V3h2V1h1v2.5l-.5.5zM13 3V1h-1v2.5l.5.5H15V3h-2zm-1 9.5V15h1v-2h2v-1h-2.5l-.5.5zM1 12v1h2v2h1v-2.5l-.5-.5H1zm11-1.5-.5.5h-7l-.5-.5v-5l.5-.5h7l.5.5v5zM10 7H6v2h4V7z"/></svg>
|
||||
|
Before Width: | Height: | Size: 452 B After Width: | Height: | Size: 348 B |
@@ -1 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" width="1em" height="1em" class="re-screen" color="#00000073" preserveAspectRatio="xMidYMid meet" viewBox="0 0 16 16"><g fill="currentColor"><path d="M3 12h10V4H3v8zm2-6h6v4H5V6zM2 6H1V2.5l.5-.5H5v1H2v3zm13-3.5V6h-1V3h-3V2h3.5l.5.5zM14 10h1v3.5l-.5.5H11v-1h3v-3zM2 13h3v1H1.5l-.5-.5V10h1v3z"></path></g></svg>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" aria-hidden="true" class="re-screen" color="#00000073" viewBox="0 0 16 16"><path fill="currentColor" d="M3 12h10V4H3v8zm2-6h6v4H5V6zM2 6H1V2.5l.5-.5H5v1H2v3zm13-3.5V6h-1V3h-3V2h3.5l.5.5zM14 10h1v3.5l-.5.5H11v-1h3v-3zM2 13h3v1H1.5l-.5-.5V10h1v3z"/></svg>
|
||||
|
Before Width: | Height: | Size: 421 B After Width: | Height: | Size: 318 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="globalization" width="1em" height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 512 512"><path d="M478.33 433.6l-90-218a22 22 0 0 0-40.67 0l-90 218a22 22 0 1 0 40.67 16.79L316.66 406h102.67l18.33 44.39A22 22 0 0 0 458 464a22 22 0 0 0 20.32-30.4zM334.83 362L368 281.65L401.17 362z" fill="currentColor"></path><path d="M267.84 342.92a22 22 0 0 0-4.89-30.7c-.2-.15-15-11.13-36.49-34.73c39.65-53.68 62.11-114.75 71.27-143.49H330a22 22 0 0 0 0-44H214V70a22 22 0 0 0-44 0v20H54a22 22 0 0 0 0 44h197.25c-9.52 26.95-27.05 69.5-53.79 108.36c-31.41-41.68-43.08-68.65-43.17-68.87a22 22 0 0 0-40.58 17c.58 1.38 14.55 34.23 52.86 83.93c.92 1.19 1.83 2.35 2.74 3.51c-39.24 44.35-77.74 71.86-93.85 80.74a22 22 0 1 0 21.07 38.63c2.16-1.18 48.6-26.89 101.63-85.59c22.52 24.08 38 35.44 38.93 36.1a22 22 0 0 0 30.75-4.9z" fill="currentColor"></path></svg>
|
||||
|
Before Width: | Height: | Size: 965 B |
1
src/assets/svg/keyboard_esc.svg
Normal file
1
src/assets/svg/keyboard_esc.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" aria-hidden="true" class="iconify iconify--mdi" viewBox="0 0 24 24"><path fill="currentColor" d="M1 7h6v2H3v2h4v2H3v2h4v2H1V7m10 0h4v2h-4v2h2a2 2 0 0 1 2 2v2c0 1.11-.89 2-2 2H9v-2h4v-2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2m8 0h2a2 2 0 0 1 2 2v1h-2V9h-2v6h2v-1h2v1c0 1.11-.89 2-2 2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2Z"/></svg>
|
||||
|
After Width: | Height: | Size: 381 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--mdi" width="20" height="20" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path fill="currentColor" d="M1 7h6v2H3v2h4v2H3v2h4v2H1V7m10 0h4v2h-4v2h2a2 2 0 0 1 2 2v2c0 1.11-.89 2-2 2H9v-2h4v-2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2m8 0h2a2 2 0 0 1 2 2v1h-2V9h-2v6h2v-1h2v1c0 1.11-.89 2-2 2h-2a2 2 0 0 1-2-2V9c0-1.1.9-2 2-2Z"></path></svg>
|
||||
|
Before Width: | Height: | Size: 477 B |
@@ -2,7 +2,7 @@ import iconifyIconOffline from "./src/iconifyIconOffline";
|
||||
import iconifyIconOnline from "./src/iconifyIconOnline";
|
||||
import fontIcon from "./src/iconfont";
|
||||
|
||||
/** 离线图标组件 */
|
||||
/** 本地图标组件 */
|
||||
const IconifyIconOffline = iconifyIconOffline;
|
||||
/** 在线图标组件 */
|
||||
const IconifyIconOnline = iconifyIconOnline;
|
||||
|
||||
@@ -3,7 +3,8 @@ import { h, defineComponent, Component } from "vue";
|
||||
import { IconifyIconOnline, IconifyIconOffline, FontIcon } from "../index";
|
||||
|
||||
/**
|
||||
* 支持fontawesome4、5+、iconfont、remixicon、element-plus的icons、自定义svg
|
||||
* 支持 `iconfont`、自定义 `svg` 以及 `iconify` 中所有的图标
|
||||
* @see 点击查看文档图标篇 {@link https://yiming_chang.gitee.io/pure-admin-doc/pages/icon/}
|
||||
* @param icon 必传 图标
|
||||
* @param attrs 可选 iconType 属性
|
||||
* @returns Component
|
||||
@@ -34,11 +35,12 @@ export function useRenderIcon(icon: any, attrs?: iconType): Component {
|
||||
// svg
|
||||
return icon;
|
||||
} else {
|
||||
// 通过是否存在 : 符号来判断是在线还是本地图标，存在即是在线图标，反之
|
||||
return defineComponent({
|
||||
name: "Icon",
|
||||
render() {
|
||||
const IconifyIcon =
|
||||
attrs && attrs["online"] ? IconifyIconOnline : IconifyIconOffline;
|
||||
icon && icon.includes(":") ? IconifyIconOnline : IconifyIconOffline;
|
||||
return h(IconifyIcon, {
|
||||
icon: icon,
|
||||
...attrs
|
||||
|
||||
@@ -10,6 +10,10 @@ import Close from "@iconify-icons/ep/close";
|
||||
import CloseBold from "@iconify-icons/ep/close-bold";
|
||||
import Bell from "@iconify-icons/ep/bell";
|
||||
import Search from "@iconify-icons/ep/search";
|
||||
import EpArrowDown from "@iconify-icons/ep/arrow-down";
|
||||
import ArrowUp from "@iconify-icons/ep/arrow-up";
|
||||
import ArrowRight from "@iconify-icons/ep/arrow-right";
|
||||
import ArrowLeft from "@iconify-icons/ep/arrow-left";
|
||||
addIcon("check", Check);
|
||||
addIcon("home-filled", HomeFilled);
|
||||
addIcon("lollipop", Lollipop);
|
||||
@@ -18,6 +22,10 @@ addIcon("close", Close);
|
||||
addIcon("close-bold", CloseBold);
|
||||
addIcon("bell", Bell);
|
||||
addIcon("search", Search);
|
||||
addIcon("ep-arrow-down", EpArrowDown);
|
||||
addIcon("ep-arrow-up", ArrowUp);
|
||||
addIcon("ep-arrow-right", ArrowRight);
|
||||
addIcon("ep-arrow-left", ArrowLeft);
|
||||
|
||||
// remixicon
|
||||
import ArrowRightSLine from "@iconify-icons/ri/arrow-right-s-line";
|
||||
@@ -59,7 +67,7 @@ addIcon("close-all-tags", CloseAllTags);
|
||||
addIcon("fullscreen", Fullscreen);
|
||||
addIcon("exit-fullscreen", ExitFullscreen);
|
||||
|
||||
// Iconify Icon在Vue里离线使用（用于内网环境）https://docs.iconify.design/icon-components/vue/offline.html
|
||||
// Iconify Icon在Vue里本地使用（用于内网环境）https://docs.iconify.design/icon-components/vue/offline.html
|
||||
export default defineComponent({
|
||||
name: "IconifyIconOffline",
|
||||
components: { IconifyIcon },
|
||||
|
||||
@@ -11,7 +11,6 @@ export interface iconType {
|
||||
horizontalAlign?: boolean;
|
||||
verticalAlign?: boolean;
|
||||
align?: string;
|
||||
online?: boolean;
|
||||
onLoad?: Function;
|
||||
includes?: Function;
|
||||
|
||||
|
||||
@@ -31,7 +31,6 @@ const getConfig = (key?: string): ServerConfigs => {
|
||||
export const getServerConfig = async (app: App): Promise<undefined> => {
|
||||
app.config.globalProperties.$config = getConfig();
|
||||
return axios({
|
||||
baseURL: "",
|
||||
method: "get",
|
||||
url: `${VITE_PUBLIC_PATH}serverConfig.json`
|
||||
})
|
||||
@@ -44,8 +43,6 @@ export const getServerConfig = async (app: App): Promise<undefined> => {
|
||||
// 设置全局配置
|
||||
setConfig($config);
|
||||
}
|
||||
// 设置全局baseURL
|
||||
app.config.globalProperties.$baseUrl = $config.baseURL;
|
||||
return $config;
|
||||
})
|
||||
.catch(() => {
|
||||
|
||||
@@ -2,12 +2,9 @@
|
||||
import Search from "./search/index.vue";
|
||||
import Notice from "./notice/index.vue";
|
||||
import mixNav from "./sidebar/mixNav.vue";
|
||||
import avatars from "@/assets/avatars.jpg";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import Breadcrumb from "./sidebar/breadCrumb.vue";
|
||||
import topCollapse from "./sidebar/topCollapse.vue";
|
||||
import { useTranslationLang } from "../hooks/useTranslationLang";
|
||||
import globalization from "@/assets/svg/globalization.svg?component";
|
||||
|
||||
const {
|
||||
layout,
|
||||
@@ -17,12 +14,8 @@ const {
|
||||
pureApp,
|
||||
username,
|
||||
avatarsStyle,
|
||||
toggleSideBar,
|
||||
getDropdownItemStyle,
|
||||
getDropdownItemClass
|
||||
toggleSideBar
|
||||
} = useNav();
|
||||
|
||||
const { t, locale, translationCh, translationEn } = useTranslationLang();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -48,42 +41,13 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
|
||||
<Search />
|
||||
<!-- 通知 -->
|
||||
<Notice id="header-notice" />
|
||||
<!-- 国际化 -->
|
||||
<el-dropdown id="header-translation" trigger="click">
|
||||
<globalization
|
||||
class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-none"
|
||||
/>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu class="translation">
|
||||
<el-dropdown-item
|
||||
:style="getDropdownItemStyle(locale, 'zh')"
|
||||
:class="['dark:!text-white', getDropdownItemClass(locale, 'zh')]"
|
||||
@click="translationCh"
|
||||
>
|
||||
<IconifyIconOffline
|
||||
class="check-zh"
|
||||
v-show="locale === 'zh'"
|
||||
icon="check"
|
||||
/>
|
||||
简体中文
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
:style="getDropdownItemStyle(locale, 'en')"
|
||||
:class="['dark:!text-white', getDropdownItemClass(locale, 'en')]"
|
||||
@click="translationEn"
|
||||
>
|
||||
<span class="check-en" v-show="locale === 'en'">
|
||||
<IconifyIconOffline icon="check" />
|
||||
</span>
|
||||
English
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<!-- 退出登录 -->
|
||||
<el-dropdown trigger="click">
|
||||
<span class="el-dropdown-link navbar-bg-hover">
|
||||
<img v-if="avatars" :src="avatars" :style="avatarsStyle" />
|
||||
<span class="el-dropdown-link navbar-bg-hover select-none">
|
||||
<img
|
||||
src="https://avatars.githubusercontent.com/u/44761321?v=4"
|
||||
:style="avatarsStyle"
|
||||
/>
|
||||
<p v-if="username" class="dark:text-white">{{ username }}</p>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
@@ -93,14 +57,14 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
|
||||
icon="logout-circle-r-line"
|
||||
style="margin: 5px"
|
||||
/>
|
||||
{{ t("buttons.hsLoginOut") }}
|
||||
退出系统
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<span
|
||||
class="set-icon navbar-bg-hover"
|
||||
:title="t('buttons.hssystemSet')"
|
||||
title="打开项目配置"
|
||||
@click="onPanel"
|
||||
>
|
||||
<IconifyIconOffline icon="setting" />
|
||||
@@ -157,22 +121,6 @@ const { t, locale, translationCh, translationEn } = useTranslationLang();
|
||||
}
|
||||
}
|
||||
|
||||
.translation {
|
||||
::v-deep(.el-dropdown-menu__item) {
|
||||
padding: 5px 40px;
|
||||
}
|
||||
|
||||
.check-zh {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.check-en {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.logout {
|
||||
max-width: 120px;
|
||||
|
||||
|
||||
@@ -2,25 +2,16 @@
|
||||
import { ref } from "vue";
|
||||
import { noticesData } from "./data";
|
||||
import NoticeList from "./noticeList.vue";
|
||||
import { templateRef } from "@vueuse/core";
|
||||
import { Tabs, TabPane } from "@pureadmin/components";
|
||||
|
||||
const dropdownDom = templateRef<ElRef | null>("dropdownDom", null);
|
||||
const activeName = ref(noticesData[0].name);
|
||||
const noticesNum = ref(0);
|
||||
const notices = ref(noticesData);
|
||||
const activeKey = ref(noticesData[0].key);
|
||||
|
||||
let noticesNum = ref(0);
|
||||
notices.value.forEach(notice => {
|
||||
noticesNum.value += notice.list.length;
|
||||
});
|
||||
|
||||
function tabClick() {
|
||||
(dropdownDom as any).value.handleOpen();
|
||||
}
|
||||
notices.value.map(v => (noticesNum.value += v.list.length));
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-dropdown ref="dropdownDom" trigger="click" placement="bottom-end">
|
||||
<el-dropdown trigger="click" placement="bottom-end">
|
||||
<span class="dropdown-badge navbar-bg-hover select-none">
|
||||
<el-badge :value="noticesNum" :max="99">
|
||||
<span class="header-notice-icon">
|
||||
@@ -30,33 +21,25 @@ function tabClick() {
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<Tabs
|
||||
centered
|
||||
class="dropdown-tabs"
|
||||
v-model:activeName="activeName"
|
||||
@tabClick="tabClick"
|
||||
>
|
||||
<el-tabs :stretch="true" v-model="activeKey" class="dropdown-tabs">
|
||||
<template v-for="item in notices" :key="item.key">
|
||||
<TabPane :tab="`${item.name}(${item.list.length})`">
|
||||
<el-tab-pane
|
||||
:label="`${item.name}(${item.list.length})`"
|
||||
:name="`${item.key}`"
|
||||
>
|
||||
<el-scrollbar max-height="330px">
|
||||
<div class="noticeList-container">
|
||||
<NoticeList :list="item.list" />
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</TabPane>
|
||||
</el-tab-pane>
|
||||
</template>
|
||||
</Tabs>
|
||||
</el-tabs>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.ant-tabs-dropdown {
|
||||
z-index: 2900 !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dropdown-badge {
|
||||
display: flex;
|
||||
@@ -72,30 +55,28 @@ function tabClick() {
|
||||
}
|
||||
|
||||
.dropdown-tabs {
|
||||
width: 336px;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 2px 8px rgb(0 0 0 / 15%);
|
||||
border-radius: 4px;
|
||||
width: 330px;
|
||||
|
||||
.noticeList-container {
|
||||
padding: 15px 24px 0 24px;
|
||||
}
|
||||
|
||||
:deep(.el-tabs__header) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:deep(.el-tabs__nav-scroll) {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
:deep(.el-tabs__nav-wrap)::after {
|
||||
height: 1px;
|
||||
}
|
||||
|
||||
:deep(.noticeList-container) {
|
||||
padding: 15px 24px 0 24px;
|
||||
}
|
||||
// 如果上面的 notices 长度大于 3 请注释掉下面代码
|
||||
:deep(.el-tabs__nav-wrap) {
|
||||
padding: 0 36px 0 36px;
|
||||
}
|
||||
|
||||
:deep(.ant-tabs-nav) {
|
||||
margin-bottom: 0;
|
||||
// 如果上面的 notices 长度大于 3 请注释掉下面代码
|
||||
:deep(.el-tabs__active-bar) {
|
||||
margin: 0 36px 0 36px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -24,11 +24,11 @@ function hoverTitle() {
|
||||
|
||||
function hoverDescription(event, description) {
|
||||
// currentWidth 为文本在页面中所占的宽度，创建标签，加入到页面，获取currentWidth ,最后在移除
|
||||
let tempTag = document.createElement("span");
|
||||
const tempTag = document.createElement("span");
|
||||
tempTag.innerText = description;
|
||||
tempTag.className = "getDescriptionWidth";
|
||||
document.querySelector("body").appendChild(tempTag);
|
||||
let currentWidth = (
|
||||
const currentWidth = (
|
||||
document.querySelector(".getDescriptionWidth") as HTMLSpanElement
|
||||
).offsetWidth;
|
||||
document.querySelector(".getDescriptionWidth").remove();
|
||||
|
||||
@@ -3,7 +3,7 @@ import { ref } from "vue";
|
||||
import { onClickOutside } from "@vueuse/core";
|
||||
import { emitter } from "@/utils/mitt";
|
||||
|
||||
let show = ref<Boolean>(false);
|
||||
const show = ref<Boolean>(false);
|
||||
const target = ref(null);
|
||||
onClickOutside(target, (event: any) => {
|
||||
if (event.clientX > target.value.offsetLeft) return;
|
||||
@@ -21,7 +21,7 @@ emitter.on("openPanel", () => {
|
||||
<div ref="target" class="right-panel bg-bg_color">
|
||||
<div class="right-panel-items">
|
||||
<div class="project-configuration">
|
||||
<h3 class="dark:text-white">项目配置</h3>
|
||||
<h4 class="dark:text-white">项目配置</h4>
|
||||
<span title="关闭配置">
|
||||
<IconifyIconOffline
|
||||
class="dark:text-white"
|
||||
|
||||
@@ -1,8 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { useFullscreen } from "@vueuse/core";
|
||||
|
||||
const { t } = useI18n();
|
||||
const { isFullscreen, toggle } = useFullscreen();
|
||||
</script>
|
||||
|
||||
@@ -12,9 +10,7 @@ const { isFullscreen, toggle } = useFullscreen();
|
||||
@click="toggle"
|
||||
>
|
||||
<FontIcon
|
||||
:title="
|
||||
isFullscreen ? t('buttons.hsexitfullscreen') : t('buttons.hsfullscreen')
|
||||
"
|
||||
:title="isFullscreen ? '退出全屏' : '全屏'"
|
||||
:icon="isFullscreen ? 'team-iconexit-fullscreen' : 'team-iconfullscreen'"
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -16,10 +16,11 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
<script setup lang="ts">
|
||||
import mdiKeyboardEsc from "@/assets/svg/keyboard_esc.svg?component";
|
||||
import enterOutlined from "@/assets/svg/enter_outlined.svg?component";
|
||||
import mdiKeyboardEsc from "@/assets/svg/mdi_keyboard_esc.svg?component";
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.search-footer {
|
||||
display: flex;
|
||||
|
||||
@@ -1,11 +1,10 @@
|
||||
<script lang="ts" setup>
|
||||
<script setup lang="ts">
|
||||
import { useRouter } from "vue-router";
|
||||
import { cloneDeep } from "lodash-unified";
|
||||
import SearchResult from "./SearchResult.vue";
|
||||
import SearchFooter from "./SearchFooter.vue";
|
||||
import { deleteChildren } from "@/utils/tree";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import { transformI18n } from "@/plugins/i18n";
|
||||
import { deleteChildren } from "@pureadmin/utils";
|
||||
import { useDebounceFn, onKeyStroke } from "@vueuse/core";
|
||||
import { ref, watch, computed, nextTick, shallowRef } from "vue";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
@@ -71,7 +70,7 @@ function search() {
|
||||
resultOptions.value = flatMenusData.filter(
|
||||
menu =>
|
||||
keyword.value &&
|
||||
transformI18n(menu.meta?.title)
|
||||
menu.meta?.title
|
||||
.toLocaleLowerCase()
|
||||
.includes(keyword.value.toLocaleLowerCase().trim())
|
||||
);
|
||||
|
||||
@@ -1,12 +1,9 @@
|
||||
<script lang="ts" setup>
|
||||
<script setup lang="ts">
|
||||
import { computed } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { useEpThemeStoreHook } from "@/store/modules/epTheme";
|
||||
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
||||
import enterOutlined from "@/assets/svg/enter_outlined.svg?component";
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
interface optionsItem {
|
||||
path: string;
|
||||
meta?: {
|
||||
@@ -68,7 +65,7 @@ function handleTo() {
|
||||
@mouseenter="handleMouse(item)"
|
||||
>
|
||||
<component :is="useRenderIcon(item.meta?.icon ?? 'bookmark-2-line')" />
|
||||
<span class="result-item-title">{{ t(item.meta?.title) }}</span>
|
||||
<span class="result-item-title">{{ item.meta?.title }}</span>
|
||||
<enterOutlined />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<script lang="ts" setup>
|
||||
<script setup lang="ts">
|
||||
import { SearchModal } from "./components";
|
||||
import { useBoolean } from "../../hooks/useBoolean";
|
||||
const { bool: show, toggle } = useBoolean();
|
||||
|
||||
@@ -13,7 +13,6 @@ import { useRouter } from "vue-router";
|
||||
import panel from "../panel/index.vue";
|
||||
import { emitter } from "@/utils/mitt";
|
||||
import { resetRouter } from "@/router";
|
||||
import { templateRef } from "@vueuse/core";
|
||||
import { removeToken } from "@/utils/auth";
|
||||
import { routerArrays } from "@/layout/types";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
@@ -38,9 +37,9 @@ const { isDark } = useDark();
|
||||
const { isSelect } = useCssModule();
|
||||
const { $storage } = useGlobal<GlobalPropertiesApi>();
|
||||
|
||||
const mixRef = templateRef<HTMLElement | null>("mixRef", null);
|
||||
const verticalRef = templateRef<HTMLElement | null>("verticalRef", null);
|
||||
const horizontalRef = templateRef<HTMLElement | null>("horizontalRef", null);
|
||||
const mixRef = ref();
|
||||
const verticalRef = ref();
|
||||
const horizontalRef = ref();
|
||||
|
||||
const {
|
||||
body,
|
||||
@@ -54,8 +53,8 @@ const {
|
||||
|
||||
/* body添加layout属性，作用于src/style/sidebar.scss */
|
||||
if (unref(layoutTheme)) {
|
||||
let layout = unref(layoutTheme).layout;
|
||||
let theme = unref(layoutTheme).theme;
|
||||
const layout = unref(layoutTheme).layout;
|
||||
const theme = unref(layoutTheme).theme;
|
||||
toggleTheme({
|
||||
scopeName: `layout-theme-${theme}`
|
||||
});
|
||||
@@ -119,13 +118,13 @@ const weekChange = (value): void => {
|
||||
};
|
||||
|
||||
const tagsChange = () => {
|
||||
let showVal = settings.tabsVal;
|
||||
const showVal = settings.tabsVal;
|
||||
storageConfigureChange("hideTabs", showVal);
|
||||
emitter.emit("tagViewsChange", showVal as unknown as string);
|
||||
};
|
||||
|
||||
const multiTagsCacheChange = () => {
|
||||
let multiTagsCache = settings.multiTagsCache;
|
||||
const multiTagsCache = settings.multiTagsCache;
|
||||
storageConfigureChange("multiTagsCache", multiTagsCache);
|
||||
useMultiTagsStoreHook().multiTagsCacheChange(multiTagsCache);
|
||||
};
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import { isEqual } from "lodash-unified";
|
||||
import { transformI18n } from "@/plugins/i18n";
|
||||
import { isEqual } from "@pureadmin/utils";
|
||||
import { ref, watch, onMounted, toRaw } from "vue";
|
||||
import { getParentPaths, findRouteByPath } from "@/router/utils";
|
||||
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
|
||||
@@ -53,7 +52,7 @@ const getBreadcrumb = (): void => {
|
||||
{
|
||||
path: "/welcome",
|
||||
parentPath: "/",
|
||||
meta: { title: "menus.hshome" }
|
||||
meta: { title: "首页" }
|
||||
} as unknown as RouteLocationMatched
|
||||
].concat(matched);
|
||||
}
|
||||
@@ -100,7 +99,7 @@ watch(
|
||||
<transition-group appear name="breadcrumb">
|
||||
<el-breadcrumb-item v-for="item in levelList" :key="item.path">
|
||||
<a @click.prevent="handleLink(item)">
|
||||
{{ transformI18n(item.meta.title) }}
|
||||
{{ item.meta.title }}
|
||||
</a>
|
||||
</el-breadcrumb-item>
|
||||
</transition-group>
|
||||
|
||||
@@ -3,17 +3,13 @@ import Search from "../search/index.vue";
|
||||
import Notice from "../notice/index.vue";
|
||||
import { ref, watch, nextTick } from "vue";
|
||||
import SidebarItem from "./sidebarItem.vue";
|
||||
import avatars from "@/assets/avatars.jpg";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import { useTranslationLang } from "../../hooks/useTranslationLang";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
import globalization from "@/assets/svg/globalization.svg?component";
|
||||
|
||||
const menuRef = ref();
|
||||
|
||||
const { t, route, locale, translationCh, translationEn } =
|
||||
useTranslationLang(menuRef);
|
||||
const {
|
||||
route,
|
||||
title,
|
||||
routers,
|
||||
logout,
|
||||
@@ -21,9 +17,7 @@ const {
|
||||
onPanel,
|
||||
menuSelect,
|
||||
username,
|
||||
avatarsStyle,
|
||||
getDropdownItemStyle,
|
||||
getDropdownItemClass
|
||||
avatarsStyle
|
||||
} = useNav();
|
||||
|
||||
nextTick(() => {
|
||||
@@ -64,40 +58,13 @@ watch(
|
||||
<Search />
|
||||
<!-- 通知 -->
|
||||
<Notice id="header-notice" />
|
||||
<!-- 国际化 -->
|
||||
<el-dropdown id="header-translation" trigger="click">
|
||||
<globalization
|
||||
class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-none"
|
||||
/>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu class="translation">
|
||||
<el-dropdown-item
|
||||
:style="getDropdownItemStyle(locale, 'zh')"
|
||||
:class="['dark:!text-white', getDropdownItemClass(locale, 'zh')]"
|
||||
@click="translationCh"
|
||||
>
|
||||
<span class="check-zh" v-show="locale === 'zh'">
|
||||
<IconifyIconOffline icon="check" />
|
||||
</span>
|
||||
简体中文
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
:style="getDropdownItemStyle(locale, 'en')"
|
||||
:class="['dark:!text-white', getDropdownItemClass(locale, 'en')]"
|
||||
@click="translationEn"
|
||||
>
|
||||
<span class="check-en" v-show="locale === 'en'">
|
||||
<IconifyIconOffline icon="check" />
|
||||
</span>
|
||||
English
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<!-- 退出登录 -->
|
||||
<el-dropdown trigger="click">
|
||||
<span class="el-dropdown-link navbar-bg-hover">
|
||||
<img v-if="avatars" :src="avatars" :style="avatarsStyle" />
|
||||
<img
|
||||
src="https://avatars.githubusercontent.com/u/44761321?v=4"
|
||||
:style="avatarsStyle"
|
||||
/>
|
||||
<p v-if="username" class="dark:text-white">{{ username }}</p>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
@@ -107,14 +74,14 @@ watch(
|
||||
icon="logout-circle-r-line"
|
||||
style="margin: 5px"
|
||||
/>
|
||||
{{ t("buttons.hsLoginOut") }}
|
||||
退出系统
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<span
|
||||
class="set-icon navbar-bg-hover"
|
||||
:title="t('buttons.hssystemSet')"
|
||||
title="打开项目配置"
|
||||
@click="onPanel"
|
||||
>
|
||||
<IconifyIconOffline icon="setting" />
|
||||
@@ -124,22 +91,6 @@ watch(
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.translation {
|
||||
::v-deep(.el-dropdown-menu__item) {
|
||||
padding: 5px 40px;
|
||||
}
|
||||
|
||||
.check-zh {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.check-en {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.logout {
|
||||
max-width: 120px;
|
||||
|
||||
|
||||
@@ -9,7 +9,7 @@ const { title } = useNav();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="sidebar-logo-container" :class="{ collapse: props.collapse }">
|
||||
<div class="sidebar-logo-container" :class="{ collapses: props.collapse }">
|
||||
<transition name="sidebarLogoFade">
|
||||
<router-link
|
||||
v-if="props.collapse"
|
||||
@@ -65,7 +65,7 @@ const { title } = useNav();
|
||||
}
|
||||
}
|
||||
|
||||
.collapse {
|
||||
.collapses {
|
||||
.sidebar-logo {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
@@ -1,22 +1,17 @@
|
||||
<script setup lang="ts">
|
||||
import Search from "../search/index.vue";
|
||||
import Notice from "../notice/index.vue";
|
||||
import avatars from "@/assets/avatars.jpg";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import { transformI18n } from "@/plugins/i18n";
|
||||
import { ref, toRaw, watch, onMounted, nextTick } from "vue";
|
||||
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
||||
import { getParentPaths, findRouteByPath } from "@/router/utils";
|
||||
import { useTranslationLang } from "../../hooks/useTranslationLang";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
import globalization from "@/assets/svg/globalization.svg?component";
|
||||
|
||||
const menuRef = ref();
|
||||
let defaultActive = ref(null);
|
||||
const defaultActive = ref(null);
|
||||
|
||||
const { t, route, locale, translationCh, translationEn } =
|
||||
useTranslationLang(menuRef);
|
||||
const {
|
||||
route,
|
||||
device,
|
||||
routers,
|
||||
logout,
|
||||
@@ -24,9 +19,7 @@ const {
|
||||
menuSelect,
|
||||
resolvePath,
|
||||
username,
|
||||
avatarsStyle,
|
||||
getDropdownItemStyle,
|
||||
getDropdownItemClass
|
||||
avatarsStyle
|
||||
} = useNav();
|
||||
|
||||
function getDefaultActive(routePath) {
|
||||
@@ -79,7 +72,7 @@ watch(
|
||||
:is="useRenderIcon(route.meta && toRaw(route.meta.icon))"
|
||||
/>
|
||||
</div>
|
||||
<span class="select-none">{{ transformI18n(route.meta.title) }}</span>
|
||||
<span class="select-none">{{ route.meta.title }}</span>
|
||||
<FontIcon
|
||||
v-if="route.meta.extraIcon"
|
||||
width="30px"
|
||||
@@ -96,40 +89,13 @@ watch(
|
||||
<Search />
|
||||
<!-- 通知 -->
|
||||
<Notice id="header-notice" />
|
||||
<!-- 国际化 -->
|
||||
<el-dropdown id="header-translation" trigger="click">
|
||||
<globalization
|
||||
class="navbar-bg-hover w-[40px] h-[48px] p-[11px] cursor-pointer outline-none"
|
||||
/>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu class="translation">
|
||||
<el-dropdown-item
|
||||
:style="getDropdownItemStyle(locale, 'zh')"
|
||||
:class="['dark:!text-white', getDropdownItemClass(locale, 'zh')]"
|
||||
@click="translationCh"
|
||||
>
|
||||
<span class="check-zh" v-show="locale === 'zh'">
|
||||
<IconifyIconOffline icon="check" />
|
||||
</span>
|
||||
简体中文
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
:style="getDropdownItemStyle(locale, 'en')"
|
||||
:class="['dark:!text-white', getDropdownItemClass(locale, 'en')]"
|
||||
@click="translationEn"
|
||||
>
|
||||
<span class="check-en" v-show="locale === 'en'">
|
||||
<IconifyIconOffline icon="check" />
|
||||
</span>
|
||||
English
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<!-- 退出登录 -->
|
||||
<el-dropdown trigger="click">
|
||||
<span class="el-dropdown-link navbar-bg-hover">
|
||||
<img v-if="avatars" :src="avatars" :style="avatarsStyle" />
|
||||
<span class="el-dropdown-link navbar-bg-hover select-none">
|
||||
<img
|
||||
src="https://avatars.githubusercontent.com/u/44761321?v=4"
|
||||
:style="avatarsStyle"
|
||||
/>
|
||||
<p v-if="username" class="dark:text-white">{{ username }}</p>
|
||||
</span>
|
||||
<template #dropdown>
|
||||
@@ -139,14 +105,14 @@ watch(
|
||||
icon="logout-circle-r-line"
|
||||
style="margin: 5px"
|
||||
/>
|
||||
{{ t("buttons.hsLoginOut") }}
|
||||
退出系统
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<span
|
||||
class="set-icon navbar-bg-hover"
|
||||
:title="t('buttons.hssystemSet')"
|
||||
title="打开项目配置"
|
||||
@click="onPanel"
|
||||
>
|
||||
<IconifyIconOffline icon="setting" />
|
||||
@@ -156,22 +122,6 @@ watch(
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.translation {
|
||||
::v-deep(.el-dropdown-menu__item) {
|
||||
padding: 5px 40px;
|
||||
}
|
||||
|
||||
.check-zh {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.check-en {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.logout {
|
||||
max-width: 120px;
|
||||
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<script setup lang="ts">
|
||||
import path from "path";
|
||||
import { getConfig } from "@/config";
|
||||
import { childrenType } from "../../types";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import { transformI18n } from "@/plugins/i18n";
|
||||
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
||||
import { ref, toRaw, PropType, nextTick, computed, CSSProperties } from "vue";
|
||||
|
||||
@@ -76,6 +76,10 @@ const getSpanStyle = computed(() => {
|
||||
};
|
||||
});
|
||||
|
||||
const expandCloseIcon = computed(() => {
|
||||
return getConfig()?.MenuArrowIconNoTransition ? "expand-close-icon" : "";
|
||||
});
|
||||
|
||||
const onlyOneChild: childrenType = ref(null);
|
||||
// 存放菜单是否存在showTooltip属性标识
|
||||
const hoverMenuMap = new WeakMap();
|
||||
@@ -164,7 +168,7 @@ function resolvePath(routePath) {
|
||||
:style="getDivStyle"
|
||||
>
|
||||
<span :style="getMenuTextStyle">
|
||||
{{ transformI18n(onlyOneChild.meta.title) }}
|
||||
{{ onlyOneChild.meta.title }}
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
@@ -174,13 +178,13 @@ function resolvePath(routePath) {
|
||||
:style="getDivStyle"
|
||||
>
|
||||
<span :style="getMenuTextStyle">
|
||||
{{ transformI18n(onlyOneChild.meta.title) }}
|
||||
{{ onlyOneChild.meta.title }}
|
||||
</span>
|
||||
</div>
|
||||
<template #title>
|
||||
<div :style="getDivStyle">
|
||||
<span v-if="layout === 'horizontal'">
|
||||
{{ transformI18n(onlyOneChild.meta.title) }}
|
||||
{{ onlyOneChild.meta.title }}
|
||||
</span>
|
||||
<el-tooltip
|
||||
v-else
|
||||
@@ -189,14 +193,14 @@ function resolvePath(routePath) {
|
||||
:disabled="!onlyOneChild.showTooltip"
|
||||
>
|
||||
<template #content>
|
||||
{{ transformI18n(onlyOneChild.meta.title) }}
|
||||
{{ onlyOneChild.meta.title }}
|
||||
</template>
|
||||
<span
|
||||
ref="menuTextRef"
|
||||
:style="getMenuTextStyle"
|
||||
@mouseover="hoverMenu(onlyOneChild)"
|
||||
>
|
||||
{{ transformI18n(onlyOneChild.meta.title) }}
|
||||
{{ onlyOneChild.meta.title }}
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<FontIcon
|
||||
@@ -212,7 +216,15 @@ function resolvePath(routePath) {
|
||||
</el-menu-item>
|
||||
</template>
|
||||
|
||||
<el-sub-menu v-else ref="subMenu" :index="resolvePath(props.item.path)">
|
||||
<el-sub-menu
|
||||
v-else
|
||||
ref="subMenu"
|
||||
:index="resolvePath(props.item.path)"
|
||||
v-bind:[expandCloseIcon]="useRenderIcon('ep-arrow-down')"
|
||||
:expand-open-icon="useRenderIcon('ep-arrow-up')"
|
||||
:collapse-close-icon="useRenderIcon('ep-arrow-right')"
|
||||
:collapse-open-icon="useRenderIcon('ep-arrow-left')"
|
||||
>
|
||||
<template #title>
|
||||
<div v-if="toRaw(props.item.meta.icon)" class="sub-menu-icon">
|
||||
<component
|
||||
@@ -220,7 +232,7 @@ function resolvePath(routePath) {
|
||||
/>
|
||||
</div>
|
||||
<span v-if="layout === 'horizontal'">
|
||||
{{ transformI18n(props.item.meta.title) }}
|
||||
{{ props.item.meta.title }}
|
||||
</span>
|
||||
<el-tooltip
|
||||
v-else
|
||||
@@ -229,7 +241,7 @@ function resolvePath(routePath) {
|
||||
:disabled="!isCollapse || !props.item.showTooltip"
|
||||
>
|
||||
<template #content>
|
||||
{{ transformI18n(props.item.meta.title) }}
|
||||
{{ props.item.meta.title }}
|
||||
</template>
|
||||
<div
|
||||
ref="menuTextRef"
|
||||
@@ -237,7 +249,7 @@ function resolvePath(routePath) {
|
||||
@mouseover="hoverMenu(props.item)"
|
||||
>
|
||||
<span :style="getSpanStyle">
|
||||
{{ transformI18n(props.item.meta.title) }}
|
||||
{{ props.item.meta.title }}
|
||||
</span>
|
||||
</div>
|
||||
</el-tooltip>
|
||||
|
||||
@@ -4,7 +4,6 @@ import { useRoute } from "vue-router";
|
||||
import { emitter } from "@/utils/mitt";
|
||||
import SidebarItem from "./sidebarItem.vue";
|
||||
import leftCollapse from "./leftCollapse.vue";
|
||||
import type { StorageConfigs } from "/#/index";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import { storageLocal } from "@pureadmin/utils";
|
||||
import { ref, computed, watch, onBeforeMount } from "vue";
|
||||
@@ -19,7 +18,7 @@ const showLogo = ref(
|
||||
const { routers, device, pureApp, isCollapse, menuSelect, toggleSideBar } =
|
||||
useNav();
|
||||
|
||||
let subMenuData = ref([]);
|
||||
const subMenuData = ref([]);
|
||||
|
||||
const menuData = computed(() => {
|
||||
return pureApp.layout === "mix" && device.value !== "mobile"
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
<script setup lang="ts">
|
||||
import { $t } from "@/plugins/i18n";
|
||||
import { emitter } from "@/utils/mitt";
|
||||
import { RouteConfigs } from "../../types";
|
||||
import { useTags } from "../../hooks/useTag";
|
||||
@@ -35,14 +34,13 @@ const {
|
||||
onMounted,
|
||||
onMouseenter,
|
||||
onMouseleave,
|
||||
transformI18n,
|
||||
onContentFullScreen
|
||||
} = useTags();
|
||||
|
||||
const tabDom = ref();
|
||||
const containerDom = ref();
|
||||
const scrollbarDom = ref();
|
||||
let isShowArrow = ref(false);
|
||||
const isShowArrow = ref(false);
|
||||
const { isFullscreen, toggle } = useFullscreen();
|
||||
|
||||
const dynamicTagView = () => {
|
||||
@@ -129,7 +127,7 @@ function dynamicRouteTag(value: string, parentPath: string): void {
|
||||
function concatPath(arr: object[], value: string, parentPath: string) {
|
||||
if (!hasValue) {
|
||||
arr.forEach((arrItem: any) => {
|
||||
let pathConcat = parentPath + arrItem.path;
|
||||
const pathConcat = parentPath + arrItem.path;
|
||||
if (arrItem.path === value || pathConcat === value) {
|
||||
useMultiTagsStoreHook().handleTags("push", {
|
||||
path: value,
|
||||
@@ -160,7 +158,7 @@ function onFresh() {
|
||||
function deleteDynamicTag(obj: any, current: any, tag?: string) {
|
||||
// 存放被删除的缓存路由
|
||||
let delAliveRouteList = [];
|
||||
let valueIndex: number = multiTags.value.findIndex((item: any) => {
|
||||
const valueIndex: number = multiTags.value.findIndex((item: any) => {
|
||||
if (item.query) {
|
||||
if (item.path === obj.path) {
|
||||
return item.query === obj.query;
|
||||
@@ -199,7 +197,7 @@ function deleteDynamicTag(obj: any, current: any, tag?: string) {
|
||||
// 从当前匹配到的路径中删除
|
||||
spliceRoute(valueIndex, 1);
|
||||
}
|
||||
let newRoute = useMultiTagsStoreHook().handleTags("slice");
|
||||
const newRoute = useMultiTagsStoreHook().handleTags("slice");
|
||||
if (current === route.path) {
|
||||
// 删除缓存路由
|
||||
tag
|
||||
@@ -285,10 +283,10 @@ function onClickDrop(key, item, selectRoute?: RouteConfigs) {
|
||||
setTimeout(() => {
|
||||
if (isFullscreen.value) {
|
||||
tagsViews[6].icon = "exit-fullscreen";
|
||||
tagsViews[6].text = $t("buttons.hswholeExitFullScreen");
|
||||
tagsViews[6].text = "整体页面退出全屏";
|
||||
} else {
|
||||
tagsViews[6].icon = "fullscreen";
|
||||
tagsViews[6].text = $t("buttons.hswholeFullScreen");
|
||||
tagsViews[6].text = "整体页面全屏";
|
||||
}
|
||||
}, 100);
|
||||
break;
|
||||
@@ -298,10 +296,10 @@ function onClickDrop(key, item, selectRoute?: RouteConfigs) {
|
||||
setTimeout(() => {
|
||||
if (pureSetting.hiddenSideBar) {
|
||||
tagsViews[7].icon = "exit-fullscreen";
|
||||
tagsViews[7].text = $t("buttons.hscontentExitFullScreen");
|
||||
tagsViews[7].text = "内容区退出全屏";
|
||||
} else {
|
||||
tagsViews[7].icon = "fullscreen";
|
||||
tagsViews[7].text = $t("buttons.hscontentFullScreen");
|
||||
tagsViews[7].text = "内容区全屏";
|
||||
}
|
||||
}, 100);
|
||||
break;
|
||||
@@ -339,8 +337,8 @@ function showMenuModel(
|
||||
query: object = {},
|
||||
refresh = false
|
||||
) {
|
||||
let allRoute = multiTags.value;
|
||||
let routeLength = multiTags.value.length;
|
||||
const allRoute = multiTags.value;
|
||||
const routeLength = multiTags.value.length;
|
||||
let currentIndex = -1;
|
||||
if (isEmpty(query)) {
|
||||
currentIndex = allRoute.findIndex(v => v.path === currentPath);
|
||||
@@ -499,7 +497,7 @@ onMounted(() => {
|
||||
<IconifyIconOffline icon="arrow-left-s-line" @click="handleScroll(200)" />
|
||||
</span>
|
||||
<div ref="scrollbarDom" class="scroll-container">
|
||||
<div class="tab" ref="tabDom" :style="getTabStyle">
|
||||
<div class="tab select-none" ref="tabDom" :style="getTabStyle">
|
||||
<div
|
||||
:ref="'dynamic' + index"
|
||||
v-for="(item, index) in multiTags"
|
||||
@@ -520,7 +518,7 @@ onMounted(() => {
|
||||
:to="item.path"
|
||||
class="dark:!text-text_color_primary dark:hover:!text-primary"
|
||||
>
|
||||
{{ transformI18n(item.meta.title) }}
|
||||
{{ item.meta.title }}
|
||||
</router-link>
|
||||
<span
|
||||
v-if="
|
||||
@@ -561,7 +559,7 @@ onMounted(() => {
|
||||
>
|
||||
<li v-if="item.show" @click="selectTag(key, item)">
|
||||
<IconifyIconOffline :icon="item.icon" />
|
||||
{{ transformI18n(item.text) }}
|
||||
{{ item.text }}
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
@@ -585,7 +583,7 @@ onMounted(() => {
|
||||
:disabled="item.disabled"
|
||||
>
|
||||
<IconifyIconOffline :icon="item.icon" />
|
||||
{{ transformI18n(item.text) }}
|
||||
{{ item.text }}
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
<script lang="ts" setup>
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { useRoute } from "vue-router";
|
||||
import { ref, unref, onMounted, nextTick } from "vue";
|
||||
|
||||
@@ -7,7 +6,6 @@ defineOptions({
|
||||
name: "FrameView"
|
||||
});
|
||||
|
||||
const { t } = useI18n();
|
||||
const loading = ref(true);
|
||||
const currentRoute = useRoute();
|
||||
const frameSrc = ref<string>("");
|
||||
@@ -45,11 +43,7 @@ onMounted(() => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="frame"
|
||||
v-loading="loading"
|
||||
:element-loading-text="t('status.hsLoad')"
|
||||
>
|
||||
<div class="frame" v-loading="loading" element-loading-text="加载中...">
|
||||
<iframe :src="frameSrc" class="frame-iframe" ref="frameRef" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -69,7 +69,7 @@ export function useDataThemeChange() {
|
||||
return new TinyColor(color).shade(10).toString();
|
||||
};
|
||||
|
||||
/** 设置ep主题色 */
|
||||
/** 设置 `element-plus` 主题色 */
|
||||
const setEpThemeColor = (color: string) => {
|
||||
useEpThemeStoreHook().setEpThemeColor(color);
|
||||
body.style.setProperty("--el-color-primary-active", shadeBgColor(color));
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import { computed } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { routerArrays } from "../types";
|
||||
import { useGlobal } from "@pureadmin/utils";
|
||||
import { useMultiTagsStore } from "@/store/modules/multiTags";
|
||||
@@ -15,11 +14,6 @@ export function useLayout() {
|
||||
) {
|
||||
$storage.tags = routerArrays;
|
||||
}
|
||||
/** 国际化 */
|
||||
if (!$storage.locale) {
|
||||
$storage.locale = { locale: $config?.Locale ?? "zh" };
|
||||
useI18n().locale.value = $config?.Locale ?? "zh";
|
||||
}
|
||||
/** 导航 */
|
||||
if (!$storage.layout) {
|
||||
$storage.layout = {
|
||||
|
||||
@@ -1,42 +1,28 @@
|
||||
import { computed } from "vue";
|
||||
import { storeToRefs } from "pinia";
|
||||
import { getConfig } from "@/config";
|
||||
import { useRouter } from "vue-router";
|
||||
import { emitter } from "@/utils/mitt";
|
||||
import { routeMetaType } from "../types";
|
||||
import { useGlobal } from "@pureadmin/utils";
|
||||
import { transformI18n } from "@/plugins/i18n";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { router, remainingPaths } from "@/router";
|
||||
import { useAppStoreHook } from "@/store/modules/app";
|
||||
import { useUserStoreHook } from "@/store/modules/user";
|
||||
import { useEpThemeStoreHook } from "@/store/modules/epTheme";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
|
||||
const errorInfo = "当前路由配置不正确，请检查配置";
|
||||
|
||||
export function useNav() {
|
||||
const route = useRoute();
|
||||
const pureApp = useAppStoreHook();
|
||||
const routers = useRouter().options.routes;
|
||||
const { wholeMenus } = storeToRefs(usePermissionStoreHook());
|
||||
|
||||
/** 用户名 */
|
||||
const username = computed(() => {
|
||||
return useUserStoreHook()?.username;
|
||||
});
|
||||
|
||||
/** 设置国际化选中后的样式 */
|
||||
const getDropdownItemStyle = computed(() => {
|
||||
return (locale, t) => {
|
||||
return {
|
||||
background: locale === t ? useEpThemeStoreHook().epThemeColor : "",
|
||||
color: locale === t ? "#f4f4f5" : "#000"
|
||||
};
|
||||
};
|
||||
});
|
||||
|
||||
const getDropdownItemClass = computed(() => {
|
||||
return (locale, t) => {
|
||||
return locale === t ? "" : "dark:hover:!text-primary";
|
||||
};
|
||||
});
|
||||
|
||||
const avatarsStyle = computed(() => {
|
||||
return username.value ? { marginRight: "10px" } : "";
|
||||
});
|
||||
@@ -61,8 +47,8 @@ export function useNav() {
|
||||
/** 动态title */
|
||||
function changeTitle(meta: routeMetaType) {
|
||||
const Title = getConfig().Title;
|
||||
if (Title) document.title = `${transformI18n(meta.title)} | ${Title}`;
|
||||
else document.title = transformI18n(meta.title);
|
||||
if (Title) document.title = `${meta.title} | ${Title}`;
|
||||
else document.title = meta.title;
|
||||
}
|
||||
|
||||
/** 退出登录 */
|
||||
@@ -98,6 +84,7 @@ export function useNav() {
|
||||
}
|
||||
|
||||
function menuSelect(indexPath: string, routers): void {
|
||||
if (wholeMenus.value.length === 0) return;
|
||||
if (isRemaining(indexPath)) return;
|
||||
let parentPath = "";
|
||||
const parentPathIndex = indexPath.lastIndexOf("/");
|
||||
@@ -132,6 +119,7 @@ export function useNav() {
|
||||
}
|
||||
|
||||
return {
|
||||
route,
|
||||
title,
|
||||
device,
|
||||
layout,
|
||||
@@ -148,8 +136,6 @@ export function useNav() {
|
||||
isCollapse,
|
||||
pureApp,
|
||||
username,
|
||||
avatarsStyle,
|
||||
getDropdownItemStyle,
|
||||
getDropdownItemClass
|
||||
avatarsStyle
|
||||
};
|
||||
}
|
||||
|
||||
@@ -9,11 +9,9 @@ import {
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
import { tagsViewsType } from "../types";
|
||||
import { isEqual } from "lodash-unified";
|
||||
import type { StorageConfigs } from "/#/index";
|
||||
import { useEventListener } from "@vueuse/core";
|
||||
import { useRoute, useRouter } from "vue-router";
|
||||
import { transformI18n, $t } from "@/plugins/i18n";
|
||||
import { isEqual, isBoolean } from "@pureadmin/utils";
|
||||
import { useSettingStoreHook } from "@/store/modules/settings";
|
||||
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
|
||||
import { storageLocal, toggleClass, hasClass } from "@pureadmin/utils";
|
||||
@@ -49,56 +47,56 @@ export function useTags() {
|
||||
const tagsViews = reactive<Array<tagsViewsType>>([
|
||||
{
|
||||
icon: "refresh-right",
|
||||
text: $t("buttons.hsreload"),
|
||||
text: "重新加载",
|
||||
divided: false,
|
||||
disabled: false,
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: "close",
|
||||
text: $t("buttons.hscloseCurrentTab"),
|
||||
text: "关闭当前标签页",
|
||||
divided: false,
|
||||
disabled: multiTags.value.length > 1 ? false : true,
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: "close-left-tags",
|
||||
text: $t("buttons.hscloseLeftTabs"),
|
||||
text: "关闭左侧标签页",
|
||||
divided: true,
|
||||
disabled: multiTags.value.length > 1 ? false : true,
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: "close-right-tags",
|
||||
text: $t("buttons.hscloseRightTabs"),
|
||||
text: "关闭右侧标签页",
|
||||
divided: false,
|
||||
disabled: multiTags.value.length > 1 ? false : true,
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: "close-other-tags",
|
||||
text: $t("buttons.hscloseOtherTabs"),
|
||||
text: "关闭其他标签页",
|
||||
divided: true,
|
||||
disabled: multiTags.value.length > 2 ? false : true,
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: "close-all-tags",
|
||||
text: $t("buttons.hscloseAllTabs"),
|
||||
text: "关闭全部标签页",
|
||||
divided: false,
|
||||
disabled: multiTags.value.length > 1 ? false : true,
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: "fullscreen",
|
||||
text: $t("buttons.hswholeFullScreen"),
|
||||
text: "整体页面全屏",
|
||||
divided: true,
|
||||
disabled: false,
|
||||
show: true
|
||||
},
|
||||
{
|
||||
icon: "fullscreen",
|
||||
text: $t("buttons.hscontentFullScreen"),
|
||||
text: "内容区全屏",
|
||||
divided: false,
|
||||
disabled: false,
|
||||
show: true
|
||||
@@ -106,16 +104,15 @@ export function useTags() {
|
||||
]);
|
||||
|
||||
function conditionHandle(item, previous, next) {
|
||||
if (
|
||||
Object.keys(route.query).length === 0 &&
|
||||
Object.keys(route.params).length === 0
|
||||
) {
|
||||
return route.path === item.path ? previous : next;
|
||||
} else if (Object.keys(route.query).length > 0) {
|
||||
if (isBoolean(route?.meta?.showLink) && route?.meta?.showLink === false) {
|
||||
if (Object.keys(route.query).length > 0) {
|
||||
return isEqual(route.query, item.query) ? previous : next;
|
||||
} else {
|
||||
return isEqual(route.params, item.params) ? previous : next;
|
||||
}
|
||||
} else {
|
||||
return route.path === item.path ? previous : next;
|
||||
}
|
||||
}
|
||||
|
||||
const iconIsActive = computed(() => {
|
||||
@@ -224,12 +221,10 @@ export function useTags() {
|
||||
currentSelect,
|
||||
scheduleIsActive,
|
||||
getContextMenuStyle,
|
||||
$t,
|
||||
closeMenu,
|
||||
onMounted,
|
||||
onMouseenter,
|
||||
onMouseleave,
|
||||
transformI18n,
|
||||
onContentFullScreen
|
||||
};
|
||||
}
|
||||
|
||||
@@ -1,37 +0,0 @@
|
||||
import { useNav } from "./useNav";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { useRoute } from "vue-router";
|
||||
import { watch, type Ref } from "vue";
|
||||
|
||||
export function useTranslationLang(ref?: Ref) {
|
||||
const { $storage, changeTitle, handleResize } = useNav();
|
||||
const { locale, t } = useI18n();
|
||||
const route = useRoute();
|
||||
|
||||
function translationCh() {
|
||||
$storage.locale = { locale: "zh" };
|
||||
locale.value = "zh";
|
||||
ref && handleResize(ref.value);
|
||||
}
|
||||
|
||||
function translationEn() {
|
||||
$storage.locale = { locale: "en" };
|
||||
locale.value = "en";
|
||||
ref && handleResize(ref.value);
|
||||
}
|
||||
|
||||
watch(
|
||||
() => locale.value,
|
||||
() => {
|
||||
changeTitle(route.meta);
|
||||
}
|
||||
);
|
||||
|
||||
return {
|
||||
t,
|
||||
route,
|
||||
locale,
|
||||
translationCh,
|
||||
translationEn
|
||||
};
|
||||
}
|
||||
@@ -70,7 +70,7 @@ let isAutoCloseSidebar = true;
|
||||
// 监听容器
|
||||
emitter.on("resize", ({ detail }) => {
|
||||
if (isMobile) return;
|
||||
let { width } = detail;
|
||||
const { width } = detail;
|
||||
width <= 760 ? setTheme("vertical") : setTheme(useAppStoreHook().layout);
|
||||
/** width app-wrapper类容器宽度
|
||||
* 0 < width <= 760 隐藏侧边栏
|
||||
|
||||
@@ -20,7 +20,6 @@ const themeColors = {
|
||||
menuHover: "#4091f7",
|
||||
subMenuBg: "#0f0303",
|
||||
subMenuActiveBg: "#4091f7",
|
||||
navTextColor: "#fff",
|
||||
menuText: "rgb(254 254 254 / 65%)",
|
||||
sidebarLogo: "#002140",
|
||||
menuTitleHover: "#fff",
|
||||
@@ -33,7 +32,6 @@ const themeColors = {
|
||||
menuHover: "#e0ebf6",
|
||||
subMenuBg: "#fff",
|
||||
subMenuActiveBg: "#e0ebf6",
|
||||
navTextColor: "#7a80b4",
|
||||
menuText: "#7a80b4",
|
||||
sidebarLogo: "#fff",
|
||||
menuTitleHover: "#000",
|
||||
@@ -46,7 +44,6 @@ const themeColors = {
|
||||
menuHover: "#e13c39",
|
||||
subMenuBg: "#000",
|
||||
subMenuActiveBg: "#e13c39",
|
||||
navTextColor: "#red",
|
||||
menuText: "rgb(254 254 254 / 65.1%)",
|
||||
sidebarLogo: "#42090c",
|
||||
menuTitleHover: "#fff",
|
||||
@@ -59,7 +56,6 @@ const themeColors = {
|
||||
menuHover: "#e85f33",
|
||||
subMenuBg: "#0f0603",
|
||||
subMenuActiveBg: "#e85f33",
|
||||
navTextColor: "#fff",
|
||||
menuText: "rgb(254 254 254 / 65%)",
|
||||
sidebarLogo: "#441708",
|
||||
menuTitleHover: "#fff",
|
||||
@@ -72,7 +68,6 @@ const themeColors = {
|
||||
menuHover: "#f6da4d",
|
||||
subMenuBg: "#0f0603",
|
||||
subMenuActiveBg: "#f6da4d",
|
||||
navTextColor: "#fff",
|
||||
menuText: "rgb(254 254 254 / 65%)",
|
||||
sidebarLogo: "#443b05",
|
||||
menuTitleHover: "#fff",
|
||||
@@ -85,7 +80,6 @@ const themeColors = {
|
||||
menuHover: "#59bfc1",
|
||||
subMenuBg: "#000",
|
||||
subMenuActiveBg: "#59bfc1",
|
||||
navTextColor: "#7a80b4",
|
||||
menuText: "#7a80b4",
|
||||
sidebarLogo: "#053434",
|
||||
menuTitleHover: "#fff",
|
||||
@@ -98,7 +92,6 @@ const themeColors = {
|
||||
menuHover: "#60ac80",
|
||||
subMenuBg: "#000",
|
||||
subMenuActiveBg: "#60ac80",
|
||||
navTextColor: "#7a80b4",
|
||||
menuText: "#7a80b4",
|
||||
sidebarLogo: "#112f21",
|
||||
menuTitleHover: "#fff",
|
||||
@@ -111,7 +104,6 @@ const themeColors = {
|
||||
menuHover: "#d84493",
|
||||
subMenuBg: "#000",
|
||||
subMenuActiveBg: "#d84493",
|
||||
navTextColor: "#7a80b4",
|
||||
menuText: "#7a80b4",
|
||||
sidebarLogo: "#3f0d29",
|
||||
menuTitleHover: "#fff",
|
||||
@@ -124,7 +116,6 @@ const themeColors = {
|
||||
menuHover: "#693ac9",
|
||||
subMenuBg: "#000",
|
||||
subMenuActiveBg: "#693ac9",
|
||||
navTextColor: "#7a80b4",
|
||||
menuText: "#7a80b4",
|
||||
sidebarLogo: "#1f0c38",
|
||||
menuTitleHover: "#fff",
|
||||
@@ -147,7 +138,6 @@ export const genScssMultipleScopeVars = (): MultipleScopeVarsItem[] => {
|
||||
$menuHover: ${themeColors[key].menuHover} !default;
|
||||
$subMenuBg: ${themeColors[key].subMenuBg} !default;
|
||||
$subMenuActiveBg: ${themeColors[key].subMenuActiveBg} !default;
|
||||
$navTextColor: ${themeColors[key].navTextColor} !default;
|
||||
$menuText: ${themeColors[key].menuText} !default;
|
||||
$sidebarLogo: ${themeColors[key].sidebarLogo} !default;
|
||||
$menuTitleHover: ${themeColors[key].menuTitleHover} !default;
|
||||
|
||||
@@ -3,7 +3,7 @@ export const routerArrays: Array<RouteConfigs> = [
|
||||
path: "/welcome",
|
||||
parentPath: "/",
|
||||
meta: {
|
||||
title: "menus.hshome",
|
||||
title: "首页",
|
||||
icon: "home-filled"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,7 +2,6 @@ import App from "./App.vue";
|
||||
import router from "./router";
|
||||
import { setupStore } from "@/store";
|
||||
import ElementPlus from "element-plus";
|
||||
import { useI18n } from "@/plugins/i18n";
|
||||
import { getServerConfig } from "./config";
|
||||
import { createApp, Directive } from "vue";
|
||||
import { MotionPlugin } from "@vueuse/motion";
|
||||
@@ -19,9 +18,7 @@ import "./style/reset.scss";
|
||||
// 导入公共样式
|
||||
import "./style/index.scss";
|
||||
import "element-plus/dist/index.css";
|
||||
import "@pureadmin/components/dist/index.css";
|
||||
import "@pureadmin/components/dist/theme.css";
|
||||
import "@pureadmin/components/dist/dark.scss";
|
||||
|
||||
// 导入字体图标
|
||||
import "./assets/iconfont/iconfont.js";
|
||||
import "./assets/iconfont/iconfont.css";
|
||||
@@ -53,7 +50,7 @@ getServerConfig(app).then(async config => {
|
||||
await router.isReady();
|
||||
injectResponsiveStorage(app, config);
|
||||
setupStore(app);
|
||||
app.use(MotionPlugin).use(useI18n).use(ElementPlus);
|
||||
app.use(MotionPlugin).use(ElementPlus);
|
||||
// .use(useEcharts);
|
||||
// .use(Table);
|
||||
// .use(PureDescriptions);
|
||||
|
||||
@@ -1,74 +0,0 @@
|
||||
// 多组件库的国际化和本地项目国际化兼容
|
||||
import { App, WritableComputedRef } from "vue";
|
||||
import type { StorageConfigs } from "/#/index";
|
||||
import { storageLocal } from "@pureadmin/utils";
|
||||
import { type I18n, createI18n } from "vue-i18n";
|
||||
|
||||
// element-plus国际化
|
||||
import enLocale from "element-plus/lib/locale/lang/en";
|
||||
import zhLocale from "element-plus/lib/locale/lang/zh-cn";
|
||||
|
||||
function siphonI18n(prefix = "zh-CN") {
|
||||
return Object.fromEntries(
|
||||
Object.entries(
|
||||
import.meta.glob("../../locales/*.y(a)?ml", { eager: true })
|
||||
).map(([key, value]: any) => {
|
||||
const matched = key.match(/([A-Za-z0-9-_]+)\./i)[1];
|
||||
return [matched, value.default];
|
||||
})
|
||||
)[prefix];
|
||||
}
|
||||
|
||||
export const localesConfigs = {
|
||||
zh: {
|
||||
...siphonI18n("zh-CN"),
|
||||
...zhLocale
|
||||
},
|
||||
en: {
|
||||
...siphonI18n("en"),
|
||||
...enLocale
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 国际化转换工具函数（自动读取根目录locales文件夹下文件进行国际化匹配）
|
||||
* @param message message
|
||||
* @returns 转化后的message
|
||||
*/
|
||||
export function transformI18n(message: any = "") {
|
||||
if (!message) {
|
||||
return "";
|
||||
}
|
||||
|
||||
// 处理存储动态路由的title,格式 {zh:"",en:""}
|
||||
if (typeof message === "object") {
|
||||
const locale: string | WritableComputedRef<string> | any =
|
||||
i18n.global.locale;
|
||||
return message[locale?.value];
|
||||
}
|
||||
|
||||
const key = message.match(/(\S*)\./)?.[1];
|
||||
if (key && Object.keys(siphonI18n("zh-CN")).includes(key)) {
|
||||
return i18n.global.t.call(i18n.global.locale, message);
|
||||
} else if (!key && Object.keys(siphonI18n("zh-CN")).includes(message)) {
|
||||
// 兼容非嵌套形式的国际化写法
|
||||
return i18n.global.t.call(i18n.global.locale, message);
|
||||
} else {
|
||||
return message;
|
||||
}
|
||||
}
|
||||
|
||||
/** 此函数只是配合i18n Ally插件来进行国际化智能提示，并无实际意义（只对提示起作用），如果不需要国际化可删除 */
|
||||
export const $t = (key: string) => key;
|
||||
|
||||
export const i18n: I18n = createI18n({
|
||||
legacy: false,
|
||||
locale:
|
||||
storageLocal.getItem<StorageConfigs>("responsive-locale")?.locale ?? "zh",
|
||||
fallbackLocale: "en",
|
||||
messages: localesConfigs
|
||||
});
|
||||
|
||||
export function useI18n(app: App) {
|
||||
app.use(i18n);
|
||||
}
|
||||
@@ -1,11 +1,7 @@
|
||||
import "xe-utils";
|
||||
import "./index.scss";
|
||||
import XEUtils from "xe-utils";
|
||||
import { App, unref } from "vue";
|
||||
import { i18n } from "@/plugins/i18n";
|
||||
import { App } from "vue";
|
||||
import "font-awesome/css/font-awesome.min.css";
|
||||
import zh from "vxe-table/lib/locale/lang/zh-CN";
|
||||
import en from "vxe-table/lib/locale/lang/en-US";
|
||||
|
||||
import {
|
||||
// 核心
|
||||
@@ -60,18 +56,6 @@ VXETable.setup({
|
||||
},
|
||||
input: {
|
||||
clearable: true
|
||||
},
|
||||
i18n: (key, args) => {
|
||||
return unref(i18n.global.locale) === "zh"
|
||||
? XEUtils.toFormatString(XEUtils.get(zh, key), args)
|
||||
: XEUtils.toFormatString(XEUtils.get(en, key), args);
|
||||
},
|
||||
translate(key) {
|
||||
const NAMESPACED = ["el.", "buttons."];
|
||||
if (key && NAMESPACED.findIndex(v => key.includes(v)) !== -1) {
|
||||
return i18n.global.t.call(i18n.global.locale, key);
|
||||
}
|
||||
return key;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
// import "@/utils/sso";
|
||||
import { getConfig } from "@/config";
|
||||
import { toRouteType } from "./types";
|
||||
import NProgress from "@/utils/progress";
|
||||
import { findIndex } from "lodash-unified";
|
||||
import { transformI18n } from "@/plugins/i18n";
|
||||
import { sessionKey, type DataInfo } from "@/utils/auth";
|
||||
import { useMultiTagsStoreHook } from "@/store/modules/multiTags";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
@@ -22,19 +21,28 @@ import {
|
||||
formatTwoStageRoutes,
|
||||
formatFlatteningRoutes
|
||||
} from "./utils";
|
||||
import {
|
||||
buildHierarchyTree,
|
||||
openLink,
|
||||
isUrl,
|
||||
storageSession
|
||||
} from "@pureadmin/utils";
|
||||
import { buildHierarchyTree } from "@/utils/tree";
|
||||
import { isUrl, openLink, storageSession } from "@pureadmin/utils";
|
||||
|
||||
import homeRouter from "./modules/home";
|
||||
import errorRouter from "./modules/error";
|
||||
import remainingRouter from "./modules/remaining";
|
||||
|
||||
/** 自动导入全部静态路由，无需再手动引入！匹配 src/router/modules 目录（任何嵌套级别）中具有 .ts 扩展名的所有文件，除了 remaining.ts 文件
|
||||
* 如何匹配所有文件请看：https://github.com/mrmlnc/fast-glob#basic-syntax
|
||||
* 如何排除文件请看：https://cn.vitejs.dev/guide/features.html#negative-patterns
|
||||
*/
|
||||
const modules: Record<string, any> = import.meta.glob(
|
||||
["./modules/**/*.ts", "!./modules/**/remaining.ts"],
|
||||
{
|
||||
eager: true
|
||||
}
|
||||
);
|
||||
|
||||
/** 原始静态路由（未做任何处理） */
|
||||
const routes = [homeRouter, errorRouter];
|
||||
const routes = [];
|
||||
|
||||
Object.keys(modules).forEach(key => {
|
||||
routes.push(modules[key].default);
|
||||
});
|
||||
|
||||
/** 导出处理后的静态路由（三级及以上的路由全部拍成二级） */
|
||||
export const constantRoutes: Array<RouteRecordRaw> = formatTwoStageRoutes(
|
||||
@@ -104,11 +112,14 @@ router.beforeEach((to: toRouteType, _from, next) => {
|
||||
to.matched.some(item => {
|
||||
if (!item.meta.title) return "";
|
||||
const Title = getConfig().Title;
|
||||
if (Title)
|
||||
document.title = `${transformI18n(item.meta.title)} | ${Title}`;
|
||||
else document.title = transformI18n(item.meta.title);
|
||||
if (Title) document.title = `${item.meta.title} | ${Title}`;
|
||||
else document.title = item.meta.title as string;
|
||||
});
|
||||
}
|
||||
/** 如果已经登录并存在登录信息后不能跳转到路由白名单，而是继续保持在当前页面 */
|
||||
function toCorrectRoute() {
|
||||
whiteList.includes(to.fullPath) ? next(_from.fullPath) : next();
|
||||
}
|
||||
if (userInfo) {
|
||||
// 无权限跳转403页面
|
||||
if (to.meta?.roles && !isOneOfArray(to.meta?.roles, userInfo?.roles)) {
|
||||
@@ -120,7 +131,7 @@ router.beforeEach((to: toRouteType, _from, next) => {
|
||||
openLink(to?.name as string);
|
||||
NProgress.done();
|
||||
} else {
|
||||
next();
|
||||
toCorrectRoute();
|
||||
}
|
||||
} else {
|
||||
// 刷新
|
||||
@@ -150,7 +161,7 @@ router.beforeEach((to: toRouteType, _from, next) => {
|
||||
}
|
||||
router.push(to.fullPath);
|
||||
});
|
||||
next();
|
||||
toCorrectRoute();
|
||||
}
|
||||
} else {
|
||||
if (to.path !== "/login") {
|
||||
|
||||
@@ -1,12 +1,9 @@
|
||||
import { $t } from "@/plugins/i18n";
|
||||
import type { RouteConfigsTable } from "/#/index";
|
||||
|
||||
const errorRouter: RouteConfigsTable = {
|
||||
export default {
|
||||
path: "/error",
|
||||
redirect: "/error/403",
|
||||
meta: {
|
||||
icon: "information-line",
|
||||
title: $t("menus.hsabnormal"),
|
||||
title: "异常页面",
|
||||
rank: 9
|
||||
},
|
||||
children: [
|
||||
@@ -15,7 +12,7 @@ const errorRouter: RouteConfigsTable = {
|
||||
name: "403",
|
||||
component: () => import("@/views/error/403.vue"),
|
||||
meta: {
|
||||
title: $t("menus.hsfourZeroOne")
|
||||
title: "403"
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -23,7 +20,7 @@ const errorRouter: RouteConfigsTable = {
|
||||
name: "404",
|
||||
component: () => import("@/views/error/404.vue"),
|
||||
meta: {
|
||||
title: $t("menus.hsfourZeroFour")
|
||||
title: "404"
|
||||
}
|
||||
},
|
||||
{
|
||||
@@ -31,10 +28,8 @@ const errorRouter: RouteConfigsTable = {
|
||||
name: "500",
|
||||
component: () => import("@/views/error/500.vue"),
|
||||
meta: {
|
||||
title: $t("menus.hsFive")
|
||||
title: "500"
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export default errorRouter;
|
||||
} as RouteConfigsTable;
|
||||
|
||||
@@ -1,15 +1,13 @@
|
||||
import { $t } from "@/plugins/i18n";
|
||||
import type { RouteConfigsTable } from "/#/index";
|
||||
const Layout = () => import("@/layout/index.vue");
|
||||
|
||||
const homeRouter: RouteConfigsTable = {
|
||||
export default {
|
||||
path: "/",
|
||||
name: "Home",
|
||||
component: Layout,
|
||||
redirect: "/welcome",
|
||||
meta: {
|
||||
icon: "home-filled",
|
||||
title: $t("menus.hshome"),
|
||||
title: "首页",
|
||||
rank: 0
|
||||
},
|
||||
children: [
|
||||
@@ -18,10 +16,8 @@ const homeRouter: RouteConfigsTable = {
|
||||
name: "Welcome",
|
||||
component: () => import("@/views/welcome/index.vue"),
|
||||
meta: {
|
||||
title: $t("menus.hshome")
|
||||
title: "首页"
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
export default homeRouter;
|
||||
} as RouteConfigsTable;
|
||||
|
||||
@@ -1,14 +1,12 @@
|
||||
import { $t } from "@/plugins/i18n";
|
||||
import type { RouteConfigsTable } from "/#/index";
|
||||
const Layout = () => import("@/layout/index.vue");
|
||||
|
||||
const remainingRouter: Array<RouteConfigsTable> = [
|
||||
export default [
|
||||
{
|
||||
path: "/login",
|
||||
name: "Login",
|
||||
component: () => import("@/views/login/index.vue"),
|
||||
meta: {
|
||||
title: $t("menus.hslogin"),
|
||||
title: "登录",
|
||||
showLink: false,
|
||||
rank: 101
|
||||
}
|
||||
@@ -18,7 +16,7 @@ const remainingRouter: Array<RouteConfigsTable> = [
|
||||
component: Layout,
|
||||
meta: {
|
||||
icon: "home-filled",
|
||||
title: $t("menus.hshome"),
|
||||
title: "首页",
|
||||
showLink: false,
|
||||
rank: 104
|
||||
},
|
||||
@@ -30,6 +28,4 @@ const remainingRouter: Array<RouteConfigsTable> = [
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
export default remainingRouter;
|
||||
] as Array<RouteConfigsTable>;
|
||||
|
||||
@@ -1,9 +0,0 @@
|
||||
import { RouteLocationNormalized } from "vue-router";
|
||||
|
||||
export interface toRouteType extends RouteLocationNormalized {
|
||||
meta: {
|
||||
roles: Array<string>;
|
||||
keepAlive?: boolean;
|
||||
dynamicLevel?: string;
|
||||
};
|
||||
}
|
||||
@@ -14,9 +14,9 @@ import { RouteConfigs } from "@/layout/types";
|
||||
import {
|
||||
isString,
|
||||
storageSession,
|
||||
buildHierarchyTree,
|
||||
isIncludeAllChildren
|
||||
} from "@pureadmin/utils";
|
||||
import { buildHierarchyTree } from "@/utils/tree";
|
||||
import { cloneDeep, intersection } from "lodash-unified";
|
||||
import { sessionKey, type DataInfo } from "@/utils/auth";
|
||||
import { usePermissionStoreHook } from "@/store/modules/permission";
|
||||
@@ -76,7 +76,7 @@ function isOneOfArray(a: Array<string>, b: Array<string>) {
|
||||
/** 从sessionStorage里取出当前登陆用户的角色roles，过滤无权限的菜单 */
|
||||
function filterNoPermissionTree(data: RouteComponent[]) {
|
||||
const currentRoles =
|
||||
storageSession.getItem<DataInfo<number>>(sessionKey).roles ?? [];
|
||||
storageSession.getItem<DataInfo<number>>(sessionKey)?.roles ?? [];
|
||||
const newTree = cloneDeep(data).filter((v: any) =>
|
||||
isOneOfArray(v.meta?.roles, currentRoles)
|
||||
);
|
||||
|
||||
@@ -2,7 +2,6 @@ import { store } from "@/store";
|
||||
import { appType } from "./types";
|
||||
import { defineStore } from "pinia";
|
||||
import { getConfig } from "@/config";
|
||||
import type { StorageConfigs } from "/#/index";
|
||||
import { deviceDetection, storageLocal } from "@pureadmin/utils";
|
||||
|
||||
export const useAppStore = defineStore({
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import { store } from "@/store";
|
||||
import { defineStore } from "pinia";
|
||||
import { getConfig } from "@/config";
|
||||
import type { StorageConfigs } from "/#/index";
|
||||
import { storageLocal } from "@pureadmin/utils";
|
||||
|
||||
export const useEpThemeStore = defineStore({
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import { defineStore } from "pinia";
|
||||
import { store } from "@/store";
|
||||
import { isEqual } from "lodash-unified";
|
||||
import type { StorageConfigs } from "/#/index";
|
||||
import { isEqual } from "@pureadmin/utils";
|
||||
import { routerArrays } from "@/layout/types";
|
||||
import { multiType, positionType } from "./types";
|
||||
import { isUrl, storageLocal } from "@pureadmin/utils";
|
||||
@@ -11,11 +10,11 @@ export const useMultiTagsStore = defineStore({
|
||||
state: () => ({
|
||||
// 存储标签页信息（路由信息）
|
||||
multiTags: storageLocal.getItem<StorageConfigs>("responsive-configure")
|
||||
.multiTagsCache
|
||||
?.multiTagsCache
|
||||
? storageLocal.getItem<StorageConfigs>("responsive-tags")
|
||||
: [...routerArrays],
|
||||
multiTagsCache: storageLocal.getItem<StorageConfigs>("responsive-configure")
|
||||
.multiTagsCache
|
||||
?.multiTagsCache
|
||||
}),
|
||||
getters: {
|
||||
getMultiTagsCache() {
|
||||
|
||||
@@ -39,6 +39,4 @@ export type setType = {
|
||||
export type userType = {
|
||||
username?: string;
|
||||
roles?: Array<string>;
|
||||
verifyCode?: string;
|
||||
currentPage?: number;
|
||||
};
|
||||
|
||||
@@ -12,14 +12,11 @@ import { type DataInfo, setToken, removeToken, sessionKey } from "@/utils/auth";
|
||||
export const useUserStore = defineStore({
|
||||
id: "pure-user",
|
||||
state: (): userType => ({
|
||||
// 用户名
|
||||
username:
|
||||
storageSession.getItem<DataInfo<number>>(sessionKey)?.username ?? "",
|
||||
// 页面级别权限
|
||||
roles: storageSession.getItem<DataInfo<number>>(sessionKey)?.roles ?? [],
|
||||
// 前端生成的验证码（按实际需求替换）
|
||||
verifyCode: "",
|
||||
// 判断登录页面显示哪个组件（0：登录（默认）、1：手机登录、2：二维码登录、3：注册、4：忘记密码）
|
||||
currentPage: 0
|
||||
roles: storageSession.getItem<DataInfo<number>>(sessionKey)?.roles ?? []
|
||||
}),
|
||||
actions: {
|
||||
/** 存储用户名 */
|
||||
@@ -30,14 +27,6 @@ export const useUserStore = defineStore({
|
||||
SET_ROLES(roles: Array<string>) {
|
||||
this.roles = roles;
|
||||
},
|
||||
/** 存储前端生成的验证码 */
|
||||
SET_VERIFYCODE(verifyCode: string) {
|
||||
this.verifyCode = verifyCode;
|
||||
},
|
||||
/** 存储登录页面显示哪个组件 */
|
||||
SET_CURRENTPAGE(value: number) {
|
||||
this.currentPage = value;
|
||||
},
|
||||
/** 登入 */
|
||||
async loginByUsername(data) {
|
||||
return new Promise<UserResult>((resolve, reject) => {
|
||||
@@ -58,9 +47,9 @@ export const useUserStore = defineStore({
|
||||
this.username = "";
|
||||
this.roles = [];
|
||||
removeToken();
|
||||
router.push("/login");
|
||||
useMultiTagsStoreHook().handleTags("equal", [...routerArrays]);
|
||||
resetRouter();
|
||||
router.push("/login");
|
||||
},
|
||||
/** 刷新`token` */
|
||||
async handRefreshToken(data) {
|
||||
|
||||
@@ -26,11 +26,6 @@ html.dark {
|
||||
filter: invert(0.9) hue-rotate(180deg);
|
||||
}
|
||||
|
||||
.ant-tabs {
|
||||
background: var(--el-bg-color);
|
||||
color: $color-white;
|
||||
}
|
||||
|
||||
/* 标签页 */
|
||||
.tags-view {
|
||||
.arrow-left,
|
||||
@@ -127,7 +122,7 @@ html.dark {
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
|
||||
.vxe-button.type--button.size--medium:hover {
|
||||
.vxe-button.type--button:hover {
|
||||
background: var(--el-color-primary) !important;
|
||||
}
|
||||
|
||||
|
||||
@@ -20,7 +20,8 @@
|
||||
filter: invert(80%);
|
||||
}
|
||||
|
||||
/* 重置 vxe-table 中 pager 样式 */
|
||||
/* 重置 vxe-table 样式 */
|
||||
.vxe-button.type--button.theme--primary:hover,
|
||||
.vxe-pager .vxe-pager--num-btn:not(.is--disabled).is--active {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
@@ -44,16 +44,6 @@ abbr:where([title]) {
|
||||
text-decoration: underline dotted;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-size: inherit;
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
text-decoration: inherit;
|
||||
|
||||
@@ -68,10 +68,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.el-popper.is-light {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.sidebar-container {
|
||||
/* 展开动画 */
|
||||
transition: width var(--pure-transition-duration);
|
||||
@@ -233,11 +229,7 @@
|
||||
.search-container,
|
||||
/* 告警 */
|
||||
.dropdown-badge,
|
||||
/* 全屏 */
|
||||
.screen-full,
|
||||
/* 国际化 */
|
||||
.globalization,
|
||||
/* 登录名 */
|
||||
/* 用户名 */
|
||||
.el-dropdown-link,
|
||||
/* 设置 */
|
||||
.set-icon {
|
||||
@@ -251,15 +243,6 @@
|
||||
color: $subMenuActiveText;
|
||||
}
|
||||
|
||||
.globalization {
|
||||
width: 40px;
|
||||
height: 48px;
|
||||
padding: 11px;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
color: $subMenuActiveText;
|
||||
}
|
||||
|
||||
.el-dropdown-link {
|
||||
height: 48px;
|
||||
padding: 10px;
|
||||
@@ -587,11 +570,7 @@ body[layout="vertical"] {
|
||||
.search-container,
|
||||
/* 告警 */
|
||||
.dropdown-badge,
|
||||
/* 全屏 */
|
||||
.screen-full,
|
||||
/* 国际化 */
|
||||
.globalization,
|
||||
/* 登录名 */
|
||||
/* 用户名 */
|
||||
.el-dropdown-link,
|
||||
/* 设置 */
|
||||
.set-icon {
|
||||
|
||||
@@ -43,11 +43,10 @@
|
||||
|
||||
/**
|
||||
* @description 重置el-menu的展开收起动画时长
|
||||
* @see {@link https://github.com/element-plus/element-plus/issues/4509#issuecomment-980165001}
|
||||
*/
|
||||
.outer-most .el-collapse-transition-leave-active,
|
||||
.outer-most .el-collapse-transition-enter-active {
|
||||
transition: 0.12s all ease-in-out !important;
|
||||
transition: 0.2s all ease-in-out !important;
|
||||
}
|
||||
|
||||
.horizontal-collapse-transition {
|
||||
|
||||
@@ -1,5 +0,0 @@
|
||||
### 注意
|
||||
|
||||
- [文档](https://pure-admin-utils-docs.vercel.app/)
|
||||
- [npm](https://www.npmjs.com/package/@pureadmin/utils)
|
||||
- vue-pure-admin 从 3.3.0 版本之后（不包括 3.3.0 版本），大部分工具和 hooks 都集成到了[@pureadmin/utils](https://pure-admin-utils-docs.vercel.app/)
|
||||
@@ -35,7 +35,7 @@ export function getToken(): DataInfo<number> {
|
||||
export function setToken(data: DataInfo<Date>) {
|
||||
let expires = 0;
|
||||
const { accessToken, refreshToken } = data;
|
||||
expires = new Date(data.expires).getTime();
|
||||
expires = new Date(data.expires).getTime(); // 如果后端直接设置时间戳，将此处代码改为expires = data.expires，然后把上面的DataInfo<Date>改成DataInfo<number>即可
|
||||
const cookieString = JSON.stringify({ accessToken, expires });
|
||||
|
||||
expires > 0
|
||||
@@ -59,8 +59,10 @@ export function setToken(data: DataInfo<Date>) {
|
||||
const { username, roles } = data;
|
||||
setSessionKey(username, roles);
|
||||
} else {
|
||||
const { username, roles } =
|
||||
storageSession.getItem<DataInfo<number>>(sessionKey);
|
||||
const username =
|
||||
storageSession.getItem<DataInfo<number>>(sessionKey)?.username ?? "";
|
||||
const roles =
|
||||
storageSession.getItem<DataInfo<number>>(sessionKey)?.roles ?? [];
|
||||
setSessionKey(username, roles);
|
||||
}
|
||||
}
|
||||
@@ -70,3 +72,8 @@ export function removeToken() {
|
||||
Cookies.remove(TokenKey);
|
||||
sessionStorage.removeItem(sessionKey);
|
||||
}
|
||||
|
||||
/** 格式化token（jwt格式） */
|
||||
export const formatToken = (token: string): string => {
|
||||
return "Bearer " + token;
|
||||
};
|
||||
|
||||
7
src/utils/globalPolyfills.ts
Normal file
7
src/utils/globalPolyfills.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
// 如果项目出现 `global is not defined` 报错，可能是您引入某个库的问题，比如 aws-sdk-js https://github.com/aws/aws-sdk-js
|
||||
// 解决办法就是将该文件引入 src/main.ts 即可 import "@/utils/globalPolyfills";
|
||||
if (typeof (window as any).global === "undefined") {
|
||||
(window as any).global = window;
|
||||
}
|
||||
|
||||
export {};
|
||||
@@ -1,25 +0,0 @@
|
||||
## 用法
|
||||
|
||||
### Get 请求
|
||||
|
||||
```
|
||||
import { http } from "@/utils/http";
|
||||
|
||||
// params传参
|
||||
http.request('get', '/xxx', { params: param });
|
||||
|
||||
// url拼接传参
|
||||
http.request('get', '/xxx?message=' + msg);
|
||||
```
|
||||
|
||||
### Post 请求
|
||||
|
||||
```
|
||||
import { http } from "@/utils/http";
|
||||
|
||||
// params传参
|
||||
http.request('post', '/xxx', { params: param });
|
||||
|
||||
// data传参
|
||||
http.request('post', '/xxx', { data: param });
|
||||
```
|
||||
@@ -11,21 +11,12 @@ import {
|
||||
} from "./types.d";
|
||||
import { stringify } from "qs";
|
||||
import NProgress from "../progress";
|
||||
// import { loadEnv } from "@build/index";
|
||||
import { getToken } from "@/utils/auth";
|
||||
import { getToken, formatToken } from "@/utils/auth";
|
||||
import { useUserStoreHook } from "@/store/modules/user";
|
||||
|
||||
// 加载环境变量 VITE_PROXY_DOMAIN（开发环境） VITE_PROXY_DOMAIN_REAL（打包后的线上环境）
|
||||
// const { VITE_PROXY_DOMAIN, VITE_PROXY_DOMAIN_REAL } = loadEnv();
|
||||
|
||||
// 相关配置请参考：www.axios-js.com/zh-cn/docs/#axios-request-config-1
|
||||
const defaultConfig: AxiosRequestConfig = {
|
||||
// baseURL:
|
||||
// process.env.NODE_ENV === "production"
|
||||
// ? VITE_PROXY_DOMAIN_REAL
|
||||
// : VITE_PROXY_DOMAIN,
|
||||
// 当前使用mock模拟请求，将baseURL制空，如果你的环境用到了http请求，请删除下面的baseURL启用上面的baseURL，并将第14行、19行代码注释取消
|
||||
baseURL: "",
|
||||
// 请求超时时间
|
||||
timeout: 10000,
|
||||
headers: {
|
||||
Accept: "application/json, text/plain, */*",
|
||||
@@ -43,27 +34,43 @@ class PureHttp {
|
||||
this.httpInterceptorsRequest();
|
||||
this.httpInterceptorsResponse();
|
||||
}
|
||||
|
||||
/** token过期后，暂存待执行的请求 */
|
||||
private static requests = [];
|
||||
|
||||
/** 防止重复刷新token */
|
||||
private static isRefreshing = false;
|
||||
|
||||
/** 初始化配置对象 */
|
||||
private static initConfig: PureHttpRequestConfig = {};
|
||||
|
||||
/** 保存当前Axios实例对象 */
|
||||
private static axiosInstance: AxiosInstance = Axios.create(defaultConfig);
|
||||
|
||||
/** 重连原始请求 */
|
||||
private static retryOriginalRequest(config: PureHttpRequestConfig) {
|
||||
return new Promise(resolve => {
|
||||
PureHttp.requests.push((token: string) => {
|
||||
config.headers["Authorization"] = formatToken(token);
|
||||
resolve(config);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/** 请求拦截 */
|
||||
private httpInterceptorsRequest(): void {
|
||||
PureHttp.axiosInstance.interceptors.request.use(
|
||||
async (config: PureHttpRequestConfig) => {
|
||||
const $config = config;
|
||||
// 开启进度条动画
|
||||
NProgress.start();
|
||||
// 优先判断post/get等方法是否传入回掉，否则执行初始化设置等回掉
|
||||
if (typeof config.beforeRequestCallback === "function") {
|
||||
config.beforeRequestCallback($config);
|
||||
return $config;
|
||||
config.beforeRequestCallback(config);
|
||||
return config;
|
||||
}
|
||||
if (PureHttp.initConfig.beforeRequestCallback) {
|
||||
PureHttp.initConfig.beforeRequestCallback($config);
|
||||
return $config;
|
||||
PureHttp.initConfig.beforeRequestCallback(config);
|
||||
return config;
|
||||
}
|
||||
/** 请求白名单，放置一些不需要token的接口（通过设置请求白名单，防止token过期后再请求造成的死循环问题） */
|
||||
const whiteList = ["/refreshToken", "/login"];
|
||||
@@ -75,21 +82,30 @@ class PureHttp {
|
||||
const now = new Date().getTime();
|
||||
const expired = parseInt(data.expires) - now <= 0;
|
||||
if (expired) {
|
||||
if (!PureHttp.isRefreshing) {
|
||||
PureHttp.isRefreshing = true;
|
||||
// token过期刷新
|
||||
useUserStoreHook()
|
||||
.handRefreshToken({ refreshToken: data.refreshToken })
|
||||
.then(res => {
|
||||
config.headers["Authorization"] =
|
||||
"Bearer " + res.data.accessToken;
|
||||
resolve($config);
|
||||
const token = res.data.accessToken;
|
||||
config.headers["Authorization"] = formatToken(token);
|
||||
PureHttp.requests.forEach(cb => cb(token));
|
||||
PureHttp.requests = [];
|
||||
})
|
||||
.finally(() => {
|
||||
PureHttp.isRefreshing = false;
|
||||
});
|
||||
}
|
||||
resolve(PureHttp.retryOriginalRequest(config));
|
||||
} else {
|
||||
config.headers["Authorization"] =
|
||||
"Bearer " + data.accessToken;
|
||||
resolve($config);
|
||||
config.headers["Authorization"] = formatToken(
|
||||
data.accessToken
|
||||
);
|
||||
resolve(config);
|
||||
}
|
||||
} else {
|
||||
resolve($config);
|
||||
resolve(config);
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
33
src/utils/message.ts
Normal file
33
src/utils/message.ts
Normal file
@@ -0,0 +1,33 @@
|
||||
import { type MessageHandler, ElMessage } from "element-plus";
|
||||
|
||||
// 更多配置请看：https://element-plus.org/zh-CN/component/message.html#message-%E9%85%8D%E7%BD%AE%E9%A1%B9
|
||||
|
||||
type messageTypes = "success" | "info" | "warning" | "error";
|
||||
|
||||
/**
|
||||
* `element-plus` 的 `info` 消息类型
|
||||
*/
|
||||
const message = (
|
||||
message: string,
|
||||
type = "info" as messageTypes,
|
||||
showClose = true,
|
||||
duration = 2000,
|
||||
center = false,
|
||||
grouping = false
|
||||
): MessageHandler => {
|
||||
return ElMessage({
|
||||
message,
|
||||
type,
|
||||
showClose,
|
||||
duration,
|
||||
center,
|
||||
grouping
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 关闭 `element-plus` 的所有消息实例
|
||||
*/
|
||||
const closeAllMessage = (): void => ElMessage.closeAll();
|
||||
|
||||
export { message, closeAllMessage };
|
||||
@@ -8,10 +8,6 @@ const nameSpace = "responsive-";
|
||||
export const injectResponsiveStorage = (app: App, config: ServerConfigs) => {
|
||||
const configObj = Object.assign(
|
||||
{
|
||||
// 国际化 默认中文zh
|
||||
locale: Storage.getData("locale", nameSpace) ?? {
|
||||
locale: config.Locale ?? "zh"
|
||||
},
|
||||
// layout模式以及主题
|
||||
layout: Storage.getData("layout", nameSpace) ?? {
|
||||
layout: config.Layout ?? "vertical",
|
||||
|
||||
59
src/utils/sso.ts
Normal file
59
src/utils/sso.ts
Normal file
@@ -0,0 +1,59 @@
|
||||
import { removeToken, setToken, type DataInfo } from "./auth";
|
||||
import { subBefore, getQueryMap } from "@pureadmin/utils";
|
||||
|
||||
/**
|
||||
* 简版前端单点登录，根据实际业务自行编写
|
||||
* 划重点：
|
||||
* 判断是否为单点登录，不为则直接返回不再进行任何逻辑处理，下面是单点登录后的逻辑处理
|
||||
* 1.清空本地旧信息；
|
||||
* 2.获取url中的重要参数信息，然后通过 setToken 保存在本地；
|
||||
* 3.删除不需要显示在 url 的参数
|
||||
* 4.使用 window.location.replace 跳转正确页面
|
||||
*/
|
||||
(function () {
|
||||
// 获取 url 中的参数
|
||||
const params = getQueryMap(location.href) as DataInfo<Date>;
|
||||
const must = ["username", "roles", "accessToken"];
|
||||
const mustLength = must.length;
|
||||
if (Object.keys(params).length !== mustLength) return;
|
||||
|
||||
// url 参数满足 must 里的全部值，才判定为单点登录，避免非单点登录时刷新页面无限循环
|
||||
let sso = [];
|
||||
let start = 0;
|
||||
|
||||
while (start < mustLength) {
|
||||
if (Object.keys(params).includes(must[start]) && sso.length <= mustLength) {
|
||||
sso.push(must[start]);
|
||||
} else {
|
||||
sso = [];
|
||||
}
|
||||
start++;
|
||||
}
|
||||
|
||||
if (sso.length === mustLength) {
|
||||
// 判定为单点登录
|
||||
|
||||
// 清空本地旧信息
|
||||
removeToken();
|
||||
|
||||
// 保存新信息到本地
|
||||
setToken(params);
|
||||
|
||||
// 删除不需要显示在 url 的参数
|
||||
delete params["roles"];
|
||||
delete params["accessToken"];
|
||||
|
||||
const newUrl = `${location.origin}${location.pathname}${subBefore(
|
||||
location.hash,
|
||||
"?"
|
||||
)}?${JSON.stringify(params)
|
||||
.replace(/["{}]/g, "")
|
||||
.replace(/:/g, "=")
|
||||
.replace(/,/g, "&")}`;
|
||||
|
||||
// 替换历史记录项
|
||||
window.location.replace(newUrl);
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
})();
|
||||
188
src/utils/tree.ts
Normal file
188
src/utils/tree.ts
Normal file
@@ -0,0 +1,188 @@
|
||||
/**
|
||||
* @description 提取菜单树中的每一项uniqueId
|
||||
* @param tree 树
|
||||
* @returns 每一项uniqueId组成的数组
|
||||
*/
|
||||
export const extractPathList = (tree: any[]): any => {
|
||||
if (!Array.isArray(tree)) {
|
||||
console.warn("tree must be an array");
|
||||
return [];
|
||||
}
|
||||
if (!tree || tree.length === 0) return [];
|
||||
const expandedPaths: Array<number | string> = [];
|
||||
for (const node of tree) {
|
||||
const hasChildren = node.children && node.children.length > 0;
|
||||
if (hasChildren) {
|
||||
extractPathList(node.children);
|
||||
}
|
||||
expandedPaths.push(node.uniqueId);
|
||||
}
|
||||
return expandedPaths;
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 如果父级下children的length为1，删除children并自动组建唯一uniqueId
|
||||
* @param tree 树
|
||||
* @param pathList 每一项的id组成的数组
|
||||
* @returns 组件唯一uniqueId后的树
|
||||
*/
|
||||
export const deleteChildren = (tree: any[], pathList = []): any => {
|
||||
if (!Array.isArray(tree)) {
|
||||
console.warn("menuTree must be an array");
|
||||
return [];
|
||||
}
|
||||
if (!tree || tree.length === 0) return [];
|
||||
for (const [key, node] of tree.entries()) {
|
||||
if (node.children && node.children.length === 1) delete node.children;
|
||||
node.id = key;
|
||||
node.parentId = pathList.length ? pathList[pathList.length - 1] : null;
|
||||
node.pathList = [...pathList, node.id];
|
||||
node.uniqueId =
|
||||
node.pathList.length > 1 ? node.pathList.join("-") : node.pathList[0];
|
||||
const hasChildren = node.children && node.children.length > 0;
|
||||
if (hasChildren) {
|
||||
deleteChildren(node.children, node.pathList);
|
||||
}
|
||||
}
|
||||
return tree;
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 创建层级关系
|
||||
* @param tree 树
|
||||
* @param pathList 每一项的id组成的数组
|
||||
* @returns 创建层级关系后的树
|
||||
*/
|
||||
export const buildHierarchyTree = (tree: any[], pathList = []): any => {
|
||||
if (!Array.isArray(tree)) {
|
||||
console.warn("tree must be an array");
|
||||
return [];
|
||||
}
|
||||
if (!tree || tree.length === 0) return [];
|
||||
for (const [key, node] of tree.entries()) {
|
||||
node.id = key;
|
||||
node.parentId = pathList.length ? pathList[pathList.length - 1] : null;
|
||||
node.pathList = [...pathList, node.id];
|
||||
const hasChildren = node.children && node.children.length > 0;
|
||||
if (hasChildren) {
|
||||
buildHierarchyTree(node.children, node.pathList);
|
||||
}
|
||||
}
|
||||
return tree;
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 广度优先遍历，根据唯一uniqueId找当前节点信息
|
||||
* @param tree 树
|
||||
* @param uniqueId 唯一uniqueId
|
||||
* @returns 当前节点信息
|
||||
*/
|
||||
export const getNodeByUniqueId = (
|
||||
tree: any[],
|
||||
uniqueId: number | string
|
||||
): any => {
|
||||
if (!Array.isArray(tree)) {
|
||||
console.warn("menuTree must be an array");
|
||||
return [];
|
||||
}
|
||||
if (!tree || tree.length === 0) return [];
|
||||
const item = tree.find(node => node.uniqueId === uniqueId);
|
||||
if (item) return item;
|
||||
const childrenList = tree
|
||||
.filter(node => node.children)
|
||||
.map(i => i.children)
|
||||
.flat(1) as unknown;
|
||||
return getNodeByUniqueId(childrenList as any[], uniqueId);
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 向当前唯一uniqueId节点中追加字段
|
||||
* @param tree 树
|
||||
* @param uniqueId 唯一uniqueId
|
||||
* @param fields 需要追加的字段
|
||||
* @returns 追加字段后的树
|
||||
*/
|
||||
export const appendFieldByUniqueId = (
|
||||
tree: any[],
|
||||
uniqueId: number | string,
|
||||
fields: object
|
||||
): any => {
|
||||
if (!Array.isArray(tree)) {
|
||||
console.warn("menuTree must be an array");
|
||||
return [];
|
||||
}
|
||||
if (!tree || tree.length === 0) return [];
|
||||
for (const node of tree) {
|
||||
const hasChildren = node.children && node.children.length > 0;
|
||||
if (
|
||||
node.uniqueId === uniqueId &&
|
||||
Object.prototype.toString.call(fields) === "[object Object]"
|
||||
)
|
||||
Object.assign(node, fields);
|
||||
if (hasChildren) {
|
||||
appendFieldByUniqueId(node.children, uniqueId, fields);
|
||||
}
|
||||
}
|
||||
return tree;
|
||||
};
|
||||
|
||||
/**
|
||||
* @description 构造树型结构数据
|
||||
* @param data 数据源
|
||||
* @param id id字段 默认id
|
||||
* @param parentId 父节点字段，默认parentId
|
||||
* @param children 子节点字段，默认children
|
||||
* @returns 追加字段后的树
|
||||
*/
|
||||
export const handleTree = (
|
||||
data: any[],
|
||||
id?: string,
|
||||
parentId?: string,
|
||||
children?: string
|
||||
): any => {
|
||||
if (!Array.isArray(data)) {
|
||||
console.warn("data must be an array");
|
||||
return [];
|
||||
}
|
||||
const config = {
|
||||
id: id || "id",
|
||||
parentId: parentId || "parentId",
|
||||
childrenList: children || "children"
|
||||
};
|
||||
|
||||
const childrenListMap: any = {};
|
||||
const nodeIds: any = {};
|
||||
const tree = [];
|
||||
|
||||
for (const d of data) {
|
||||
const parentId = d[config.parentId];
|
||||
if (childrenListMap[parentId] == null) {
|
||||
childrenListMap[parentId] = [];
|
||||
}
|
||||
nodeIds[d[config.id]] = d;
|
||||
childrenListMap[parentId].push(d);
|
||||
}
|
||||
|
||||
for (const d of data) {
|
||||
const parentId = d[config.parentId];
|
||||
if (nodeIds[parentId] == null) {
|
||||
tree.push(d);
|
||||
}
|
||||
}
|
||||
|
||||
for (const t of tree) {
|
||||
adaptToChildrenList(t);
|
||||
}
|
||||
|
||||
function adaptToChildrenList(o: Record<string, any>) {
|
||||
if (childrenListMap[o[config.id]] !== null) {
|
||||
o[config.childrenList] = childrenListMap[o[config.id]];
|
||||
}
|
||||
if (o[config.childrenList]) {
|
||||
for (const c of o[config.childrenList]) {
|
||||
adaptToChildrenList(c);
|
||||
}
|
||||
}
|
||||
}
|
||||
return tree;
|
||||
};
|
||||
@@ -1,24 +1,20 @@
|
||||
<script setup lang="ts">
|
||||
import { useI18n } from "vue-i18n";
|
||||
import Motion from "./utils/motion";
|
||||
import { useRouter } from "vue-router";
|
||||
import { message } from "@/utils/message";
|
||||
import { loginRules } from "./utils/rule";
|
||||
import { initRouter } from "@/router/utils";
|
||||
import { useNav } from "@/layout/hooks/useNav";
|
||||
import { message } from "@pureadmin/components";
|
||||
import type { FormInstance } from "element-plus";
|
||||
import { $t, transformI18n } from "@/plugins/i18n";
|
||||
import { useLayout } from "@/layout/hooks/useLayout";
|
||||
import { useUserStoreHook } from "@/store/modules/user";
|
||||
import { bg, avatar, illustration } from "./utils/static";
|
||||
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
||||
import { ref, reactive, toRaw, onMounted, onBeforeUnmount } from "vue";
|
||||
import { useTranslationLang } from "@/layout/hooks/useTranslationLang";
|
||||
import { useDataThemeChange } from "@/layout/hooks/useDataThemeChange";
|
||||
|
||||
import dayIcon from "@/assets/svg/day.svg?component";
|
||||
import darkIcon from "@/assets/svg/dark.svg?component";
|
||||
import globalization from "@/assets/svg/globalization.svg?component";
|
||||
|
||||
defineOptions({
|
||||
name: "Login"
|
||||
@@ -30,11 +26,9 @@ const ruleFormRef = ref<FormInstance>();
|
||||
const { initStorage } = useLayout();
|
||||
initStorage();
|
||||
|
||||
const { t } = useI18n();
|
||||
const { dataTheme, dataThemeChange } = useDataThemeChange();
|
||||
dataThemeChange();
|
||||
const { title, getDropdownItemStyle, getDropdownItemClass } = useNav();
|
||||
const { locale, translationCh, translationEn } = useTranslationLang();
|
||||
const { title } = useNav();
|
||||
|
||||
const ruleForm = reactive({
|
||||
username: "admin",
|
||||
@@ -47,13 +41,13 @@ const onLogin = async (formEl: FormInstance | undefined) => {
|
||||
await formEl.validate((valid, fields) => {
|
||||
if (valid) {
|
||||
useUserStoreHook()
|
||||
.loginByUsername({ username: ruleForm.username })
|
||||
.loginByUsername({ username: ruleForm.username, password: "admin123" })
|
||||
.then(res => {
|
||||
if (res.success) {
|
||||
// 获取后端路由
|
||||
initRouter().then(() => {
|
||||
message.success("登录成功");
|
||||
router.push("/");
|
||||
message("登录成功", "success");
|
||||
});
|
||||
}
|
||||
});
|
||||
@@ -92,38 +86,6 @@ onBeforeUnmount(() => {
|
||||
:inactive-icon="darkIcon"
|
||||
@change="dataThemeChange"
|
||||
/>
|
||||
<!-- 国际化 -->
|
||||
<el-dropdown trigger="click">
|
||||
<globalization
|
||||
class="hover:text-primary hover:!bg-[transparent] w-[20px] h-[20px] ml-1.5 cursor-pointer outline-none duration-300"
|
||||
/>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu class="translation">
|
||||
<el-dropdown-item
|
||||
:style="getDropdownItemStyle(locale, 'zh')"
|
||||
:class="['dark:!text-white', getDropdownItemClass(locale, 'zh')]"
|
||||
@click="translationCh"
|
||||
>
|
||||
<IconifyIconOffline
|
||||
class="check-zh"
|
||||
v-show="locale === 'zh'"
|
||||
icon="check"
|
||||
/>
|
||||
简体中文
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item
|
||||
:style="getDropdownItemStyle(locale, 'en')"
|
||||
:class="['dark:!text-white', getDropdownItemClass(locale, 'en')]"
|
||||
@click="translationEn"
|
||||
>
|
||||
<span class="check-en" v-show="locale === 'en'">
|
||||
<IconifyIconOffline icon="check" />
|
||||
</span>
|
||||
English
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
<div class="login-container">
|
||||
<div class="img">
|
||||
@@ -147,7 +109,7 @@ onBeforeUnmount(() => {
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: transformI18n($t('login.usernameReg')),
|
||||
message: '请输入账号',
|
||||
trigger: 'blur'
|
||||
}
|
||||
]"
|
||||
@@ -156,7 +118,7 @@ onBeforeUnmount(() => {
|
||||
<el-input
|
||||
clearable
|
||||
v-model="ruleForm.username"
|
||||
:placeholder="t('login.username')"
|
||||
placeholder="账号"
|
||||
:prefix-icon="useRenderIcon('user')"
|
||||
/>
|
||||
</el-form-item>
|
||||
@@ -168,7 +130,7 @@ onBeforeUnmount(() => {
|
||||
clearable
|
||||
show-password
|
||||
v-model="ruleForm.password"
|
||||
:placeholder="t('login.password')"
|
||||
placeholder="密码"
|
||||
:prefix-icon="useRenderIcon('lock')"
|
||||
/>
|
||||
</el-form-item>
|
||||
@@ -182,7 +144,7 @@ onBeforeUnmount(() => {
|
||||
:loading="loading"
|
||||
@click="onLogin(ruleFormRef)"
|
||||
>
|
||||
{{ t("login.login") }}
|
||||
登录
|
||||
</el-button>
|
||||
</Motion>
|
||||
</el-form>
|
||||
@@ -200,20 +162,4 @@ onBeforeUnmount(() => {
|
||||
:deep(.el-input-group__append, .el-input-group__prepend) {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.translation {
|
||||
::v-deep(.el-dropdown-menu__item) {
|
||||
padding: 5px 40px;
|
||||
}
|
||||
|
||||
.check-zh {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.check-en {
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import { reactive } from "vue";
|
||||
import type { FormRules } from "element-plus";
|
||||
import { $t, transformI18n } from "@/plugins/i18n";
|
||||
|
||||
/** 密码正则（密码格式应为8-18位数字、字母、符号的任意两种组合） */
|
||||
export const REGEXP_PWD =
|
||||
@@ -12,9 +11,11 @@ const loginRules = reactive(<FormRules>{
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (value === "") {
|
||||
callback(new Error(transformI18n($t("login.passwordReg"))));
|
||||
callback(new Error("请输入密码"));
|
||||
} else if (!REGEXP_PWD.test(value)) {
|
||||
callback(new Error(transformI18n($t("login.passwordRuleReg"))));
|
||||
callback(
|
||||
new Error("密码格式应为8-18位数字、字母、符号的任意两种组合")
|
||||
);
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
|
||||
@@ -6,7 +6,7 @@ defineOptions({
|
||||
name: "PermissionButton"
|
||||
});
|
||||
|
||||
let elStyle = computed((): CSSProperties => {
|
||||
const elStyle = computed((): CSSProperties => {
|
||||
return {
|
||||
width: "85vw",
|
||||
justifyContent: "start"
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user