mirror of
https://github.com/pure-admin/vue-pure-admin.git
synced 2025-11-03 13:44:47 +08:00
Compare commits
9 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
5734d0391f | ||
|
|
e81fb5bb10 | ||
|
|
0c5ecd0a4e | ||
|
|
1d76946968 | ||
|
|
297319f668 | ||
|
|
e23971b680 | ||
|
|
18927d4750 | ||
|
|
33bd64d9ff | ||
|
|
667ef918fc |
@@ -1,3 +1,19 @@
|
||||
# 3.8.7 (2022-11-28)
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
- perf: Great package optimization, please be sure to upgrade! Use `unplugin-vue-define-options` to replace `unplugin-vue-macros`, the packaging speed is increased several times, use `unplugin-vue-macros` to take `mac` with moderate performance as an example, the packaging time of the full version is` 6` minutes😭, after replacing it with `unplugin-vue-define-options`, the packaging time on the same computer is `50` seconds☺️
|
||||
|
||||
# 3.8.6 (2022-11-27)
|
||||
|
||||
### 🎫 Feat
|
||||
|
||||
- Add `message` message prompt function, compatible with `Element Plus` and `Ant Design` two `Message` style styles, use and package size are extremely low cost and adapt to dark mode, really fragrant 😂
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
- perf: No need to install `@vue/runtime-core`, compatible with `volar` hints of all `element-plus` components
|
||||
|
||||
# 3.8.5 (2022-11-26)
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
16
CHANGELOG.md
16
CHANGELOG.md
@@ -1,3 +1,19 @@
|
||||
# 3.8.7 (2022-11-28)
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
- perf: Great package optimization, please be sure to upgrade! Use `unplugin-vue-define-options` to replace `unplugin-vue-macros`, the packaging speed is increased several times, use `unplugin-vue-macros` to take `mac` with moderate performance as an example, the packaging time of the full version is` 6` minutes😭, after replacing it with `unplugin-vue-define-options`, the packaging time on the same computer is `50` seconds☺️
|
||||
|
||||
# 3.8.6 (2022-11-27)
|
||||
|
||||
### 🎫 Feat
|
||||
|
||||
- Add `message` message prompt function, compatible with `Element Plus` and `Ant Design` two `Message` style styles, use and package size are extremely low cost and adapt to dark mode, really fragrant 😂
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
- perf: No need to install `@vue/runtime-core`, compatible with `volar` hints of all `element-plus` components
|
||||
|
||||
# 3.8.5 (2022-11-26)
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
@@ -1,3 +1,19 @@
|
||||
# 3.8.7 (2022-11-28)
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
- perf: 打包大优化，请务必升级！使用 `unplugin-vue-define-options` 替换 `unplugin-vue-macros` ，打包速度提升数倍，使用 `unplugin-vue-macros` 以性能中等偏上的 `mac` 为例完整版打包时长为 `6` 分钟 😭，使用 `unplugin-vue-define-options` 替换后，相同电脑下打包时长为 `50` 秒 ☺️
|
||||
|
||||
# 3.8.6 (2022-11-27)
|
||||
|
||||
### 🎫 Feat
|
||||
|
||||
- 添加 `message` 消息提示函数，兼容 `Element Plus` 和 `Ant Design` 两种 `Message` 样式风格，使用和打包大小成本极低并适配暗黑模式，真香 😂
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
- perf: 无需安装 `@vue/runtime-core` ，兼容所有 `element-plus` 组件的 `volar` 提示
|
||||
|
||||
# 3.8.5 (2022-11-26)
|
||||
|
||||
### 🍏 Perf
|
||||
|
||||
@@ -10,6 +10,13 @@
|
||||
|
||||
`vue-pure-admin` is an open source free and out-of-the-box middle and background management system template. Developed using the latest mainstream technologies such as `Vue3`, `Vite`, `Element-Plus`, `TypeScript`, `Pinia`, `Tailwindcss`
|
||||
|
||||
## Thin version (offering non-internationalized and internationalized versions)
|
||||
|
||||
The simplified version is based on the shelf extracted from [vue-pure-admin](https://github.com/xiaoxian521/vue-pure-admin), which contains main functions and is more suitable for actual project development. The packaged size is introduced globally [element-plus](https://element-plus.org) is still below `2.3MB`, and the full version of the code will be permanently synchronized. After enabling `brotli` compression and `cdn` to replace the local library mode, the package size is less than `350kb`
|
||||
|
||||
- [Click me to view the non-internationalized version](https://github.com/xiaoxian521/pure-admin-thin)
|
||||
- [Click me to view Internationalization version](https://github.com/xiaoxian521/pure-admin-thin/tree/i18n)
|
||||
|
||||
## Supporting Video
|
||||
|
||||
- [Click Watch Tutorial](https://www.bilibili.com/video/BV1kg411v7QT)
|
||||
@@ -20,11 +27,6 @@
|
||||
- [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)
|
||||
|
||||
## Thin version (offering non-internationalized and internationalized versions)
|
||||
|
||||
- [Click me to view the non-internationalized version](https://github.com/xiaoxian521/pure-admin-thin)
|
||||
- [Click me to view Internationalization version](https://github.com/xiaoxian521/pure-admin-thin/tree/i18n)
|
||||
|
||||
## Tauri
|
||||
|
||||
- [Click Watch Tauri](https://github.com/xiaoxian521/tauri-pure-admin)
|
||||
|
||||
12
README.md
12
README.md
@@ -10,6 +10,13 @@
|
||||
|
||||
`vue-pure-admin` 是一款开源免费且开箱即用的中后台管理系统模版。使用了最新的 `Vue3`、`Vite`、`Element-Plus`、`TypeScript`、`Pinia`、`Tailwindcss` 等主流技术开发
|
||||
|
||||
## 精简版（实际项目开发请用精简版，提供 `非国际化` 、`国际化` 两个版本选择）
|
||||
|
||||
精简版是基于 [vue-pure-admin](https://github.com/xiaoxian521/vue-pure-admin) 提炼出的架子，包含主体功能，更适合实际项目开发，打包后的大小在全局引入 [element-plus](https://element-plus.org) 的情况下仍然低于 `2.3MB`，并且会永久同步完整版的代码。开启 `brotli` 压缩和 `cdn` 替换本地库模式后，打包大小低于 `350kb`
|
||||
|
||||
- [点我查看非国际化精简版](https://github.com/xiaoxian521/pure-admin-thin)
|
||||
- [点我查看国际化精简版](https://github.com/xiaoxian521/pure-admin-thin/tree/i18n)
|
||||
|
||||
## 配套视频
|
||||
|
||||
- [点我查看快速开发教程](https://www.bilibili.com/video/BV1kg411v7QT)
|
||||
@@ -20,11 +27,6 @@
|
||||
- [点我查看国内文档站](https://yiming_chang.gitee.io/pure-admin-doc)
|
||||
- [点我查看国外文档站](https://xiaoxian521.github.io/pure-admin-doc)
|
||||
|
||||
## 精简版（实际项目开发请用精简版，提供 `非国际化` 、`国际化` 两个版本选择）
|
||||
|
||||
- [点我查看非国际化精简版](https://github.com/xiaoxian521/pure-admin-thin)
|
||||
- [点我查看国际化精简版](https://github.com/xiaoxian521/pure-admin-thin/tree/i18n)
|
||||
|
||||
## `Tauri` 版
|
||||
|
||||
- [点我查看 Tauri 版](https://github.com/xiaoxian521/tauri-pure-admin)
|
||||
|
||||
@@ -4,13 +4,13 @@ import vue from "@vitejs/plugin-vue";
|
||||
import { viteBuildInfo } from "./info";
|
||||
import svgLoader from "vite-svg-loader";
|
||||
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 { 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(
|
||||
@@ -32,7 +32,7 @@ export function getPluginsList(
|
||||
vueJsx(),
|
||||
VITE_CDN ? cdn : null,
|
||||
configCompressPlugin(VITE_COMPRESSION),
|
||||
VueMacros(),
|
||||
DefineOptions(),
|
||||
// 线上环境删除console
|
||||
removeConsole({ external: ["src/assets/iconfont/iconfont.js"] }),
|
||||
viteBuildInfo(),
|
||||
|
||||
@@ -37,6 +37,7 @@ menus:
|
||||
hsfourZeroOne: "403"
|
||||
hsFive: "500"
|
||||
hscomponents: Components
|
||||
hsmessage: Message Tips Components
|
||||
hsvideo: Video Components
|
||||
hsmap: Map Components
|
||||
hsdraggable: Draggable Components
|
||||
|
||||
@@ -37,6 +37,7 @@ menus:
|
||||
hsfourZeroOne: "403"
|
||||
hsFive: "500"
|
||||
hscomponents: 组件
|
||||
hsmessage: 消息提示组件
|
||||
hsvideo: 视频组件
|
||||
hsmap: 地图组件
|
||||
hsdraggable: 拖拽组件
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "vue-pure-admin",
|
||||
"version": "3.8.5",
|
||||
"version": "3.8.7",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "NODE_OPTIONS=--max-old-space-size=4096 vite",
|
||||
@@ -114,7 +114,6 @@
|
||||
"@vitejs/plugin-vue-jsx": "^2.1.1",
|
||||
"@vue/eslint-config-prettier": "^7.0.0",
|
||||
"@vue/eslint-config-typescript": "^11.0.2",
|
||||
"@vue/runtime-core": "^3.2.45",
|
||||
"autoprefixer": "^10.4.13",
|
||||
"cloc": "^2.10.0",
|
||||
"cssnano": "^5.1.14",
|
||||
@@ -145,7 +144,7 @@
|
||||
"tailwindcss": "^3.2.4",
|
||||
"terser": "^5.15.1",
|
||||
"typescript": "^4.9.3",
|
||||
"unplugin-vue-macros": "^1.0.3",
|
||||
"unplugin-vue-define-options": "^1.0.0",
|
||||
"vite": "3.1.8",
|
||||
"vite-plugin-cdn-import": "^0.3.5",
|
||||
"vite-plugin-compression": "^0.5.1",
|
||||
|
||||
273
pnpm-lock.yaml
generated
273
pnpm-lock.yaml
generated
@@ -40,7 +40,6 @@ specifiers:
|
||||
"@vitejs/plugin-vue-jsx": ^2.1.1
|
||||
"@vue/eslint-config-prettier": ^7.0.0
|
||||
"@vue/eslint-config-typescript": ^11.0.2
|
||||
"@vue/runtime-core": ^3.2.45
|
||||
"@vueuse/core": ^9.6.0
|
||||
"@vueuse/motion": 2.0.0-beta.12
|
||||
"@wangeditor/editor": ^5.1.21
|
||||
@@ -101,7 +100,7 @@ specifiers:
|
||||
terser: ^5.15.1
|
||||
typeit: ^8.7.0
|
||||
typescript: ^4.9.3
|
||||
unplugin-vue-macros: ^1.0.3
|
||||
unplugin-vue-define-options: ^1.0.0
|
||||
v-contextmenu: 3.0.0
|
||||
vite: 3.1.8
|
||||
vite-plugin-cdn-import: ^0.3.5
|
||||
@@ -211,7 +210,6 @@ devDependencies:
|
||||
"@vitejs/plugin-vue-jsx": 2.1.1_vite@3.1.8+vue@3.2.45
|
||||
"@vue/eslint-config-prettier": 7.0.0_5qrnzwqb344w6up62gv3safeoi
|
||||
"@vue/eslint-config-typescript": 11.0.2_5ma4o5namqj2syekqcvrgakwe4
|
||||
"@vue/runtime-core": 3.2.45
|
||||
autoprefixer: 10.4.13_postcss@8.4.19
|
||||
cloc: 2.10.0
|
||||
cssnano: 5.1.14_postcss@8.4.19
|
||||
@@ -242,7 +240,7 @@ devDependencies:
|
||||
tailwindcss: 3.2.4_postcss@8.4.19
|
||||
terser: 5.16.0
|
||||
typescript: 4.9.3
|
||||
unplugin-vue-macros: 1.0.3_5wosmox4cb7ovevlqdhap7knuu
|
||||
unplugin-vue-define-options: 1.0.0
|
||||
vite: 3.1.8_sass@1.56.1+terser@5.16.0
|
||||
vite-plugin-cdn-import: 0.3.5
|
||||
vite-plugin-compression: 0.5.1_vite@3.1.8
|
||||
@@ -271,13 +269,6 @@ packages:
|
||||
"@jridgewell/trace-mapping": 0.3.17
|
||||
dev: true
|
||||
|
||||
/@antfu/utils/0.6.3:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-sEYpyyKUPOew9QsXZ8feRVMzW6DWLviwOl+/ap06UQW02A8Srbc95CPHVm4eUbiBzBgD46eyIT+przv//KSSlQ==
|
||||
}
|
||||
dev: true
|
||||
|
||||
/@babel/code-frame/7.18.6:
|
||||
resolution:
|
||||
{
|
||||
@@ -1634,6 +1625,7 @@ packages:
|
||||
{
|
||||
integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==
|
||||
}
|
||||
dev: false
|
||||
|
||||
/@typescript-eslint/eslint-plugin/5.44.0_fnsv2sbzcckq65bwfk7a5xwslu:
|
||||
resolution:
|
||||
@@ -1932,30 +1924,6 @@ packages:
|
||||
"@volar/vue-language-core": 1.0.9
|
||||
dev: true
|
||||
|
||||
/@vue-macros/api/0.2.0:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-E0rhhszd3MSE8l+A78gj9ONs4lsqOLHpONNzrc7H2nlPhEDsp4ZyQt+A9rRfxX+BTeLYfq64mli2qRV0tixiaw==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
dependencies:
|
||||
"@babel/types": 7.20.2
|
||||
"@vue-macros/common": 0.13.4
|
||||
dev: true
|
||||
|
||||
/@vue-macros/better-define/1.0.0:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-SVQky3fk9wRrSH153Tw1+0sP5i6OB5iiUOtAC/mceH0IN5NGbDXt2YagELEM2+6caDquXNRL6jbG0HfRH6u0cA==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/api": 0.2.0
|
||||
"@vue-macros/common": 0.13.4
|
||||
unplugin: 1.0.0
|
||||
dev: true
|
||||
|
||||
/@vue-macros/common/0.13.4:
|
||||
resolution:
|
||||
{
|
||||
@@ -1968,158 +1936,6 @@ packages:
|
||||
magic-string: 0.26.7
|
||||
dev: true
|
||||
|
||||
/@vue-macros/define-model/1.0.0_@vueuse+core@9.6.0:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-Nyh1fidDcfCzEKAo/ljwdQbpgMOrNowdJomB/qnkz/Lx4CVEaRk87LA2o3T99qIOogRfya8af+bLM8dNOq8dAQ==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
peerDependencies:
|
||||
"@vueuse/core": ^9.0.0
|
||||
peerDependenciesMeta:
|
||||
"@vueuse/core":
|
||||
optional: true
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
"@vueuse/core": 9.6.0_vue@3.2.45
|
||||
ast-walker-scope: 0.3.0
|
||||
unplugin: 1.0.0
|
||||
dev: true
|
||||
|
||||
/@vue-macros/define-props/0.0.3_vue@3.2.45:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-GAiALWSrIogwdjbIe60Hi4CSvWFmZG7KySK8JBf7lszWNgoSirj/NKzmJOaHY0/I217tfq4Ew/brbdvcEhCikg==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
peerDependencies:
|
||||
vue: ^3.2.25
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
unplugin: 1.0.0
|
||||
vue: 3.2.45
|
||||
dev: true
|
||||
|
||||
/@vue-macros/define-render/1.0.1_vue@3.2.45:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-B4ttYDZkXqVuciN23WNuVnr6L8dKrxEvz74gaYTXbdybv9jLEYMagSm/nFBLin+32EGYKeZu/D393r2EGAzeNg==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
peerDependencies:
|
||||
vue: ^2.7.0 || ^3.0.0
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
unplugin: 1.0.0
|
||||
vue: 3.2.45
|
||||
dev: true
|
||||
|
||||
/@vue-macros/define-slots/0.0.6_vue@3.2.45:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-pK4P/oUjcrP/Rr5clsV2eZ53OJ3QlU2fZlnn91w++L0+lio+0M06ptr/IkHNVLNQ9U9Z43MkjHkMLX8Df8BknA==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
peerDependencies:
|
||||
vue: ^2.7.0 || ^3.0.0
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
unplugin: 1.0.0
|
||||
vue: 3.2.45
|
||||
dev: true
|
||||
|
||||
/@vue-macros/hoist-static/1.0.0:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-NcFVAfKM9UjChOXy+yno4vhTsSHT6qUKbmd4/I8ucoiJT8IfFyGCwFoZZ8uqgjIwlzSUDxJ/vYoDRjiziTiNKg==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
unplugin: 1.0.0
|
||||
dev: true
|
||||
|
||||
/@vue-macros/named-template/0.0.6_vite@3.1.8+vue@3.2.45:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-nEoutSYbwu7QC+uWcs90rD28erP6xZ0aU4uYnrxTUnVcbga9xMchxcs3MgI/2ax6dz/EXf1f1utYXXpGgLi+Tw==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vitejs/plugin-vue": 3.2.0_vite@3.1.8+vue@3.2.45
|
||||
"@vue-macros/common": 0.13.4
|
||||
"@vue/compiler-dom": 3.2.45
|
||||
unplugin: 1.0.0
|
||||
unplugin-combine: 0.2.8_vite@3.1.8
|
||||
transitivePeerDependencies:
|
||||
- esbuild
|
||||
- rollup
|
||||
- vite
|
||||
- vue
|
||||
- webpack
|
||||
dev: true
|
||||
|
||||
/@vue-macros/setup-block/0.0.1:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-Zr7yudMN7Q+8Rb/4ZuZzNewHTejeH9fbt3104sFK53XqL4uLkDCz0fIG2AD9bR71RA+12H+yqn/jQ3vP4OaKGA==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
"@vue/compiler-dom": 3.2.45
|
||||
unplugin: 1.0.0
|
||||
dev: true
|
||||
|
||||
/@vue-macros/setup-component/0.12.8_vite@3.1.8:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-2tRMl8l8OYMpIRYsZyAZfH0dNT7CONMTcmdGEffJb5GvK8XOmdgGk7NFUhaQg3EEnk1SUq1Kdcx+gyH/a0qE4A==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
unplugin: 1.0.0
|
||||
unplugin-combine: 0.2.8_vite@3.1.8
|
||||
transitivePeerDependencies:
|
||||
- esbuild
|
||||
- rollup
|
||||
- vite
|
||||
- webpack
|
||||
dev: true
|
||||
|
||||
/@vue-macros/setup-sfc/0.12.8:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-eOQxlY53GD/WkJrDHpDvHecWQ70Cw9aSYwS9eT1dQ9vWJVeJ/2R96z09GfYKz6cr9T00OPeZjftU5sC1FO+3xA==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
unplugin: 1.0.0
|
||||
dev: true
|
||||
|
||||
/@vue-macros/short-emits/1.0.1:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-iyCZu35uPOAUJOPrmJrc3pQdY8TswoRrF4Kfcga7xUPvE5ck0Yq4pmOIE+NKz/pGQzzOkxC1qMDc2kaoJ2qAzg==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/common": 0.13.4
|
||||
unplugin: 1.0.0
|
||||
dev: true
|
||||
|
||||
/@vue/babel-helper-vue-transform-on/1.0.2:
|
||||
resolution:
|
||||
{
|
||||
@@ -2329,6 +2145,7 @@ packages:
|
||||
transitivePeerDependencies:
|
||||
- "@vue/composition-api"
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/metadata/8.9.4:
|
||||
resolution:
|
||||
@@ -2342,6 +2159,7 @@ packages:
|
||||
{
|
||||
integrity: sha512-sIC8R+kWkIdpi5X2z2Gk8TRYzmczDwHRhEFfCu2P+XW2JdPoXrziqsGpDDsN7ykBx4ilwieS7JUIweVGhvZ93w==
|
||||
}
|
||||
dev: false
|
||||
|
||||
/@vueuse/motion/2.0.0-beta.12_vue@3.2.45:
|
||||
resolution:
|
||||
@@ -2392,6 +2210,7 @@ packages:
|
||||
transitivePeerDependencies:
|
||||
- "@vue/composition-api"
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@wangeditor/basic-modules/1.1.7_j7icpicfeimtkldwmemjnpdjs4:
|
||||
resolution:
|
||||
@@ -5926,14 +5745,6 @@ packages:
|
||||
wrap-ansi: 7.0.0
|
||||
dev: true
|
||||
|
||||
/local-pkg/0.4.2:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-mlERgSPrbxU3BP4qBqAvvwlgW4MTg78iwJdGGnv7kibKjWcJksrG3t6LB5lXI93wXRDvG4NpUgJFmTG4T6rdrg==
|
||||
}
|
||||
engines: { node: ">=14" }
|
||||
dev: true
|
||||
|
||||
/locate-path/5.0.0:
|
||||
resolution:
|
||||
{
|
||||
@@ -8721,32 +8532,6 @@ packages:
|
||||
engines: { node: ">= 0.8" }
|
||||
dev: true
|
||||
|
||||
/unplugin-combine/0.2.8_vite@3.1.8:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-Z38AC/TEjXbVyZ5HjVqo+lADj0/dcfwWC0Z4y0LNhybJzJQwmcMxm+ZsqHY3faauj4YigmlRMdptR5JEW9RuLg==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
peerDependencies:
|
||||
esbuild: ">=0.13"
|
||||
rollup: ^2.50.0
|
||||
vite: ^2.3.0 || ^3.0.0
|
||||
webpack: 4 || 5
|
||||
peerDependenciesMeta:
|
||||
esbuild:
|
||||
optional: true
|
||||
rollup:
|
||||
optional: true
|
||||
vite:
|
||||
optional: true
|
||||
webpack:
|
||||
optional: true
|
||||
dependencies:
|
||||
"@antfu/utils": 0.6.3
|
||||
unplugin: 0.10.2
|
||||
vite: 3.1.8_sass@1.56.1+terser@5.16.0
|
||||
dev: true
|
||||
|
||||
/unplugin-vue-define-options/1.0.0:
|
||||
resolution:
|
||||
{
|
||||
@@ -8760,51 +8545,6 @@ packages:
|
||||
unplugin: 1.0.0
|
||||
dev: true
|
||||
|
||||
/unplugin-vue-macros/1.0.3_5wosmox4cb7ovevlqdhap7knuu:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-QONC2iP0JNmIpbpL2jwsY89Lq6oTZf8JSbhQSVGB7xu+/iY52ZdfEB/bysai3lS5ScTH3M4y0KQHWVcyxBof7g==
|
||||
}
|
||||
engines: { node: ">=14.19.0" }
|
||||
peerDependencies:
|
||||
vue: ^2.7.0 || ^3.2.25
|
||||
dependencies:
|
||||
"@rollup/pluginutils": 4.2.1
|
||||
"@vue-macros/better-define": 1.0.0
|
||||
"@vue-macros/define-model": 1.0.0_@vueuse+core@9.6.0
|
||||
"@vue-macros/define-props": 0.0.3_vue@3.2.45
|
||||
"@vue-macros/define-render": 1.0.1_vue@3.2.45
|
||||
"@vue-macros/define-slots": 0.0.6_vue@3.2.45
|
||||
"@vue-macros/hoist-static": 1.0.0
|
||||
"@vue-macros/named-template": 0.0.6_vite@3.1.8+vue@3.2.45
|
||||
"@vue-macros/setup-block": 0.0.1
|
||||
"@vue-macros/setup-component": 0.12.8_vite@3.1.8
|
||||
"@vue-macros/setup-sfc": 0.12.8
|
||||
"@vue-macros/short-emits": 1.0.1
|
||||
local-pkg: 0.4.2
|
||||
unplugin-combine: 0.2.8_vite@3.1.8
|
||||
unplugin-vue-define-options: 1.0.0
|
||||
vue: 3.2.45
|
||||
transitivePeerDependencies:
|
||||
- "@vueuse/core"
|
||||
- esbuild
|
||||
- rollup
|
||||
- vite
|
||||
- webpack
|
||||
dev: true
|
||||
|
||||
/unplugin/0.10.2:
|
||||
resolution:
|
||||
{
|
||||
integrity: sha512-6rk7GUa4ICYjae5PrAllvcDeuT8pA9+j5J5EkxbMFaV+SalHhxZ7X2dohMzu6C3XzsMT+6jwR/+pwPNR3uK9MA==
|
||||
}
|
||||
dependencies:
|
||||
acorn: 8.8.1
|
||||
chokidar: 3.5.3
|
||||
webpack-sources: 3.2.3
|
||||
webpack-virtual-modules: 0.4.6
|
||||
dev: true
|
||||
|
||||
/unplugin/1.0.0:
|
||||
resolution:
|
||||
{
|
||||
@@ -9019,6 +8759,7 @@ packages:
|
||||
optional: true
|
||||
dependencies:
|
||||
vue: 3.2.45
|
||||
dev: false
|
||||
|
||||
/vue-eslint-parser/9.1.0_eslint@8.28.0:
|
||||
resolution:
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
{
|
||||
"Version": "3.8.5",
|
||||
"Version": "3.8.7",
|
||||
"Title": "PureAdmin",
|
||||
"FixedHeader": true,
|
||||
"HiddenSideBar": false,
|
||||
|
||||
@@ -5,8 +5,8 @@ const home = 0, // 平台规定只有 home 路由的 rank 才能为 0 ，所以
|
||||
utils = 2,
|
||||
table = 3,
|
||||
tree = 4,
|
||||
able = 5,
|
||||
components = 6,
|
||||
components = 5,
|
||||
able = 6,
|
||||
frame = 7,
|
||||
nested = 8,
|
||||
result = 9,
|
||||
@@ -28,8 +28,8 @@ export {
|
||||
utils,
|
||||
table,
|
||||
tree,
|
||||
able,
|
||||
components,
|
||||
able,
|
||||
frame,
|
||||
nested,
|
||||
result,
|
||||
|
||||
@@ -10,6 +10,22 @@ export default {
|
||||
rank: components
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: "/components/message",
|
||||
name: "Message",
|
||||
component: () => import("@/views/components/message/index.vue"),
|
||||
meta: {
|
||||
title: $t("menus.hsmessage"),
|
||||
extraIcon: {
|
||||
svg: true,
|
||||
name: "team-iconxinpinrenqiwang"
|
||||
},
|
||||
transition: {
|
||||
enterTransition: "animate__fadeInLeft",
|
||||
leaveTransition: "animate__fadeOutRight"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/components/video",
|
||||
name: "Video",
|
||||
@@ -47,11 +63,7 @@ export default {
|
||||
name: "SplitPane",
|
||||
component: () => import("@/views/components/split-pane/index.vue"),
|
||||
meta: {
|
||||
title: $t("menus.hssplitPane"),
|
||||
extraIcon: {
|
||||
svg: true,
|
||||
name: "team-iconxinpinrenqiwang"
|
||||
}
|
||||
title: $t("menus.hssplitPane")
|
||||
}
|
||||
},
|
||||
{
|
||||
|
||||
@@ -186,4 +186,25 @@ html.dark {
|
||||
.el-dropdown-menu__item:not(.is-disabled):hover {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
/* 克隆并自定义 ElMessage 样式，不会影响 ElMessage 原本样式，在 src/utils/message.ts 中调用自定义样式 ElMessage 方法即可，非暗黑模式在 src/style/element-plus.scss 文件进行了适配 */
|
||||
.pure-message {
|
||||
background-image: initial !important;
|
||||
background-color: rgb(36, 37, 37) !important;
|
||||
box-shadow: rgb(13 13 13 / 12%) 0px 3px 6px -4px,
|
||||
rgb(13 13 13 / 8%) 0px 6px 16px 0px, rgb(13 13 13 / 5%) 0px 9px 28px 8px !important;
|
||||
|
||||
& .el-message__content {
|
||||
color: $color-white !important;
|
||||
pointer-events: all !important;
|
||||
background-image: initial !important;
|
||||
}
|
||||
|
||||
& .el-message__closeBtn {
|
||||
&:hover {
|
||||
color: rgba(255, 255, 255, 0.85);
|
||||
background-color: rgba(255, 255, 255, 0.12);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -62,3 +62,37 @@
|
||||
border-left-color: var(--el-color-primary);
|
||||
}
|
||||
}
|
||||
|
||||
/* 克隆并自定义 ElMessage 样式，不会影响 ElMessage 原本样式，在 src/utils/message.ts 中调用自定义样式 ElMessage 方法即可，暗黑模式在 src/style/dark.scss 文件进行了适配 */
|
||||
.pure-message {
|
||||
border-width: 0 !important;
|
||||
background: #fff !important;
|
||||
padding: 10px 13px !important;
|
||||
box-shadow: 0 3px 6px -4px #0000001f, 0 6px 16px #00000014,
|
||||
0 9px 28px 8px #0000000d !important;
|
||||
|
||||
&.el-message.is-closable .el-message__content {
|
||||
padding-right: 17px !important;
|
||||
}
|
||||
|
||||
& .el-message__content {
|
||||
color: #000000d9 !important;
|
||||
pointer-events: all !important;
|
||||
background-image: initial !important;
|
||||
}
|
||||
|
||||
& .el-message__icon {
|
||||
margin-right: 8px !important;
|
||||
}
|
||||
|
||||
& .el-message__closeBtn {
|
||||
outline: none;
|
||||
border-radius: 4px;
|
||||
right: 9px !important;
|
||||
transition: background-color 0.2s, color 0.2s;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,32 +1,84 @@
|
||||
import { type VNode } from "vue";
|
||||
import { isFunction } from "@pureadmin/utils";
|
||||
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 messageStyle = "el" | "antd";
|
||||
type messageTypes = "info" | "success" | "warning" | "error";
|
||||
|
||||
type messageTypes = "success" | "info" | "warning" | "error";
|
||||
interface MessageParams {
|
||||
/** 消息类型，可选 `info` 、`success` 、`warning` 、`error` ，默认 `info` */
|
||||
type?: messageTypes;
|
||||
/** 自定义图标，该属性会覆盖 `type` 的图标 */
|
||||
icon?: any;
|
||||
/** 是否将 `message` 属性作为 `HTML` 片段处理，默认 `false` */
|
||||
dangerouslyUseHTMLString?: boolean;
|
||||
/** 消息风格，可选 `el` 、`antd` ，默认 `antd` */
|
||||
customClass?: messageStyle;
|
||||
/** 显示时间，单位为毫秒。设为 `0` 则不会自动关闭，`element-plus` 默认是 `3000` ，平台改成默认 `2000` */
|
||||
duration?: number;
|
||||
/** 是否显示关闭按钮，默认值 `false` */
|
||||
showClose?: boolean;
|
||||
/** 文字是否居中，默认值 `false` */
|
||||
center?: boolean;
|
||||
/** `Message` 距离窗口顶部的偏移量，默认 `20` */
|
||||
offset?: number;
|
||||
/** 设置组件的根元素，默认 `document.body` */
|
||||
appendTo?: string | HTMLElement;
|
||||
/** 合并内容相同的消息，不支持 `VNode` 类型的消息，默认值 `false` */
|
||||
grouping?: boolean;
|
||||
/** 关闭时的回调函数, 参数为被关闭的 `message` 实例 */
|
||||
onClose?: Function | null;
|
||||
}
|
||||
|
||||
/** 用法非常简单，参考 src/views/components/message/index.vue 文件 */
|
||||
|
||||
/**
|
||||
* `element-plus` 的 `info` 消息类型
|
||||
* `Message` 消息提示函数
|
||||
*/
|
||||
const message = (
|
||||
message: string,
|
||||
type = "info" as messageTypes,
|
||||
showClose = true,
|
||||
duration = 2000,
|
||||
center = false,
|
||||
grouping = false
|
||||
message: string | VNode | (() => VNode),
|
||||
params?: MessageParams
|
||||
): MessageHandler => {
|
||||
return ElMessage({
|
||||
message,
|
||||
type,
|
||||
showClose,
|
||||
duration,
|
||||
center,
|
||||
grouping
|
||||
});
|
||||
if (!params) {
|
||||
return ElMessage({
|
||||
message,
|
||||
customClass: "pure-message"
|
||||
});
|
||||
} else {
|
||||
const {
|
||||
icon,
|
||||
type = "info",
|
||||
dangerouslyUseHTMLString = false,
|
||||
customClass = "antd",
|
||||
duration = 2000,
|
||||
showClose = false,
|
||||
center = false,
|
||||
offset = 20,
|
||||
appendTo = document.body,
|
||||
grouping = false,
|
||||
onClose
|
||||
} = params;
|
||||
|
||||
return ElMessage({
|
||||
message,
|
||||
type,
|
||||
icon,
|
||||
dangerouslyUseHTMLString,
|
||||
duration,
|
||||
showClose,
|
||||
center,
|
||||
offset,
|
||||
appendTo,
|
||||
grouping,
|
||||
// 全局搜 pure-message 即可知道该类的样式位置
|
||||
customClass: customClass === "antd" ? "pure-message" : "",
|
||||
onClose: () => (isFunction(onClose) ? onClose() : null)
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 关闭 `element-plus` 的所有消息实例
|
||||
* 关闭所有 `Message` 消息提示函数
|
||||
*/
|
||||
const closeAllMessage = (): void => ElMessage.closeAll();
|
||||
|
||||
|
||||
@@ -1,17 +1,12 @@
|
||||
<script setup lang="ts">
|
||||
import { ElMessage } from "element-plus";
|
||||
import { message } from "@/utils/message";
|
||||
import { debounce, throttle } from "@pureadmin/utils";
|
||||
|
||||
defineOptions({
|
||||
name: "Debounce"
|
||||
});
|
||||
|
||||
const handle = () => {
|
||||
ElMessage({
|
||||
message: "恭喜你，这是一条成功消息",
|
||||
type: "success"
|
||||
});
|
||||
};
|
||||
const handle = () => message("恭喜你，这是一条成功消息", { type: "success" });
|
||||
|
||||
const immediateDebounce = debounce(handle, 1000, true);
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, unref } from "vue";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { message } from "@/utils/message";
|
||||
import ReQrcode from "@/components/ReQrcode";
|
||||
|
||||
defineOptions({
|
||||
@@ -14,10 +14,10 @@ setTimeout(() => {
|
||||
asyncTitle.value = unref(qrcodeText);
|
||||
}, 3000);
|
||||
const codeClick = () => {
|
||||
ElMessage.info("点击事件");
|
||||
message("点击事件", { type: "info" });
|
||||
};
|
||||
const disabledClick = () => {
|
||||
ElMessage.info("失效");
|
||||
message("失效", { type: "info" });
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
196
src/views/components/message/index.vue
Normal file
196
src/views/components/message/index.vue
Normal file
@@ -0,0 +1,196 @@
|
||||
<script setup lang="ts">
|
||||
import { h } from "vue";
|
||||
import hot from "@/assets/svg/hot.svg?component";
|
||||
import { message, closeAllMessage } from "@/utils/message";
|
||||
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
||||
|
||||
defineOptions({
|
||||
name: "Message"
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<el-card>
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span class="font-medium"> Message提示 </span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<h4 class="mb-4">element-plus 的消息提示，点击弹出提示信息</h4>
|
||||
|
||||
<el-space wrap>
|
||||
<el-button
|
||||
type="info"
|
||||
@click="message('Info类型消息', { customClass: 'el' })"
|
||||
>
|
||||
Info
|
||||
</el-button>
|
||||
<el-button
|
||||
type="success"
|
||||
@click="
|
||||
message('Success类型消息', { customClass: 'el', type: 'success' })
|
||||
"
|
||||
>
|
||||
Success
|
||||
</el-button>
|
||||
<el-button
|
||||
type="warning"
|
||||
@click="
|
||||
message('Warning类型消息', { customClass: 'el', type: 'warning' })
|
||||
"
|
||||
>
|
||||
Warning
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
@click="message('Error类型消息', { customClass: 'el', type: 'error' })"
|
||||
>
|
||||
Error
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="message('可关闭消息', { customClass: 'el', showClose: true })"
|
||||
>
|
||||
可关闭
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message('分组消息合并', {
|
||||
customClass: 'el',
|
||||
type: 'success',
|
||||
grouping: true
|
||||
})
|
||||
"
|
||||
>
|
||||
分组消息合并
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message('自定义消息图标', {
|
||||
customClass: 'el',
|
||||
icon: useRenderIcon('check')
|
||||
})
|
||||
"
|
||||
>
|
||||
自定义图标
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message('3秒后关闭', {
|
||||
customClass: 'el',
|
||||
duration: 3000,
|
||||
onClose: () =>
|
||||
message('消息已关闭', { customClass: 'el', type: 'success' })
|
||||
})
|
||||
"
|
||||
>
|
||||
自定义延时关闭时间并设置关闭后其他操作
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message(
|
||||
h('p', null, [
|
||||
h('span', null, 'Message can be '),
|
||||
h('i', { style: 'color: teal' }, 'VNode')
|
||||
]),
|
||||
{ customClass: 'el' }
|
||||
)
|
||||
"
|
||||
>
|
||||
自定义内容
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message('<strong>This is <i>HTML</i> string</strong>', {
|
||||
customClass: 'el',
|
||||
dangerouslyUseHTMLString: true
|
||||
})
|
||||
"
|
||||
>
|
||||
HTML 片段作为正文内容
|
||||
</el-button>
|
||||
</el-space>
|
||||
|
||||
<el-divider />
|
||||
|
||||
<h4 class="mb-4">
|
||||
类似 Ant Design 风格的消息提示，点击弹出提示信息（基于 ElMessage
|
||||
样式改版，不会影响 ElMessage
|
||||
原本样式，使用和打包大小成本极低并适配暗黑模式）
|
||||
</h4>
|
||||
|
||||
<el-space wrap>
|
||||
<el-button type="info" @click="message('Info类型消息')">Info</el-button>
|
||||
<el-button
|
||||
type="success"
|
||||
@click="message('Success类型消息', { type: 'success' })"
|
||||
>
|
||||
Success
|
||||
</el-button>
|
||||
<el-button
|
||||
type="warning"
|
||||
@click="message('Warning类型消息', { type: 'warning' })"
|
||||
>
|
||||
Warning
|
||||
</el-button>
|
||||
<el-button
|
||||
type="danger"
|
||||
@click="message('Error类型消息', { type: 'error' })"
|
||||
>
|
||||
Error
|
||||
</el-button>
|
||||
<el-button @click="message('可关闭消息', { showClose: true })">
|
||||
可关闭
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="message('分组消息合并', { type: 'success', grouping: true })"
|
||||
>
|
||||
分组消息合并
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message('自定义消息图标', {
|
||||
icon: hot
|
||||
})
|
||||
"
|
||||
>
|
||||
自定义图标
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message('3秒后关闭', {
|
||||
duration: 3000,
|
||||
onClose: () => message('消息已关闭', { type: 'success' })
|
||||
})
|
||||
"
|
||||
>
|
||||
自定义延时关闭时间并设置关闭后其他操作
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message(
|
||||
h('p', null, [
|
||||
h('span', null, 'Message can be '),
|
||||
h('i', { style: 'color: teal' }, 'VNode')
|
||||
])
|
||||
)
|
||||
"
|
||||
>
|
||||
自定义内容
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="
|
||||
message('<strong>This is <i>HTML</i> string</strong>', {
|
||||
dangerouslyUseHTMLString: true
|
||||
})
|
||||
"
|
||||
>
|
||||
HTML 片段作为正文内容
|
||||
</el-button>
|
||||
</el-space>
|
||||
|
||||
<el-divider />
|
||||
|
||||
<el-button @click="closeAllMessage"> 关闭所有消息提示 </el-button>
|
||||
</el-card>
|
||||
</template>
|
||||
@@ -1,6 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, watch } from "vue";
|
||||
import { ElMessage, FormInstance } from "element-plus";
|
||||
import { message } from "@/utils/message";
|
||||
import { FormInstance } from "element-plus";
|
||||
|
||||
const SELECT_OPTIONS = [
|
||||
{ label: "网关", value: 1 },
|
||||
@@ -33,7 +34,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
|
||||
if (!formEl) return;
|
||||
await formEl.validate(valid => {
|
||||
if (valid) {
|
||||
ElMessage.success("提交成功");
|
||||
message("提交成功", { type: "success" });
|
||||
formVisible.value = false;
|
||||
resetForm(formEl);
|
||||
}
|
||||
|
||||
@@ -1,9 +1,10 @@
|
||||
<script setup lang="ts">
|
||||
import Card from "./components/Card.vue";
|
||||
import { getCardList } from "@/api/list";
|
||||
import { message } from "@/utils/message";
|
||||
import { ElMessageBox } from "element-plus";
|
||||
import { ref, onMounted, nextTick } from "vue";
|
||||
import dialogForm from "./components/DialogForm.vue";
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import { useRenderIcon } from "@/components/ReIcon/src/hooks";
|
||||
|
||||
defineOptions({
|
||||
@@ -77,10 +78,7 @@ const handleDeleteItem = product => {
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
ElMessage({
|
||||
type: "success",
|
||||
message: "删除成功"
|
||||
});
|
||||
message("删除成功", { type: "success" });
|
||||
})
|
||||
.catch(() => {});
|
||||
};
|
||||
|
||||
@@ -26,7 +26,7 @@ const onLogin = async (formEl: FormInstance | undefined) => {
|
||||
if (valid) {
|
||||
// 模拟登录请求，需根据实际开发进行修改
|
||||
setTimeout(() => {
|
||||
message(transformI18n($t("login.loginSuccess")), "success");
|
||||
message(transformI18n($t("login.loginSuccess")), { type: "success" });
|
||||
loading.value = false;
|
||||
}, 2000);
|
||||
} else {
|
||||
|
||||
@@ -45,12 +45,14 @@ const onUpdate = async (formEl: FormInstance | undefined) => {
|
||||
if (checked.value) {
|
||||
// 模拟请求，需根据实际开发进行修改
|
||||
setTimeout(() => {
|
||||
message(transformI18n($t("login.registerSuccess")), "success");
|
||||
message(transformI18n($t("login.registerSuccess")), {
|
||||
type: "success"
|
||||
});
|
||||
loading.value = false;
|
||||
}, 2000);
|
||||
} else {
|
||||
loading.value = false;
|
||||
message(transformI18n($t("login.tickPrivacy")), "warning");
|
||||
message(transformI18n($t("login.tickPrivacy")), { type: "warning" });
|
||||
}
|
||||
} else {
|
||||
loading.value = false;
|
||||
|
||||
@@ -42,7 +42,9 @@ const onUpdate = async (formEl: FormInstance | undefined) => {
|
||||
if (valid) {
|
||||
// 模拟请求，需根据实际开发进行修改
|
||||
setTimeout(() => {
|
||||
message(transformI18n($t("login.passwordUpdateReg")), "success");
|
||||
message(transformI18n($t("login.passwordUpdateReg")), {
|
||||
type: "success"
|
||||
});
|
||||
loading.value = false;
|
||||
}, 2000);
|
||||
} else {
|
||||
|
||||
@@ -73,7 +73,7 @@ const onLogin = async (formEl: FormInstance | undefined) => {
|
||||
// 获取后端路由
|
||||
initRouter().then(() => {
|
||||
router.push("/");
|
||||
message("登录成功", "success");
|
||||
message("登录成功", { type: "success" });
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
@@ -56,14 +56,13 @@ export function useColumns() {
|
||||
];
|
||||
|
||||
const handleEdit = (index: number, row) => {
|
||||
message(
|
||||
`您编辑了第 ${index} 行，数据为：${JSON.stringify(row)}`,
|
||||
"success"
|
||||
);
|
||||
message(`您编辑了第 ${index} 行，数据为：${JSON.stringify(row)}`, {
|
||||
type: "success"
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = (index: number, row) => {
|
||||
message(`您删除了第 ${index} 行，数据为：${JSON.stringify(row)}`, "info");
|
||||
message(`您删除了第 ${index} 行，数据为：${JSON.stringify(row)}`);
|
||||
};
|
||||
|
||||
return {
|
||||
|
||||
@@ -15,14 +15,13 @@ export function useColumns() {
|
||||
);
|
||||
|
||||
const handleEdit = (index: number, row) => {
|
||||
message(
|
||||
`您编辑了第 ${index} 行，数据为：${JSON.stringify(row)}`,
|
||||
"success"
|
||||
);
|
||||
message(`您编辑了第 ${index} 行，数据为：${JSON.stringify(row)}`, {
|
||||
type: "success"
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = (index: number, row) => {
|
||||
message(`您删除了第 ${index} 行，数据为：${JSON.stringify(row)}`, "info");
|
||||
message(`您删除了第 ${index} 行，数据为：${JSON.stringify(row)}`);
|
||||
};
|
||||
|
||||
const columns: TableColumnList = [
|
||||
|
||||
@@ -68,4 +68,15 @@ function tabClick({ index }) {
|
||||
:deep(.el-alert__title) {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
:deep(.el-tabs__nav-next),
|
||||
:deep(.el-tabs__nav-prev) {
|
||||
font-size: 16px;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
|
||||
:deep(.el-tabs__nav-next.is-disabled),
|
||||
:deep(.el-tabs__nav-prev.is-disabled) {
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -37,7 +37,9 @@ export function useColumns() {
|
||||
`您编辑了第 ${
|
||||
dataList.value.findIndex(v => v.id === row.id) + 1
|
||||
} 行，数据为：${JSON.stringify(row)}`,
|
||||
"success"
|
||||
{
|
||||
type: "success"
|
||||
}
|
||||
)
|
||||
}
|
||||
]
|
||||
|
||||
@@ -78,7 +78,9 @@ export function useColumns() {
|
||||
callback: ({ data: { name, value } }) => {
|
||||
message(
|
||||
`您点击了第 ${i + 1} 行，图表标题为${name}，图表数据为：${value}`,
|
||||
"success"
|
||||
{
|
||||
type: "success"
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -113,7 +113,9 @@ export function useColumns() {
|
||||
`您编辑了第 ${index + 1} 行，编辑后数据为：${JSON.stringify(
|
||||
dataList.value[index]
|
||||
)}`,
|
||||
"success"
|
||||
{
|
||||
type: "success"
|
||||
}
|
||||
);
|
||||
// 编辑状态关闭
|
||||
editStatus.value[index] = Object.assign({}, editStatus.value[index], {
|
||||
|
||||
@@ -39,7 +39,9 @@ export function useColumns() {
|
||||
const workBook = utils.book_new();
|
||||
utils.book_append_sheet(workBook, workSheet, "数据报表");
|
||||
writeFile(workBook, "pure-admin-table.xlsx");
|
||||
message("导出成功", "success");
|
||||
message("导出成功", {
|
||||
type: "success"
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
|
||||
@@ -1,9 +1,16 @@
|
||||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import { list } from "./base/list";
|
||||
|
||||
defineOptions({
|
||||
name: "PureTable"
|
||||
});
|
||||
|
||||
const selected = ref(0);
|
||||
|
||||
function tabClick({ index }) {
|
||||
selected.value = index;
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -32,9 +39,9 @@ defineOptions({
|
||||
:closable="false"
|
||||
/>
|
||||
|
||||
<el-tabs>
|
||||
<el-tabs @tab-click="tabClick">
|
||||
<template v-for="(item, index) of list" :key="item.key">
|
||||
<el-tab-pane>
|
||||
<el-tab-pane :lazy="true">
|
||||
<template #label>
|
||||
<el-tooltip
|
||||
:content="`（第 ${index + 1} 个示例）${item.content}`"
|
||||
@@ -43,7 +50,7 @@ defineOptions({
|
||||
<span>{{ item.title }}</span>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<component :is="item.component" />
|
||||
<component v-if="selected == index" :is="item.component" />
|
||||
</el-tab-pane>
|
||||
</template>
|
||||
</el-tabs>
|
||||
@@ -62,4 +69,15 @@ defineOptions({
|
||||
:deep(.el-alert__title) {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
:deep(.el-tabs__nav-next),
|
||||
:deep(.el-tabs__nav-prev) {
|
||||
font-size: 16px;
|
||||
color: var(--el-text-color-primary);
|
||||
}
|
||||
|
||||
:deep(.el-tabs__nav-next.is-disabled),
|
||||
:deep(.el-tabs__nav-prev.is-disabled) {
|
||||
opacity: 0.5;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -113,7 +113,9 @@ export function useColumns() {
|
||||
loading: false
|
||||
}
|
||||
);
|
||||
message("已成功修改角色状态", "success");
|
||||
message("已成功修改角色状态", {
|
||||
type: "success"
|
||||
});
|
||||
}, 300);
|
||||
})
|
||||
.catch(() => {
|
||||
|
||||
@@ -118,7 +118,9 @@ export function useColumns() {
|
||||
loading: false
|
||||
}
|
||||
);
|
||||
message("已成功修改用户状态", "success");
|
||||
message("已成功修改用户状态", {
|
||||
type: "success"
|
||||
});
|
||||
}, 300);
|
||||
})
|
||||
.catch(() => {
|
||||
|
||||
@@ -21,8 +21,7 @@
|
||||
"incremental": true,
|
||||
"paths": {
|
||||
"@/*": ["src/*"],
|
||||
"@build/*": ["build/*"],
|
||||
"/#/*": ["types/*"]
|
||||
"@build/*": ["build/*"]
|
||||
},
|
||||
"types": [
|
||||
"node",
|
||||
@@ -30,16 +29,16 @@
|
||||
"element-plus/global",
|
||||
"@pureadmin/table/volar",
|
||||
"@pureadmin/descriptions/volar",
|
||||
"unplugin-vue-macros/macros-global"
|
||||
"unplugin-vue-define-options/macros-global"
|
||||
],
|
||||
"typeRoots": ["./node_modules/@types/", "./types"]
|
||||
},
|
||||
"include": [
|
||||
"mock/*.ts",
|
||||
"src/**/*.ts",
|
||||
"src/**/*.tsx",
|
||||
"src/**/*.vue",
|
||||
"types/*.d.ts",
|
||||
"mock/*.ts",
|
||||
"vite.config.ts"
|
||||
],
|
||||
"exclude": ["node_modules", "dist", "**/*.js"]
|
||||
|
||||
124
types/global-components.d.ts
vendored
Normal file
124
types/global-components.d.ts
vendored
Normal file
@@ -0,0 +1,124 @@
|
||||
declare module "vue" {
|
||||
/**
|
||||
* 自定义全局组件获得 Volar 提示（自定义的全局组件需要在这里声明下才能获得 Volar 类型提示哦）
|
||||
*/
|
||||
export interface GlobalComponents {
|
||||
IconifyIconOffline: typeof import("../src/components/ReIcon")["IconifyIconOffline"];
|
||||
IconifyIconOnline: typeof import("../src/components/ReIcon")["IconifyIconOnline"];
|
||||
FontIcon: typeof import("../src/components/ReIcon")["FontIcon"];
|
||||
Auth: typeof import("../src/components/ReAuth")["Auth"];
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* todo：https://github.com/element-plus/element-plus/blob/dev/global.d.ts#L2
|
||||
* No need to install @vue/runtime-core
|
||||
*/
|
||||
declare module "vue" {
|
||||
export interface GlobalComponents {
|
||||
ElAffix: typeof import("element-plus")["ElAffix"];
|
||||
ElAlert: typeof import("element-plus")["ElAlert"];
|
||||
ElAside: typeof import("element-plus")["ElAside"];
|
||||
ElAutocomplete: typeof import("element-plus")["ElAutocomplete"];
|
||||
ElAvatar: typeof import("element-plus")["ElAvatar"];
|
||||
ElBacktop: typeof import("element-plus")["ElBacktop"];
|
||||
ElBadge: typeof import("element-plus")["ElBadge"];
|
||||
ElBreadcrumb: typeof import("element-plus")["ElBreadcrumb"];
|
||||
ElBreadcrumbItem: typeof import("element-plus")["ElBreadcrumbItem"];
|
||||
ElButton: typeof import("element-plus")["ElButton"];
|
||||
ElButtonGroup: typeof import("element-plus")["ElButtonGroup"];
|
||||
ElCalendar: typeof import("element-plus")["ElCalendar"];
|
||||
ElCard: typeof import("element-plus")["ElCard"];
|
||||
ElCarousel: typeof import("element-plus")["ElCarousel"];
|
||||
ElCarouselItem: typeof import("element-plus")["ElCarouselItem"];
|
||||
ElCascader: typeof import("element-plus")["ElCascader"];
|
||||
ElCascaderPanel: typeof import("element-plus")["ElCascaderPanel"];
|
||||
ElCheckbox: typeof import("element-plus")["ElCheckbox"];
|
||||
ElCheckboxButton: typeof import("element-plus")["ElCheckboxButton"];
|
||||
ElCheckboxGroup: typeof import("element-plus")["ElCheckboxGroup"];
|
||||
ElCol: typeof import("element-plus")["ElCol"];
|
||||
ElCollapse: typeof import("element-plus")["ElCollapse"];
|
||||
ElCollapseItem: typeof import("element-plus")["ElCollapseItem"];
|
||||
ElCollapseTransition: typeof import("element-plus")["ElCollapseTransition"];
|
||||
ElColorPicker: typeof import("element-plus")["ElColorPicker"];
|
||||
ElContainer: typeof import("element-plus")["ElContainer"];
|
||||
ElConfigProvider: typeof import("element-plus")["ElConfigProvider"];
|
||||
ElDatePicker: typeof import("element-plus")["ElDatePicker"];
|
||||
ElDialog: typeof import("element-plus")["ElDialog"];
|
||||
ElDivider: typeof import("element-plus")["ElDivider"];
|
||||
ElDrawer: typeof import("element-plus")["ElDrawer"];
|
||||
ElDropdown: typeof import("element-plus")["ElDropdown"];
|
||||
ElDropdownItem: typeof import("element-plus")["ElDropdownItem"];
|
||||
ElDropdownMenu: typeof import("element-plus")["ElDropdownMenu"];
|
||||
ElEmpty: typeof import("element-plus")["ElEmpty"];
|
||||
ElFooter: typeof import("element-plus")["ElFooter"];
|
||||
ElForm: typeof import("element-plus")["ElForm"];
|
||||
ElFormItem: typeof import("element-plus")["ElFormItem"];
|
||||
ElHeader: typeof import("element-plus")["ElHeader"];
|
||||
ElIcon: typeof import("element-plus")["ElIcon"];
|
||||
ElImage: typeof import("element-plus")["ElImage"];
|
||||
ElImageViewer: typeof import("element-plus")["ElImageViewer"];
|
||||
ElInput: typeof import("element-plus")["ElInput"];
|
||||
ElInputNumber: typeof import("element-plus")["ElInputNumber"];
|
||||
ElLink: typeof import("element-plus")["ElLink"];
|
||||
ElMain: typeof import("element-plus")["ElMain"];
|
||||
ElMenu: typeof import("element-plus")["ElMenu"];
|
||||
ElMenuItem: typeof import("element-plus")["ElMenuItem"];
|
||||
ElMenuItemGroup: typeof import("element-plus")["ElMenuItemGroup"];
|
||||
ElOption: typeof import("element-plus")["ElOption"];
|
||||
ElOptionGroup: typeof import("element-plus")["ElOptionGroup"];
|
||||
ElPageHeader: typeof import("element-plus")["ElPageHeader"];
|
||||
ElPagination: typeof import("element-plus")["ElPagination"];
|
||||
ElPopconfirm: typeof import("element-plus")["ElPopconfirm"];
|
||||
ElPopper: typeof import("element-plus")["ElPopper"];
|
||||
ElPopover: typeof import("element-plus")["ElPopover"];
|
||||
ElProgress: typeof import("element-plus")["ElProgress"];
|
||||
ElRadio: typeof import("element-plus")["ElRadio"];
|
||||
ElRadioButton: typeof import("element-plus")["ElRadioButton"];
|
||||
ElRadioGroup: typeof import("element-plus")["ElRadioGroup"];
|
||||
ElRate: typeof import("element-plus")["ElRate"];
|
||||
ElRow: typeof import("element-plus")["ElRow"];
|
||||
ElScrollbar: typeof import("element-plus")["ElScrollbar"];
|
||||
ElSelect: typeof import("element-plus")["ElSelect"];
|
||||
ElSlider: typeof import("element-plus")["ElSlider"];
|
||||
ElStep: typeof import("element-plus")["ElStep"];
|
||||
ElSteps: typeof import("element-plus")["ElSteps"];
|
||||
ElSubMenu: typeof import("element-plus")["ElSubMenu"];
|
||||
ElSwitch: typeof import("element-plus")["ElSwitch"];
|
||||
ElTabPane: typeof import("element-plus")["ElTabPane"];
|
||||
ElTable: typeof import("element-plus")["ElTable"];
|
||||
ElTableColumn: typeof import("element-plus")["ElTableColumn"];
|
||||
ElTabs: typeof import("element-plus")["ElTabs"];
|
||||
ElTag: typeof import("element-plus")["ElTag"];
|
||||
ElTimePicker: typeof import("element-plus")["ElTimePicker"];
|
||||
ElTimeSelect: typeof import("element-plus")["ElTimeSelect"];
|
||||
ElTimeline: typeof import("element-plus")["ElTimeline"];
|
||||
ElTimelineItem: typeof import("element-plus")["ElTimelineItem"];
|
||||
ElTooltip: typeof import("element-plus")["ElTooltip"];
|
||||
ElTransfer: typeof import("element-plus")["ElTransfer"];
|
||||
ElTree: typeof import("element-plus")["ElTree"];
|
||||
ElTreeV2: typeof import("element-plus")["ElTreeV2"];
|
||||
ElUpload: typeof import("element-plus")["ElUpload"];
|
||||
ElSpace: typeof import("element-plus")["ElSpace"];
|
||||
ElSkeleton: typeof import("element-plus")["ElSkeleton"];
|
||||
ElSkeletonItem: typeof import("element-plus")["ElSkeletonItem"];
|
||||
ElCheckTag: typeof import("element-plus")["ElCheckTag"];
|
||||
ElDescriptions: typeof import("element-plus")["ElDescriptions"];
|
||||
ElDescriptionsItem: typeof import("element-plus")["ElDescriptionsItem"];
|
||||
ElResult: typeof import("element-plus")["ElResult"];
|
||||
ElSelectV2: typeof import("element-plus")["ElSelectV2"];
|
||||
}
|
||||
|
||||
interface ComponentCustomProperties {
|
||||
$message: typeof import("element-plus")["ElMessage"];
|
||||
$notify: typeof import("element-plus")["ElNotification"];
|
||||
$msgbox: typeof import("element-plus")["ElMessageBox"];
|
||||
$messageBox: typeof import("element-plus")["ElMessageBox"];
|
||||
$alert: typeof import("element-plus")["ElMessageBox"]["alert"];
|
||||
$confirm: typeof import("element-plus")["ElMessageBox"]["confirm"];
|
||||
$prompt: typeof import("element-plus")["ElMessageBox"]["prompt"];
|
||||
$loading: typeof import("element-plus")["ElLoadingService"];
|
||||
}
|
||||
}
|
||||
|
||||
export {};
|
||||
13
types/global.d.ts
vendored
13
types/global.d.ts
vendored
@@ -214,6 +214,7 @@ declare global {
|
||||
/**
|
||||
* @description 当前路由动画效果
|
||||
* @see {@link https://next.router.vuejs.org/guide/advanced/transitions.html#transitions}
|
||||
* @see animate.css {@link https://animate.style}
|
||||
*/
|
||||
name?: string;
|
||||
/** 进场动画 */
|
||||
@@ -265,15 +266,3 @@ declare global {
|
||||
$config: ServerConfigs;
|
||||
}
|
||||
}
|
||||
|
||||
declare module "vue" {
|
||||
/**
|
||||
* 自定义全局组件获得 Volar 提示（自定义的全局组件需要在这里声明下才能获得 Volar 类型提示哦）
|
||||
*/
|
||||
export interface GlobalComponents {
|
||||
IconifyIconOffline: typeof import("../src/components/ReIcon")["IconifyIconOffline"];
|
||||
IconifyIconOnline: typeof import("../src/components/ReIcon")["IconifyIconOnline"];
|
||||
FontIcon: typeof import("../src/components/ReIcon")["FontIcon"];
|
||||
Auth: typeof import("../src/components/ReAuth")["Auth"];
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user