Compare commits

..

16 Commits

Author SHA1 Message Date
xiaoxian521
88bba7555b release: update 3.4.6 2022-08-23 10:31:44 +08:00
xiaoxian521
30c682bd24 fix: 修复iframe加载失败 2022-08-23 10:24:40 +08:00
SampsonYe(叶飞)
3baffa11e4 fix: 修复动态路由子级长度为0时抛出异常 (#333) 2022-08-23 10:10:49 +08:00
xiaoxian521
1ed598c5f2 fix: process is not defined in path 2022-08-23 09:55:23 +08:00
xiaoxian521
185d779c8d release: update 3.4.5 2022-08-22 20:21:53 +08:00
xiaoxian521
241fc618b8 fix: 修复本地响应式存储对象设置问题 2022-08-22 20:17:50 +08:00
xiaoxian521
3a0b2e04d4 release: update 3.4.0 2022-08-22 17:21:18 +08:00
xiaoxian521
cec867297d chore: update 2022-08-22 16:16:17 +08:00
RealityBoy
cbe539c727 Refactor/tags (#332)
* refactor: tags

* chore: update

* chore: update

* chore: update

* chore: update
2022-08-22 15:49:29 +08:00
xiaoxian521
7c84d9eb70 perf: router 2022-08-22 10:19:10 +08:00
xiaoxian521
5a7187d22f perf: 移动端优化 2022-08-21 10:49:27 +08:00
xiaoxian521
a7e8249ae6 chore: update 2022-08-21 10:26:09 +08:00
xiaoxian521
d81ab81fb0 chore: update 2022-08-21 07:31:59 +08:00
xiaoxian521
846e7350fb chore: update 2022-08-19 23:01:45 +08:00
xiaoxian521
102f27fe30 chore: update element-plus@2.2.14 and perf menu 2022-08-19 21:41:49 +08:00
newives
0e76bd4aac perf: 清空缓存并返回登录页时添加重置路由 (#329)
Co-authored-by: xiaoxian521 <1923740402@qq.com>
2022-08-19 15:56:39 +08:00
43 changed files with 742 additions and 664 deletions

View File

@@ -1,3 +1,25 @@
# 3.4.6 (2022-8-23)
### 🐞 Bug fixes
- `process` is not defined in path
- Fixed an error when dynamic routing `children` is an empty array
- Fixed `iframe` loading failure
# 3.4.5 (2022-8-22)
### 🐞 Bug fixes
- Fix local responsive storage object setting issue
# 3.4.0 (2022-8-22)
### 🍏 Perf
- Optimized routing
- Optimized for mobile compatibility
- Optimized routing parameters (`query`, `params` way to refresh the page does not need to open the tab page cache, the parameters can be retained on the `url` and `tab page`)
# 3.3.5 (2022-8-19)
### 🎫 Feat

View File

@@ -1,3 +1,25 @@
# 3.4.6 (2022-8-23)
### 🐞 Bug fixes
- `process` is not defined in path
- Fixed an error when dynamic routing `children` is an empty array
- Fixed `iframe` loading failure
# 3.4.5 (2022-8-22)
### 🐞 Bug fixes
- Fix local responsive storage object setting issue
# 3.4.0 (2022-8-22)
### 🍏 Perf
- Optimized routing
- Optimized for mobile compatibility
- Optimized routing parameters (`query`, `params` way to refresh the page does not need to open the tab page cache, the parameters can be retained on the `url` and `tab page`)
# 3.3.5 (2022-8-19)
### 🎫 Feat

View File

@@ -1,3 +1,25 @@
# 3.4.6 (2022-8-23)
### 🐞 Bug fixes
- `process` is not defined in path
- 修复动态路由`children`为空数组时报错
- 修复`iframe`加载失败
# 3.4.5 (2022-8-22)
### 🐞 Bug fixes
- 修复本地响应式存储对象设置问题
# 3.4.0 (2022-8-22)
### 🍏 Perf
- 优化路由
- 优化移动端兼容性
- 优化路由传参(`query``params` 方式刷新页面不需要再开启标签页缓存也能保留参数在`url``标签页`上)
# 3.3.5 (2022-8-19)
### 🎫 Feat

View File

@@ -2,12 +2,14 @@
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="renderer" content="webkit" />
<meta
name="viewport"
content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
/>
<title>vue-pure-admin</title>
<script>
window.process = {};
</script>
<link rel="icon" href="/favicon.ico" />
</head>
<body>

View File

@@ -4,8 +4,6 @@ import { MockMethod } from "vite-plugin-mock";
// http://mockjs.com/examples.html#Object
const systemRouter = {
path: "/system",
name: "User",
redirect: "/system/user/index",
meta: {
icon: "setting",
title: "menus.hssysManagement",
@@ -51,8 +49,6 @@ const systemRouter = {
const permissionRouter = {
path: "/permission",
redirect: "/permission/page/index",
name: "PermissionPage",
meta: {
title: "menus.permission",
icon: "lollipop",
@@ -79,8 +75,6 @@ const permissionRouter = {
const frameRouter = {
path: "/iframe",
name: "FramePure",
redirect: "/iframe/pure",
meta: {
icon: "monitor",
title: "menus.hsExternalPage",
@@ -115,8 +109,6 @@ const frameRouter = {
const tabsRouter = {
path: "/tabs",
redirect: "/tabs/index",
name: "Tabs",
meta: {
icon: "IF-team-icontabs",
title: "menus.hstabs",
@@ -131,13 +123,19 @@ const tabsRouter = {
}
},
{
path: "/tabs/detail",
name: "TabDetail",
path: "/tabs/query-detail",
name: "TabQueryDetail",
meta: {
title: "",
showLink: false,
dynamicLevel: 3,
refreshRedirect: "/tabs/index"
// 不在menu菜单中显示
showLink: false
}
},
{
path: "/tabs/params-detail/:id",
component: "params-detail",
name: "TabParamsDetail",
meta: {
showLink: false
}
}
]

View File

@@ -1,6 +1,6 @@
{
"name": "vue-pure-admin",
"version": "3.3.5",
"version": "3.4.6",
"private": true,
"scripts": {
"dev": "cross-env --max_old_space_size=4096 vite",
@@ -49,7 +49,7 @@
"dayjs": "^1.11.4",
"driver.js": "^0.9.8",
"echarts": "^5.3.3",
"element-plus": "^2.2.13",
"element-plus": "^2.2.14",
"element-resize-detector": "^1.2.3",
"js-cookie": "^3.0.1",
"jsbarcode": "^3.11.5",
@@ -143,9 +143,9 @@
"stylelint-config-standard": "^24.0.0",
"stylelint-order": "^5.0.0",
"typescript": "^4.7.4",
"unocss": "^0.45.8",
"unocss": "^0.45.9",
"unplugin-vue-define-options": "^0.7.3",
"vite": "^3.0.8",
"vite": "^3.0.9",
"vite-plugin-mock": "^2.9.6",
"vite-plugin-remove-console": "^1.1.0",
"vite-svg-loader": "^3.4.0",

232
pnpm-lock.yaml generated
View File

@@ -57,7 +57,7 @@ specifiers:
dayjs: ^1.11.4
driver.js: ^0.9.8
echarts: ^5.3.3
element-plus: ^2.2.13
element-plus: ^2.2.14
element-resize-detector: ^1.2.3
eslint: ^8.8.0
eslint-plugin-prettier: ^4.0.0
@@ -100,10 +100,10 @@ specifiers:
stylelint-order: ^5.0.0
swiper: ^8.3.2
typescript: ^4.7.4
unocss: ^0.45.8
unocss: ^0.45.9
unplugin-vue-define-options: ^0.7.3
v-contextmenu: 3.0.0
vite: ^3.0.8
vite: ^3.0.9
vite-plugin-mock: ^2.9.6
vite-plugin-remove-console: ^1.1.0
vite-svg-loader: ^3.4.0
@@ -145,7 +145,7 @@ dependencies:
dayjs: 1.11.5
driver.js: 0.9.8
echarts: 5.3.3
element-plus: 2.2.13_vue@3.2.37
element-plus: 2.2.14_vue@3.2.37
element-resize-detector: 1.2.4
js-cookie: 3.0.1
jsbarcode: 3.11.5
@@ -192,7 +192,7 @@ devDependencies:
"@iconify-icons/ri": 1.2.3
"@iconify-icons/uil": 1.2.2
"@iconify/vue": 3.2.1_vue@3.2.37
"@intlify/vite-plugin-vue-i18n": 6.0.1_vite@3.0.8+vue-i18n@9.2.2
"@intlify/vite-plugin-vue-i18n": 6.0.1_vite@3.0.9+vue-i18n@9.2.2
"@pureadmin/theme": 2.4.0
"@types/element-resize-detector": 1.1.3
"@types/js-cookie": 3.0.2
@@ -206,9 +206,9 @@ devDependencies:
"@types/sortablejs": 1.13.0
"@typescript-eslint/eslint-plugin": 5.33.1_ac9d23a22d787f7b7991fddcc31412d2
"@typescript-eslint/parser": 5.33.1_eslint@8.22.0+typescript@4.7.4
"@vitejs/plugin-legacy": 2.0.1_vite@3.0.8
"@vitejs/plugin-vue": 3.0.3_vite@3.0.8+vue@3.2.37
"@vitejs/plugin-vue-jsx": 2.0.0_vite@3.0.8+vue@3.2.37
"@vitejs/plugin-legacy": 2.0.1_vite@3.0.9
"@vitejs/plugin-vue": 3.0.3_vite@3.0.9+vue@3.2.37
"@vitejs/plugin-vue-jsx": 2.0.0_vite@3.0.9+vue@3.2.37
"@vue/eslint-config-prettier": 7.0.0_eslint@8.22.0+prettier@2.7.1
"@vue/eslint-config-typescript": 10.0.0_c3cdf287d97b2ef58cc8a46e57dc8a9b
"@vue/runtime-core": 3.2.37
@@ -239,10 +239,10 @@ devDependencies:
stylelint-config-standard: 24.0.0_stylelint@14.10.0
stylelint-order: 5.0.0_stylelint@14.10.0
typescript: 4.7.4
unocss: 0.45.8_vite@3.0.8
unplugin-vue-define-options: 0.7.3_vite@3.0.8+vue@3.2.37
vite: 3.0.8_sass@1.54.4
vite-plugin-mock: 2.9.6_mockjs@1.1.0+vite@3.0.8
unocss: 0.45.9_vite@3.0.9
unplugin-vue-define-options: 0.7.3_vite@3.0.9+vue@3.2.37
vite: 3.0.9_sass@1.54.4
vite-plugin-mock: 2.9.6_mockjs@1.1.0+vite@3.0.9
vite-plugin-remove-console: 1.1.0
vite-svg-loader: 3.4.0
vue-eslint-parser: 8.3.0_eslint@8.22.0
@@ -1238,7 +1238,7 @@ packages:
engines: { node: ">= 14" }
dev: false
/@intlify/vite-plugin-vue-i18n/6.0.1_vite@3.0.8+vue-i18n@9.2.2:
/@intlify/vite-plugin-vue-i18n/6.0.1_vite@3.0.9+vue-i18n@9.2.2:
resolution:
{
integrity: sha512-FFVcxVU4bR9vdDLNbltM5mrhndnXMErO01i0RrpdyMegEt3Nu/YLoH0sFdjRun7/RY4vaEnhTnFvVf9uO0dQvg==
@@ -1262,7 +1262,7 @@ packages:
debug: 4.3.4
fast-glob: 3.2.11
source-map: 0.6.1
vite: 3.0.8_sass@1.54.4
vite: 3.0.9_sass@1.54.4
vue-i18n: 9.2.2_vue@3.2.37
transitivePeerDependencies:
- supports-color
@@ -1414,7 +1414,7 @@ packages:
}
dependencies:
"@element-plus/icons-vue": 2.0.9_vue@3.2.37
element-plus: 2.2.13_vue@3.2.37
element-plus: 2.2.14_vue@3.2.37
vue: 3.2.37
transitivePeerDependencies:
- "@vue/composition-api"
@@ -1426,7 +1426,7 @@ packages:
integrity: sha512-mJBpMj0YkaqTM5TDz+ek/f8h74qRLhDc/gLJhBq0wpyfCgG++Jd/9i+QUj8gedA5oN8IL6LOSFbcvlGDYxHgkw==
}
dependencies:
element-plus: 2.2.13_vue@3.2.37
element-plus: 2.2.14_vue@3.2.37
vue: 3.2.37
transitivePeerDependencies:
- "@vue/composition-api"
@@ -1853,17 +1853,17 @@ packages:
eslint-visitor-keys: 3.3.0
dev: true
/@unocss/cli/0.45.8:
/@unocss/cli/0.45.9:
resolution:
{
integrity: sha512-/JyYXi4SsKNkEqB3wG/3FPAOHbQ4YTl0caI8KusMrbNIdGnBHTG9Vi5IzTE7Oyt3yksvwjfgNnOGsiRWBqxq2Q==
integrity: sha512-DdSiCbLjmU5GkPKAykIeB/S28uSYWaqkdIMh7aQmg7i3ouCqp61vOeu9eiKoKK2HNm+ivPRznR4drk7zb6d9SA==
}
engines: { node: ">=14" }
hasBin: true
dependencies:
"@unocss/config": 0.45.8
"@unocss/core": 0.45.8
"@unocss/preset-uno": 0.45.8
"@unocss/config": 0.45.9
"@unocss/core": 0.45.9
"@unocss/preset-uno": 0.45.9
cac: 6.7.12
chokidar: 3.5.3
colorette: 2.0.19
@@ -1873,182 +1873,182 @@ packages:
perfect-debounce: 0.1.3
dev: true
/@unocss/config/0.45.8:
/@unocss/config/0.45.9:
resolution:
{
integrity: sha512-iwxHS0yuf/tPab8Oij6Q9pjCUASAdUJC31n0rp3VpyexjzfI/335ysbEzrBuwgxLV3RWk7Z1kHizCw+kQwZ+tw==
integrity: sha512-+HAtOxxW/BMNSunM7VwoCkCgb6SY8LpiGcfOnkrrynf/cne9RQQdfQPlMjbKLCIneBPtOSJWAKFMrPcVm0QW/w==
}
engines: { node: ">=14" }
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
unconfig: 0.3.5
dev: true
/@unocss/core/0.45.8:
/@unocss/core/0.45.9:
resolution:
{
integrity: sha512-Iskmc1FaxIUAw4HK1U3htvXxJ4YAtffn3+ygNKY8+bzuOqhIk84vbp7SnHV3b8X6IHl4/OYzNRlVFhJQYnWV7g==
integrity: sha512-ZUHgE8q7oYNFW+lPyH71n2weR9mhYL4WY/FL6K+sa9mVEYA4Lq15sCKTB+fbowB4CDLxZ8BEGNX3I9Qpn46lHA==
}
dev: true
/@unocss/inspector/0.45.8:
/@unocss/inspector/0.45.9:
resolution:
{
integrity: sha512-dvGYyVVofH8VxMvqaRfysxIbRkaunvs5M5Z8UVaCCfjfrDX6nqAQfSOakXWODEz8Y2JEfKEDLWfSn+oQWb9ohA==
integrity: sha512-/GFt/NG349cs9HnVejQe0T2HUUx8lOIjSP0cgReibWJ2idIuu9NLYPTh1YuT37ygHkze19106/HLu50lGtjAmw==
}
dependencies:
gzip-size: 6.0.0
sirv: 2.0.2
dev: true
/@unocss/preset-attributify/0.45.8:
/@unocss/preset-attributify/0.45.9:
resolution:
{
integrity: sha512-5j8TfoYWKkpV0f2fwDTtAyRl+2zoquqg5JfuQDr1ELUpSodmHq9hMvt53EmG/S1wotijthsdh8jcjCRLQ36Xuw==
integrity: sha512-jIpBx7J3XHg/QBxybU4kZr9io853ifrkcs/QfKgc2DFq+iOQfnIxFuMGJNs7oH2Py86MkX6ZkYuDJ5IlcE+v2A==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
dev: true
/@unocss/preset-icons/0.45.8:
/@unocss/preset-icons/0.45.9:
resolution:
{
integrity: sha512-2dcK2Z8xMiJoKhgraTyarJioqyh2SglXrvJ+xp7HNDOhwQcbzxdw9JzwBT1hCq03ohm2Z1CdF9xP9nbFqdpY/A==
integrity: sha512-Tla5xII9TzLgunOu4sbOshJwif2FYcX1xgql6KeFhL6f37Z6EUiax4TBgPC3GIreleRLhACVP8sZUil3fK2zcA==
}
dependencies:
"@iconify/utils": 1.0.33
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
ohmyfetch: 0.4.18
transitivePeerDependencies:
- supports-color
dev: true
/@unocss/preset-mini/0.45.8:
/@unocss/preset-mini/0.45.9:
resolution:
{
integrity: sha512-MWQWt7CR9lqR/2N7dnVQrxxuTxxccL7xj82qb8i2P1qQScyVVdPKTeUozu/oA5HrR0ujh+qjV1iTC8RB5HxbbQ==
integrity: sha512-WLBKaE+WYBPbRK4Q3lHDBf8luFElNd0cG4e05Tttg028ImZIhDsPGkGAGLKk5wmA1CiUvG/K976NywOchA9T6A==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
dev: true
/@unocss/preset-tagify/0.45.8:
/@unocss/preset-tagify/0.45.9:
resolution:
{
integrity: sha512-ePq3HUxPIuQR8MPDtgrzB/dOYGyba2KtCUjp5Zy0EPY4bd31ysz2AixjOOygFQIx5JrnYKs6WxW9PdhwMJUnXg==
integrity: sha512-cOjxRp3EWWJSVA69NiqsRdLlB2SFGys4w+44X4UYe0yYHr2L3bJEK66gPj3YLuyiBfmbv5RSv1OaP2a1RHQ1ZA==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
dev: true
/@unocss/preset-typography/0.45.8:
/@unocss/preset-typography/0.45.9:
resolution:
{
integrity: sha512-x0MyuyPLfwvQenHwVHhLRzhjtuQL9S5qkdGh04kOySprp1wIsu14L6w/zFequvVSk55Tb8s+QMd9TmTYR/MZPg==
integrity: sha512-TaHnAZd6UU2qNz0dEqoniBrwEOCpsifZquOK6hFRCj4FKwWWP2VEOgdVclgjL8DDWLZeS4bfTn2zQ5pGfo8tDQ==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
dev: true
/@unocss/preset-uno/0.45.8:
/@unocss/preset-uno/0.45.9:
resolution:
{
integrity: sha512-WxE9aAHCnmZMwzdhiKYawvyQx1wucl/AsoxTpnNgToARaGLiQiWJCT7ov0VgNndbxD1mfCIA4f9LxNklkFVZzA==
integrity: sha512-YqQRPeVDrY7poBUw0tOOD3Vd8QCEmhIjN63MovA0RnEG6NMweMuJ5ahqVarfp3Rrcfycmgya6WWGk6ZOlinl5A==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/preset-mini": 0.45.8
"@unocss/preset-wind": 0.45.8
"@unocss/core": 0.45.9
"@unocss/preset-mini": 0.45.9
"@unocss/preset-wind": 0.45.9
dev: true
/@unocss/preset-web-fonts/0.45.8:
/@unocss/preset-web-fonts/0.45.9:
resolution:
{
integrity: sha512-GvBZrDtAOkyOwphdzT3v1QniJfFssR0LhWfJPBpNsOi3Of2iz8Zq0LisbPF7PEFS0fPicijDcgyVUTj1TK71Ew==
integrity: sha512-kWYfUcvRvoPyxmf6q8AZV+cLeVJH6p4tmvDnV9iLckCThYYC+6ADHlnRimv8PJtVvy6hgv46vf0X3ZA4HLSqzg==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
ohmyfetch: 0.4.18
dev: true
/@unocss/preset-wind/0.45.8:
/@unocss/preset-wind/0.45.9:
resolution:
{
integrity: sha512-AWupVDOIRswf8CnKkWeBi1G7UBjrigQHewj/VPtnXPP7bqOHY91+4T/iaTtYJ5lrKauYVR4ZndOM1qJGEY09Gg==
integrity: sha512-LMlWg8jsUwqlhd6jwtn5QCTzb1et0k7yNIZwyL6Y2AOHW5g5jqaTvKTWVjQpfu9wmlxTTVXDBmaOV3cOiosvuw==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/preset-mini": 0.45.8
"@unocss/core": 0.45.9
"@unocss/preset-mini": 0.45.9
dev: true
/@unocss/reset/0.45.8:
/@unocss/reset/0.45.9:
resolution:
{
integrity: sha512-zeIYa/d/amPhX6/del0k6K8/Hdl/nN12XCeiVfBKymlilAjQQyV64V/qdLBtSKzqegT68O/xMscla7pZDto4Hw==
integrity: sha512-FiLi3jas0L3CkfdAYXRybRjAjGz9lZQ4+8IglBXKyR9UDnHssNemo5+NGEv7xpsItPm99b/lsMvLnx1JX/As5Q==
}
dev: true
/@unocss/scope/0.45.8:
/@unocss/scope/0.45.9:
resolution:
{
integrity: sha512-Zf08xhCBqFHCaf8kGwMXu0+JRR3U9v8m7Y2LwUK4zg6LdcfGX9luykPfiNJSsFQ20l7cWBcj2g4tWdzFvIcDMA==
integrity: sha512-1JOv+xCYYetofqpfWmBX1kXIqo2n788FRWNPzkbSGaH5qdS9za1+wECBlTiWpbvyfeB4gX88d8+DX9YL4PjVdA==
}
dev: true
/@unocss/transformer-attributify-jsx/0.45.8:
/@unocss/transformer-attributify-jsx/0.45.9:
resolution:
{
integrity: sha512-tpWr37wXvOPkMuXaTGkjSbKqz4DD2MuxKxzTs+DUQ5H7ABvp/XVnCiHudtgjLzaVAfEZgdybKFUs+xX+RuxnWA==
integrity: sha512-QgCuztKpm0jLZhJbEWGrajwT1iURtGXtALBLVdqqM/D5FoFpHpkddOhr5ud+XGoyRhy9E9m9WdfyTq8g97HHgQ==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
dev: true
/@unocss/transformer-compile-class/0.45.8:
/@unocss/transformer-compile-class/0.45.9:
resolution:
{
integrity: sha512-nYIQbXgc8yyzSYqIrb3+mojFTewOavmYreC+cmsvFhE+q3q5ZpdXNx0hgpkOFQ7Dg5KoPG9aKH+dXFjG33GcmQ==
integrity: sha512-x0MWUdTMPndS4AZEwlV+ugDdTYeezEGCC0fKb/jKujF3RMf9m6C8/MZw3eiZ5LNHKU1kfor1NWCTjshXl4pV3Q==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
dev: true
/@unocss/transformer-directives/0.45.8:
/@unocss/transformer-directives/0.45.9:
resolution:
{
integrity: sha512-das5qyPOXjw7I6eXm6ETrnBQmfwzJo/RGMUkWmed67sYL4tWGLLYu8fOqoIR8vPGc6h5YmFjBGqOOCyX+NDmlg==
integrity: sha512-88t2zWFVpYNk3kFBiJWW4oYerbVnyk9smPZD9+HJewPJbvbHm6UboW4rEy3KepT2heyn7GTpLjfLD08yDZFvIA==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
css-tree: 2.2.1
dev: true
/@unocss/transformer-variant-group/0.45.8:
/@unocss/transformer-variant-group/0.45.9:
resolution:
{
integrity: sha512-fp1tNBhO3VPxOnzDWZNqrQ1oWngeYUXeJZRl94pdsp+4nWoFrbCXG/nDn7a+Qk223al32B3rO/GLJl7nOpSmRw==
integrity: sha512-xB7ygI81u9yVpJvKDo5l03KC0zwJRerpncNxpReDpPGTcpnoYqoazX0CZ/sCekuE3ErZC6UJkyknEuwT+8owog==
}
dependencies:
"@unocss/core": 0.45.8
"@unocss/core": 0.45.9
dev: true
/@unocss/vite/0.45.8_vite@3.0.8:
/@unocss/vite/0.45.9_vite@3.0.9:
resolution:
{
integrity: sha512-uGKe0tbxcJgk9aEKa+AYjbU3i0Yh1N7ekvdLGZD+xwk+EvIOg4Hc8mym5gOOh4wRYKROoVOPp1Z7m+GwCVecAA==
integrity: sha512-Wb0JSaO/D8IvXku6+bImr4oobYbFFcqXYAT3QrWTYdCuEZ7Zn6svNN4f1baMvKH5djm7cn9YNL7lroOXN0/m8Q==
}
peerDependencies:
vite: ^2.9.0 || ^3.0.0-0
dependencies:
"@ampproject/remapping": 2.2.0
"@rollup/pluginutils": 4.2.1
"@unocss/config": 0.45.8
"@unocss/core": 0.45.8
"@unocss/inspector": 0.45.8
"@unocss/scope": 0.45.8
"@unocss/transformer-directives": 0.45.8
"@unocss/config": 0.45.9
"@unocss/core": 0.45.9
"@unocss/inspector": 0.45.9
"@unocss/scope": 0.45.9
"@unocss/transformer-directives": 0.45.9
magic-string: 0.26.2
vite: 3.0.8_sass@1.54.4
vite: 3.0.9_sass@1.54.4
dev: true
/@uppy/companion-client/2.2.1:
@@ -2107,7 +2107,7 @@ packages:
nanoid: 3.3.4
dev: false
/@vitejs/plugin-legacy/2.0.1_vite@3.0.8:
/@vitejs/plugin-legacy/2.0.1_vite@3.0.9:
resolution:
{
integrity: sha512-kKC56rfsXwebApzyuZqdQlGmqTyH1ugy0l0rY58gx5OXzq4/t5/DCqGUoz53Db51OqfjRqsHfqmvq9or6w9k/Q==
@@ -2125,10 +2125,10 @@ packages:
magic-string: 0.26.2
regenerator-runtime: 0.13.9
systemjs: 6.12.2
vite: 3.0.8_sass@1.54.4
vite: 3.0.9_sass@1.54.4
dev: true
/@vitejs/plugin-vue-jsx/2.0.0_vite@3.0.8+vue@3.2.37:
/@vitejs/plugin-vue-jsx/2.0.0_vite@3.0.9+vue@3.2.37:
resolution:
{
integrity: sha512-WF9ApZ/ivyyW3volQfu0Td0KNPhcccYEaRNzNY1NxRLVJQLSX0nFqquv3e2g7MF74p1XZK4bGtDL2y5i5O5+1A==
@@ -2142,13 +2142,13 @@ packages:
"@babel/plugin-syntax-import-meta": 7.10.4_@babel+core@7.18.10
"@babel/plugin-transform-typescript": 7.18.12_@babel+core@7.18.10
"@vue/babel-plugin-jsx": 1.1.1_@babel+core@7.18.10
vite: 3.0.8_sass@1.54.4
vite: 3.0.9_sass@1.54.4
vue: 3.2.37
transitivePeerDependencies:
- supports-color
dev: true
/@vitejs/plugin-vue/3.0.3_vite@3.0.8+vue@3.2.37:
/@vitejs/plugin-vue/3.0.3_vite@3.0.9+vue@3.2.37:
resolution:
{
integrity: sha512-U4zNBlz9mg+TA+i+5QPc3N5lQvdUXENZLO2h0Wdzp56gI1MWhqJOv+6R+d4kOzoaSSq6TnGPBdZAXKOe4lXy6g==
@@ -2158,7 +2158,7 @@ packages:
vite: ^3.0.0
vue: ^3.2.25
dependencies:
vite: 3.0.8_sass@1.54.4
vite: 3.0.9_sass@1.54.4
vue: 3.2.37
dev: true
@@ -4150,10 +4150,10 @@ packages:
}
dev: true
/element-plus/2.2.13_vue@3.2.37:
/element-plus/2.2.14_vue@3.2.37:
resolution:
{
integrity: sha512-dKQ7BPZC8deUPhv+6s4GgOL0GyGj3KpUarywxm6s1nWnHjH6FqeZlUcxPqBvJd7W/d81POayx3B13GP+rfkG9g==
integrity: sha512-V5Pis0OHhePg1RgVogZrcefaVl8vjVn4Pn9Qsh/t2CbFgjg9kKOYFqf/tuP3ObSXGm3X89hpe0W+nLVAsaFnpw==
}
peerDependencies:
vue: ^3.2.0
@@ -4164,7 +4164,7 @@ packages:
"@popperjs/core": /@sxzz/popperjs-es/2.11.7
"@types/lodash": 4.14.183
"@types/lodash-es": 4.17.6
"@vueuse/core": 8.9.4_vue@3.2.37
"@vueuse/core": 9.1.0_vue@3.2.37
async-validator: 4.2.5
dayjs: 1.11.5
escape-html: 1.0.3
@@ -8786,34 +8786,34 @@ packages:
engines: { node: ">= 10.0.0" }
dev: true
/unocss/0.45.8_vite@3.0.8:
/unocss/0.45.9_vite@3.0.9:
resolution:
{
integrity: sha512-OIStfHtH0sv1MYz0x+fa8wEBuwRS0lFhnlRwo/zxnNSh5zS+szMKeowhXoC/eoOQBUA1qoHux0qG5GdcJnX2Lg==
integrity: sha512-f2gTI1cn2/GZRbvSnCaWZa03IdcRnK33AiBtpJoDW61IRNt7lu+D1upCnkKPjcTrDFTmI7DryXGHlG/b8p4wTQ==
}
engines: { node: ">=14" }
peerDependencies:
"@unocss/webpack": 0.45.8
"@unocss/webpack": 0.45.9
peerDependenciesMeta:
"@unocss/webpack":
optional: true
dependencies:
"@unocss/cli": 0.45.8
"@unocss/core": 0.45.8
"@unocss/preset-attributify": 0.45.8
"@unocss/preset-icons": 0.45.8
"@unocss/preset-mini": 0.45.8
"@unocss/preset-tagify": 0.45.8
"@unocss/preset-typography": 0.45.8
"@unocss/preset-uno": 0.45.8
"@unocss/preset-web-fonts": 0.45.8
"@unocss/preset-wind": 0.45.8
"@unocss/reset": 0.45.8
"@unocss/transformer-attributify-jsx": 0.45.8
"@unocss/transformer-compile-class": 0.45.8
"@unocss/transformer-directives": 0.45.8
"@unocss/transformer-variant-group": 0.45.8
"@unocss/vite": 0.45.8_vite@3.0.8
"@unocss/cli": 0.45.9
"@unocss/core": 0.45.9
"@unocss/preset-attributify": 0.45.9
"@unocss/preset-icons": 0.45.9
"@unocss/preset-mini": 0.45.9
"@unocss/preset-tagify": 0.45.9
"@unocss/preset-typography": 0.45.9
"@unocss/preset-uno": 0.45.9
"@unocss/preset-web-fonts": 0.45.9
"@unocss/preset-wind": 0.45.9
"@unocss/reset": 0.45.9
"@unocss/transformer-attributify-jsx": 0.45.9
"@unocss/transformer-compile-class": 0.45.9
"@unocss/transformer-directives": 0.45.9
"@unocss/transformer-variant-group": 0.45.9
"@unocss/vite": 0.45.9_vite@3.0.9
transitivePeerDependencies:
- supports-color
- vite
@@ -8827,7 +8827,7 @@ packages:
engines: { node: ">= 0.8" }
dev: true
/unplugin-vue-define-options/0.7.3_vite@3.0.8+vue@3.2.37:
/unplugin-vue-define-options/0.7.3_vite@3.0.9+vue@3.2.37:
resolution:
{
integrity: sha512-VbexYR8m2v/TLi49+F7Yf3rO2EyS0EkrXjJxqym6W0NxOzom9zdmRUR+av4UAu4GruhMumJc/9ITS1Wj+rozjg==
@@ -8838,7 +8838,7 @@ packages:
dependencies:
"@rollup/pluginutils": 4.2.1
"@vue/compiler-sfc": 3.2.37
unplugin: 0.8.1_vite@3.0.8
unplugin: 0.8.1_vite@3.0.9
vue: 3.2.37
transitivePeerDependencies:
- esbuild
@@ -8847,7 +8847,7 @@ packages:
- webpack
dev: true
/unplugin/0.8.1_vite@3.0.8:
/unplugin/0.8.1_vite@3.0.9:
resolution:
{
integrity: sha512-o7rUZoPLG1fH4LKinWgb77gDtTE6mw/iry0Pq0Z5UPvZ9+HZ1/4+7fic7t58s8/CGkPrDpGq+RltO+DmswcR4g==
@@ -8869,7 +8869,7 @@ packages:
dependencies:
acorn: 8.8.0
chokidar: 3.5.3
vite: 3.0.8_sass@1.54.4
vite: 3.0.9_sass@1.54.4
webpack-sources: 3.2.3
webpack-virtual-modules: 0.4.4
dev: true
@@ -8954,7 +8954,7 @@ packages:
spdx-expression-parse: 3.0.1
dev: true
/vite-plugin-mock/2.9.6_mockjs@1.1.0+vite@3.0.8:
/vite-plugin-mock/2.9.6_mockjs@1.1.0+vite@3.0.9:
resolution:
{
integrity: sha512-/Rm59oPppe/ncbkSrUuAxIQihlI2YcBmnbR4ST1RA2VzM1C0tEQc1KlbQvnUGhXECAGTaQN2JyasiwXP6EtKgg==
@@ -8974,7 +8974,7 @@ packages:
fast-glob: 3.2.11
mockjs: 1.1.0
path-to-regexp: 6.2.1
vite: 3.0.8_sass@1.54.4
vite: 3.0.9_sass@1.54.4
transitivePeerDependencies:
- rollup
- supports-color
@@ -8997,10 +8997,10 @@ packages:
svgo: 2.8.0
dev: true
/vite/3.0.8_sass@1.54.4:
/vite/3.0.9_sass@1.54.4:
resolution:
{
integrity: sha512-AOZ4eN7mrkJiOLuw8IA7piS4IdOQyQCA81GxGsAQvAZzMRi9ZwGB3TOaYsj4uLAWK46T5L4AfQ6InNGlxX30IQ==
integrity: sha512-waYABTM+G6DBTCpYAxvevpG50UOlZuynR0ckTK5PawNVt7ebX6X7wNXHaGIO6wYYFXSM7/WcuFuO2QzhBB6aMw==
}
engines: { node: ^14.18.0 || >=16.0.0 }
hasBin: true
@@ -9076,7 +9076,7 @@ packages:
ace-builds: 1.9.6
ant-design-vue: 3.2.11_vue@3.2.37
core-js: 3.24.1
element-plus: 2.2.13_vue@3.2.37
element-plus: 2.2.14_vue@3.2.37
lodash: 4.17.21
uuid: 8.3.2
vue: 3.2.37

View File

@@ -1,5 +1,5 @@
{
"Version": "3.3.5",
"Version": "3.4.6",
"Title": "PureAdmin",
"FixedHeader": true,
"HiddenSideBar": false,

View File

@@ -156,7 +156,7 @@ watch(
>
<el-divider class="tab-divider" border-style="dashed" />
<el-scrollbar height="220px">
<ul class="flex flex-wrap px-2 ml-2">
<ul class="flex-wrap px-2 ml-2">
<li
v-for="(item, key) in pageList"
:key="key"

View File

@@ -428,7 +428,7 @@ function scrollInitMove() {
if (timer) clearTimeout(timer);
copyHtml.value = unref(slotList).innerHTML;
setTimeout(() => {
realBoxHeight.value = unref(realBox).offsetHeight;
realBoxHeight.value = unref(realBox)?.offsetHeight;
scrollMove();
}, 0);
} else {
@@ -454,7 +454,6 @@ function scrollStopMove() {
// 鼠标滚轮事件
function wheel(e) {
e.preventDefault();
if (
unref(options).direction === "left" ||
unref(options).direction === "right"
@@ -517,10 +516,10 @@ defineExpose({
:style="pos"
@mouseenter="enter"
@mouseleave="leave"
@touchstart="touchStart"
@touchmove="touchMove"
@touchstart.passive="touchStart"
@touchmove.passive="touchMove"
@touchend="touchEnd"
@mousewheel="wheel"
@mousewheel.passive="wheel"
>
<div :ref="'slotList' + classOption['key']" :style="float">
<slot />

View File

@@ -12,6 +12,7 @@ import { getConfig } from "/@/config";
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 { routerArrays } from "/@/layout/types";
import { useNav } from "/@/layout/hooks/useNav";
@@ -140,6 +141,7 @@ function onReset() {
useMultiTagsStoreHook().handleTags("equal", [...routerArrays]);
storageLocal.clear();
storageSession.clear();
resetRouter();
}
function onChange(label) {
@@ -209,8 +211,9 @@ function setLayoutModel(layout: string) {
$storage.layout = {
layout,
theme: layoutTheme.value.theme,
darkMode: $storage.layout.darkMode,
sidebarStatus: $storage.layout.sidebarStatus
darkMode: $storage.layout?.darkMode,
sidebarStatus: $storage.layout?.sidebarStatus,
epThemeColor: $storage.layout?.epThemeColor
};
useAppStoreHook().setLayout(layout);
}

View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import { ref, watch } from "vue";
import { isEqual } from "lodash-unified";
import { transformI18n } from "/@/plugins/i18n";
import { ref, watch, onMounted, toRaw } from "vue";
import { getParentPaths, findRouteByPath } from "/@/router/utils";
import { useMultiTagsStoreHook } from "/@/store/modules/multiTags";
import { useRoute, useRouter, RouteLocationMatched } from "vue-router";
@@ -14,19 +14,24 @@ const multiTags: any = useMultiTagsStoreHook().multiTags;
const isDashboard = (route: RouteLocationMatched): boolean | string => {
const name = route && (route.name as string);
if (!name) {
return false;
}
if (!name) return false;
return name.trim().toLocaleLowerCase() === "Welcome".toLocaleLowerCase();
};
const getBreadcrumb = (): void => {
// 当前路由信息
let currentRoute;
if (Object.keys(route.query).length > 0) {
multiTags.forEach(item => {
if (isEqual(route.query, item?.query)) {
currentRoute = item;
currentRoute = toRaw(item);
}
});
} else if (Object.keys(route.params).length > 0) {
multiTags.forEach(item => {
if (isEqual(route.params, item?.params)) {
currentRoute = toRaw(item);
}
});
} else {
@@ -38,29 +43,12 @@ const getBreadcrumb = (): void => {
let matched = [];
// 获取每个父级路径对应的路由信息
parentRoutes.forEach(path => {
if (path !== "/") {
matched.push(findRouteByPath(path, routes));
}
if (path !== "/") matched.push(findRouteByPath(path, routes));
});
if (router.currentRoute.value.meta?.refreshRedirect) {
matched.unshift(
findRouteByPath(
router.currentRoute.value.meta.refreshRedirect as string,
routes
)
);
} else {
// 过滤与子级相同标题的父级路由
matched = matched.filter(item => {
return !item.redirect || (item.redirect && item.children.length !== 1);
});
}
if (currentRoute?.path !== "/welcome") {
matched.push(currentRoute);
}
const first = matched[0];
if (!isDashboard(first)) {
if (currentRoute?.path !== "/welcome") matched.push(currentRoute);
if (!isDashboard(matched[0])) {
matched = [
{
path: "/welcome",
@@ -70,60 +58,51 @@ const getBreadcrumb = (): void => {
].concat(matched);
}
matched.forEach((item, index) => {
if (currentRoute?.query || currentRoute?.params) return;
if (item?.children) {
item.children.forEach(v => {
if (v?.meta?.title === item?.meta?.title) {
matched.splice(index, 1);
}
});
}
});
levelList.value = matched.filter(
item => item?.meta && item?.meta.title !== false
);
};
const handleLink = (item: RouteLocationMatched): void => {
const { redirect, path } = item;
if (redirect) {
router.push(redirect as any);
} else {
router.push(path);
}
};
onMounted(() => {
getBreadcrumb();
});
watch(
() => route.path,
() => getBreadcrumb()
);
watch(
() => route.query,
() => getBreadcrumb()
);
const handleLink = (item: RouteLocationMatched): any => {
const { redirect, path } = item;
if (redirect) {
router.push(redirect.toString());
return;
() => {
getBreadcrumb();
}
router.push(path);
};
);
</script>
<template>
<el-breadcrumb class="app-breadcrumb select-none" separator="/">
<el-breadcrumb class="!leading-[50px] select-none" separator="/">
<transition-group appear name="breadcrumb">
<el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
<span
v-if="item.redirect === 'noRedirect' || index == levelList.length - 1"
class="no-redirect"
>
{{ transformI18n(item.meta.title) }}
</span>
<a v-else @click.prevent="handleLink(item)">
<el-breadcrumb-item v-for="item in levelList" :key="item.path">
<a @click.prevent="handleLink(item)">
{{ transformI18n(item.meta.title) }}
</a>
</el-breadcrumb-item>
</transition-group>
</el-breadcrumb>
</template>
<style lang="scss" scoped>
.app-breadcrumb.el-breadcrumb {
display: inline-block;
font-size: 14px;
line-height: 50px;
.no-redirect {
color: #97a8be;
cursor: text;
}
}
</style>

View File

@@ -1,4 +1,5 @@
<script setup lang="ts">
import { ref, watch } from "vue";
import Search from "../search/index.vue";
import Notice from "../notice/index.vue";
import SidebarItem from "./sidebarItem.vue";
@@ -9,7 +10,6 @@ import { deviceDetection } from "@pureadmin/utils";
import { useTranslationLang } from "../../hooks/useTranslationLang";
import { usePermissionStoreHook } from "/@/store/modules/permission";
import globalization from "/@/assets/svg/globalization.svg?component";
import { ref, watch, nextTick, onMounted, onBeforeUnmount } from "vue";
const menuRef = ref();
@@ -21,7 +21,6 @@ const {
logout,
backHome,
onPanel,
handleResize,
menuSelect,
username,
avatarsStyle,
@@ -29,20 +28,6 @@ const {
getDropdownItemClass
} = useNav();
function onResizeMenu() {
nextTick(() => {
handleResize(menuRef.value);
});
}
onMounted(() => {
window.addEventListener("resize", onResizeMenu);
});
onBeforeUnmount(() => {
window.removeEventListener("resize", onResizeMenu);
});
watch(
() => route.path,
() => {

View File

@@ -6,12 +6,12 @@ import { useNav } from "/@/layout/hooks/useNav";
import { transformI18n } from "/@/plugins/i18n";
import screenfull from "../screenfull/index.vue";
import { deviceDetection } from "@pureadmin/utils";
import { ref, toRaw, watch, onMounted } 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";
import { ref, toRaw, watch, nextTick, onMounted, onBeforeUnmount } from "vue";
const menuRef = ref();
let defaultActive = ref(null);
@@ -23,7 +23,6 @@ const {
routers,
logout,
onPanel,
handleResize,
menuSelect,
resolvePath,
username,
@@ -42,19 +41,8 @@ function getDefaultActive(routePath) {
)?.children[0]?.path;
}
function onResizeMenu() {
nextTick(() => {
handleResize(menuRef.value);
});
}
onMounted(() => {
getDefaultActive(route.path);
window.addEventListener("resize", onResizeMenu);
});
onBeforeUnmount(() => {
window.removeEventListener("resize", onResizeMenu);
});
watch(

View File

@@ -1,123 +1,53 @@
<script setup lang="ts">
import {
ref,
watch,
unref,
toRaw,
reactive,
nextTick,
computed,
ComputedRef,
CSSProperties,
onBeforeMount,
getCurrentInstance
} from "vue";
import close from "/@/assets/svg/close.svg?component";
import refresh from "/@/assets/svg/refresh.svg?component";
import closeAll from "/@/assets/svg/close_all.svg?component";
import closeLeft from "/@/assets/svg/close_left.svg?component";
import closeOther from "/@/assets/svg/close_other.svg?component";
import closeRight from "/@/assets/svg/close_right.svg?component";
import { useI18n } from "vue-i18n";
import { emitter } from "/@/utils/mitt";
import type { StorageConfigs } from "/#/index";
import { RouteConfigs } from "../../types";
import { useTags } from "../../hooks/useTag";
import { routerArrays } from "/@/layout/types";
import { useRoute, useRouter } from "vue-router";
import { isEqual, isEmpty } from "lodash-unified";
import { transformI18n, $t } from "/@/plugins/i18n";
import { RouteConfigs, tagsViewsType } from "../../types";
import { toggleClass, removeClass } from "@pureadmin/utils";
import { useResizeObserver, useDebounceFn } from "@vueuse/core";
import { useSettingStoreHook } from "/@/store/modules/settings";
import { handleAliveRoute, delAliveRoutes } from "/@/router/utils";
import { useMultiTagsStoreHook } from "/@/store/modules/multiTags";
import { usePermissionStoreHook } from "/@/store/modules/permission";
import { templateRef, useResizeObserver, useDebounceFn } from "@vueuse/core";
import {
toggleClass,
removeClass,
hasClass,
storageLocal
} from "@pureadmin/utils";
import { ref, watch, unref, toRaw, nextTick, onBeforeMount } from "vue";
const { t } = useI18n();
const route = useRoute();
const router = useRouter();
const translateX = ref<number>(0);
const activeIndex = ref<number>(-1);
let refreshButton = "refresh-button";
const instance = getCurrentInstance();
const pureSetting = useSettingStoreHook();
const tabDom = templateRef<HTMLElement | null>("tabDom", null);
const containerDom = templateRef<HTMLElement | null>("containerDom", null);
const scrollbarDom = templateRef<HTMLElement | null>("scrollbarDom", null);
const showTags =
ref(storageLocal.getItem<StorageConfigs>("responsive-configure").hideTabs) ??
"false";
// @ts-expect-error
let multiTags: ComputedRef<Array<RouteConfigs>> = computed(() => {
return useMultiTagsStoreHook()?.multiTags;
});
const {
route,
router,
visible,
showTags,
instance,
multiTags,
tagsViews,
buttonTop,
buttonLeft,
showModel,
translateX,
activeIndex,
getTabStyle,
iconIsActive,
linkIsActive,
currentSelect,
scheduleIsActive,
getContextMenuStyle,
closeMenu,
onMounted,
onMouseenter,
onMouseleave,
transformI18n
} = useTags();
const linkIsActive = computed(() => {
return item => {
if (Object.keys(route.query).length === 0) {
if (route.path === item.path) {
return "is-active";
} else {
return "";
}
} else {
if (isEqual(route?.query, item?.query)) {
return "is-active";
} else {
return "";
}
}
};
});
const scheduleIsActive = computed(() => {
return item => {
if (Object.keys(route.query).length === 0) {
if (route.path === item.path) {
return "schedule-active";
} else {
return "";
}
} else {
if (isEqual(route?.query, item?.query)) {
return "schedule-active";
} else {
return "";
}
}
};
});
const iconIsActive = computed(() => {
return (item, index) => {
if (index === 0) return;
if (Object.keys(route.query).length === 0) {
if (route.path === item.path) {
return true;
} else {
return false;
}
} else {
if (isEqual(route?.query, item?.query)) {
return true;
} else {
return false;
}
}
};
});
const tabDom = ref();
const containerDom = ref();
const scrollbarDom = ref();
const dynamicTagView = () => {
const index = multiTags.value.findIndex(item => {
if (item?.query) {
return isEqual(route?.query, item?.query);
if (item.query) {
return isEqual(route.query, item.query);
} else if (item.params) {
return isEqual(route.params, item.params);
} else {
return item.path === route.path;
}
@@ -125,23 +55,9 @@ const dynamicTagView = () => {
moveToView(index);
};
watch([route], () => {
activeIndex.value = -1;
dynamicTagView();
});
useResizeObserver(
scrollbarDom,
useDebounceFn(() => {
dynamicTagView();
}, 200)
);
const tabNavPadding = 10;
const moveToView = (index: number): void => {
if (!instance.refs["dynamic" + index]) {
return;
}
const tabNavPadding = 10;
if (!instance.refs["dynamic" + index]) return;
const tabItemEl = instance.refs["dynamic" + index][0];
const tabItemElOffsetLeft = (tabItemEl as HTMLElement)?.offsetLeft;
const tabItemOffsetWidth = (tabItemEl as HTMLElement)?.offsetWidth;
@@ -151,7 +67,6 @@ const moveToView = (index: number): void => {
: 0;
// 已有标签页总长度(包含溢出部分)
const tabDomWidth = tabDom.value ? tabDom.value?.offsetWidth : 0;
if (tabDomWidth < scrollbarDomWidth || tabItemElOffsetLeft === 0) {
translateX.value = 0;
} else if (tabItemElOffsetLeft < -translateX.value) {
@@ -200,71 +115,6 @@ const handleScroll = (offset: number): void => {
}
};
const tagsViews = reactive<Array<tagsViewsType>>([
{
icon: refresh,
text: $t("buttons.hsreload"),
divided: false,
disabled: false,
show: true
},
{
icon: close,
text: $t("buttons.hscloseCurrentTab"),
divided: false,
disabled: multiTags.value.length > 1 ? false : true,
show: true
},
{
icon: closeLeft,
text: $t("buttons.hscloseLeftTabs"),
divided: true,
disabled: multiTags.value.length > 1 ? false : true,
show: true
},
{
icon: closeRight,
text: $t("buttons.hscloseRightTabs"),
divided: false,
disabled: multiTags.value.length > 1 ? false : true,
show: true
},
{
icon: closeOther,
text: $t("buttons.hscloseOtherTabs"),
divided: true,
disabled: multiTags.value.length > 2 ? false : true,
show: true
},
{
icon: closeAll,
text: $t("buttons.hscloseAllTabs"),
divided: false,
disabled: multiTags.value.length > 1 ? false : true,
show: true
}
]);
// 显示模式,默认灵动模式显示
const showModel = ref(
storageLocal.getItem<StorageConfigs>("responsive-configure")?.showModel ||
"smart"
);
if (!showModel.value) {
const configure = storageLocal.getItem<StorageConfigs>(
"responsive-configure"
);
configure.showModel = "card";
storageLocal.setItem("responsive-configure", configure);
}
let visible = ref(false);
let buttonLeft = ref(0);
let buttonTop = ref(0);
// 当前右键选中的路由信息
let currentSelect = ref({});
function dynamicRouteTag(value: string, parentPath: string): void {
const hasValue = multiTags.value.some(item => {
return item.path === value;
@@ -292,8 +142,9 @@ function dynamicRouteTag(value: string, parentPath: string): void {
concatPath(router.options.routes as any, value, parentPath);
}
// 重新加载
/** 刷新路由 */
function onFresh() {
const refreshButton = "refresh-button";
toggleClass(true, refreshButton, document.querySelector(".rotate"));
const { fullPath, query } = unref(route);
router.replace({
@@ -313,6 +164,10 @@ function deleteDynamicTag(obj: any, current: any, tag?: string) {
if (item.path === obj.path) {
return item.query === obj.query;
}
} else if (item.params) {
if (item.path === obj.path) {
return item.params === obj.params;
}
} else {
return item.path === obj.path;
}
@@ -351,24 +206,25 @@ function deleteDynamicTag(obj: any, current: any, tag?: string) {
: handleAliveRoute(route.matched, "delete");
// 如果删除当前激活tag就自动切换到最后一个tag
if (tag === "left") return;
nextTick(() => {
router.push({
path: newRoute[0].path,
query: newRoute[0].query
});
});
if (newRoute[0]?.query) {
router.push({ name: newRoute[0].name, query: newRoute[0].query });
} else if (newRoute[0]?.params) {
router.push({ name: newRoute[0].name, params: newRoute[0].params });
} else {
router.push({ path: newRoute[0].path });
}
} else {
// 删除缓存路由
tag ? delAliveRoutes(delAliveRouteList) : delAliveRoutes([obj]);
if (!multiTags.value.length) return;
let isHasActiveTag = multiTags.value.some(item => {
return item.path === route.path;
});
!isHasActiveTag &&
router.push({
path: newRoute[0].path,
query: newRoute[0].query
});
if (multiTags.value.some(item => item.path === route.path)) return;
if (newRoute[0]?.query) {
router.push({ name: newRoute[0].name, query: newRoute[0].query });
} else if (newRoute[0]?.params) {
router.push({ name: newRoute[0].name, params: newRoute[0].params });
} else {
router.push({ path: newRoute[0].path });
}
}
}
@@ -385,7 +241,8 @@ function onClickDrop(key, item, selectRoute?: RouteConfigs) {
path: selectRoute.path,
meta: selectRoute.meta,
name: selectRoute.name,
query: selectRoute.query
query: selectRoute?.query,
params: selectRoute?.params
};
} else {
selectTagRoute = { path: route.path, meta: route.meta };
@@ -394,7 +251,7 @@ function onClickDrop(key, item, selectRoute?: RouteConfigs) {
// 当前路由信息
switch (key) {
case 0:
// 重新加载
// 刷新路由
onFresh();
break;
case 1:
@@ -433,15 +290,11 @@ function handleCommand(command: any) {
onClickDrop(key, item);
}
// 触发右键中菜单的点击事件
/** 触发右键中菜单的点击事件 */
function selectTag(key, item) {
onClickDrop(key, item, currentSelect.value);
}
function closeMenu() {
visible.value = false;
}
function showMenus(value: boolean) {
Array.of(1, 2, 3, 4, 5).forEach(v => {
tagsViews[v].show = value;
@@ -454,7 +307,7 @@ function disabledMenus(value: boolean) {
});
}
// 检查当前右键的菜单两边是否存在别的菜单,如果左侧的菜单是首页,则不显示关闭左侧标签页,如果右侧没有菜单,则不显示关闭右侧标签页
/** 检查当前右键的菜单两边是否存在别的菜单,如果左侧的菜单是首页,则不显示关闭左侧标签页,如果右侧没有菜单,则不显示关闭右侧标签页 */
function showMenuModel(
currentPath: string,
query: object = {},
@@ -514,7 +367,7 @@ function openMenu(tag, e) {
// 右键菜单为首页,只显示刷新
showMenus(false);
tagsViews[0].show = true;
} else if (route.path !== tag.path) {
} else if (route.path !== tag.path && route.name !== tag.name) {
// 右键菜单不匹配当前路由,隐藏刷新
tagsViews[0].show = false;
showMenuModel(tag.path, tag.query);
@@ -542,64 +395,37 @@ function openMenu(tag, e) {
} else {
buttonLeft.value = left;
}
pureSetting.hiddenSideBar
useSettingStoreHook().hiddenSideBar
? (buttonTop.value = e.clientY)
: (buttonTop.value = e.clientY - 40);
setTimeout(() => {
nextTick(() => {
visible.value = true;
}, 10);
}
// 触发tags标签切换
function tagOnClick(item) {
router.push({
path: item?.path,
query: item?.query
});
showMenuModel(item?.path, item?.query);
}
// 鼠标移入
function onMouseenter(index) {
if (index) activeIndex.value = index;
if (unref(showModel) === "smart") {
if (hasClass(instance.refs["schedule" + index][0], "schedule-active"))
return;
toggleClass(true, "schedule-in", instance.refs["schedule" + index][0]);
toggleClass(false, "schedule-out", instance.refs["schedule" + index][0]);
/** 触发tags标签切换 */
function tagOnClick(item) {
const { name, path } = item;
if (name) {
if (item.query) {
router.push({
name,
query: item.query
});
} else if (item.params) {
router.push({
name,
params: item.params
});
} else {
if (hasClass(instance.refs["dynamic" + index][0], "card-active")) return;
toggleClass(true, "card-in", instance.refs["dynamic" + index][0]);
toggleClass(false, "card-out", instance.refs["dynamic" + index][0]);
router.push({ name });
}
}
// 鼠标移出
function onMouseleave(index) {
activeIndex.value = -1;
if (unref(showModel) === "smart") {
if (hasClass(instance.refs["schedule" + index][0], "schedule-active"))
return;
toggleClass(false, "schedule-in", instance.refs["schedule" + index][0]);
toggleClass(true, "schedule-out", instance.refs["schedule" + index][0]);
} else {
if (hasClass(instance.refs["dynamic" + index][0], "card-active")) return;
toggleClass(false, "card-in", instance.refs["dynamic" + index][0]);
toggleClass(true, "card-out", instance.refs["dynamic" + index][0]);
router.push({ path });
}
// showMenuModel(item?.path, item?.query);
}
watch(
() => visible.value,
val => {
if (val) {
document.body.addEventListener("click", closeMenu);
} else {
document.body.removeEventListener("click", closeMenu);
}
}
);
onBeforeMount(() => {
if (!instance) return;
@@ -626,14 +452,18 @@ onBeforeMount(() => {
});
});
const getTabStyle = computed((): CSSProperties => {
return {
transform: `translateX(${translateX.value}px)`
};
watch([route], () => {
activeIndex.value = -1;
dynamicTagView();
});
const getContextMenuStyle = computed((): CSSProperties => {
return { left: buttonLeft.value + "px", top: buttonTop.value + "px" };
onMounted(() => {
useResizeObserver(
scrollbarDom,
useDebounceFn(() => {
dynamicTagView();
}, 200)
);
});
</script>
@@ -705,7 +535,7 @@ const getContextMenuStyle = computed((): CSSProperties => {
>
<li v-if="item.show" @click="selectTag(key, item)">
<component :is="toRaw(item.icon)" :key="key" />
{{ t(item.text) }}
{{ transformI18n(item.text) }}
</li>
</div>
</ul>
@@ -714,7 +544,7 @@ const getContextMenuStyle = computed((): CSSProperties => {
<ul class="right-button">
<li>
<span
:title="t('buttons.hsrefreshRoute')"
:title="transformI18n('buttons.hsrefreshRoute')"
class="el-icon-refresh-right rotate"
@click="onFresh"
>
@@ -742,7 +572,7 @@ const getContextMenuStyle = computed((): CSSProperties => {
:key="key"
style="margin-right: 6px"
/>
{{ t(item.text) }}
{{ transformI18n(item.text) }}
</el-dropdown-item>
</el-dropdown-menu>
</template>

View File

@@ -13,7 +13,7 @@ import {
} from "@pureadmin/theme/dist/browser-utils";
export function useDataThemeChange() {
const { layoutTheme } = useLayout();
const { layoutTheme, layout } = useLayout();
const themeColors = ref<Array<themeColorsType>>([
/* 道奇蓝(默认) */
{ color: "#1b2a47", themeColor: "default" },
@@ -36,7 +36,7 @@ export function useDataThemeChange() {
]);
const { $storage } = useGlobal<GlobalPropertiesApi>();
const dataTheme = ref<boolean>($storage?.layout?.darkMode);
const body = document.documentElement as HTMLElement;
/** 设置导航主题色 */
@@ -45,8 +45,13 @@ export function useDataThemeChange() {
toggleTheme({
scopeName: `layout-theme-${theme}`
});
$storage.layout.theme = theme;
$storage.layout.darkMode = dataTheme.value;
$storage.layout = {
layout: layout.value,
theme,
darkMode: dataTheme.value,
sidebarStatus: $storage.layout?.sidebarStatus,
epThemeColor: $storage.layout?.epThemeColor
};
if (theme === "default" || theme === "light") {
setEpThemeColor(getConfig().EpThemeColor);
@@ -82,7 +87,6 @@ export function useDataThemeChange() {
);
}
};
const dataTheme = ref<boolean>($storage?.layout?.darkMode);
/** 日间、夜间主题切换 */
function dataThemeChange() {
@@ -94,10 +98,8 @@ export function useDataThemeChange() {
}
if (dataTheme.value) {
$storage.layout.darkMode = true;
document.documentElement.classList.add("dark");
} else {
$storage.layout.darkMode = false;
document.documentElement.classList.remove("dark");
}
}

218
src/layout/hooks/useTag.ts Normal file
View File

@@ -0,0 +1,218 @@
import {
ref,
unref,
watch,
computed,
reactive,
onMounted,
CSSProperties,
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 { useMultiTagsStoreHook } from "/@/store/modules/multiTags";
import { storageLocal, toggleClass, hasClass } from "@pureadmin/utils";
import close from "/@/assets/svg/close.svg?component";
import refresh from "/@/assets/svg/refresh.svg?component";
import closeAll from "/@/assets/svg/close_all.svg?component";
import closeLeft from "/@/assets/svg/close_left.svg?component";
import closeOther from "/@/assets/svg/close_other.svg?component";
import closeRight from "/@/assets/svg/close_right.svg?component";
export function useTags() {
const route = useRoute();
const router = useRouter();
const instance = getCurrentInstance();
const buttonTop = ref(0);
const buttonLeft = ref(0);
const translateX = ref(0);
const visible = ref(false);
const activeIndex = ref(-1);
// 当前右键选中的路由信息
const currentSelect = ref({});
/** 显示模式,默认灵动模式 */
const showModel = ref(
storageLocal.getItem<StorageConfigs>("responsive-configure")?.showModel ||
"smart"
);
/** 是否隐藏标签页,默认显示 */
const showTags =
ref(
storageLocal.getItem<StorageConfigs>("responsive-configure").hideTabs
) ?? ref("false");
const multiTags: any = computed(() => {
return useMultiTagsStoreHook().multiTags;
});
const tagsViews = reactive<Array<tagsViewsType>>([
{
icon: refresh,
text: $t("buttons.hsreload"),
divided: false,
disabled: false,
show: true
},
{
icon: close,
text: $t("buttons.hscloseCurrentTab"),
divided: false,
disabled: multiTags.value.length > 1 ? false : true,
show: true
},
{
icon: closeLeft,
text: $t("buttons.hscloseLeftTabs"),
divided: true,
disabled: multiTags.value.length > 1 ? false : true,
show: true
},
{
icon: closeRight,
text: $t("buttons.hscloseRightTabs"),
divided: false,
disabled: multiTags.value.length > 1 ? false : true,
show: true
},
{
icon: closeOther,
text: $t("buttons.hscloseOtherTabs"),
divided: true,
disabled: multiTags.value.length > 2 ? false : true,
show: true
},
{
icon: closeAll,
text: $t("buttons.hscloseAllTabs"),
divided: false,
disabled: multiTags.value.length > 1 ? false : true,
show: true
}
]);
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) {
return isEqual(route.query, item.query) ? previous : next;
} else {
return isEqual(route.params, item.params) ? previous : next;
}
}
const iconIsActive = computed(() => {
return (item, index) => {
if (index === 0) return;
return conditionHandle(item, true, false);
};
});
const linkIsActive = computed(() => {
return item => {
return conditionHandle(item, "is-active", "");
};
});
const scheduleIsActive = computed(() => {
return item => {
return conditionHandle(item, "schedule-active", "");
};
});
const getTabStyle = computed((): CSSProperties => {
return {
transform: `translateX(${translateX.value}px)`
};
});
const getContextMenuStyle = computed((): CSSProperties => {
return { left: buttonLeft.value + "px", top: buttonTop.value + "px" };
});
const closeMenu = () => {
visible.value = false;
};
/** 鼠标移入添加激活样式 */
function onMouseenter(index) {
if (index) activeIndex.value = index;
if (unref(showModel) === "smart") {
if (hasClass(instance.refs["schedule" + index][0], "schedule-active"))
return;
toggleClass(true, "schedule-in", instance.refs["schedule" + index][0]);
toggleClass(false, "schedule-out", instance.refs["schedule" + index][0]);
} else {
if (hasClass(instance.refs["dynamic" + index][0], "card-active")) return;
toggleClass(true, "card-in", instance.refs["dynamic" + index][0]);
toggleClass(false, "card-out", instance.refs["dynamic" + index][0]);
}
}
/** 鼠标移出恢复默认样式 */
function onMouseleave(index) {
activeIndex.value = -1;
if (unref(showModel) === "smart") {
if (hasClass(instance.refs["schedule" + index][0], "schedule-active"))
return;
toggleClass(false, "schedule-in", instance.refs["schedule" + index][0]);
toggleClass(true, "schedule-out", instance.refs["schedule" + index][0]);
} else {
if (hasClass(instance.refs["dynamic" + index][0], "card-active")) return;
toggleClass(false, "card-in", instance.refs["dynamic" + index][0]);
toggleClass(true, "card-out", instance.refs["dynamic" + index][0]);
}
}
onMounted(() => {
if (!showModel.value) {
const configure = storageLocal.getItem<StorageConfigs>(
"responsive-configure"
);
configure.showModel = "card";
storageLocal.setItem("responsive-configure", configure);
}
});
watch(
() => visible.value,
() => {
useEventListener(document, "click", closeMenu);
}
);
return {
route,
router,
visible,
showTags,
instance,
multiTags,
showModel,
tagsViews,
buttonTop,
buttonLeft,
translateX,
activeIndex,
getTabStyle,
iconIsActive,
linkIsActive,
currentSelect,
scheduleIsActive,
getContextMenuStyle,
$t,
closeMenu,
onMounted,
onMouseenter,
onMouseleave,
transformI18n
};
}

View File

@@ -22,6 +22,7 @@ export type RouteConfigs = {
path?: string;
parentPath?: string;
query?: object;
params?: object;
meta?: routeMetaType;
children?: RouteConfigs[];
name?: string;

View File

@@ -8,17 +8,14 @@ import { useMultiTagsStoreHook } from "/@/store/modules/multiTags";
import { usePermissionStoreHook } from "/@/store/modules/permission";
import {
Router,
RouteMeta,
createRouter,
RouteRecordRaw,
RouteComponent,
RouteRecordName
RouteComponent
} from "vue-router";
import {
ascending,
initRouter,
getHistoryMode,
getParentPaths,
findRouteByPath,
handleAliveRoute,
formatTwoStageRoutes,
@@ -148,32 +145,6 @@ router.beforeEach((to: toRouteType, _from, next) => {
if (usePermissionStoreHook().wholeMenus.length === 0)
initRouter(name.username).then((router: Router) => {
if (!useMultiTagsStoreHook().getMultiTagsCache) {
const handTag = (
path: string,
parentPath: string,
name: RouteRecordName,
meta: RouteMeta
): void => {
useMultiTagsStoreHook().handleTags("push", {
path,
parentPath,
name,
meta
});
};
// 未开启标签页缓存,刷新页面重定向到顶级路由(参考标签页操作例子,只针对静态路由)
if (to.meta?.refreshRedirect) {
const routes: any = router.options.routes;
const { refreshRedirect } = to.meta;
const { name, meta } = findRouteByPath(refreshRedirect, routes);
handTag(
refreshRedirect,
getParentPaths(refreshRedirect, routes)[1],
name,
meta
);
return router.push(refreshRedirect);
} else {
const { path } = to;
const index = findIndex(remainingRouter, v => {
return v.path == path;
@@ -183,34 +154,13 @@ router.beforeEach((to: toRouteType, _from, next) => {
? router.options.routes[0].children
: router.options.routes;
const route = findRouteByPath(path, routes);
const routePartent = getParentPaths(path, routes);
// 未开启标签页缓存,刷新页面重定向到顶级路由(参考标签页操作例子,只针对动态路由)
if (
path !== routes[0].path &&
route?.meta?.rank !== 0 &&
routePartent.length === 0
) {
if (!route?.meta?.refreshRedirect) return;
const { name, meta } = findRouteByPath(
route.meta.refreshRedirect,
routes
);
handTag(
route.meta?.refreshRedirect,
getParentPaths(route.meta?.refreshRedirect, routes)[0],
name,
meta
);
return router.push(route.meta?.refreshRedirect);
} else {
handTag(
route.path,
routePartent[routePartent.length - 1],
route.name,
route.meta
);
return router.push(path);
}
// query、params模式路由传参数的标签页不在此处处理
if (route && route.meta?.title) {
useMultiTagsStoreHook().handleTags("push", {
path: route.path,
name: route.name,
meta: route.meta
});
}
}
router.push(to.fullPath);

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const ableRouter: RouteConfigsTable = {
path: "/able",
component: Layout,
redirect: "/able/watermark",
meta: {
icon: "ubuntu-fill",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const aboutRouter: RouteConfigsTable = {
path: "/about",
component: Layout,
redirect: "/about/index",
meta: {
// icon: "question-line",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const componentsRouter: RouteConfigsTable = {
path: "/components",
component: Layout,
redirect: "/components/video",
meta: {
icon: "menu",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const editorRouter: RouteConfigsTable = {
path: "/editor",
component: Layout,
redirect: "/editor/index",
meta: {
icon: "edit",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const errorRouter: RouteConfigsTable = {
path: "/error",
component: Layout,
redirect: "/error/403",
meta: {
icon: "information-line",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const flowChartRouter: RouteConfigsTable = {
path: "/flowChart",
component: Layout,
redirect: "/flowChart/index",
meta: {
icon: "set-up",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const formDesignRouter: RouteConfigsTable = {
path: "/formDesign",
component: Layout,
redirect: "/formDesign/index",
meta: {
icon: "terminal-window-line",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const guideRouter: RouteConfigsTable = {
path: "/guide",
component: Layout,
redirect: "/guide/index",
meta: {
icon: "guide",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const ableRouter: RouteConfigsTable = {
path: "/list",
component: Layout,
redirect: "/list/card",
meta: {
icon: "list-check",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const nestedRouter: RouteConfigsTable = {
path: "/nested",
component: Layout,
redirect: "/nested/menu1/menu1-1",
meta: {
title: $t("menus.hsmenus"),

View File

@@ -1,10 +1,8 @@
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const IFrame = () => import("/@/layout/frameView.vue");
const pptRouter: RouteConfigsTable = {
path: "/ppt",
component: Layout,
redirect: "/ppt/index",
meta: {
icon: "ppt",

View File

@@ -1,10 +1,8 @@
import { $t } from "/@/plugins/i18n";
import type { RouteConfigsTable } from "/#/index";
const Layout = () => import("/@/layout/index.vue");
const resultRouter: RouteConfigsTable = {
path: "/result",
component: Layout,
redirect: "/result/success",
meta: {
icon: "checkbox-circle-line",

View File

@@ -3,7 +3,6 @@ import { RouteLocationNormalized } from "vue-router";
export interface toRouteType extends RouteLocationNormalized {
meta: {
keepAlive?: boolean;
refreshRedirect: string;
dynamicLevel?: string;
};
}

View File

@@ -7,13 +7,13 @@ import {
RouteRecordNormalized
} from "vue-router";
import { router } from "./index";
import { isProxy, toRaw } from "vue";
import { loadEnv } from "../../build";
import { cloneDeep } from "lodash-unified";
import { useTimeoutFn } from "@vueuse/core";
import { RouteConfigs } from "/@/layout/types";
import { buildHierarchyTree } from "@pureadmin/utils";
import { usePermissionStoreHook } from "/@/store/modules/permission";
const Layout = () => import("/@/layout/index.vue");
const IFrame = () => import("/@/layout/frameView.vue");
// https://cn.vitejs.dev/guide/features.html#glob-import
const modulesRoutes = import.meta.glob("/src/views/**/*.{vue,tsx}");
@@ -87,7 +87,7 @@ function getParentPaths(path: string, routes: RouteRecordRaw[]) {
function findRouteByPath(path: string, routes: RouteRecordRaw[]) {
let res = routes.find((item: { path: string }) => item.path == path);
if (res) {
return res;
return isProxy(res) ? toRaw(res) : res;
} else {
for (let i = 0; i < routes.length; i++) {
if (
@@ -96,7 +96,7 @@ function findRouteByPath(path: string, routes: RouteRecordRaw[]) {
) {
res = findRouteByPath(path, routes[i].children);
if (res) {
return res;
return isProxy(res) ? toRaw(res) : res;
}
}
}
@@ -229,18 +229,22 @@ function addAsyncRoutes(arrRoutes: Array<RouteRecordRaw>) {
arrRoutes.forEach((v: RouteRecordRaw) => {
// 将backstage属性加入meta标识此路由为后端返回路由
v.meta.backstage = true;
if (v.redirect) {
v.component = Layout;
} else if (v.meta?.frameSrc) {
// 父级的redirect属性取值如果子级存在且父级的redirect属性不存在默认取第一个子级的path如果子级存在且父级的redirect属性存在取存在的redirect属性会覆盖默认值
if (v?.children && v.children.length && !v.redirect)
v.redirect = v.children[0].path;
// 父级的name属性取值如果子级存在且父级的name属性不存在默认取第一个子级的name如果子级存在且父级的name属性存在取存在的name属性会覆盖默认值
if (v?.children && v.children.length && !v.name)
v.name = v.children[0].name;
if (v.meta?.frameSrc) {
v.component = IFrame;
} else {
// 对后端传component组件路径和不传做兼容如果后端传component组件路径那么path可以随便写如果不传component组件路径会path保持一致
// 对后端传component组件路径和不传做兼容如果后端传component组件路径那么path可以随便写如果不传component组件路径会path保持一致
const index = v?.component
? modulesRoutesKeys.findIndex(ev => ev.includes(v.component as any))
: modulesRoutesKeys.findIndex(ev => ev.includes(v.path));
v.component = modulesRoutes[modulesRoutesKeys[index]];
}
if (v.children) {
if (v?.children && v.children.length) {
addAsyncRoutes(v.children);
}
});

View File

@@ -48,9 +48,13 @@ export const useMultiTagsStore = defineStore({
case "push":
{
const tagVal = value as multiType;
// 不添加到标签页
if (tagVal?.meta?.hiddenTag) return;
// 如果是外链无需添加信息到标签页
if (isUrl(tagVal?.name)) return;
// 如果title为空拒绝添加空信息到标签页
if (tagVal?.meta?.title.length === 0) return;
const tagPath = tagVal?.path;
const tagPath = tagVal.path;
// 判断tag是否已存在
const tagHasExits = this.multiTags.some(tag => {
return tag.path === tagPath;
@@ -58,20 +62,24 @@ export const useMultiTagsStore = defineStore({
// 判断tag中的query键值是否相等
const tagQueryHasExits = this.multiTags.some(tag => {
return isEqual(tag.query, tagVal?.query);
return isEqual(tag?.query, tagVal?.query);
});
if (tagHasExits && tagQueryHasExits) return;
// 判断tag中的params键值是否相等
const tagParamsHasExits = this.multiTags.some(tag => {
return isEqual(tag?.params, tagVal?.params);
});
if (tagHasExits && tagQueryHasExits && tagParamsHasExits) return;
// 动态路由可打开的最大数量
const dynamicLevel = tagVal?.meta?.dynamicLevel ?? -1;
if (dynamicLevel > 0) {
// dynamicLevel动态路由可打开的数量
// 获取到已经打开的动态路由数, 判断是否大于dynamicLevel
if (
this.multiTags.filter(e => e?.path === tagPath).length >=
dynamicLevel
) {
// 关闭第一个
// 如果当前已打开的动态路由数大于dynamicLevel替换第一个动态路由标签
const index = this.multiTags.findIndex(
item => item?.path === tagPath
);

View File

@@ -27,6 +27,7 @@ export type multiType = {
name: string;
meta: any;
query?: object;
params?: object;
};
export type setType = {

View File

@@ -51,7 +51,7 @@ export function useColumns() {
label: "QQ交流群",
cellRenderer: () => {
return (
<a href="https://jq.qq.com/?_wv=1027&k=HntMx0dt" target="_blank">
<a href="https://jq.qq.com/?_wv=1027&k=E9fwmFGr" target="_blank">
<span style="color: var(--el-color-primary)">
Pure Admin
</span>

View File

@@ -5,26 +5,48 @@ import { onBeforeMount } from "vue";
export function useDetail() {
const route = useRoute();
const router = useRouter();
const id = route.query?.id ?? -1;
const id = route.query?.id ? route.query?.id : route.params?.id;
function toDetail(index: number | string | string[] | number[]) {
function toDetail(
index: number | string | string[] | number[],
model: string
) {
if (model === "query") {
// 保存信息到标签页
useMultiTagsStoreHook().handleTags("push", {
path: `/tabs/detail`,
parentPath: route.matched[0].path,
name: "TabDetail",
path: `/tabs/query-detail`,
name: "TabQueryDetail",
query: { id: String(index) },
meta: {
title: { zh: `No.${index} - 详情信息`, en: `No.${index} - DetailInfo` },
showLink: false,
title: {
zh: `No.${index} - 详情信息`,
en: `No.${index} - DetailInfo`
},
// 最大打开标签数
dynamicLevel: 3
}
});
router.push({ name: "TabDetail", query: { id: String(index) } });
// 路由跳转
router.push({ name: "TabQueryDetail", query: { id: String(index) } });
} else {
useMultiTagsStoreHook().handleTags("push", {
path: `/tabs/params-detail/:id`,
name: "TabParamsDetail",
params: { id: String(index) },
meta: {
title: {
zh: `No.${index} - 详情信息`,
en: `No.${index} - DetailInfo`
}
}
});
router.push({ name: "TabParamsDetail", params: { id: String(index) } });
}
}
function initToDetail() {
function initToDetail(model) {
onBeforeMount(() => {
if (id) toDetail(id);
if (id) toDetail(id, model);
});
}

View File

@@ -6,8 +6,8 @@ import { useMultiTagsStoreHook } from "/@/store/modules/multiTags";
import { usePermissionStoreHook } from "/@/store/modules/permission";
import {
deleteChildren,
appendFieldByUniqueId,
getNodeByUniqueId
getNodeByUniqueId,
appendFieldByUniqueId
} from "@pureadmin/utils";
import { useDetail } from "./hooks";
@@ -50,9 +50,32 @@ function onCloseTags() {
<template #header>
<div>标签页复用超出限制自动关闭使用场景: 动态路由</div>
</template>
<el-button v-for="index in 6" :key="index" @click="toDetail(index)">
<div class="flex-wrap items-center">
<p>query传参模式</p>
<el-button
class="m-2"
v-for="index in 6"
:key="index"
@click="toDetail(index, 'query')"
>
打开{{ index }}详情页
</el-button>
</div>
<el-divider />
<div class="flex-wrap items-center">
<p>params传参模式</p>
<el-button
class="m-2"
v-for="index in 6"
:key="index"
@click="toDetail(index, 'params')"
>
打开{{ index }}详情页
</el-button>
</div>
<el-divider />
<TreeSelect
class="w-300px"
@@ -80,19 +103,27 @@ function onCloseTags() {
<span>{{ transformI18n(data.meta.title) }}</span>
</template>
</TreeSelect>
<el-button class="ml-2" @click="onCloseTags">关闭标签</el-button>
<br />
<p class="mt-4">
注意此demo并未开启标签页缓存如果需要在
<span class="text-red-500">刷新页面</span>
的时候同时
<span class="text-red-500">保留标签页的显示</span>
或者
<span class="text-red-500">保留url的参数</span>
那么就需要开启标签页持久化
<br />
开启方式在页面最右上角有个设置的小图标点进去会看到项目配置面板找到标签页持久化开启即可
</p>
<el-button class="m-2" @click="onCloseTags">关闭标签</el-button>
<el-divider />
<el-button @click="$router.push({ name: 'Menu1-2-2' })">
跳转页内菜单传name对象优先推荐
</el-button>
<el-button @click="$router.push('/nested/menu1/menu1-2/menu1-2-2')">
跳转页内菜单直接传要跳转的路径
</el-button>
<el-button
@click="$router.push({ path: '/nested/menu1/menu1-2/menu1-2-2' })"
>
跳转页内菜单传path对象
</el-button>
<el-link
class="ml-4"
href="https://router.vuejs.org/zh/guide/essentials/navigation.html#%E5%AF%BC%E8%88%AA%E5%88%B0%E4%B8%8D%E5%90%8C%E7%9A%84%E4%BD%8D%E7%BD%AE"
target="_blank"
>
点击查看更多跳转方式
</el-link>
<el-divider />
<el-button @click="$router.push({ name: 'Empty' })">

View File

@@ -0,0 +1,14 @@
<script setup lang="ts">
import { useDetail } from "./hooks";
defineOptions({
name: "TabParamsDetail"
});
const { initToDetail, id } = useDetail();
initToDetail("params");
</script>
<template>
<div>{{ id }} - 详情页内容在此params传参</div>
</template>

View File

@@ -2,13 +2,13 @@
import { useDetail } from "./hooks";
defineOptions({
name: "TabDetail"
name: "TabQueryDetail"
});
const { initToDetail, id } = useDetail();
initToDetail();
initToDetail("query");
</script>
<template>
<div>{{ id }} - 详情页内容在此</div>
<div>{{ id }} - 详情页内容在此query传参</div>
</template>

View File

@@ -54,7 +54,7 @@ export interface ResponsiveStorage {
export interface RouteChildrenConfigsTable {
/** 子路由地址 `必填` */
path: string;
/** 路由名字(对应不要重复,当前组件的`name`保持一致)`必填` */
/** 路由名字(对应不要重复,当前组件的`name`保持一致)`必填` */
name?: string;
/** 路由重定向 `可选` */
redirect?: string;
@@ -94,10 +94,10 @@ export interface RouteChildrenConfigsTable {
/** 离场动画 */
leaveTransition?: string;
};
// 是否不添加信息到标签页,(默认`false`
hiddenTag?: boolean;
/** 动态路由可打开的最大数量 `可选` */
dynamicLevel?: number;
/** 刷新重定向(用于未开启标签页缓存,刷新页面获取不到动态`title``可选` */
refreshRedirect?: string;
};
/** 子路由配置项 */
children?: Array<RouteChildrenConfigsTable>;

View File

@@ -38,7 +38,7 @@ export default defineConfig({
shortcuts: {
"bg-dark": "bg-bg_color",
"wh-full": "w-full h-full",
"cp-on": "cursor-pointer outline-none",
"flex-wrap": "flex flex-wrap",
"flex-c": "flex justify-center items-center",
"flex-ac": "flex justify-around items-center",
"flex-bc": "flex justify-between items-center",

View File

@@ -70,6 +70,8 @@ export default ({ command, mode }: ConfigEnv): UserConfigExport => {
chunkSizeWarningLimit: 4000
},
define: {
"process.platform": null,
"process.version": null,
__INTLIFY_PROD_DEVTOOLS__: false,
__APP_INFO__: JSON.stringify(__APP_INFO__)
}