mirror of
https://github.com/soybeanjs/soybean-admin.git
synced 2025-10-31 13:53:43 +08:00
Compare commits
95 Commits
v1.0.2
...
v1.1.0-bet
| Author | SHA1 | Date | |
|---|---|---|---|
|
46e90a7208 | ||
|
|
3b47b5a56f | ||
|
|
073fbcfc36 | ||
|
0a90dd3764 | ||
|
|
60f3b14085 | ||
|
|
18b3f05382 | ||
|
|
72ccb6bf6d | ||
|
|
21df57b71c | ||
|
|
7bd43df5f7 | ||
|
|
599b4e1947 | ||
|
|
003e145e77 | ||
|
|
c4b5c65625 | ||
|
|
ebe55af7d5 | ||
|
|
a6b92103a6 | ||
|
|
f4513e1e38 | ||
|
|
734ef9852c | ||
|
|
c137b97089 | ||
|
|
b8f9e60211 | ||
|
|
ce2a75b5a8 | ||
|
|
d0f17a440c | ||
|
|
1ed2eb5fdd | ||
|
d3849baaff | ||
|
|
413a8b29c7 | ||
|
|
52188d8853 | ||
|
|
fbc2e61f49 | ||
|
|
55d7cc09d7 | ||
|
|
dae2aa5513 | ||
|
|
e3bd397248 | ||
|
|
42f950f819 | ||
|
|
b3e9bbaeaa | ||
|
|
c89e00d194 | ||
|
|
4708eded4c | ||
|
|
3d10ef1a90 | ||
|
|
145300e95c | ||
|
3ddb17a0f5 | ||
|
|
6b465c0ebd | ||
|
|
dbe31eb1dc | ||
|
|
a8dbc03e23 | ||
|
|
c0ed1f26f7 | ||
|
|
a1920fcad9 | ||
|
|
34999971fd | ||
|
|
1cb3816e48 | ||
|
|
de9567420a | ||
|
|
4749b411bd | ||
|
|
fbd80c289a | ||
|
|
da12d4a5cd | ||
|
|
3e61eab498 | ||
|
|
1c3b4734fa | ||
|
|
93c7ff7122 | ||
|
|
1e14293d67 | ||
|
|
19e65c1a9f | ||
|
|
e57bf0b076 | ||
|
|
5d45cef1f0 | ||
|
|
d460e5cc6d | ||
|
|
3b5e4b3405 | ||
|
|
ec5b1c3f84 | ||
|
1fc34cc5f8 | ||
|
|
dcd51f4cda | ||
|
|
09f6464678 | ||
|
|
fdde679c70 | ||
|
|
b266035800 | ||
|
|
a1e432f81e | ||
|
|
82eabab753 | ||
|
|
c347528bbb | ||
|
|
d335df6f46 | ||
|
|
0d45b86cde | ||
|
|
516f46a47e | ||
|
|
b52432a792 | ||
|
|
cf5bc88a75 | ||
|
|
03b1fbacc4 | ||
|
|
9a66979f09 | ||
|
|
c695208f62 | ||
|
|
3ceeb6f942 | ||
|
|
04aa0972f9 | ||
|
|
cb83d6d90d | ||
|
|
79d9c5143a | ||
|
|
5a5232bdf4 | ||
|
|
7392bebff9 | ||
|
|
23f283aa31 | ||
|
|
42e16a0165 | ||
|
|
ac92817343 | ||
|
|
93191737dd | ||
|
|
d9af5aa2d3 | ||
|
|
d984f75b80 | ||
|
|
27c53cd688 | ||
|
|
b7f0749170 | ||
|
|
cb8ea2531d | ||
|
|
c6648b6c8b | ||
|
|
bb74d9949b | ||
|
|
60beff7e63 | ||
|
|
d6eda8f9ed | ||
|
|
f4a9cf8339 | ||
|
|
efc0e25c7f | ||
|
|
35310ed73c | ||
|
|
001059cca0 |
6
.env
6
.env
@@ -40,3 +40,9 @@ VITE_SERVICE_EXPIRED_TOKEN_CODES=9999,9998
|
||||
|
||||
# when the route mode is static, the defined super role
|
||||
VITE_STATIC_SUPER_ROLE=R_SUPER
|
||||
|
||||
# sourcemap
|
||||
VITE_SOURCE_MAP=N
|
||||
|
||||
# Used to differentiate storage across different domains
|
||||
VITE_STORAGE_PREFIX=SOY_
|
||||
|
||||
1
.npmrc
1
.npmrc
@@ -1,3 +1,4 @@
|
||||
registry=https://registry.npmmirror.com/
|
||||
shamefully-hoist=true
|
||||
ignore-workspace-root-check=true
|
||||
link-workspace-packages=true
|
||||
|
||||
3
.vscode/settings.json
vendored
3
.vscode/settings.json
vendored
@@ -13,7 +13,6 @@
|
||||
"i18n-ally.keystyle": "nested",
|
||||
"i18n-ally.localesPaths": ["src/locales/langs"],
|
||||
"prettier.enable": false,
|
||||
"unocss.root": ["./"],
|
||||
"typescript.tsdk": "node_modules/typescript/lib",
|
||||
"vue.server.hybridMode": true
|
||||
"unocss.root": ["./"]
|
||||
}
|
||||
|
||||
616
CHANGELOG.md
616
CHANGELOG.md
@@ -1,7 +1,261 @@
|
||||
# Changelog
|
||||
|
||||
|
||||
## [v1.0.2](https://github.com/soybeanjs/soybean-admin/compare/tauri-v1.0.1...v1.0.2) (24-04-08)
|
||||
## [v1.1.0-beta.2](https://github.com/honghuangdc/soybean-admin/compare/v1.1.0-beta.1...v1.1.0-beta.2) (2024-05-07)
|
||||
|
||||
### 🚀 Features
|
||||
|
||||
- **projects**: useTable adds expand to display - by **paynezhuang** [<samp>(0a90d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0a90dd3)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- **projects**:
|
||||
- fix manage_menu modal style - by @honghuangdc [<samp>(60f3b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/60f3b14)
|
||||
- fix menu data when role is changed. fixed #391 - by @honghuangdc in https://github.com/honghuangdc/soybean-admin/issues/391 [<samp>(3b47b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/3b47b5a)
|
||||
|
||||
### 🛠 Optimizations
|
||||
|
||||
- **projects**: remove deprecated code - by @honghuangdc [<samp>(72ccb)</samp>](https://github.com/honghuangdc/soybean-admin/commit/72ccb6b)
|
||||
|
||||
### 📖 Documentation
|
||||
|
||||
- **projects**: add CHANGELOG.zh_CN.md - by @honghuangdc [<samp>(18b3f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/18b3f05)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
[paynezhuang](mailto:paynezhuang@gmail.com)
|
||||
|
||||
## [v1.1.0-beta.1](https://github.com/soybeanjs/soybean-admin/compare/v1.0.9...v1.1.0-beta.1) (2024-05-07)
|
||||
|
||||
### 🚀 Features
|
||||
|
||||
- **projects**:
|
||||
- support grayscale. fixed #385 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/385 [<samp>(d335d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d335df6)
|
||||
- Add prefix to local storage - by **Azir** [<samp>(1fc34)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1fc34cc)
|
||||
- add table showTotal options - by **paynezhuang** [<samp>(3e61e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3e61eab)
|
||||
- add recommend color switch. closed #388 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/388 [<samp>(a1920)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a1920fc)
|
||||
- add menu route field - by **paynezhuang** [<samp>(dbe31)</samp>](https://github.com/soybeanjs/soybean-admin/commit/dbe31eb)
|
||||
- support repeated request errors occur once in a short time. close #368, close #369 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/368 and https://github.com/soybeanjs/soybean-admin/issues/369 [<samp>(e3bd3)</samp>](https://github.com/soybeanjs/soybean-admin/commit/e3bd397)
|
||||
- close tab by mouse wheel button click - by **JianJroh** [<samp>(d3849)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d3849ba)
|
||||
- page: support manage_menu more options. close #366 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/366 [<samp>(c4b5c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c4b5c65)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- **projects**:
|
||||
- menu fixedIndexInTab default null - by **paynezhuang** [<samp>(3d10e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3d10ef1)
|
||||
- fix menu-toggler zIndex - by @honghuangdc [<samp>(7bd43)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7bd43df)
|
||||
|
||||
### 💅 Refactors
|
||||
|
||||
- **projects**:
|
||||
- refactor @sa/color-palette => @sa/color & perf @sa/utils - by @honghuangdc [<samp>(34999)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3499997)
|
||||
- menu-operate-drawer => menu-operate-modal - by @honghuangdc [<samp>(003e1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/003e145)
|
||||
|
||||
### 🏡 Chore
|
||||
|
||||
- **deps**:
|
||||
- update deps - by @honghuangdc [<samp>(1cb38)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1cb3816)
|
||||
- update deps - by @honghuangdc [<samp>(599b4)</samp>](https://github.com/soybeanjs/soybean-admin/commit/599b4e1)
|
||||
- **projects**:
|
||||
- merge main to v1.1.0 - by @honghuangdc [<samp>(ebe55)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ebe55af)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
[JianJroh](mailto:rhjian@foxmail.com), [paynezhuang](mailto:paynezhuang@gmail.com), [Azir](mailto:2075125282@qq.com)
|
||||
|
||||
## [v1.0.9](https://github.com/soybeanjs/soybean-admin/compare/v1.0.8...v1.0.9) (2024-05-05)
|
||||
|
||||
### 🚀 Features
|
||||
|
||||
- **packages**: @sa/scripts: add new commit type `optimize` and commit scope `packages` - by @honghuangdc [<samp>(fbc2e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/fbc2e61)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- **projects**: fix manage page drawer operate about data reset. fixed #415, fixed #417 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/415 and https://github.com/soybeanjs/soybean-admin/issues/417 [<samp>(f4513)</samp>](https://github.com/soybeanjs/soybean-admin/commit/f4513e1)
|
||||
|
||||
### 📖 Documentation
|
||||
|
||||
- **projects**:
|
||||
- add ecosystem to README.md - by @honghuangdc [<samp>(d0f17)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d0f17a4)
|
||||
- add PanisAdmin to README - by **paynezhuang** [<samp>(ce2a7)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ce2a75b)
|
||||
|
||||
### 🏡 Chore
|
||||
|
||||
- **deps**:
|
||||
- update deps - by @honghuangdc [<samp>(413a8)</samp>](https://github.com/soybeanjs/soybean-admin/commit/413a8b2)
|
||||
- update deps - by @honghuangdc [<samp>(734ef)</samp>](https://github.com/soybeanjs/soybean-admin/commit/734ef98)
|
||||
- **projects**:
|
||||
- update .npmrc - by @honghuangdc [<samp>(52188)</samp>](https://github.com/soybeanjs/soybean-admin/commit/52188d8)
|
||||
- update vscode settings - by @honghuangdc [<samp>(c137b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c137b97)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
[paynezhuang](mailto:paynezhuang@gmail.com)
|
||||
|
||||
## [v1.0.8](https://github.com/soybeanjs/soybean-admin/compare/v1.0.7...v1.0.8) (2024-04-27)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- **components**:
|
||||
- fix PinToggler label. fixed #407 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/407 [<samp>(c0ed1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c0ed1f2)
|
||||
- **projects**:
|
||||
- text level low. #409 - by **alleycharming** in https://github.com/soybeanjs/soybean-admin/issues/409 [<samp>(3ddb1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3ddb17a)
|
||||
- fix tab fixedIndex as null case - by **paynezhuang** [<samp>(4708e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4708ede)
|
||||
- recovery the layout config before is mobile. fixed #408, fixed #361 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/408 and https://github.com/soybeanjs/soybean-admin/issues/361 [<samp>(dae2a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/dae2aa5)
|
||||
|
||||
### 🔥 Performance
|
||||
|
||||
- **projects**: perf judgement the fixed tab - by @honghuangdc [<samp>(b3e9b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b3e9bba)
|
||||
|
||||
### 💅 Refactors
|
||||
|
||||
- **projects**: `Soybean Admin` to `SoybeanAdmin` - by @honghuangdc [<samp>(a8dbc)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a8dbc03)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
[paynezhuang](mailto:paynezhuang@gmail.com), [alleycharming](mailto:alleycharming@gmail.com)
|
||||
|
||||
## [v1.0.7](https://github.com/soybeanjs/soybean-admin/compare/v1.0.6...v1.0.7) (2024-04-25)
|
||||
|
||||
### 🚀 Features
|
||||
|
||||
- **projects**: support iframe page with diffrent url of custom route - by @honghuangdc [<samp>(da12d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/da12d4a)
|
||||
|
||||
### 🏡 Chore
|
||||
|
||||
- **deps**: update deps - by @honghuangdc [<samp>(fbd80)</samp>](https://github.com/soybeanjs/soybean-admin/commit/fbd80c2)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
|
||||
## [v1.0.6](https://github.com/soybeanjs/soybean-admin/compare/v1.0.5...v1.0.6) (2024-04-25)
|
||||
|
||||
### 🚀 Features
|
||||
|
||||
- **hooks**: add state hooks: useRef, useState, useSignal - by @honghuangdc [<samp>(09f64)</samp>](https://github.com/soybeanjs/soybean-admin/commit/09f6464)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- **projects**:
|
||||
- added responseType judgment. #396 - by **alleycharming** in https://github.com/soybeanjs/soybean-admin/issues/396 [<samp>(82eab)</samp>](https://github.com/soybeanjs/soybean-admin/commit/82eabab)
|
||||
- supply $t import statement - by @honghuangdc [<samp>(b2660)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b266035)
|
||||
- fix mix-menu blank. fixed #389 & cache mixMenuFixed - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/389 [<samp>(93c7f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/93c7ff7)
|
||||
|
||||
### 🔥 Performance
|
||||
|
||||
- **hooks**:
|
||||
- perf useSignal - by @honghuangdc [<samp>(5d45c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/5d45cef)
|
||||
- **projects**:
|
||||
- remove useless prop `title` of `NDrawer` - by @honghuangdc [<samp>(fdde6)</samp>](https://github.com/soybeanjs/soybean-admin/commit/fdde679)
|
||||
- add tsconfig.json for @sa/color-palette - by @honghuangdc [<samp>(d460e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d460e5c)
|
||||
|
||||
### 💅 Refactors
|
||||
|
||||
- **hooks**: refactor useSignal, useComputed - by @honghuangdc [<samp>(3b5e4)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3b5e4b3)
|
||||
- **projects**: useMixMenuContext replace useMixMenu - by @honghuangdc [<samp>(1e142)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1e14293)
|
||||
|
||||
### 🏡 Chore
|
||||
|
||||
- **deps**:
|
||||
- update deps - by @honghuangdc [<samp>(e57bf)</samp>](https://github.com/soybeanjs/soybean-admin/commit/e57bf0b)
|
||||
- **projects**:
|
||||
- use `engines` replace `packageManager` - by @honghuangdc [<samp>(dcd51)</samp>](https://github.com/soybeanjs/soybean-admin/commit/dcd51f4)
|
||||
- update pnpm version requirement - by @honghuangdc [<samp>(19e65)</samp>](https://github.com/soybeanjs/soybean-admin/commit/19e65c1)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
[alleycharming](mailto:alleycharming@gmail.com)
|
||||
|
||||
## [v1.0.5](https://github.com/honghuangdc/soybean-admin/compare/v1.0.4...v1.0.5) (2024-04-24)
|
||||
|
||||
### 📖 Documentation
|
||||
|
||||
- **projects**: update CHANGELOG.md - by @honghuangdc [<samp>(cf5bc)</samp>](https://github.com/honghuangdc/soybean-admin/commit/cf5bc88)
|
||||
|
||||
### 🏡 Chore
|
||||
|
||||
- **projects**:
|
||||
- lower vue version to 3.4.23 - by @honghuangdc [<samp>(b5243)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b52432a)
|
||||
- update pnpm-lock.yaml - by @honghuangdc [<samp>(516f4)</samp>](https://github.com/honghuangdc/soybean-admin/commit/516f46a)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
|
||||
## [v1.0.4](https://github.com/soybeanjs/soybean-admin/compare/v1.0.3...v1.0.4) (2024-04-24)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- **projects**:
|
||||
- fix CHANGELOG versions - by @honghuangdc [<samp>(d9af5)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d9af5aa)
|
||||
- fix disabled page animate - by @honghuangdc [<samp>(23f28)</samp>](https://github.com/soybeanjs/soybean-admin/commit/23f283a)
|
||||
- fix routes data when role is change. fixed #391 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/391 [<samp>(cb83d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/cb83d6d)
|
||||
- fix tabs data when role is change. fixed #392 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/392 [<samp>(04aa0)</samp>](https://github.com/soybeanjs/soybean-admin/commit/04aa097)
|
||||
- recovery pnpm-lock.yaml - by @honghuangdc [<samp>(c6952)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c695208)
|
||||
|
||||
### 💅 Refactors
|
||||
|
||||
- **hooks**: refactor @sa/color - by @honghuangdc [<samp>(93191)</samp>](https://github.com/soybeanjs/soybean-admin/commit/9319173)
|
||||
|
||||
### 📖 Documentation
|
||||
|
||||
- **projects**:
|
||||
- update README.md - by @honghuangdc [<samp>(5a523)</samp>](https://github.com/soybeanjs/soybean-admin/commit/5a5232b)
|
||||
- update README.md - by @honghuangdc [<samp>(79d9c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/79d9c51)
|
||||
|
||||
### 🏡 Chore
|
||||
|
||||
- **deps**:
|
||||
- update deps - by @honghuangdc [<samp>(ac928)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ac92817)
|
||||
- update deps - by @honghuangdc [<samp>(3ceeb)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3ceeb6f)
|
||||
- update deps - by @honghuangdc [<samp>(9a669)</samp>](https://github.com/soybeanjs/soybean-admin/commit/9a66979)
|
||||
- **projects**:
|
||||
- update pnpm version - by @honghuangdc [<samp>(42e16)</samp>](https://github.com/soybeanjs/soybean-admin/commit/42e16a0)
|
||||
- update deps & update pnpm version & update eslint config - by @honghuangdc [<samp>(7392b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7392beb)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
|
||||
## [v1.0.3](https://github.com/soybeanjs/soybean-admin/compare/v1.0.2...v1.0.3) (2024-04-16)
|
||||
|
||||
### 🚀 Features
|
||||
|
||||
- **hooks**: deleting the route export of useRoutePush, use vue-router - by **paynezhuang** [<samp>(c6648)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c6648b6)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- **projects**:
|
||||
- fix menu edit rules - by **paynezhuang** [<samp>(00105)</samp>](https://github.com/soybeanjs/soybean-admin/commit/001059c)
|
||||
- fix SvgIcon inheritAttrs warning - by @honghuangdc [<samp>(efc0e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/efc0e25)
|
||||
- fix axios createRequest: add default state - by @honghuangdc [<samp>(d6eda)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d6eda8f)
|
||||
- update union-key.d.ts - by @honghuangdc [<samp>(60bef)</samp>](https://github.com/soybeanjs/soybean-admin/commit/60beff7)
|
||||
- fix update theme color - by @honghuangdc [<samp>(27c53)</samp>](https://github.com/soybeanjs/soybean-admin/commit/27c53cd)
|
||||
|
||||
### 🔥 Performance
|
||||
|
||||
- **projects**: perf code - by @honghuangdc [<samp>(b7f07)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b7f0749)
|
||||
|
||||
### 💅 Refactors
|
||||
|
||||
- **projects**: update naive-ui.d.ts - by @honghuangdc [<samp>(bb74d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/bb74d99)
|
||||
|
||||
### 📖 Documentation
|
||||
|
||||
- **projects**: update README.md - by @honghuangdc [<samp>(f4a9c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/f4a9cf8)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
[paynezhuang](mailto:paynezhuang@gmail.com)
|
||||
|
||||
## [v1.0.2](https://github.com/soybeanjs/soybean-admin/compare/v1.0.1...v1.0.2) (2024-04-08)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
@@ -22,7 +276,7 @@
|
||||
[](https://github.com/honghuangdc)
|
||||
[燕博文](mailto:349952469@qq.com)
|
||||
|
||||
## [v1.0.1](https://github.com/soybeanjs/soybean-admin/compare/tauri-v1.0.0...v1.0.1) (24-04-03)
|
||||
## [v1.0.1](https://github.com/soybeanjs/soybean-admin/compare/v1.0.0...v1.0.1) (2024-04-03)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
@@ -44,7 +298,7 @@
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
|
||||
## [v1.0.0](https://github.com/soybeanjs/soybean-admin/compare/v0.10.4...v1.0.0) (24-03-31)
|
||||
## [v1.0.0](https://github.com/soybeanjs/soybean-admin/compare/v0.10.4...v1.0.0) (2024-03-31)
|
||||
|
||||
### 🚀 Features
|
||||
|
||||
@@ -77,7 +331,7 @@
|
||||
- support directory menu hide all child menus. fixed #325 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/325 [<samp>(7256a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7256ad4)
|
||||
- mock manage list data with pagination - by @honghuangdc [<samp>(1a6be)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1a6be00)
|
||||
- globalSearch add i18n - by **燕博文** [<samp>(0126d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0126da4)
|
||||
- Add route meta parameter:fixedQuery - by **Azir-11** [<samp>(874aa)</samp>](https://github.com/soybeanjs/soybean-admin/commit/874aaca)
|
||||
- Add route meta parameter:fixedQuery - by @Azir-11 [<samp>(874aa)</samp>](https://github.com/soybeanjs/soybean-admin/commit/874aaca)
|
||||
- update - by @honghuangdc [<samp>(4158a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4158a72)
|
||||
- change borderRadius to 6px of naiveUI - by @honghuangdc [<samp>(49558)</samp>](https://github.com/soybeanjs/soybean-admin/commit/49558ca)
|
||||
- pef manage role - by @honghuangdc [<samp>(18709)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1870981)
|
||||
@@ -87,7 +341,7 @@
|
||||
- add request exception example page - by @honghuangdc [<samp>(41e8b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/41e8bc4)
|
||||
- add auth example - by @honghuangdc [<samp>(c11d5)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c11d56d)
|
||||
- **router**:
|
||||
- add sortRoutesByOrder function - by **Azir-11** [<samp>(0cf09)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0cf09ba)
|
||||
- add sortRoutesByOrder function - by @Azir-11 [<samp>(0cf09)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0cf09ba)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
@@ -276,7 +530,7 @@
|
||||
[](https://github.com/honghuangdc) [](https://github.com/Azir-11) [](https://github.com/smileluck) [](https://github.com/Particaly)
|
||||
[~li](mailto:miciili-02@outlook.com), [Azir-11](mailto:2075125282@qq.com), [燕博文](mailto:349952469@qq.com), [tnt group](mailto:dodu@live.cn), [Kori](mailto:kexin@korix.top),
|
||||
|
||||
## [v1.0.0-beta.3](https://github.com/soybeanjs/soybean-admin/compare/v1.0.0-beta.2...v1.0.0-beta.3) (24-03-31)
|
||||
## [v1.0.0-beta.3](https://github.com/soybeanjs/soybean-admin/compare/v1.0.0-beta.2...v1.0.0-beta.3) (2024-03-31)
|
||||
|
||||
### 📖 Documentation
|
||||
|
||||
@@ -291,7 +545,7 @@
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
|
||||
## [v1.0.0-beta.2](https://github.com/soybeanjs/soybean-admin/compare/v1.0.0-beta.1...v1.0.0-beta.2) (24-03-27)
|
||||
## [v1.0.0-beta.2](https://github.com/soybeanjs/soybean-admin/compare/v1.0.0-beta.1...v1.0.0-beta.2) (2024-03-27)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
@@ -322,220 +576,220 @@
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
|
||||
## [v1.0.0-beta.1](https://github.com/honghuangdc/soybean-admin/compare/v0.10.4...v1.0.0-beta.1) (24-03-25)
|
||||
## [v1.0.0-beta.1](https://github.com/soybeanjs/soybean-admin/compare/v0.10.4...v1.0.0-beta.1) (2024-03-25)
|
||||
|
||||
### 🚀 Features
|
||||
|
||||
- internationalized menu search - by **Kori** [<samp>(9e115)</samp>](https://github.com/honghuangdc/soybean-admin/commit/9e115da)
|
||||
- internationalized menu search - by **Kori** [<samp>(9e115)</samp>](https://github.com/soybeanjs/soybean-admin/commit/9e115da)
|
||||
- **components**:
|
||||
- enhance the custom strength of the 'TableHeaderOperation' component - by **tnt group** [<samp>(fdf64)</samp>](https://github.com/honghuangdc/soybean-admin/commit/fdf64f7)
|
||||
- add GlobalSearch components - by **燕博文** [<samp>(9ea87)</samp>](https://github.com/honghuangdc/soybean-admin/commit/9ea8789)
|
||||
- enhance the custom strength of the 'TableHeaderOperation' component - by **tnt group** [<samp>(fdf64)</samp>](https://github.com/soybeanjs/soybean-admin/commit/fdf64f7)
|
||||
- add GlobalSearch components - by **燕博文** [<samp>(9ea87)</samp>](https://github.com/soybeanjs/soybean-admin/commit/9ea8789)
|
||||
- **hooks**:
|
||||
- add use-echarts - by @honghuangdc [<samp>(726ab)</samp>](https://github.com/honghuangdc/soybean-admin/commit/726abe4)
|
||||
- add use-echarts - by @honghuangdc [<samp>(726ab)</samp>](https://github.com/soybeanjs/soybean-admin/commit/726abe4)
|
||||
- **projects**:
|
||||
- 1.0 beta - by @honghuangdc [<samp>(e918a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/e918a2c)
|
||||
- support Vite5 - by @honghuangdc [<samp>(96e4a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/96e4aff)
|
||||
- @sa/axios: createRequest, createFlatRequest, createHookRequest - by @honghuangdc [<samp>(bac16)</samp>](https://github.com/honghuangdc/soybean-admin/commit/bac1632)
|
||||
- add app loading - by @honghuangdc [<samp>(c6545)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c65451b)
|
||||
- add copyright, unocss shortcut: card-wrapper, update package.json - by @honghuangdc [<samp>(affcc)</samp>](https://github.com/honghuangdc/soybean-admin/commit/affcc26)
|
||||
- add page: about - by @honghuangdc [<samp>(4955f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4955f1a)
|
||||
- add custom route exception - by @honghuangdc [<samp>(b43c9)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b43c925)
|
||||
- filter tabs which are not in routes - by @honghuangdc [<samp>(f59f3)</samp>](https://github.com/honghuangdc/soybean-admin/commit/f59f348)
|
||||
- packages/scripts: add command changelog,release - by @honghuangdc [<samp>(dafb6)</samp>](https://github.com/honghuangdc/soybean-admin/commit/dafb6fa)
|
||||
- add script: gen-route - by @honghuangdc [<samp>(697c1)</samp>](https://github.com/honghuangdc/soybean-admin/commit/697c1b6)
|
||||
- @sa/axios: add qs stringify for params - by @honghuangdc [<samp>(2400c)</samp>](https://github.com/honghuangdc/soybean-admin/commit/2400c02)
|
||||
- page home & perf useEcharts - by @honghuangdc [<samp>(62e4d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/62e4da0)
|
||||
- finish page home - by @honghuangdc [<samp>(7bd1e)</samp>](https://github.com/honghuangdc/soybean-admin/commit/7bd1e47)
|
||||
- add page function_tab - by @honghuangdc [<samp>(6ff86)</samp>](https://github.com/honghuangdc/soybean-admin/commit/6ff86e7)
|
||||
- page manage_role - by @honghuangdc [<samp>(237c6)</samp>](https://github.com/honghuangdc/soybean-admin/commit/237c6d2)
|
||||
- page manage_user - by @honghuangdc [<samp>(8a170)</samp>](https://github.com/honghuangdc/soybean-admin/commit/8a170ee)
|
||||
- page manage_menu - by @honghuangdc [<samp>(87d65)</samp>](https://github.com/honghuangdc/soybean-admin/commit/87d65d3)
|
||||
- page manage_menu operateDrawer - by @honghuangdc [<samp>(db17c)</samp>](https://github.com/honghuangdc/soybean-admin/commit/db17c91)
|
||||
- Add type to TabRoute: matched - by @Azir-11 [<samp>(2d102)</samp>](https://github.com/honghuangdc/soybean-admin/commit/2d102a0)
|
||||
- support directory menu hide all child menus. fixed #325 - by @honghuangdc in https://github.com/honghuangdc/soybean-admin/issues/325 [<samp>(7256a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/7256ad4)
|
||||
- mock manage list data with pagination - by @honghuangdc [<samp>(1a6be)</samp>](https://github.com/honghuangdc/soybean-admin/commit/1a6be00)
|
||||
- globalSearch add i18n - by **燕博文** [<samp>(0126d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0126da4)
|
||||
- Add route meta parameter:fixedQuery - by **Azir-11** [<samp>(874aa)</samp>](https://github.com/honghuangdc/soybean-admin/commit/874aaca)
|
||||
- update - by @honghuangdc [<samp>(4158a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4158a72)
|
||||
- change borderRadius to 6px of naiveUI - by @honghuangdc [<samp>(49558)</samp>](https://github.com/honghuangdc/soybean-admin/commit/49558ca)
|
||||
- pef manage role - by @honghuangdc [<samp>(18709)</samp>](https://github.com/honghuangdc/soybean-admin/commit/1870981)
|
||||
- login page: code-login - by @honghuangdc [<samp>(c91dd)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c91dd28)
|
||||
- login page: register - by @honghuangdc [<samp>(1ed33)</samp>](https://github.com/honghuangdc/soybean-admin/commit/1ed33dc)
|
||||
- add request refresh token & logout - by @honghuangdc [<samp>(11a6a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/11a6a3b)
|
||||
- add request exception example page - by @honghuangdc [<samp>(41e8b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/41e8bc4)
|
||||
- add auth example - by @honghuangdc [<samp>(c11d5)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c11d56d)
|
||||
- 1.0 beta - by @honghuangdc [<samp>(e918a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/e918a2c)
|
||||
- support Vite5 - by @honghuangdc [<samp>(96e4a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/96e4aff)
|
||||
- @sa/axios: createRequest, createFlatRequest, createHookRequest - by @honghuangdc [<samp>(bac16)</samp>](https://github.com/soybeanjs/soybean-admin/commit/bac1632)
|
||||
- add app loading - by @honghuangdc [<samp>(c6545)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c65451b)
|
||||
- add copyright, unocss shortcut: card-wrapper, update package.json - by @honghuangdc [<samp>(affcc)</samp>](https://github.com/soybeanjs/soybean-admin/commit/affcc26)
|
||||
- add page: about - by @honghuangdc [<samp>(4955f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4955f1a)
|
||||
- add custom route exception - by @honghuangdc [<samp>(b43c9)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b43c925)
|
||||
- filter tabs which are not in routes - by @honghuangdc [<samp>(f59f3)</samp>](https://github.com/soybeanjs/soybean-admin/commit/f59f348)
|
||||
- packages/scripts: add command changelog,release - by @honghuangdc [<samp>(dafb6)</samp>](https://github.com/soybeanjs/soybean-admin/commit/dafb6fa)
|
||||
- add script: gen-route - by @honghuangdc [<samp>(697c1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/697c1b6)
|
||||
- @sa/axios: add qs stringify for params - by @honghuangdc [<samp>(2400c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/2400c02)
|
||||
- page home & perf useEcharts - by @honghuangdc [<samp>(62e4d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/62e4da0)
|
||||
- finish page home - by @honghuangdc [<samp>(7bd1e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7bd1e47)
|
||||
- add page function_tab - by @honghuangdc [<samp>(6ff86)</samp>](https://github.com/soybeanjs/soybean-admin/commit/6ff86e7)
|
||||
- page manage_role - by @honghuangdc [<samp>(237c6)</samp>](https://github.com/soybeanjs/soybean-admin/commit/237c6d2)
|
||||
- page manage_user - by @honghuangdc [<samp>(8a170)</samp>](https://github.com/soybeanjs/soybean-admin/commit/8a170ee)
|
||||
- page manage_menu - by @honghuangdc [<samp>(87d65)</samp>](https://github.com/soybeanjs/soybean-admin/commit/87d65d3)
|
||||
- page manage_menu operateDrawer - by @honghuangdc [<samp>(db17c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/db17c91)
|
||||
- Add type to TabRoute: matched - by @Azir-11 [<samp>(2d102)</samp>](https://github.com/soybeanjs/soybean-admin/commit/2d102a0)
|
||||
- support directory menu hide all child menus. fixed #325 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/325 [<samp>(7256a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7256ad4)
|
||||
- mock manage list data with pagination - by @honghuangdc [<samp>(1a6be)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1a6be00)
|
||||
- globalSearch add i18n - by **燕博文** [<samp>(0126d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0126da4)
|
||||
- Add route meta parameter:fixedQuery - by @Azir-11 [<samp>(874aa)</samp>](https://github.com/soybeanjs/soybean-admin/commit/874aaca)
|
||||
- update - by @honghuangdc [<samp>(4158a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4158a72)
|
||||
- change borderRadius to 6px of naiveUI - by @honghuangdc [<samp>(49558)</samp>](https://github.com/soybeanjs/soybean-admin/commit/49558ca)
|
||||
- pef manage role - by @honghuangdc [<samp>(18709)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1870981)
|
||||
- login page: code-login - by @honghuangdc [<samp>(c91dd)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c91dd28)
|
||||
- login page: register - by @honghuangdc [<samp>(1ed33)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1ed33dc)
|
||||
- add request refresh token & logout - by @honghuangdc [<samp>(11a6a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/11a6a3b)
|
||||
- add request exception example page - by @honghuangdc [<samp>(41e8b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/41e8bc4)
|
||||
- add auth example - by @honghuangdc [<samp>(c11d5)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c11d56d)
|
||||
- **router**:
|
||||
- add sortRoutesByOrder function - by **Azir-11** [<samp>(0cf09)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0cf09ba)
|
||||
- add sortRoutesByOrder function - by @Azir-11 [<samp>(0cf09)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0cf09ba)
|
||||
|
||||
### 🐞 Bug Fixes
|
||||
|
||||
- **components**:
|
||||
- fix tooltip zIndex of ButtonIcon - by @honghuangdc [<samp>(99097)</samp>](https://github.com/honghuangdc/soybean-admin/commit/99097b4)
|
||||
- supplement the `NaiveUI` type - by **tnt group** [<samp>(ccc2b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/ccc2b67)
|
||||
- fix homeTab closeRight and disable colseLeft - by **~li** [<samp>(d28bf)</samp>](https://github.com/honghuangdc/soybean-admin/commit/d28bf52)
|
||||
- fix tooltip zIndex of ButtonIcon - by @honghuangdc [<samp>(99097)</samp>](https://github.com/soybeanjs/soybean-admin/commit/99097b4)
|
||||
- supplement the `NaiveUI` type - by **tnt group** [<samp>(ccc2b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ccc2b67)
|
||||
- fix homeTab closeRight and disable colseLeft - by **~li** [<samp>(d28bf)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d28bf52)
|
||||
- **hooks**:
|
||||
- Fix Naive Pagination's outdated API - by **tnt group** [<samp>(37436)</samp>](https://github.com/honghuangdc/soybean-admin/commit/3743612)
|
||||
- Fix Naive Pagination's outdated API - by **tnt group** [<samp>(37436)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3743612)
|
||||
- **projects**:
|
||||
- 修复路由命名为包含关系时导致导航数据出错的问题 - by @Particaly [<samp>(76636)</samp>](https://github.com/honghuangdc/soybean-admin/commit/766369f)
|
||||
- rename zh-ch - by @honghuangdc [<samp>(a8a77)</samp>](https://github.com/honghuangdc/soybean-admin/commit/a8a77ea)
|
||||
- Fix welcome notification not closing - by @Azir-11 [<samp>(748cf)</samp>](https://github.com/honghuangdc/soybean-admin/commit/748cfa2)
|
||||
- fix i18n vscode settings - by @honghuangdc [<samp>(fbf4c)</samp>](https://github.com/honghuangdc/soybean-admin/commit/fbf4cc4)
|
||||
- add duration of login success notification - by @honghuangdc [<samp>(1335d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/1335d47)
|
||||
- fix menu indent - by @honghuangdc [<samp>(87143)</samp>](https://github.com/honghuangdc/soybean-admin/commit/8714317)
|
||||
- fix theme mode segment - by @honghuangdc [<samp>(2372d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/2372dc9)
|
||||
- fix app loading theme color - by @honghuangdc [<samp>(0ba19)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0ba19d5)
|
||||
- fix page about style in mobile - by @honghuangdc [<samp>(8b6de)</samp>](https://github.com/honghuangdc/soybean-admin/commit/8b6de48)
|
||||
- fix themeDrawer darkMode segement - by @honghuangdc [<samp>(1b5ca)</samp>](https://github.com/honghuangdc/soybean-admin/commit/1b5caa0)
|
||||
- fix themeDrawer copy - by @honghuangdc [<samp>(b3779)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b3779a6)
|
||||
- remove space in tab content - by @honghuangdc [<samp>(4aae6)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4aae6a5)
|
||||
- fix horizontal menu - by @honghuangdc [<samp>(d886e)</samp>](https://github.com/honghuangdc/soybean-admin/commit/d886e50)
|
||||
- perf card style - by @honghuangdc [<samp>(c1afb)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c1afb9d)
|
||||
- fix manage_user title - by @honghuangdc [<samp>(7770b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/7770b37)
|
||||
- default proxy prefix - by @smileluck [<samp>(da246)</samp>](https://github.com/honghuangdc/soybean-admin/commit/da24642)
|
||||
- fix request msg - by @honghuangdc [<samp>(ae6b6)</samp>](https://github.com/honghuangdc/soybean-admin/commit/ae6b613)
|
||||
- Fix the issue of tab error displaying parent localIcon - by @Azir-11 [<samp>(a9c98)</samp>](https://github.com/honghuangdc/soybean-admin/commit/a9c98d9)
|
||||
- The matched value of TabRoute should be optional - by @Azir-11 [<samp>(e6fed)</samp>](https://github.com/honghuangdc/soybean-admin/commit/e6fed1f)
|
||||
- fix build [unocss]: build failed to load icon "close", fixed #319 - by @honghuangdc in https://github.com/honghuangdc/soybean-admin/issues/319 [<samp>(c18d8)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c18d82f)
|
||||
- fix resolve alias - by @honghuangdc [<samp>(3bdcb)</samp>](https://github.com/honghuangdc/soybean-admin/commit/3bdcbc7)
|
||||
- Missing default value for tab icon - by @Azir-11 [<samp>(72a46)</samp>](https://github.com/honghuangdc/soybean-admin/commit/72a4679)
|
||||
- add route icon: fucntion_hide-child - by @honghuangdc [<samp>(0a3ef)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0a3efe3)
|
||||
- fix table x-scroll. fixed #324 - by @honghuangdc in https://github.com/honghuangdc/soybean-admin/issues/324 [<samp>(c7e2c)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c7e2c55)
|
||||
- Fix the logic of root route redirection to home - by **恕瑞玛的皇帝** [<samp>(0123c)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0123c37)
|
||||
- Fix homepage mount error under dynamic routing - by **恕瑞玛的皇帝** [<samp>(9cf2a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/9cf2a51)
|
||||
- fix repeat home tab - by @honghuangdc [<samp>(bccd6)</samp>](https://github.com/honghuangdc/soybean-admin/commit/bccd6cb)
|
||||
- fix proxy config - by @honghuangdc [<samp>(c8019)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c8019c4)
|
||||
- fix proxy config - by @honghuangdc [<samp>(ffc95)</samp>](https://github.com/honghuangdc/soybean-admin/commit/ffc95d2)
|
||||
- fix table row-key ts type - by @honghuangdc [<samp>(0cc8f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0cc8f05)
|
||||
- fix class name conflict with unocss icon - by @honghuangdc [<samp>(455e4)</samp>](https://github.com/honghuangdc/soybean-admin/commit/455e48f)
|
||||
- fix repeat routes - by @honghuangdc [<samp>(2c543)</samp>](https://github.com/honghuangdc/soybean-admin/commit/2c543f1)
|
||||
- fix route init - by @honghuangdc [<samp>(23a40)</samp>](https://github.com/honghuangdc/soybean-admin/commit/23a4098)
|
||||
- 修复路由命名为包含关系时导致导航数据出错的问题 - by **pantao** [<samp>(76636)</samp>](https://github.com/soybeanjs/soybean-admin/commit/766369f)
|
||||
- rename zh-ch - by @honghuangdc [<samp>(a8a77)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a8a77ea)
|
||||
- Fix welcome notification not closing - by @Azir-11 [<samp>(748cf)</samp>](https://github.com/soybeanjs/soybean-admin/commit/748cfa2)
|
||||
- fix i18n vscode settings - by @honghuangdc [<samp>(fbf4c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/fbf4cc4)
|
||||
- add duration of login success notification - by @honghuangdc [<samp>(1335d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1335d47)
|
||||
- fix menu indent - by @honghuangdc [<samp>(87143)</samp>](https://github.com/soybeanjs/soybean-admin/commit/8714317)
|
||||
- fix theme mode segment - by @honghuangdc [<samp>(2372d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/2372dc9)
|
||||
- fix app loading theme color - by @honghuangdc [<samp>(0ba19)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0ba19d5)
|
||||
- fix page about style in mobile - by @honghuangdc [<samp>(8b6de)</samp>](https://github.com/soybeanjs/soybean-admin/commit/8b6de48)
|
||||
- fix themeDrawer darkMode segement - by @honghuangdc [<samp>(1b5ca)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1b5caa0)
|
||||
- fix themeDrawer copy - by @honghuangdc [<samp>(b3779)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b3779a6)
|
||||
- remove space in tab content - by @honghuangdc [<samp>(4aae6)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4aae6a5)
|
||||
- fix horizontal menu - by @honghuangdc [<samp>(d886e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d886e50)
|
||||
- perf card style - by @honghuangdc [<samp>(c1afb)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c1afb9d)
|
||||
- fix manage_user title - by @honghuangdc [<samp>(7770b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7770b37)
|
||||
- default proxy prefix - by @smileluck [<samp>(da246)</samp>](https://github.com/soybeanjs/soybean-admin/commit/da24642)
|
||||
- fix request msg - by @honghuangdc [<samp>(ae6b6)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ae6b613)
|
||||
- Fix the issue of tab error displaying parent localIcon - by @Azir-11 [<samp>(a9c98)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a9c98d9)
|
||||
- The matched value of TabRoute should be optional - by @Azir-11 [<samp>(e6fed)</samp>](https://github.com/soybeanjs/soybean-admin/commit/e6fed1f)
|
||||
- fix build [unocss]: build failed to load icon "close", fixed #319 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/319 [<samp>(c18d8)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c18d82f)
|
||||
- fix resolve alias - by @honghuangdc [<samp>(3bdcb)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3bdcbc7)
|
||||
- Missing default value for tab icon - by @Azir-11 [<samp>(72a46)</samp>](https://github.com/soybeanjs/soybean-admin/commit/72a4679)
|
||||
- add route icon: fucntion_hide-child - by @honghuangdc [<samp>(0a3ef)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0a3efe3)
|
||||
- fix table x-scroll. fixed #324 - by @honghuangdc in https://github.com/soybeanjs/soybean-admin/issues/324 [<samp>(c7e2c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c7e2c55)
|
||||
- Fix the logic of root route redirection to home - by **恕瑞玛的皇帝** [<samp>(0123c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0123c37)
|
||||
- Fix homepage mount error under dynamic routing - by **恕瑞玛的皇帝** [<samp>(9cf2a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/9cf2a51)
|
||||
- fix repeat home tab - by @honghuangdc [<samp>(bccd6)</samp>](https://github.com/soybeanjs/soybean-admin/commit/bccd6cb)
|
||||
- fix proxy config - by @honghuangdc [<samp>(c8019)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c8019c4)
|
||||
- fix proxy config - by @honghuangdc [<samp>(ffc95)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ffc95d2)
|
||||
- fix table row-key ts type - by @honghuangdc [<samp>(0cc8f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0cc8f05)
|
||||
- fix class name conflict with unocss icon - by @honghuangdc [<samp>(455e4)</samp>](https://github.com/soybeanjs/soybean-admin/commit/455e48f)
|
||||
- fix repeat routes - by @honghuangdc [<samp>(2c543)</samp>](https://github.com/soybeanjs/soybean-admin/commit/2c543f1)
|
||||
- fix route init - by @honghuangdc [<samp>(23a40)</samp>](https://github.com/soybeanjs/soybean-admin/commit/23a4098)
|
||||
|
||||
### 🔥 Performance
|
||||
|
||||
- **components**:
|
||||
- Optimize internationalized menu search code - by **燕博文** [<samp>(8c1ef)</samp>](https://github.com/honghuangdc/soybean-admin/commit/8c1ef4b)
|
||||
- Optimize menu search code - by **燕博文** [<samp>(296a2)</samp>](https://github.com/honghuangdc/soybean-admin/commit/296a2d2)
|
||||
- perf count-to - by @honghuangdc [<samp>(b2c61)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b2c61f0)
|
||||
- components name is converted to uppercase - by **燕博文** [<samp>(04aa1)</samp>](https://github.com/honghuangdc/soybean-admin/commit/04aa10b)
|
||||
- perf global-search - by @honghuangdc [<samp>(72745)</samp>](https://github.com/honghuangdc/soybean-admin/commit/7274522)
|
||||
- Optimize internationalized menu search code - by **燕博文** [<samp>(8c1ef)</samp>](https://github.com/soybeanjs/soybean-admin/commit/8c1ef4b)
|
||||
- Optimize menu search code - by **燕博文** [<samp>(296a2)</samp>](https://github.com/soybeanjs/soybean-admin/commit/296a2d2)
|
||||
- perf count-to - by @honghuangdc [<samp>(b2c61)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b2c61f0)
|
||||
- components name is converted to uppercase - by **燕博文** [<samp>(04aa1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/04aa10b)
|
||||
- perf global-search - by @honghuangdc [<samp>(72745)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7274522)
|
||||
- **projects**:
|
||||
- perf code - by @honghuangdc [<samp>(8081e)</samp>](https://github.com/honghuangdc/soybean-admin/commit/8081e19)
|
||||
- env config - by @honghuangdc [<samp>(1bac3)</samp>](https://github.com/honghuangdc/soybean-admin/commit/1bac3b7)
|
||||
- add detailed annotations for route role - by @honghuangdc [<samp>(f6bab)</samp>](https://github.com/honghuangdc/soybean-admin/commit/f6bab0c)
|
||||
- perf code - by @honghuangdc [<samp>(5c49d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/5c49d24)
|
||||
- remove useless file - by @honghuangdc [<samp>(c624f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c624f32)
|
||||
- remove @soybeanjs/cli - by @honghuangdc [<samp>(41349)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4134955)
|
||||
- echarts loading style - by @honghuangdc [<samp>(456c3)</samp>](https://github.com/honghuangdc/soybean-admin/commit/456c318)
|
||||
- perf page manage_role, useTable - by @honghuangdc [<samp>(39aa7)</samp>](https://github.com/honghuangdc/soybean-admin/commit/39aa7aa)
|
||||
- perf table columns style - by @honghuangdc [<samp>(babdb)</samp>](https://github.com/honghuangdc/soybean-admin/commit/babdb5d)
|
||||
- perf page manage_menu style - by @honghuangdc [<samp>(0aa75)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0aa75c0)
|
||||
- perf code - by @honghuangdc [<samp>(7fa87)</samp>](https://github.com/honghuangdc/soybean-admin/commit/7fa87f5)
|
||||
- perf code - by @honghuangdc [<samp>(05db8)</samp>](https://github.com/honghuangdc/soybean-admin/commit/05db8c0)
|
||||
- perf code - by @honghuangdc [<samp>(dc24a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/dc24a36)
|
||||
- perf manage page style - by @honghuangdc [<samp>(779ba)</samp>](https://github.com/honghuangdc/soybean-admin/commit/779ba4e)
|
||||
- perf manage menu - by @honghuangdc [<samp>(71f2c)</samp>](https://github.com/honghuangdc/soybean-admin/commit/71f2c55)
|
||||
- manage menu: add transform to component - by @honghuangdc [<samp>(0abbf)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0abbfa5)
|
||||
- perf code - by @honghuangdc [<samp>(8081e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/8081e19)
|
||||
- env config - by @honghuangdc [<samp>(1bac3)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1bac3b7)
|
||||
- add detailed annotations for route role - by @honghuangdc [<samp>(f6bab)</samp>](https://github.com/soybeanjs/soybean-admin/commit/f6bab0c)
|
||||
- perf code - by @honghuangdc [<samp>(5c49d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/5c49d24)
|
||||
- remove useless file - by @honghuangdc [<samp>(c624f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c624f32)
|
||||
- remove @soybeanjs/cli - by @honghuangdc [<samp>(41349)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4134955)
|
||||
- echarts loading style - by @honghuangdc [<samp>(456c3)</samp>](https://github.com/soybeanjs/soybean-admin/commit/456c318)
|
||||
- perf page manage_role, useTable - by @honghuangdc [<samp>(39aa7)</samp>](https://github.com/soybeanjs/soybean-admin/commit/39aa7aa)
|
||||
- perf table columns style - by @honghuangdc [<samp>(babdb)</samp>](https://github.com/soybeanjs/soybean-admin/commit/babdb5d)
|
||||
- perf page manage_menu style - by @honghuangdc [<samp>(0aa75)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0aa75c0)
|
||||
- perf code - by @honghuangdc [<samp>(7fa87)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7fa87f5)
|
||||
- perf code - by @honghuangdc [<samp>(05db8)</samp>](https://github.com/soybeanjs/soybean-admin/commit/05db8c0)
|
||||
- perf code - by @honghuangdc [<samp>(dc24a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/dc24a36)
|
||||
- perf manage page style - by @honghuangdc [<samp>(779ba)</samp>](https://github.com/soybeanjs/soybean-admin/commit/779ba4e)
|
||||
- perf manage menu - by @honghuangdc [<samp>(71f2c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/71f2c55)
|
||||
- manage menu: add transform to component - by @honghuangdc [<samp>(0abbf)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0abbfa5)
|
||||
|
||||
### 💅 Refactors
|
||||
|
||||
- **projects**:
|
||||
- remove plugin-web-update-notification - by @honghuangdc [<samp>(f6c6d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/f6c6dbd)
|
||||
- fix conflict with locale file - by @honghuangdc [<samp>(3346b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/3346bcd)
|
||||
- refactor app-loading - by @honghuangdc [<samp>(b4f3d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b4f3dd2)
|
||||
- use naive-ui color-picker - by @honghuangdc [<samp>(b5551)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b5551d6)
|
||||
- perf page home - by @honghuangdc [<samp>(4c61c)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4c61c6f)
|
||||
- login components => modules - by @honghuangdc [<samp>(59bec)</samp>](https://github.com/honghuangdc/soybean-admin/commit/59bec2d)
|
||||
- perf page function_tab - by @honghuangdc [<samp>(b5477)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b5477e8)
|
||||
- update mock api - by @honghuangdc [<samp>(27241)</samp>](https://github.com/honghuangdc/soybean-admin/commit/2724169)
|
||||
- page manage_role: extract module - by @honghuangdc [<samp>(0e9e2)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0e9e2e1)
|
||||
- perf page manage_role - by @honghuangdc [<samp>(a19f8)</samp>](https://github.com/honghuangdc/soybean-admin/commit/a19f895)
|
||||
- manage_route => manage_menu - by @honghuangdc [<samp>(f8467)</samp>](https://github.com/honghuangdc/soybean-admin/commit/f8467ce)
|
||||
- refactor service env config - by @honghuangdc [<samp>(43193)</samp>](https://github.com/honghuangdc/soybean-admin/commit/43193e2)
|
||||
- refactor unocss shortcuts: wh-full => size-full - by @honghuangdc [<samp>(b4c00)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b4c00ce)
|
||||
- use enquirer replace prompts - by @honghuangdc [<samp>(b546f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b546ff8)
|
||||
- refactor useTable - by @honghuangdc [<samp>(c3efa)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c3efa1b)
|
||||
- finish refactor useTable - by @honghuangdc [<samp>(86301)</samp>](https://github.com/honghuangdc/soybean-admin/commit/8630175)
|
||||
- finish refactor useTable and apply - by @honghuangdc [<samp>(3fd15)</samp>](https://github.com/honghuangdc/soybean-admin/commit/3fd15e5)
|
||||
- perf code - by @honghuangdc [<samp>(f91ef)</samp>](https://github.com/honghuangdc/soybean-admin/commit/f91ef30)
|
||||
- new route guard - by @honghuangdc [<samp>(37d20)</samp>](https://github.com/honghuangdc/soybean-admin/commit/37d20b8)
|
||||
- remove plugin-web-update-notification - by @honghuangdc [<samp>(f6c6d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/f6c6dbd)
|
||||
- fix conflict with locale file - by @honghuangdc [<samp>(3346b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3346bcd)
|
||||
- refactor app-loading - by @honghuangdc [<samp>(b4f3d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b4f3dd2)
|
||||
- use naive-ui color-picker - by @honghuangdc [<samp>(b5551)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b5551d6)
|
||||
- perf page home - by @honghuangdc [<samp>(4c61c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4c61c6f)
|
||||
- login components => modules - by @honghuangdc [<samp>(59bec)</samp>](https://github.com/soybeanjs/soybean-admin/commit/59bec2d)
|
||||
- perf page function_tab - by @honghuangdc [<samp>(b5477)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b5477e8)
|
||||
- update mock api - by @honghuangdc [<samp>(27241)</samp>](https://github.com/soybeanjs/soybean-admin/commit/2724169)
|
||||
- page manage_role: extract module - by @honghuangdc [<samp>(0e9e2)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0e9e2e1)
|
||||
- perf page manage_role - by @honghuangdc [<samp>(a19f8)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a19f895)
|
||||
- manage_route => manage_menu - by @honghuangdc [<samp>(f8467)</samp>](https://github.com/soybeanjs/soybean-admin/commit/f8467ce)
|
||||
- refactor service env config - by @honghuangdc [<samp>(43193)</samp>](https://github.com/soybeanjs/soybean-admin/commit/43193e2)
|
||||
- refactor unocss shortcuts: wh-full => size-full - by @honghuangdc [<samp>(b4c00)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b4c00ce)
|
||||
- use enquirer replace prompts - by @honghuangdc [<samp>(b546f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b546ff8)
|
||||
- refactor useTable - by @honghuangdc [<samp>(c3efa)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c3efa1b)
|
||||
- finish refactor useTable - by @honghuangdc [<samp>(86301)</samp>](https://github.com/soybeanjs/soybean-admin/commit/8630175)
|
||||
- finish refactor useTable and apply - by @honghuangdc [<samp>(3fd15)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3fd15e5)
|
||||
- perf code - by @honghuangdc [<samp>(f91ef)</samp>](https://github.com/soybeanjs/soybean-admin/commit/f91ef30)
|
||||
- new route guard - by @honghuangdc [<samp>(37d20)</samp>](https://github.com/soybeanjs/soybean-admin/commit/37d20b8)
|
||||
|
||||
### 📖 Documentation
|
||||
|
||||
- **projects**:
|
||||
- update README.md - by @honghuangdc [<samp>(78364)</samp>](https://github.com/honghuangdc/soybean-admin/commit/783648f)
|
||||
- update README.md - by @honghuangdc [<samp>(1ea48)</samp>](https://github.com/honghuangdc/soybean-admin/commit/1ea4817)
|
||||
- add README - by @honghuangdc [<samp>(2371b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/2371ba8)
|
||||
- update README - by @honghuangdc [<samp>(d16a9)</samp>](https://github.com/honghuangdc/soybean-admin/commit/d16a9d5)
|
||||
- update README.md - by @honghuangdc [<samp>(6a771)</samp>](https://github.com/honghuangdc/soybean-admin/commit/6a771ea)
|
||||
- update README.md - by @honghuangdc [<samp>(57b6d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/57b6d8a)
|
||||
- update README.md - by @honghuangdc [<samp>(b30c0)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b30c035)
|
||||
- update README.md - by @honghuangdc [<samp>(c260f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c260fe2)
|
||||
- update README.md - by @honghuangdc [<samp>(03c42)</samp>](https://github.com/honghuangdc/soybean-admin/commit/03c42aa)
|
||||
- update README.md - by @honghuangdc [<samp>(0fae9)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0fae993)
|
||||
- update README.md - by @honghuangdc [<samp>(4e4d2)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4e4d2de)
|
||||
- update README.md - by @honghuangdc [<samp>(86b44)</samp>](https://github.com/honghuangdc/soybean-admin/commit/86b445c)
|
||||
- update README.md - by @honghuangdc [<samp>(e2085)</samp>](https://github.com/honghuangdc/soybean-admin/commit/e2085e0)
|
||||
- update README.md - by @honghuangdc [<samp>(6ea9b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/6ea9b85)
|
||||
- update README.md - by @honghuangdc [<samp>(ef4af)</samp>](https://github.com/honghuangdc/soybean-admin/commit/ef4af79)
|
||||
- update README.md - by @honghuangdc [<samp>(41830)</samp>](https://github.com/honghuangdc/soybean-admin/commit/418302a)
|
||||
- add CHANGELOG.md - by @honghuangdc [<samp>(46b61)</samp>](https://github.com/honghuangdc/soybean-admin/commit/46b6156)
|
||||
- update README.md - by @honghuangdc [<samp>(78364)</samp>](https://github.com/soybeanjs/soybean-admin/commit/783648f)
|
||||
- update README.md - by @honghuangdc [<samp>(1ea48)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1ea4817)
|
||||
- add README - by @honghuangdc [<samp>(2371b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/2371ba8)
|
||||
- update README - by @honghuangdc [<samp>(d16a9)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d16a9d5)
|
||||
- update README.md - by @honghuangdc [<samp>(6a771)</samp>](https://github.com/soybeanjs/soybean-admin/commit/6a771ea)
|
||||
- update README.md - by @honghuangdc [<samp>(57b6d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/57b6d8a)
|
||||
- update README.md - by @honghuangdc [<samp>(b30c0)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b30c035)
|
||||
- update README.md - by @honghuangdc [<samp>(c260f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c260fe2)
|
||||
- update README.md - by @honghuangdc [<samp>(03c42)</samp>](https://github.com/soybeanjs/soybean-admin/commit/03c42aa)
|
||||
- update README.md - by @honghuangdc [<samp>(0fae9)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0fae993)
|
||||
- update README.md - by @honghuangdc [<samp>(4e4d2)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4e4d2de)
|
||||
- update README.md - by @honghuangdc [<samp>(86b44)</samp>](https://github.com/soybeanjs/soybean-admin/commit/86b445c)
|
||||
- update README.md - by @honghuangdc [<samp>(e2085)</samp>](https://github.com/soybeanjs/soybean-admin/commit/e2085e0)
|
||||
- update README.md - by @honghuangdc [<samp>(6ea9b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/6ea9b85)
|
||||
- update README.md - by @honghuangdc [<samp>(ef4af)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ef4af79)
|
||||
- update README.md - by @honghuangdc [<samp>(41830)</samp>](https://github.com/soybeanjs/soybean-admin/commit/418302a)
|
||||
- add CHANGELOG.md - by @honghuangdc [<samp>(46b61)</samp>](https://github.com/soybeanjs/soybean-admin/commit/46b6156)
|
||||
|
||||
### 🏡 Chore
|
||||
|
||||
- **deps**:
|
||||
- update deps - by @honghuangdc [<samp>(3eaf0)</samp>](https://github.com/honghuangdc/soybean-admin/commit/3eaf05b)
|
||||
- update deps - by @honghuangdc [<samp>(36fe1)</samp>](https://github.com/honghuangdc/soybean-admin/commit/36fe1da)
|
||||
- update deps - by @honghuangdc [<samp>(55342)</samp>](https://github.com/honghuangdc/soybean-admin/commit/5534294)
|
||||
- update deps - by @honghuangdc [<samp>(f1b86)</samp>](https://github.com/honghuangdc/soybean-admin/commit/f1b86cc)
|
||||
- update deps - by @honghuangdc [<samp>(840e7)</samp>](https://github.com/honghuangdc/soybean-admin/commit/840e7f9)
|
||||
- update deps - by @honghuangdc [<samp>(6114b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/6114b9f)
|
||||
- update deps - by @honghuangdc [<samp>(9cc7e)</samp>](https://github.com/honghuangdc/soybean-admin/commit/9cc7ee5)
|
||||
- update deps - by @honghuangdc [<samp>(9c4ba)</samp>](https://github.com/honghuangdc/soybean-admin/commit/9c4ba66)
|
||||
- update deps - by @honghuangdc [<samp>(fb3b9)</samp>](https://github.com/honghuangdc/soybean-admin/commit/fb3b94b)
|
||||
- update deps - by @honghuangdc [<samp>(14aa8)</samp>](https://github.com/honghuangdc/soybean-admin/commit/14aa856)
|
||||
- update deps - by @honghuangdc [<samp>(02d4b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/02d4b0a)
|
||||
- update deps - by @honghuangdc [<samp>(b2ee9)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b2ee9ee)
|
||||
- update deps - by @honghuangdc [<samp>(0fee1)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0fee104)
|
||||
- update deps - by @honghuangdc [<samp>(c0a65)</samp>](https://github.com/honghuangdc/soybean-admin/commit/c0a65a1)
|
||||
- update deps - by @honghuangdc [<samp>(3eaf0)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3eaf05b)
|
||||
- update deps - by @honghuangdc [<samp>(36fe1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/36fe1da)
|
||||
- update deps - by @honghuangdc [<samp>(55342)</samp>](https://github.com/soybeanjs/soybean-admin/commit/5534294)
|
||||
- update deps - by @honghuangdc [<samp>(f1b86)</samp>](https://github.com/soybeanjs/soybean-admin/commit/f1b86cc)
|
||||
- update deps - by @honghuangdc [<samp>(840e7)</samp>](https://github.com/soybeanjs/soybean-admin/commit/840e7f9)
|
||||
- update deps - by @honghuangdc [<samp>(6114b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/6114b9f)
|
||||
- update deps - by @honghuangdc [<samp>(9cc7e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/9cc7ee5)
|
||||
- update deps - by @honghuangdc [<samp>(9c4ba)</samp>](https://github.com/soybeanjs/soybean-admin/commit/9c4ba66)
|
||||
- update deps - by @honghuangdc [<samp>(fb3b9)</samp>](https://github.com/soybeanjs/soybean-admin/commit/fb3b94b)
|
||||
- update deps - by @honghuangdc [<samp>(14aa8)</samp>](https://github.com/soybeanjs/soybean-admin/commit/14aa856)
|
||||
- update deps - by @honghuangdc [<samp>(02d4b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/02d4b0a)
|
||||
- update deps - by @honghuangdc [<samp>(b2ee9)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b2ee9ee)
|
||||
- update deps - by @honghuangdc [<samp>(0fee1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0fee104)
|
||||
- update deps - by @honghuangdc [<samp>(c0a65)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c0a65a1)
|
||||
- **project**:
|
||||
- delete src/locales/lang/zh-CN.ts - by @honghuangdc [<samp>(377db)</samp>](https://github.com/honghuangdc/soybean-admin/commit/377db82)
|
||||
- delete src/locales/lang/zh-CN.ts - by @honghuangdc [<samp>(377db)</samp>](https://github.com/soybeanjs/soybean-admin/commit/377db82)
|
||||
- **projects**:
|
||||
- use eslint flat config & update config - by @honghuangdc [<samp>(a176d)</samp>](https://github.com/honghuangdc/soybean-admin/commit/a176dc4)
|
||||
- update @sa/scripts - by @honghuangdc [<samp>(d7785)</samp>](https://github.com/honghuangdc/soybean-admin/commit/d778560)
|
||||
- update pnpm version - by @honghuangdc [<samp>(55f76)</samp>](https://github.com/honghuangdc/soybean-admin/commit/55f7638)
|
||||
- update eslint config - by @honghuangdc [<samp>(5023f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/5023f37)
|
||||
- lock deps versions - by @honghuangdc [<samp>(a24f9)</samp>](https://github.com/honghuangdc/soybean-admin/commit/a24f963)
|
||||
- update pnpm version - by @honghuangdc [<samp>(ea02b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/ea02b23)
|
||||
- remove @simonwep/pickr - by @honghuangdc [<samp>(502a4)</samp>](https://github.com/honghuangdc/soybean-admin/commit/502a4d2)
|
||||
- remove soybean.svg - by @honghuangdc [<samp>(4031f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4031faf)
|
||||
- update pnpm version - by @honghuangdc [<samp>(adec0)</samp>](https://github.com/honghuangdc/soybean-admin/commit/adec0d7)
|
||||
- update deps & fix keep-alive - by @honghuangdc [<samp>(13001)</samp>](https://github.com/honghuangdc/soybean-admin/commit/13001bc)
|
||||
- update @elegant-router/vue, fix inject name in windows - by @honghuangdc [<samp>(0b56e)</samp>](https://github.com/honghuangdc/soybean-admin/commit/0b56e44)
|
||||
- add dev and build command with service env - by @honghuangdc [<samp>(ebb15)</samp>](https://github.com/honghuangdc/soybean-admin/commit/ebb1548)
|
||||
- update deps & remove packages docs - by @honghuangdc [<samp>(57963)</samp>](https://github.com/honghuangdc/soybean-admin/commit/579636b)
|
||||
- update pnpm-lock.yaml - by @honghuangdc [<samp>(147f6)</samp>](https://github.com/honghuangdc/soybean-admin/commit/147f60d)
|
||||
- update repository url - by @honghuangdc [<samp>(806a1)</samp>](https://github.com/honghuangdc/soybean-admin/commit/806a1cb)
|
||||
- update deps & update pnpm version - by @honghuangdc [<samp>(9772a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/9772aec)
|
||||
- add unocss eslint config - by @honghuangdc [<samp>(40635)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4063529)
|
||||
- update launch.json - by @honghuangdc [<samp>(3db82)</samp>](https://github.com/honghuangdc/soybean-admin/commit/3db82ac)
|
||||
- update vscode extensions.json - by @honghuangdc [<samp>(4e29a)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4e29aca)
|
||||
- update pnpm version - by @honghuangdc [<samp>(7065f)</samp>](https://github.com/honghuangdc/soybean-admin/commit/7065f6f)
|
||||
- update deps & fix eslint vue rule - by @honghuangdc [<samp>(8143b)</samp>](https://github.com/honghuangdc/soybean-admin/commit/8143b00)
|
||||
- update pnpm version - by @honghuangdc [<samp>(6ad51)</samp>](https://github.com/honghuangdc/soybean-admin/commit/6ad51e9)
|
||||
- use eslint flat config & update config - by @honghuangdc [<samp>(a176d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a176dc4)
|
||||
- update @sa/scripts - by @honghuangdc [<samp>(d7785)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d778560)
|
||||
- update pnpm version - by @honghuangdc [<samp>(55f76)</samp>](https://github.com/soybeanjs/soybean-admin/commit/55f7638)
|
||||
- update eslint config - by @honghuangdc [<samp>(5023f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/5023f37)
|
||||
- lock deps versions - by @honghuangdc [<samp>(a24f9)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a24f963)
|
||||
- update pnpm version - by @honghuangdc [<samp>(ea02b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ea02b23)
|
||||
- remove @simonwep/pickr - by @honghuangdc [<samp>(502a4)</samp>](https://github.com/soybeanjs/soybean-admin/commit/502a4d2)
|
||||
- remove soybean.svg - by @honghuangdc [<samp>(4031f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4031faf)
|
||||
- update pnpm version - by @honghuangdc [<samp>(adec0)</samp>](https://github.com/soybeanjs/soybean-admin/commit/adec0d7)
|
||||
- update deps & fix keep-alive - by @honghuangdc [<samp>(13001)</samp>](https://github.com/soybeanjs/soybean-admin/commit/13001bc)
|
||||
- update @elegant-router/vue, fix inject name in windows - by @honghuangdc [<samp>(0b56e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/0b56e44)
|
||||
- add dev and build command with service env - by @honghuangdc [<samp>(ebb15)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ebb1548)
|
||||
- update deps & remove packages docs - by @honghuangdc [<samp>(57963)</samp>](https://github.com/soybeanjs/soybean-admin/commit/579636b)
|
||||
- update pnpm-lock.yaml - by @honghuangdc [<samp>(147f6)</samp>](https://github.com/soybeanjs/soybean-admin/commit/147f60d)
|
||||
- update repository url - by @honghuangdc [<samp>(806a1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/806a1cb)
|
||||
- update deps & update pnpm version - by @honghuangdc [<samp>(9772a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/9772aec)
|
||||
- add unocss eslint config - by @honghuangdc [<samp>(40635)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4063529)
|
||||
- update launch.json - by @honghuangdc [<samp>(3db82)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3db82ac)
|
||||
- update vscode extensions.json - by @honghuangdc [<samp>(4e29a)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4e29aca)
|
||||
- update pnpm version - by @honghuangdc [<samp>(7065f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7065f6f)
|
||||
- update deps & fix eslint vue rule - by @honghuangdc [<samp>(8143b)</samp>](https://github.com/soybeanjs/soybean-admin/commit/8143b00)
|
||||
- update pnpm version - by @honghuangdc [<samp>(6ad51)</samp>](https://github.com/soybeanjs/soybean-admin/commit/6ad51e9)
|
||||
|
||||
### 🎨 Styles
|
||||
|
||||
- **components**:
|
||||
- Uniform icon size for header - by @Azir-11 [<samp>(b37c1)</samp>](https://github.com/honghuangdc/soybean-admin/commit/b37c1e9)
|
||||
- Uniform icon size for header - by @Azir-11 [<samp>(b37c1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b37c1e9)
|
||||
- **projects**:
|
||||
- format code - by @honghuangdc [<samp>(a7481)</samp>](https://github.com/honghuangdc/soybean-admin/commit/a748166)
|
||||
- update theme mode segment height - by @honghuangdc [<samp>(4d846)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4d8469e)
|
||||
- fix tooltip zIndex of ButtonIcon - by @honghuangdc [<samp>(db747)</samp>](https://github.com/honghuangdc/soybean-admin/commit/db747c4)
|
||||
- sort defineProps, defineEmits with TS type - by @honghuangdc [<samp>(123fd)</samp>](https://github.com/honghuangdc/soybean-admin/commit/123fd4f)
|
||||
- format code - by @honghuangdc [<samp>(a7481)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a748166)
|
||||
- update theme mode segment height - by @honghuangdc [<samp>(4d846)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4d8469e)
|
||||
- fix tooltip zIndex of ButtonIcon - by @honghuangdc [<samp>(db747)</samp>](https://github.com/soybeanjs/soybean-admin/commit/db747c4)
|
||||
- sort defineProps, defineEmits with TS type - by @honghuangdc [<samp>(123fd)</samp>](https://github.com/soybeanjs/soybean-admin/commit/123fd4f)
|
||||
|
||||
### 🤖 CI
|
||||
|
||||
- **projects**: add github actions config - by @honghuangdc [<samp>(4cb17)</samp>](https://github.com/honghuangdc/soybean-admin/commit/4cb17c7)
|
||||
- **projects**: add github actions config - by @honghuangdc [<samp>(4cb17)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4cb17c7)
|
||||
|
||||
### ❤️ Contributors
|
||||
|
||||
|
||||
41
CHANGELOG.zh_CN.md
Normal file
41
CHANGELOG.zh_CN.md
Normal file
@@ -0,0 +1,41 @@
|
||||
# 更新日志
|
||||
|
||||
|
||||
## [v1.1.0-beta.1](https://github.com/soybeanjs/soybean-admin/compare/v1.0.9...v1.1.0-beta.1) (2024-05-07)
|
||||
|
||||
### 🚀 功能
|
||||
|
||||
- **项目**:
|
||||
- 支持灰度。修复了 #385 - 由 @honghuangdc 在 https://github.com/soybeanjs/soybean-admin/issues/385 [<samp>(d335d)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d335df6)
|
||||
- 添加前缀到本地存储 - 由 **Azir** [<samp>(1fc34)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1fc34cc)
|
||||
- 添加表格 showTotal 选项 - 由 **paynezhuang** [<samp>(3e61e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3e61eab)
|
||||
- 添加推荐颜色切换。关闭了 #388 - 由 @honghuangdc 在 https://github.com/soybeanjs/soybean-admin/issues/388 [<samp>(a1920)</samp>](https://github.com/soybeanjs/soybean-admin/commit/a1920fc)
|
||||
- 添加菜单路由字段 - 由 **paynezhuang** [<samp>(dbe31)</samp>](https://github.com/soybeanjs/soybean-admin/commit/dbe31eb)
|
||||
- 支持短时间内重复请求错误只发生一次。关闭了 #368, 关闭了 #369 - 由 @honghuangdc 在 https://github.com/soybeanjs/soybean-admin/issues/368 和 https://github.com/soybeanjs/soybean-admin/issues/369 [<samp>(e3bd3)</samp>](https://github.com/soybeanjs/soybean-admin/commit/e3bd397)
|
||||
- 通过鼠标滚轮按钮点击关闭标签 - 由 **JianJroh** [<samp>(d3849)</samp>](https://github.com/soybeanjs/soybean-admin/commit/d3849ba)
|
||||
- 页面：支持更多的 manage_menu 选项。关闭了 #366 - 由 @honghuangdc 在 https://github.com/soybeanjs/soybean-admin/issues/366 [<samp>(c4b5c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/c4b5c65)
|
||||
|
||||
### 🐞 错误修复
|
||||
|
||||
- **项目**:
|
||||
- 修复菜单 fixedIndexInTab 默认为 null - 由 **paynezhuang** [<samp>(3d10e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3d10ef1)完成
|
||||
- 修复菜单切换器 zIndex - 由 @honghuangdc [<samp>(7bd43)</samp>](https://github.com/soybeanjs/soybean-admin/commit/7bd43df)完成
|
||||
|
||||
### 💅 重构
|
||||
|
||||
- **项目**:
|
||||
- 重构 @sa/color-palette => @sa/color & 性能优化 @sa/utils - 由 @honghuangdc [<samp>(34999)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3499997)完成
|
||||
- menu-operate-drawer => menu-operate-modal - 由 @honghuangdc [<samp>(003e1)</samp>](https://github.com/soybeanjs/soybean-admin/commit/003e145)完成
|
||||
|
||||
### 🏡 杂务
|
||||
|
||||
- **依赖**:
|
||||
- 更新依赖 - 由 @honghuangdc [<samp>(1cb38)</samp>](https://github.com/soybeanjs/soybean-admin/commit/1cb3816)完成
|
||||
- 更新依赖 - 由 @honghuangdc [<samp>(599b4)</samp>](https://github.com/soybeanjs/soybean-admin/commit/599b4e1)完成
|
||||
- **项目**:
|
||||
- 合并主分支到 v1.1.0 - 由 @honghuangdc [<samp>(ebe55)</samp>](https://github.com/soybeanjs/soybean-admin/commit/ebe55af)完成
|
||||
|
||||
### ❤️ 贡献者
|
||||
|
||||
[](https://github.com/honghuangdc)
|
||||
[JianJroh](mailto:rhjian@foxmail.com), [paynezhuang](mailto:paynezhuang@gmail.com), [Azir](mailto:2075125282@qq.com)
|
||||
30
README.md
30
README.md
@@ -3,13 +3,13 @@
|
||||
<h1>SoybeanAdmin</h1>
|
||||
<span>English | <a href="./README.zh_CN.md">中文</a></span>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
[](./LICENSE)  
|
||||
---
|
||||
|
||||
|
||||
>[!CAUTION]
|
||||
> the old version of `Soybean Admin` is moved to branch [legacy](https://github.com/soybeanjs/soybean-admin/tree/legacy). It is recommended to use the latest version of `Soybean Admin`.
|
||||
[](./LICENSE)
|
||||
[](https://github.com/soybeanjs/soybean-admin)
|
||||
[](https://github.com/soybeanjs/soybean-admin)
|
||||
[](https://gitee.com/honghuangdc/soybean-admin)
|
||||
|
||||
> [!NOTE]
|
||||
> If you think `SoybeanAdmin` is helpful to you, or you like our project, please give us a ⭐️ on GitHub. Your support is the driving force for us to continue to improve and add new features! Thank you for your support!
|
||||
@@ -79,7 +79,6 @@ Make sure your environment meets the following requirements:
|
||||
|
||||
- **git**: you need git to clone and manage project versions.
|
||||
- **NodeJS**: >=18.0.0, recommended 18.19.0 or higher.
|
||||
> You can use [fnm](https://github.com/Schniz/fnm) to manage your NodeJS version, [installation tutorial](https://juejin.cn/post/7113462239734022158).
|
||||
- **pnpm**: >= 8.0.0, recommended 8.14.0 or higher.
|
||||
|
||||
**Clone Project**
|
||||
@@ -107,13 +106,22 @@ pnpm dev
|
||||
pnpm build
|
||||
```
|
||||
|
||||
## Ecosystem
|
||||
|
||||
- [electron-mock-admin](https://github.com/lixin59/electron-mock-api): A Mock Api management system that helps front-end developers quickly implement interface mocks.
|
||||
- [T-Shell](https://github.com/TheBlindM/T-Shell): A terminal emulator and SSH client with configurable command prompts.
|
||||
- [pea](https://github.com/haitang1894/pea) : Adopting SpringBoot3.2 + JDK21, MyBatis-Plus, SpringSecurity security framework, etc., suitable for the simple permission system developed by [soybean-admin](https://gitee.com/honghuangdc/soybean-admin).
|
||||
- [MalusAdmin](https://github.com/pridejoy/MalusAdmin): A backend management framework developed based on Vue3/TypeScript/NaiveUI and NET7 & Sqlsugar. It is implemented in the most original and simplest way, with a fresh and elegant front-end, a clear and elegant backend structure, and powerful functions.
|
||||
- [PanisAdmin](https://github.com/paynezhuang/panis-admin): Adopting SpringBoot 3, SaToken, MySQL and other frameworks to develop and modify [soybean-admin](https://github.com/soybeanjs/soybean-admin) for the second time, adapting dynamic menu/button-level authorization. Retaining the original flavor, fresh and elegant, high-value back-end management system scaffold.
|
||||
|
||||
|
||||
## How to Contribute
|
||||
|
||||
We warmly welcome and appreciate all forms of contributions. If you have any ideas or suggestions, please feel free to share them by submitting [pull requests](https://github.com/soybeanjs/soybean-admin/pulls) or creating GitHub [issue](https://github.com/soybeanjs/soybean-admin/issues/new).
|
||||
|
||||
## Git Commit Guidelines
|
||||
|
||||
This project has built-in `commit` command, you can execute `pnpm commit` to generate commit information that conforms to [Conventional Commits](conventionalcommits) specification. When submitting PR, please be sure to use `commit` command to create commit information to ensure the standardization of information.
|
||||
This project has built-in `commit` command, you can execute `pnpm commit` to generate commit information that conforms to [Conventional Commits](https://www.conventionalcommits.org/) specification. When submitting PR, please be sure to use `commit` command to create commit information to ensure the standardization of information.
|
||||
|
||||
## Browser Support
|
||||
|
||||
@@ -143,17 +151,17 @@ Thanks the following people for their contributions. If you want to contribute t
|
||||
<p>QQ Group</p>
|
||||
<img src="https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/qq-soybean-admin-2.jpg" style="width:200px" />
|
||||
</div>
|
||||
<div>
|
||||
<!-- <div>
|
||||
<p>WeChat Group</p>
|
||||
<img src="https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/wechat-0402.jpg" style="width:200px" />
|
||||
</div>
|
||||
</div> -->
|
||||
<div>
|
||||
<p>Add the following WeChat to invite to the WeChat group</p>
|
||||
<img src="https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/wechat-soybeanjs.jpg" style="width:200px" />
|
||||
</div>
|
||||
<!-- <div>
|
||||
<div>
|
||||
<p>Add Soybean's WeChat for business consultation, cooperation, project architecture, one-on-one guidance, etc.</p>
|
||||
<img src="https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/wechat-soybean.jpg" style="width:200px" /> -->
|
||||
<img src="https://soybeanjs-1300612522.cos.ap-guangzhou.myqcloud.com/uPic/wechat-soybean.jpg" style="width:200px" />
|
||||
</div>
|
||||
|
||||
## Star Trend
|
||||
|
||||
@@ -3,21 +3,17 @@
|
||||
<h1>SoybeanAdmin</h1>
|
||||
<span><a href="./README.zh_CN.md">English</a> | 中文</span>
|
||||
</div>
|
||||
<br />
|
||||
|
||||
[](./LICENSE)  
|
||||
---
|
||||
|
||||
>[!CAUTION]
|
||||
> 旧版本的 `Soybean Admin` 已经移动到分支 [legacy](https://github.com/soybeanjs/soybean-admin/tree/legacy)。建议使用最新版本的 `Soybean Admin`。
|
||||
[](./LICENSE)
|
||||
[](https://github.com/soybeanjs/soybean-admin)
|
||||
[](https://github.com/soybeanjs/soybean-admin)
|
||||
[](https://gitee.com/honghuangdc/soybean-admin)
|
||||
|
||||
> [!NOTE]
|
||||
> 如果您觉得 `SoybeanAdmin`对您有所帮助，或者您喜欢我们的项目，请在 GitHub 上给我们一个 ⭐️。您的支持是我们持续改进和增加新功能的动力！感谢您的支持！
|
||||
|
||||
<br />
|
||||
|
||||
[](https://star-history.com/#soybeanjs/soybean-admin&Date)
|
||||
|
||||
|
||||
## 简介
|
||||
|
||||
[`SoybeanAdmin`](https://github.com/soybeanjs/soybean-admin) 是一个清新优雅、高颜值且功能强大的后台管理模板，基于最新的前端技术栈，包括 Vue3, Vite5, TypeScript, Pinia 和 UnoCSS。它内置了丰富的主题配置和组件，代码规范严谨，实现了自动化的文件路由系统。此外，它还采用了基于 ApiFox 的在线Mock数据方案。`SoybeanAdmin` 为您提供了一站式的后台管理解决方案，无需额外配置，开箱即用。同样是一个快速学习前沿技术的最佳实践。
|
||||
@@ -82,7 +78,6 @@
|
||||
|
||||
- **git**: 你需要git来克隆和管理项目版本。
|
||||
- **NodeJS**: >=18.0.0，推荐 18.19.0 或更高。
|
||||
> 你可以使用 [fnm](https://github.com/Schniz/fnm) 来管理你的NodeJS版本，[安装教程](https://juejin.cn/post/7113462239734022158)。
|
||||
- **pnpm**: >= 8.0.0，推荐 8.14.0 或更高。
|
||||
|
||||
**克隆项目**
|
||||
@@ -110,13 +105,22 @@ pnpm dev
|
||||
pnpm build
|
||||
```
|
||||
|
||||
## 周边生态
|
||||
|
||||
- [electron-mock-admin](https://github.com/lixin59/electron-mock-api): 一个 Mock Api 管理系统，帮助前端开发伙伴快速实现接口的 mock。
|
||||
- [T-Shell](https://github.com/TheBlindM/T-Shell): 是一个可配置命令提示的终端模拟器和 SSH 客户端。
|
||||
- [pea](https://github.com/haitang1894/pea) : 采用SpringBoot3.2 + JDK21、MyBatis-Plus、SpringSecurity安全框架等，适配 [soybean-admin](https://gitee.com/honghuangdc/soybean-admin) 开发的简单权限系统。
|
||||
- [MalusAdmin](https://github.com/pridejoy/MalusAdmin): 基于 Vue3/TypeScript/NaiveUI 和 NET7 & Sqlsugar 开发的后台管理框架。采用最原生最简洁的方式来实现, 前端清新优雅高颜值，后端 结构清晰，优雅易懂，功能强大。
|
||||
- [PanisAdmin](https://github.com/paynezhuang/panis-admin): 采用SpringBoot3、SaToken、MySQL等框架开发，二次修改 [soybean-admin](https://github.com/soybeanjs/soybean-admin)，适配动态菜单/按钮级别的鉴权，保留原汁原味、清新优雅、高颜值的后台管理系统脚手架。
|
||||
|
||||
|
||||
## 如何贡献
|
||||
|
||||
我们热烈欢迎并感谢所有形式的贡献。如果您有任何想法或建议，欢迎通过提交 [pull requests](https://github.com/soybeanjs/soybean-admin/pulls) 或创建 GitHub [issue](https://github.com/soybeanjs/soybean-admin/issues/new) 来分享。
|
||||
|
||||
## Git 提交规范
|
||||
|
||||
本项目已内置 `commit` 命令，您可以通过执行 `pnpm commit` 来生成符合 [Conventional Commits](conventionalcommits) 规范的提交信息。在提交PR时，请务必使用 `commit` 命令来创建提交信息，以确保信息的规范性。
|
||||
本项目已内置 `commit` 命令，您可以通过执行 `pnpm commit` 来生成符合 [Conventional Commits]([conventionalcommits](https://www.conventionalcommits.org/)) 规范的提交信息。在提交PR时，请务必使用 `commit` 命令来创建提交信息，以确保信息的规范性。
|
||||
|
||||
|
||||
## 浏览器支持
|
||||
@@ -131,6 +135,7 @@ pnpm build
|
||||
|
||||
[Soybean](https://github.com/honghuangdc)
|
||||
|
||||
|
||||
## 贡献者
|
||||
|
||||
感谢以下贡献者的贡献。如果您想为本项目做出贡献，请参考 [如何贡献](#如何贡献)。
|
||||
|
||||
@@ -9,7 +9,18 @@ export function setupElegantRouter() {
|
||||
blank: 'src/layouts/blank-layout/index.vue'
|
||||
},
|
||||
customRoutes: {
|
||||
names: ['exception_403', 'exception_404', 'exception_500']
|
||||
names: [
|
||||
'exception_403',
|
||||
'exception_404',
|
||||
'exception_500',
|
||||
'document_project',
|
||||
'document_project-link',
|
||||
'document_vue',
|
||||
'document_vite',
|
||||
'document_unocss',
|
||||
'document_naive',
|
||||
'document_antd'
|
||||
]
|
||||
},
|
||||
routePathTransformer(routeName, routePath) {
|
||||
const key = routeName as RouteKey;
|
||||
|
||||
@@ -7,7 +7,7 @@ export default defineConfig(
|
||||
'vue/multi-word-component-names': [
|
||||
'warn',
|
||||
{
|
||||
ignores: ['index', 'App', '[id]']
|
||||
ignores: ['index', 'App', '[id]', '[url]']
|
||||
}
|
||||
],
|
||||
'vue/component-name-in-template-casing': [
|
||||
@@ -18,7 +18,7 @@ export default defineConfig(
|
||||
ignores: ['/^icon-/']
|
||||
}
|
||||
],
|
||||
'order-attributify': 'off'
|
||||
'unocss/order-attributify': 'off'
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
59
package.json
59
package.json
@@ -1,8 +1,7 @@
|
||||
{
|
||||
"name": "soybean-admin",
|
||||
"type": "module",
|
||||
"version": "1.0.2",
|
||||
"packageManager": "pnpm@8.15.6",
|
||||
"version": "1.1.0-beta.2",
|
||||
"description": "A fresh and elegant admin template, based on Vue3、Vite3、TypeScript、NaiveUI and UnoCSS. 一个基于Vue3、Vite3、TypeScript、NaiveUI and UnoCSS的清新优雅的中后台模版。",
|
||||
"author": {
|
||||
"name": "Soybean",
|
||||
@@ -27,6 +26,10 @@
|
||||
"ant-design-vue v4",
|
||||
"UnoCSS"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">=18.12.0",
|
||||
"pnpm": ">=8.7.0"
|
||||
},
|
||||
"scripts": {
|
||||
"build": "vite build --mode prod",
|
||||
"build:test": "vite build --mode test",
|
||||
@@ -44,57 +47,57 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@better-scroll/core": "2.5.1",
|
||||
"@iconify/vue": "4.1.1",
|
||||
"@iconify/vue": "4.1.2",
|
||||
"@sa/axios": "workspace:*",
|
||||
"@sa/color-palette": "workspace:*",
|
||||
"@sa/color": "workspace:*",
|
||||
"@sa/hooks": "workspace:*",
|
||||
"@sa/materials": "workspace:*",
|
||||
"@sa/utils": "workspace:*",
|
||||
"@vueuse/core": "10.9.0",
|
||||
"clipboard": "2.0.11",
|
||||
"dayjs": "1.11.10",
|
||||
"dayjs": "1.11.11",
|
||||
"echarts": "5.5.0",
|
||||
"lodash-es": "4.17.21",
|
||||
"naive-ui": "2.38.1",
|
||||
"naive-ui": "2.38.2",
|
||||
"nprogress": "0.2.0",
|
||||
"pinia": "2.1.7",
|
||||
"vue": "3.4.21",
|
||||
"vue": "3.4.26",
|
||||
"vue-draggable-plus": "0.4.0",
|
||||
"vue-i18n": "9.11.0",
|
||||
"vue-router": "4.3.0"
|
||||
"vue-i18n": "9.13.1",
|
||||
"vue-router": "4.3.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@elegant-router/vue": "0.3.6",
|
||||
"@iconify/json": "2.2.198",
|
||||
"@iconify/json": "2.2.207",
|
||||
"@sa/scripts": "workspace:*",
|
||||
"@sa/uno-preset": "workspace:*",
|
||||
"@soybeanjs/eslint-config": "1.2.5",
|
||||
"@soybeanjs/eslint-config": "1.3.4",
|
||||
"@types/lodash-es": "4.17.12",
|
||||
"@types/node": "20.12.5",
|
||||
"@types/node": "20.12.10",
|
||||
"@types/nprogress": "0.2.3",
|
||||
"@unocss/eslint-config": "0.59.0",
|
||||
"@unocss/preset-icons": "0.59.0",
|
||||
"@unocss/preset-uno": "0.59.0",
|
||||
"@unocss/transformer-directives": "0.59.0",
|
||||
"@unocss/transformer-variant-group": "0.59.0",
|
||||
"@unocss/vite": "0.59.0",
|
||||
"@unocss/eslint-config": "0.59.4",
|
||||
"@unocss/preset-icons": "0.59.4",
|
||||
"@unocss/preset-uno": "0.59.4",
|
||||
"@unocss/transformer-directives": "0.59.4",
|
||||
"@unocss/transformer-variant-group": "0.59.4",
|
||||
"@unocss/vite": "0.59.4",
|
||||
"@vitejs/plugin-vue": "5.0.4",
|
||||
"@vitejs/plugin-vue-jsx": "3.1.0",
|
||||
"eslint": "8.57.0",
|
||||
"eslint-plugin-vue": "9.24.0",
|
||||
"eslint": "9.2.0",
|
||||
"eslint-plugin-vue": "9.25.0",
|
||||
"lint-staged": "15.2.2",
|
||||
"sass": "1.74.1",
|
||||
"sass": "1.76.0",
|
||||
"simple-git-hooks": "2.11.1",
|
||||
"tsx": "4.7.2",
|
||||
"typescript": "5.4.4",
|
||||
"unplugin-icons": "0.18.5",
|
||||
"unplugin-vue-components": "0.26.0",
|
||||
"vite": "5.2.8",
|
||||
"tsx": "4.9.3",
|
||||
"typescript": "5.4.5",
|
||||
"unplugin-icons": "0.19.0",
|
||||
"unplugin-vue-components": "0.27.0",
|
||||
"vite": "5.2.11",
|
||||
"vite-plugin-progress": "0.0.7",
|
||||
"vite-plugin-svg-icons": "2.0.1",
|
||||
"vite-plugin-vue-devtools": "7.0.25",
|
||||
"vite-plugin-vue-devtools": "7.1.3",
|
||||
"vue-eslint-parser": "9.4.2",
|
||||
"vue-tsc": "2.0.11"
|
||||
"vue-tsc": "2.0.16"
|
||||
},
|
||||
"simple-git-hooks": {
|
||||
"commit-msg": "pnpm sa git-commit-verify",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sa/axios",
|
||||
"version": "1.0.2",
|
||||
"version": "1.1.0-beta.2",
|
||||
"exports": {
|
||||
".": "./src/index.ts"
|
||||
},
|
||||
@@ -13,9 +13,9 @@
|
||||
"@sa/utils": "workspace:*",
|
||||
"axios": "1.6.8",
|
||||
"axios-retry": "4.1.0",
|
||||
"qs": "6.12.0"
|
||||
"qs": "6.12.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/qs": "6.9.14"
|
||||
"@types/qs": "6.9.15"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -48,7 +48,9 @@ function createCommonRequest<ResponseData = any>(
|
||||
|
||||
instance.interceptors.response.use(
|
||||
async response => {
|
||||
if (opts.isBackendSuccess(response)) {
|
||||
const responseType: ResponseType = (response.config?.responseType as ResponseType) || 'json';
|
||||
|
||||
if (responseType !== 'json' || opts.isBackendSuccess(response)) {
|
||||
return Promise.resolve(response);
|
||||
}
|
||||
|
||||
@@ -127,6 +129,7 @@ export function createRequest<ResponseData = any, State = Record<string, unknown
|
||||
|
||||
request.cancelRequest = cancelRequest;
|
||||
request.cancelAllRequest = cancelAllRequest;
|
||||
request.state = {} as State;
|
||||
|
||||
return request;
|
||||
}
|
||||
|
||||
@@ -1,29 +0,0 @@
|
||||
import { colord, extend } from 'colord';
|
||||
import type { HslColor } from 'colord';
|
||||
import labPlugin from 'colord/plugins/lab';
|
||||
|
||||
extend([labPlugin]);
|
||||
|
||||
export function isValidColor(color: string) {
|
||||
return colord(color).isValid();
|
||||
}
|
||||
|
||||
export function getHex(color: string) {
|
||||
return colord(color).toHex();
|
||||
}
|
||||
|
||||
export function getRgb(color: string) {
|
||||
return colord(color).toRgb();
|
||||
}
|
||||
|
||||
export function getHsl(color: string) {
|
||||
return colord(color).toHsl();
|
||||
}
|
||||
|
||||
export function getDeltaE(color1: string, color2: string) {
|
||||
return colord(color1).delta(color2);
|
||||
}
|
||||
|
||||
export function transformHslToHex(color: HslColor) {
|
||||
return colord(color).toHex();
|
||||
}
|
||||
@@ -1,56 +0,0 @@
|
||||
import { getColorPaletteFamily } from './palette';
|
||||
import { getColorName } from './name';
|
||||
import type { ColorPalette, ColorPaletteFamily, ColorPaletteItem, ColorPaletteNumber } from './type';
|
||||
import defaultPalettes from './json/palette.json';
|
||||
|
||||
/**
|
||||
* Get color palette by provided color and color name
|
||||
*
|
||||
* @param color The provided color
|
||||
* @param colorName Color name
|
||||
*/
|
||||
export function getColorPalette(color: string, colorName: string) {
|
||||
const colorPaletteFamily = getColorPaletteFamily(color, colorName);
|
||||
|
||||
const colorMap = new Map<ColorPaletteNumber, ColorPaletteItem>();
|
||||
|
||||
colorPaletteFamily.palettes.forEach(palette => {
|
||||
colorMap.set(palette.number, palette);
|
||||
});
|
||||
|
||||
const mainColor = colorMap.get(500) as ColorPaletteItem;
|
||||
const matchColor = colorPaletteFamily.palettes.find(palette => palette.hexcode === color) as ColorPaletteItem;
|
||||
|
||||
const colorPalette: ColorPalette = {
|
||||
...colorPaletteFamily,
|
||||
colorMap,
|
||||
main: mainColor,
|
||||
match: matchColor
|
||||
};
|
||||
|
||||
return colorPalette;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get color by color palette number
|
||||
*
|
||||
* @param color Color
|
||||
* @param num Color palette number
|
||||
* @returns Color hexcode
|
||||
*/
|
||||
export function getColorByColorPaletteNumber(color: string, num: ColorPaletteNumber) {
|
||||
const colorPalette = getColorPalette(color, color);
|
||||
|
||||
const colorItem = colorPalette.colorMap.get(num) as ColorPaletteItem;
|
||||
|
||||
return colorItem.hexcode;
|
||||
}
|
||||
|
||||
export default getColorPalette;
|
||||
|
||||
/** The builtin color palettes */
|
||||
const colorPalettes = defaultPalettes as ColorPaletteFamily[];
|
||||
|
||||
export { getColorName, colorPalettes };
|
||||
|
||||
export type { ColorPalette, ColorPaletteNumber, ColorPaletteItem, ColorPaletteFamily };
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,274 +0,0 @@
|
||||
[
|
||||
{
|
||||
"key": "red",
|
||||
"palettes": [
|
||||
{ "hexcode": "#fef2f2", "number": 50, "name": "Bridesmaid" },
|
||||
{ "hexcode": "#fee2e2", "number": 100, "name": "Pippin" },
|
||||
{ "hexcode": "#fecaca", "number": 200, "name": "Your Pink" },
|
||||
{ "hexcode": "#fca5a5", "number": 300, "name": "Cornflower Lilac" },
|
||||
{ "hexcode": "#f87171", "number": 400, "name": "Bittersweet" },
|
||||
{ "hexcode": "#ef4444", "number": 500, "name": "Cinnabar" },
|
||||
{ "hexcode": "#dc2626", "number": 600, "name": "Persian Red" },
|
||||
{ "hexcode": "#b91c1c", "number": 700, "name": "Thunderbird" },
|
||||
{ "hexcode": "#991b1b", "number": 800, "name": "Old Brick" },
|
||||
{ "hexcode": "#7f1d1d", "number": 900, "name": "Falu Red" },
|
||||
{ "hexcode": "#450a0a", "number": 950, "name": "Mahogany" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "orange",
|
||||
"palettes": [
|
||||
{ "hexcode": "#fff7ed", "number": 50, "name": "Serenade" },
|
||||
{ "hexcode": "#ffedd5", "number": 100, "name": "Derby" },
|
||||
{ "hexcode": "#fed7aa", "number": 200, "name": "Caramel" },
|
||||
{ "hexcode": "#fdba74", "number": 300, "name": "Macaroni and Cheese" },
|
||||
{ "hexcode": "#fb923c", "number": 400, "name": "Neon Carrot" },
|
||||
{ "hexcode": "#f97316", "number": 500, "name": "Ecstasy" },
|
||||
{ "hexcode": "#ea580c", "number": 600, "name": "Trinidad" },
|
||||
{ "hexcode": "#c2410c", "number": 700, "name": "Tia Maria" },
|
||||
{ "hexcode": "#9a3412", "number": 800, "name": "Tabasco" },
|
||||
{ "hexcode": "#7c2d12", "number": 900, "name": "Pueblo" },
|
||||
{ "hexcode": "#431407", "number": 950, "name": "Rebel" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "amber",
|
||||
"palettes": [
|
||||
{ "hexcode": "#fffbeb", "number": 50, "name": "Island Spice" },
|
||||
{ "hexcode": "#fef3c7", "number": 100, "name": "Beeswax" },
|
||||
{ "hexcode": "#fde68a", "number": 200, "name": "Sweet Corn" },
|
||||
{ "hexcode": "#fcd34d", "number": 300, "name": "Mustard" },
|
||||
{ "hexcode": "#fbbf24", "number": 400, "name": "Lightning Yellow" },
|
||||
{ "hexcode": "#f59e0b", "number": 500, "name": "California" },
|
||||
{ "hexcode": "#d97706", "number": 600, "name": "Christine" },
|
||||
{ "hexcode": "#b45309", "number": 700, "name": "Vesuvius" },
|
||||
{ "hexcode": "#92400e", "number": 800, "name": "Korma" },
|
||||
{ "hexcode": "#78350f", "number": 900, "name": "Copper Canyon" },
|
||||
{ "hexcode": "#451a03", "number": 950, "name": "Brown Pod" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "yellow",
|
||||
"palettes": [
|
||||
{ "hexcode": "#fefce8", "number": 50, "name": "Orange White" },
|
||||
{ "hexcode": "#fef9c3", "number": 100, "name": "Lemon Chiffon" },
|
||||
{ "hexcode": "#fef08a", "number": 200, "name": "Sweet Corn" },
|
||||
{ "hexcode": "#fde047", "number": 300, "name": "Bright Sun" },
|
||||
{ "hexcode": "#facc15", "number": 400, "name": "Candlelight" },
|
||||
{ "hexcode": "#eab308", "number": 500, "name": "Corn" },
|
||||
{ "hexcode": "#ca8a04", "number": 600, "name": "Pirate Gold" },
|
||||
{ "hexcode": "#a16207", "number": 700, "name": "Mai Tai" },
|
||||
{ "hexcode": "#854d0e", "number": 800, "name": "Korma" },
|
||||
{ "hexcode": "#713f12", "number": 900, "name": "Sepia" },
|
||||
{ "hexcode": "#422006", "number": 950, "name": "Dark Ebony" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "lime",
|
||||
"palettes": [
|
||||
{ "hexcode": "#f7fee7", "number": 50, "name": "Spring Sun" },
|
||||
{ "hexcode": "#ecfccb", "number": 100, "name": "Chiffon" },
|
||||
{ "hexcode": "#d9f99d", "number": 200, "name": "Gossip" },
|
||||
{ "hexcode": "#bef264", "number": 300, "name": "Sulu" },
|
||||
{ "hexcode": "#a3e635", "number": 400, "name": "Conifer" },
|
||||
{ "hexcode": "#84cc16", "number": 500, "name": "Lima" },
|
||||
{ "hexcode": "#65a30d", "number": 600, "name": "Christi" },
|
||||
{ "hexcode": "#4d7c0f", "number": 700, "name": "Green Leaf" },
|
||||
{ "hexcode": "#3f6212", "number": 800, "name": "Dell" },
|
||||
{ "hexcode": "#365314", "number": 900, "name": "Clover" },
|
||||
{ "hexcode": "#1a2e05", "number": 950, "name": "Deep Forest Green" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "green",
|
||||
"palettes": [
|
||||
{ "hexcode": "#f0fdf4", "number": 50, "name": "Ottoman" },
|
||||
{ "hexcode": "#dcfce7", "number": 100, "name": "Blue Romance" },
|
||||
{ "hexcode": "#bbf7d0", "number": 200, "name": "Magic Mint" },
|
||||
{ "hexcode": "#86efac", "number": 300, "name": "Algae Green" },
|
||||
{ "hexcode": "#4ade80", "number": 400, "name": "Emerald" },
|
||||
{ "hexcode": "#22c55e", "number": 500, "name": "Malachite" },
|
||||
{ "hexcode": "#16a34a", "number": 600, "name": "Salem" },
|
||||
{ "hexcode": "#15803d", "number": 700, "name": "Jewel" },
|
||||
{ "hexcode": "#166534", "number": 800, "name": "Jewel" },
|
||||
{ "hexcode": "#14532d", "number": 900, "name": "Green Pea" },
|
||||
{ "hexcode": "#052e16", "number": 950, "name": "English Holly" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "emerald",
|
||||
"palettes": [
|
||||
{ "hexcode": "#ecfdf5", "number": 50, "name": "White Ice" },
|
||||
{ "hexcode": "#d1fae5", "number": 100, "name": "Granny Apple" },
|
||||
{ "hexcode": "#a7f3d0", "number": 200, "name": "Magic Mint" },
|
||||
{ "hexcode": "#6ee7b7", "number": 300, "name": "Bermuda" },
|
||||
{ "hexcode": "#34d399", "number": 400, "name": "Shamrock" },
|
||||
{ "hexcode": "#10b981", "number": 500, "name": "Mountain Meadow" },
|
||||
{ "hexcode": "#059669", "number": 600, "name": "Green Haze" },
|
||||
{ "hexcode": "#047857", "number": 700, "name": "Watercourse" },
|
||||
{ "hexcode": "#065f46", "number": 800, "name": "Watercourse" },
|
||||
{ "hexcode": "#064e3b", "number": 900, "name": "Evening Sea" },
|
||||
{ "hexcode": "#022c22", "number": 950, "name": "Burnham" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "teal",
|
||||
"palettes": [
|
||||
{ "hexcode": "#f0fdfa", "number": 50, "name": "White Ice" },
|
||||
{ "hexcode": "#ccfbf1", "number": 100, "name": "Scandal" },
|
||||
{ "hexcode": "#99f6e4", "number": 200, "name": "Ice Cold" },
|
||||
{ "hexcode": "#5eead4", "number": 300, "name": "Turquoise Blue" },
|
||||
{ "hexcode": "#2dd4bf", "number": 400, "name": "Turquoise" },
|
||||
{ "hexcode": "#14b8a6", "number": 500, "name": "Java" },
|
||||
{ "hexcode": "#0d9488", "number": 600, "name": "Blue Chill" },
|
||||
{ "hexcode": "#0f766e", "number": 700, "name": "Genoa" },
|
||||
{ "hexcode": "#115e59", "number": 800, "name": "Eden" },
|
||||
{ "hexcode": "#134e4a", "number": 900, "name": "Eden" },
|
||||
{ "hexcode": "#042f2e", "number": 950, "name": "Tiber" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "cyan",
|
||||
"palettes": [
|
||||
{ "hexcode": "#ecfeff", "number": 50, "name": "Bubbles" },
|
||||
{ "hexcode": "#cffafe", "number": 100, "name": "Oyster Bay" },
|
||||
{ "hexcode": "#a5f3fc", "number": 200, "name": "Anakiwa" },
|
||||
{ "hexcode": "#67e8f9", "number": 300, "name": "Spray" },
|
||||
{ "hexcode": "#22d3ee", "number": 400, "name": "Bright Turquoise" },
|
||||
{ "hexcode": "#06b6d4", "number": 500, "name": "Cerulean" },
|
||||
{ "hexcode": "#0891b2", "number": 600, "name": "Bondi Blue" },
|
||||
{ "hexcode": "#0e7490", "number": 700, "name": "Blue Chill" },
|
||||
{ "hexcode": "#155e75", "number": 800, "name": "Blumine" },
|
||||
{ "hexcode": "#164e63", "number": 900, "name": "Chathams Blue" },
|
||||
{ "hexcode": "#083344", "number": 950, "name": "Tarawera" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "sky",
|
||||
"palettes": [
|
||||
{ "hexcode": "#f0f9ff", "number": 50, "name": "Alice Blue" },
|
||||
{ "hexcode": "#e0f2fe", "number": 100, "name": "Pattens Blue" },
|
||||
{ "hexcode": "#bae6fd", "number": 200, "name": "French Pass" },
|
||||
{ "hexcode": "#7dd3fc", "number": 300, "name": "Malibu" },
|
||||
{ "hexcode": "#38bdf8", "number": 400, "name": "Picton Blue" },
|
||||
{ "hexcode": "#0ea5e9", "number": 500, "name": "Cerulean" },
|
||||
{ "hexcode": "#0284c7", "number": 600, "name": "Lochmara" },
|
||||
{ "hexcode": "#0369a1", "number": 700, "name": "Bahama Blue" },
|
||||
{ "hexcode": "#075985", "number": 800, "name": "Venice Blue" },
|
||||
{ "hexcode": "#0c4a6e", "number": 900, "name": "Chathams Blue" },
|
||||
{ "hexcode": "#082f49", "number": 950, "name": "Blue Whale" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "blue",
|
||||
"palettes": [
|
||||
{ "hexcode": "#eff6ff", "number": 50, "name": "Zumthor" },
|
||||
{ "hexcode": "#dbeafe", "number": 100, "name": "Hawkes Blue" },
|
||||
{ "hexcode": "#bfdbfe", "number": 200, "name": "Tropical Blue" },
|
||||
{ "hexcode": "#93c5fd", "number": 300, "name": "Malibu" },
|
||||
{ "hexcode": "#60a5fa", "number": 400, "name": "Cornflower Blue" },
|
||||
{ "hexcode": "#3b82f6", "number": 500, "name": "Dodger Blue" },
|
||||
{ "hexcode": "#2563eb", "number": 600, "name": "Royal Blue" },
|
||||
{ "hexcode": "#1d4ed8", "number": 700, "name": "Cerulean Blue" },
|
||||
{ "hexcode": "#1e40af", "number": 800, "name": "Persian Blue" },
|
||||
{ "hexcode": "#1e3a8a", "number": 900, "name": "Bay of Many" },
|
||||
{ "hexcode": "#172554", "number": 950, "name": "Bunting" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "indigo",
|
||||
"palettes": [
|
||||
{ "hexcode": "#eef2ff", "number": 50, "name": "Zircon" },
|
||||
{ "hexcode": "#e0e7ff", "number": 100, "name": "Hawkes Blue" },
|
||||
{ "hexcode": "#c7d2fe", "number": 200, "name": "Periwinkle" },
|
||||
{ "hexcode": "#a5b4fc", "number": 300, "name": "Perano" },
|
||||
{ "hexcode": "#818cf8", "number": 400, "name": "Portage" },
|
||||
{ "hexcode": "#6366f1", "number": 500, "name": "Royal Blue" },
|
||||
{ "hexcode": "#4f46e5", "number": 600, "name": "Royal Blue" },
|
||||
{ "hexcode": "#4338ca", "number": 700, "name": "Governor Bay" },
|
||||
{ "hexcode": "#3730a3", "number": 800, "name": "Governor Bay" },
|
||||
{ "hexcode": "#312e81", "number": 900, "name": "Minsk" },
|
||||
{ "hexcode": "#1e1b4b", "number": 950, "name": "Port Gore" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "violet",
|
||||
"palettes": [
|
||||
{ "hexcode": "#f5f3ff", "number": 50, "name": "Titan White" },
|
||||
{ "hexcode": "#ede9fe", "number": 100, "name": "Titan White" },
|
||||
{ "hexcode": "#ddd6fe", "number": 200, "name": "Fog" },
|
||||
{ "hexcode": "#c4b5fd", "number": 300, "name": "Melrose" },
|
||||
{ "hexcode": "#a78bfa", "number": 400, "name": "Dull Lavender" },
|
||||
{ "hexcode": "#8b5cf6", "number": 500, "name": "Medium Purple" },
|
||||
{ "hexcode": "#7c3aed", "number": 600, "name": "Purple Heart" },
|
||||
{ "hexcode": "#6d28d9", "number": 700, "name": "Purple Heart" },
|
||||
{ "hexcode": "#5b21b6", "number": 800, "name": "Purple Heart" },
|
||||
{ "hexcode": "#4c1d95", "number": 900, "name": "Daisy Bush" },
|
||||
{ "hexcode": "#2e1065", "number": 950, "name": "Violent Violet" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "purple",
|
||||
"palettes": [
|
||||
{ "hexcode": "#faf5ff", "number": 50, "name": "Magnolia" },
|
||||
{ "hexcode": "#f3e8ff", "number": 100, "name": "Blue Chalk" },
|
||||
{ "hexcode": "#e9d5ff", "number": 200, "name": "Blue Chalk" },
|
||||
{ "hexcode": "#d8b4fe", "number": 300, "name": "Mauve" },
|
||||
{ "hexcode": "#c084fc", "number": 400, "name": "Heliotrope" },
|
||||
{ "hexcode": "#a855f7", "number": 500, "name": "Medium Purple" },
|
||||
{ "hexcode": "#9333ea", "number": 600, "name": "Electric Violet" },
|
||||
{ "hexcode": "#7e22ce", "number": 700, "name": "Purple Heart" },
|
||||
{ "hexcode": "#6b21a8", "number": 800, "name": "Seance" },
|
||||
{ "hexcode": "#581c87", "number": 900, "name": "Daisy Bush" },
|
||||
{ "hexcode": "#3b0764", "number": 950, "name": "Christalle" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "fuchsia",
|
||||
"palettes": [
|
||||
{ "hexcode": "#fdf4ff", "number": 50, "name": "White Pointer" },
|
||||
{ "hexcode": "#fae8ff", "number": 100, "name": "White Pointer" },
|
||||
{ "hexcode": "#f5d0fe", "number": 200, "name": "Mauve" },
|
||||
{ "hexcode": "#f0abfc", "number": 300, "name": "Mauve" },
|
||||
{ "hexcode": "#e879f9", "number": 400, "name": "Heliotrope" },
|
||||
{ "hexcode": "#d946ef", "number": 500, "name": "Heliotrope" },
|
||||
{ "hexcode": "#c026d3", "number": 600, "name": "Fuchsia Pink" },
|
||||
{ "hexcode": "#a21caf", "number": 700, "name": "Violet Eggplant" },
|
||||
{ "hexcode": "#86198f", "number": 800, "name": "Seance" },
|
||||
{ "hexcode": "#701a75", "number": 900, "name": "Seance" },
|
||||
{ "hexcode": "#4a044e", "number": 950, "name": "Clairvoyant" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "pink",
|
||||
"palettes": [
|
||||
{ "hexcode": "#fdf2f8", "number": 50, "name": "Wisp Pink" },
|
||||
{ "hexcode": "#fce7f3", "number": 100, "name": "Carousel Pink" },
|
||||
{ "hexcode": "#fbcfe8", "number": 200, "name": "Classic Rose" },
|
||||
{ "hexcode": "#f9a8d4", "number": 300, "name": "Lavender Pink" },
|
||||
{ "hexcode": "#f472b6", "number": 400, "name": "Persian Pink" },
|
||||
{ "hexcode": "#ec4899", "number": 500, "name": "Brilliant Rose" },
|
||||
{ "hexcode": "#db2777", "number": 600, "name": "Cerise" },
|
||||
{ "hexcode": "#be185d", "number": 700, "name": "Maroon Flush" },
|
||||
{ "hexcode": "#9d174d", "number": 800, "name": "Disco" },
|
||||
{ "hexcode": "#831843", "number": 900, "name": "Disco" },
|
||||
{ "hexcode": "#500724", "number": 950, "name": "Cab Sav" }
|
||||
]
|
||||
},
|
||||
{
|
||||
"key": "rose",
|
||||
"palettes": [
|
||||
{ "hexcode": "#fff1f2", "number": 50, "name": "Lavender blush" },
|
||||
{ "hexcode": "#ffe4e6", "number": 100, "name": "Cosmos" },
|
||||
{ "hexcode": "#fecdd3", "number": 200, "name": "Pastel Pink" },
|
||||
{ "hexcode": "#fda4af", "number": 300, "name": "Sweet Pink" },
|
||||
{ "hexcode": "#fb7185", "number": 400, "name": "Froly" },
|
||||
{ "hexcode": "#f43f5e", "number": 500, "name": "Radical Red" },
|
||||
{ "hexcode": "#e11d48", "number": 600, "name": "Amaranth" },
|
||||
{ "hexcode": "#be123c", "number": 700, "name": "Cardinal" },
|
||||
{ "hexcode": "#9f1239", "number": 800, "name": "Shiraz" },
|
||||
{ "hexcode": "#881337", "number": 900, "name": "Claret" },
|
||||
{ "hexcode": "#4c0519", "number": 950, "name": "Cab Sav" }
|
||||
]
|
||||
}
|
||||
]
|
||||
@@ -1,95 +0,0 @@
|
||||
import { getDeltaE, getHsl, isValidColor, transformHslToHex } from './color';
|
||||
import { getColorName } from './name';
|
||||
import type { ColorPaletteFamily, ColorPaletteFamilyWithNearestPalette } from './type';
|
||||
import defaultPalettes from './json/palette.json';
|
||||
|
||||
export function getNearestColorPaletteFamily(color: string, families: ColorPaletteFamily[]) {
|
||||
const familyWithConfig = families.map(family => {
|
||||
const palettes = family.palettes.map(palette => {
|
||||
return {
|
||||
...palette,
|
||||
delta: getDeltaE(color, palette.hexcode)
|
||||
};
|
||||
});
|
||||
|
||||
const nearestPalette = palettes.reduce((prev, curr) => (prev.delta < curr.delta ? prev : curr));
|
||||
|
||||
return {
|
||||
...family,
|
||||
palettes,
|
||||
nearestPalette
|
||||
};
|
||||
});
|
||||
|
||||
const nearestPaletteFamily = familyWithConfig.reduce((prev, curr) =>
|
||||
prev.nearestPalette.delta < curr.nearestPalette.delta ? prev : curr
|
||||
);
|
||||
|
||||
const { l } = getHsl(color);
|
||||
|
||||
const paletteFamily: ColorPaletteFamilyWithNearestPalette = {
|
||||
...nearestPaletteFamily,
|
||||
nearestLightnessPalette: nearestPaletteFamily.palettes.reduce((prev, curr) => {
|
||||
const { l: prevLightness } = getHsl(prev.hexcode);
|
||||
const { l: currLightness } = getHsl(curr.hexcode);
|
||||
|
||||
const deltaPrev = Math.abs(prevLightness - l);
|
||||
const deltaCurr = Math.abs(currLightness - l);
|
||||
|
||||
return deltaPrev < deltaCurr ? prev : curr;
|
||||
})
|
||||
};
|
||||
|
||||
return paletteFamily;
|
||||
}
|
||||
|
||||
export function getColorPaletteFamily(color: string, colorName: string) {
|
||||
if (!isValidColor(color)) {
|
||||
throw new Error('Invalid color, please check color value!');
|
||||
}
|
||||
|
||||
const { h: h1, s: s1 } = getHsl(color);
|
||||
|
||||
const { nearestLightnessPalette, palettes } = getNearestColorPaletteFamily(
|
||||
color,
|
||||
defaultPalettes as ColorPaletteFamily[]
|
||||
);
|
||||
|
||||
const { number, hexcode } = nearestLightnessPalette;
|
||||
|
||||
const { h: h2, s: s2 } = getHsl(hexcode);
|
||||
|
||||
const deltaH = h1 - h2 || h2;
|
||||
|
||||
const sRatio = s1 / s2;
|
||||
|
||||
const colorPaletteFamily: ColorPaletteFamily = {
|
||||
key: colorName,
|
||||
palettes: palettes.map(palette => {
|
||||
let hexValue = color;
|
||||
|
||||
const isSame = number === palette.number;
|
||||
|
||||
if (!isSame) {
|
||||
const { h: h3, s: s3, l } = getHsl(palette.hexcode);
|
||||
|
||||
const newH = deltaH < 0 ? h3 + deltaH : deltaH;
|
||||
const newS = s3 * sRatio;
|
||||
|
||||
hexValue = transformHslToHex({
|
||||
h: newH,
|
||||
s: newS,
|
||||
l
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
hexcode: hexValue,
|
||||
number: palette.number,
|
||||
name: getColorName(hexValue)
|
||||
};
|
||||
})
|
||||
};
|
||||
|
||||
return colorPaletteFamily;
|
||||
}
|
||||
@@ -1,49 +0,0 @@
|
||||
/** The color palette number */
|
||||
export type ColorPaletteNumber = 50 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 950;
|
||||
|
||||
/** The color palette item */
|
||||
export type ColorPaletteItem = {
|
||||
/** The color hexcode */
|
||||
hexcode: string;
|
||||
/**
|
||||
* The color number
|
||||
*
|
||||
* @link {@link ColorPaletteNumber}
|
||||
*/
|
||||
number: ColorPaletteNumber;
|
||||
/** The color name */
|
||||
name: string;
|
||||
};
|
||||
|
||||
export type ColorPaletteFamily = {
|
||||
/** The color palette family key */
|
||||
key: string;
|
||||
/** The color palette family's palettes */
|
||||
palettes: ColorPaletteItem[];
|
||||
};
|
||||
|
||||
export type ColorPaletteWithDelta = ColorPaletteItem & {
|
||||
delta: number;
|
||||
};
|
||||
|
||||
export type ColorPaletteItemWithName = ColorPaletteItem & {
|
||||
name: string;
|
||||
};
|
||||
|
||||
export type ColorPaletteFamilyWithNearestPalette = ColorPaletteFamily & {
|
||||
nearestPalette: ColorPaletteWithDelta;
|
||||
nearestLightnessPalette: ColorPaletteWithDelta;
|
||||
};
|
||||
|
||||
export type ColorPalette = ColorPaletteFamily & {
|
||||
/** The color map of the palette */
|
||||
colorMap: Map<ColorPaletteNumber, ColorPaletteItem>;
|
||||
/**
|
||||
* The main color of the palette
|
||||
*
|
||||
* Which number is 500
|
||||
*/
|
||||
main: ColorPaletteItemWithName;
|
||||
/** The match color of the palette */
|
||||
match: ColorPaletteItemWithName;
|
||||
};
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sa/color-palette",
|
||||
"version": "1.0.2",
|
||||
"name": "@sa/color",
|
||||
"version": "1.1.0-beta.2",
|
||||
"exports": {
|
||||
".": "./src/index.ts"
|
||||
},
|
||||
@@ -10,6 +10,7 @@
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@sa/utils": "workspace:*",
|
||||
"colord": "2.9.3"
|
||||
}
|
||||
}
|
||||
2
packages/color/src/constant/index.ts
Normal file
2
packages/color/src/constant/index.ts
Normal file
@@ -0,0 +1,2 @@
|
||||
export * from './name';
|
||||
export * from './palette';
|
||||
1579
packages/color/src/constant/name.ts
Normal file
1579
packages/color/src/constant/name.ts
Normal file
File diff suppressed because it is too large
Load Diff
356
packages/color/src/constant/palette.ts
Normal file
356
packages/color/src/constant/palette.ts
Normal file
@@ -0,0 +1,356 @@
|
||||
import type { ColorPaletteFamily } from '../types';
|
||||
|
||||
export const colorPalettes: ColorPaletteFamily[] = [
|
||||
{
|
||||
name: 'Slate',
|
||||
palettes: [
|
||||
{ hex: '#f8fafc', number: 50 },
|
||||
{ hex: '#f1f5f9', number: 100 },
|
||||
{ hex: '#e2e8f0', number: 200 },
|
||||
{ hex: '#cbd5e1', number: 300 },
|
||||
{ hex: '#94a3b8', number: 400 },
|
||||
{ hex: '#64748b', number: 500 },
|
||||
{ hex: '#475569', number: 600 },
|
||||
{ hex: '#334155', number: 700 },
|
||||
{ hex: '#1e293b', number: 800 },
|
||||
{ hex: '#0f172a', number: 900 },
|
||||
{ hex: '#020617', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Gray',
|
||||
palettes: [
|
||||
{ hex: '#f9fafb', number: 50 },
|
||||
{ hex: '#f3f4f6', number: 100 },
|
||||
{ hex: '#e5e7eb', number: 200 },
|
||||
{ hex: '#d1d5db', number: 300 },
|
||||
{ hex: '#9ca3af', number: 400 },
|
||||
{ hex: '#6b7280', number: 500 },
|
||||
{ hex: '#4b5563', number: 600 },
|
||||
{ hex: '#374151', number: 700 },
|
||||
{ hex: '#1f2937', number: 800 },
|
||||
{ hex: '#111827', number: 900 },
|
||||
{ hex: '#030712', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Zinc',
|
||||
palettes: [
|
||||
{ hex: '#fafafa', number: 50 },
|
||||
{ hex: '#f4f4f5', number: 100 },
|
||||
{ hex: '#e4e4e7', number: 200 },
|
||||
{ hex: '#d4d4d8', number: 300 },
|
||||
{ hex: '#a1a1aa', number: 400 },
|
||||
{ hex: '#71717a', number: 500 },
|
||||
{ hex: '#52525b', number: 600 },
|
||||
{ hex: '#3f3f46', number: 700 },
|
||||
{ hex: '#27272a', number: 800 },
|
||||
{ hex: '#18181b', number: 900 },
|
||||
{ hex: '#09090b', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Neutral',
|
||||
palettes: [
|
||||
{ hex: '#fafafa', number: 50 },
|
||||
{ hex: '#f5f5f5', number: 100 },
|
||||
{ hex: '#e5e5e5', number: 200 },
|
||||
{ hex: '#d4d4d4', number: 300 },
|
||||
{ hex: '#a3a3a3', number: 400 },
|
||||
{ hex: '#737373', number: 500 },
|
||||
{ hex: '#525252', number: 600 },
|
||||
{ hex: '#404040', number: 700 },
|
||||
{ hex: '#262626', number: 800 },
|
||||
{ hex: '#171717', number: 900 },
|
||||
{ hex: '#0a0a0a', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Stone',
|
||||
palettes: [
|
||||
{ hex: '#fafaf9', number: 50 },
|
||||
{ hex: '#f5f5f4', number: 100 },
|
||||
{ hex: '#e7e5e4', number: 200 },
|
||||
{ hex: '#d6d3d1', number: 300 },
|
||||
{ hex: '#a8a29e', number: 400 },
|
||||
{ hex: '#78716c', number: 500 },
|
||||
{ hex: '#57534e', number: 600 },
|
||||
{ hex: '#44403c', number: 700 },
|
||||
{ hex: '#292524', number: 800 },
|
||||
{ hex: '#1c1917', number: 900 },
|
||||
{ hex: '#0c0a09', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Red',
|
||||
palettes: [
|
||||
{ hex: '#fef2f2', number: 50 },
|
||||
{ hex: '#fee2e2', number: 100 },
|
||||
{ hex: '#fecaca', number: 200 },
|
||||
{ hex: '#fca5a5', number: 300 },
|
||||
{ hex: '#f87171', number: 400 },
|
||||
{ hex: '#ef4444', number: 500 },
|
||||
{ hex: '#dc2626', number: 600 },
|
||||
{ hex: '#b91c1c', number: 700 },
|
||||
{ hex: '#991b1b', number: 800 },
|
||||
{ hex: '#7f1d1d', number: 900 },
|
||||
{ hex: '#450a0a', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Orange',
|
||||
palettes: [
|
||||
{ hex: '#fff7ed', number: 50 },
|
||||
{ hex: '#ffedd5', number: 100 },
|
||||
{ hex: '#fed7aa', number: 200 },
|
||||
{ hex: '#fdba74', number: 300 },
|
||||
{ hex: '#fb923c', number: 400 },
|
||||
{ hex: '#f97316', number: 500 },
|
||||
{ hex: '#ea580c', number: 600 },
|
||||
{ hex: '#c2410c', number: 700 },
|
||||
{ hex: '#9a3412', number: 800 },
|
||||
{ hex: '#7c2d12', number: 900 },
|
||||
{ hex: '#431407', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Amber',
|
||||
palettes: [
|
||||
{ hex: '#fffbeb', number: 50 },
|
||||
{ hex: '#fef3c7', number: 100 },
|
||||
{ hex: '#fde68a', number: 200 },
|
||||
{ hex: '#fcd34d', number: 300 },
|
||||
{ hex: '#fbbf24', number: 400 },
|
||||
{ hex: '#f59e0b', number: 500 },
|
||||
{ hex: '#d97706', number: 600 },
|
||||
{ hex: '#b45309', number: 700 },
|
||||
{ hex: '#92400e', number: 800 },
|
||||
{ hex: '#78350f', number: 900 },
|
||||
{ hex: '#451a03', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Yellow',
|
||||
palettes: [
|
||||
{ hex: '#fefce8', number: 50 },
|
||||
{ hex: '#fef9c3', number: 100 },
|
||||
{ hex: '#fef08a', number: 200 },
|
||||
{ hex: '#fde047', number: 300 },
|
||||
{ hex: '#facc15', number: 400 },
|
||||
{ hex: '#eab308', number: 500 },
|
||||
{ hex: '#ca8a04', number: 600 },
|
||||
{ hex: '#a16207', number: 700 },
|
||||
{ hex: '#854d0e', number: 800 },
|
||||
{ hex: '#713f12', number: 900 },
|
||||
{ hex: '#422006', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Lime',
|
||||
palettes: [
|
||||
{ hex: '#f7fee7', number: 50 },
|
||||
{ hex: '#ecfccb', number: 100 },
|
||||
{ hex: '#d9f99d', number: 200 },
|
||||
{ hex: '#bef264', number: 300 },
|
||||
{ hex: '#a3e635', number: 400 },
|
||||
{ hex: '#84cc16', number: 500 },
|
||||
{ hex: '#65a30d', number: 600 },
|
||||
{ hex: '#4d7c0f', number: 700 },
|
||||
{ hex: '#3f6212', number: 800 },
|
||||
{ hex: '#365314', number: 900 },
|
||||
{ hex: '#1a2e05', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Green',
|
||||
palettes: [
|
||||
{ hex: '#f0fdf4', number: 50 },
|
||||
{ hex: '#dcfce7', number: 100 },
|
||||
{ hex: '#bbf7d0', number: 200 },
|
||||
{ hex: '#86efac', number: 300 },
|
||||
{ hex: '#4ade80', number: 400 },
|
||||
{ hex: '#22c55e', number: 500 },
|
||||
{ hex: '#16a34a', number: 600 },
|
||||
{ hex: '#15803d', number: 700 },
|
||||
{ hex: '#166534', number: 800 },
|
||||
{ hex: '#14532d', number: 900 },
|
||||
{ hex: '#052e16', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Emerald',
|
||||
palettes: [
|
||||
{ hex: '#ecfdf5', number: 50 },
|
||||
{ hex: '#d1fae5', number: 100 },
|
||||
{ hex: '#a7f3d0', number: 200 },
|
||||
{ hex: '#6ee7b7', number: 300 },
|
||||
{ hex: '#34d399', number: 400 },
|
||||
{ hex: '#10b981', number: 500 },
|
||||
{ hex: '#059669', number: 600 },
|
||||
{ hex: '#047857', number: 700 },
|
||||
{ hex: '#065f46', number: 800 },
|
||||
{ hex: '#064e3b', number: 900 },
|
||||
{ hex: '#022c22', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Teal',
|
||||
palettes: [
|
||||
{ hex: '#f0fdfa', number: 50 },
|
||||
{ hex: '#ccfbf1', number: 100 },
|
||||
{ hex: '#99f6e4', number: 200 },
|
||||
{ hex: '#5eead4', number: 300 },
|
||||
{ hex: '#2dd4bf', number: 400 },
|
||||
{ hex: '#14b8a6', number: 500 },
|
||||
{ hex: '#0d9488', number: 600 },
|
||||
{ hex: '#0f766e', number: 700 },
|
||||
{ hex: '#115e59', number: 800 },
|
||||
{ hex: '#134e4a', number: 900 },
|
||||
{ hex: '#042f2e', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Cyan',
|
||||
palettes: [
|
||||
{ hex: '#ecfeff', number: 50 },
|
||||
{ hex: '#cffafe', number: 100 },
|
||||
{ hex: '#a5f3fc', number: 200 },
|
||||
{ hex: '#67e8f9', number: 300 },
|
||||
{ hex: '#22d3ee', number: 400 },
|
||||
{ hex: '#06b6d4', number: 500 },
|
||||
{ hex: '#0891b2', number: 600 },
|
||||
{ hex: '#0e7490', number: 700 },
|
||||
{ hex: '#155e75', number: 800 },
|
||||
{ hex: '#164e63', number: 900 },
|
||||
{ hex: '#083344', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Sky',
|
||||
palettes: [
|
||||
{ hex: '#f0f9ff', number: 50 },
|
||||
{ hex: '#e0f2fe', number: 100 },
|
||||
{ hex: '#bae6fd', number: 200 },
|
||||
{ hex: '#7dd3fc', number: 300 },
|
||||
{ hex: '#38bdf8', number: 400 },
|
||||
{ hex: '#0ea5e9', number: 500 },
|
||||
{ hex: '#0284c7', number: 600 },
|
||||
{ hex: '#0369a1', number: 700 },
|
||||
{ hex: '#075985', number: 800 },
|
||||
{ hex: '#0c4a6e', number: 900 },
|
||||
{ hex: '#082f49', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Blue',
|
||||
palettes: [
|
||||
{ hex: '#eff6ff', number: 50 },
|
||||
{ hex: '#dbeafe', number: 100 },
|
||||
{ hex: '#bfdbfe', number: 200 },
|
||||
{ hex: '#93c5fd', number: 300 },
|
||||
{ hex: '#60a5fa', number: 400 },
|
||||
{ hex: '#3b82f6', number: 500 },
|
||||
{ hex: '#2563eb', number: 600 },
|
||||
{ hex: '#1d4ed8', number: 700 },
|
||||
{ hex: '#1e40af', number: 800 },
|
||||
{ hex: '#1e3a8a', number: 900 },
|
||||
{ hex: '#172554', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Indigo',
|
||||
palettes: [
|
||||
{ hex: '#eef2ff', number: 50 },
|
||||
{ hex: '#e0e7ff', number: 100 },
|
||||
{ hex: '#c7d2fe', number: 200 },
|
||||
{ hex: '#a5b4fc', number: 300 },
|
||||
{ hex: '#818cf8', number: 400 },
|
||||
{ hex: '#6366f1', number: 500 },
|
||||
{ hex: '#4f46e5', number: 600 },
|
||||
{ hex: '#4338ca', number: 700 },
|
||||
{ hex: '#3730a3', number: 800 },
|
||||
{ hex: '#312e81', number: 900 },
|
||||
{ hex: '#1e1b4b', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Violet',
|
||||
palettes: [
|
||||
{ hex: '#f5f3ff', number: 50 },
|
||||
{ hex: '#ede9fe', number: 100 },
|
||||
{ hex: '#ddd6fe', number: 200 },
|
||||
{ hex: '#c4b5fd', number: 300 },
|
||||
{ hex: '#a78bfa', number: 400 },
|
||||
{ hex: '#8b5cf6', number: 500 },
|
||||
{ hex: '#7c3aed', number: 600 },
|
||||
{ hex: '#6d28d9', number: 700 },
|
||||
{ hex: '#5b21b6', number: 800 },
|
||||
{ hex: '#4c1d95', number: 900 },
|
||||
{ hex: '#2e1065', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Purple',
|
||||
palettes: [
|
||||
{ hex: '#faf5ff', number: 50 },
|
||||
{ hex: '#f3e8ff', number: 100 },
|
||||
{ hex: '#e9d5ff', number: 200 },
|
||||
{ hex: '#d8b4fe', number: 300 },
|
||||
{ hex: '#c084fc', number: 400 },
|
||||
{ hex: '#a855f7', number: 500 },
|
||||
{ hex: '#9333ea', number: 600 },
|
||||
{ hex: '#7e22ce', number: 700 },
|
||||
{ hex: '#6b21a8', number: 800 },
|
||||
{ hex: '#581c87', number: 900 },
|
||||
{ hex: '#3b0764', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Fuchsia',
|
||||
palettes: [
|
||||
{ hex: '#fdf4ff', number: 50 },
|
||||
{ hex: '#fae8ff', number: 100 },
|
||||
{ hex: '#f5d0fe', number: 200 },
|
||||
{ hex: '#f0abfc', number: 300 },
|
||||
{ hex: '#e879f9', number: 400 },
|
||||
{ hex: '#d946ef', number: 500 },
|
||||
{ hex: '#c026d3', number: 600 },
|
||||
{ hex: '#a21caf', number: 700 },
|
||||
{ hex: '#86198f', number: 800 },
|
||||
{ hex: '#701a75', number: 900 },
|
||||
{ hex: '#4a044e', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Pink',
|
||||
palettes: [
|
||||
{ hex: '#fdf2f8', number: 50 },
|
||||
{ hex: '#fce7f3', number: 100 },
|
||||
{ hex: '#fbcfe8', number: 200 },
|
||||
{ hex: '#f9a8d4', number: 300 },
|
||||
{ hex: '#f472b6', number: 400 },
|
||||
{ hex: '#ec4899', number: 500 },
|
||||
{ hex: '#db2777', number: 600 },
|
||||
{ hex: '#be185d', number: 700 },
|
||||
{ hex: '#9d174d', number: 800 },
|
||||
{ hex: '#831843', number: 900 },
|
||||
{ hex: '#500724', number: 950 }
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Rose',
|
||||
palettes: [
|
||||
{ hex: '#fff1f2', number: 50 },
|
||||
{ hex: '#ffe4e6', number: 100 },
|
||||
{ hex: '#fecdd3', number: 200 },
|
||||
{ hex: '#fda4af', number: 300 },
|
||||
{ hex: '#fb7185', number: 400 },
|
||||
{ hex: '#f43f5e', number: 500 },
|
||||
{ hex: '#e11d48', number: 600 },
|
||||
{ hex: '#be123c', number: 700 },
|
||||
{ hex: '#9f1239', number: 800 },
|
||||
{ hex: '#881337', number: 900 },
|
||||
{ hex: '#4c0519', number: 950 }
|
||||
]
|
||||
}
|
||||
];
|
||||
7
packages/color/src/index.ts
Normal file
7
packages/color/src/index.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import { colorPalettes } from './constant';
|
||||
|
||||
export * from './palette';
|
||||
export * from './shared';
|
||||
export { colorPalettes };
|
||||
|
||||
export * from './types';
|
||||
@@ -1,74 +1,6 @@
|
||||
import { colord, extend } from 'colord';
|
||||
import namesPlugin from 'colord/plugins/names';
|
||||
import mixPlugin from 'colord/plugins/mix';
|
||||
import type { AnyColor, HsvColor, RgbColor } from 'colord';
|
||||
|
||||
extend([namesPlugin, mixPlugin]);
|
||||
|
||||
/**
|
||||
* Add color alpha
|
||||
*
|
||||
* @param color - Color
|
||||
* @param alpha - Alpha (0 - 1)
|
||||
*/
|
||||
export function addColorAlpha(color: string, alpha: number) {
|
||||
return colord(color).alpha(alpha).toHex();
|
||||
}
|
||||
|
||||
/**
|
||||
* Mix color
|
||||
*
|
||||
* @param firstColor - First color
|
||||
* @param secondColor - Second color
|
||||
* @param ratio - The ratio of the second color (0 - 1)
|
||||
*/
|
||||
export function mixColor(firstColor: string, secondColor: string, ratio: number) {
|
||||
return colord(firstColor).mix(secondColor, ratio).toHex();
|
||||
}
|
||||
|
||||
/**
|
||||
* Transform color with opacity to similar color without opacity
|
||||
*
|
||||
* @param color - Color
|
||||
* @param alpha - Alpha (0 - 1)
|
||||
* @param bgColor Background color (usually white or black)
|
||||
*/
|
||||
export function transformColorWithOpacity(color: string, alpha: number, bgColor = '#ffffff') {
|
||||
const originColor = addColorAlpha(color, alpha);
|
||||
const { r: oR, g: oG, b: oB } = colord(originColor).toRgb();
|
||||
|
||||
const { r: bgR, g: bgG, b: bgB } = colord(bgColor).toRgb();
|
||||
|
||||
function calRgb(or: number, bg: number, al: number) {
|
||||
return bg + (or - bg) * al;
|
||||
}
|
||||
|
||||
const resultRgb: RgbColor = {
|
||||
r: calRgb(oR, bgR, alpha),
|
||||
g: calRgb(oG, bgG, alpha),
|
||||
b: calRgb(oB, bgB, alpha)
|
||||
};
|
||||
|
||||
return colord(resultRgb).toHex();
|
||||
}
|
||||
|
||||
/**
|
||||
* Is white color
|
||||
*
|
||||
* @param color - Color
|
||||
*/
|
||||
export function isWhiteColor(color: string) {
|
||||
return colord(color).isEqual('#ffffff');
|
||||
}
|
||||
|
||||
/**
|
||||
* Get rgb of color
|
||||
*
|
||||
* @param color Color
|
||||
*/
|
||||
export function getRgbOfColor(color: string) {
|
||||
return colord(color).toRgb();
|
||||
}
|
||||
import type { AnyColor, HsvColor } from 'colord';
|
||||
import { getHex, getHsv, isValidColor, mixColor } from '../shared';
|
||||
import type { ColorIndex } from '../types';
|
||||
|
||||
/** Hue step */
|
||||
const hueStep = 2;
|
||||
@@ -86,32 +18,23 @@ const lightColorCount = 5;
|
||||
const darkColorCount = 4;
|
||||
|
||||
/**
|
||||
* The color index of color palette
|
||||
*
|
||||
* From left to right, the color is from light to dark, 6 is main color
|
||||
*/
|
||||
type ColorIndex = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10;
|
||||
|
||||
/**
|
||||
* Get color palette (from left to right, the color is from light to dark, 6 is main color)
|
||||
* Get AntD palette color by index
|
||||
*
|
||||
* @param color - Color
|
||||
* @param index - The color index of color palette (the main color index is 6)
|
||||
* @returns Hex color
|
||||
*/
|
||||
export function getColorPalette(color: AnyColor, index: ColorIndex): string {
|
||||
const transformColor = colord(color);
|
||||
|
||||
if (!transformColor.isValid()) {
|
||||
export function getAntDPaletteColorByIndex(color: AnyColor, index: ColorIndex): string {
|
||||
if (!isValidColor(color)) {
|
||||
throw new Error('invalid input color value');
|
||||
}
|
||||
|
||||
if (index === 6) {
|
||||
return colord(transformColor).toHex();
|
||||
return getHex(color);
|
||||
}
|
||||
|
||||
const isLight = index < 6;
|
||||
const hsv = transformColor.toHsv();
|
||||
const hsv = getHsv(color);
|
||||
const i = isLight ? lightColorCount + 1 - index : index - lightColorCount - 1;
|
||||
|
||||
const newHsv: HsvColor = {
|
||||
@@ -120,7 +43,7 @@ export function getColorPalette(color: AnyColor, index: ColorIndex): string {
|
||||
v: getValue(hsv, i, isLight)
|
||||
};
|
||||
|
||||
return colord(newHsv).toHex();
|
||||
return getHex(newHsv);
|
||||
}
|
||||
|
||||
/** Map of dark color index and opacity */
|
||||
@@ -131,32 +54,33 @@ const darkColorMap = [
|
||||
{ index: 5, opacity: 0.45 },
|
||||
{ index: 5, opacity: 0.65 },
|
||||
{ index: 5, opacity: 0.85 },
|
||||
{ index: 4, opacity: 0.9 },
|
||||
{ index: 5, opacity: 0.9 },
|
||||
{ index: 4, opacity: 0.93 },
|
||||
{ index: 3, opacity: 0.95 },
|
||||
{ index: 2, opacity: 0.97 },
|
||||
{ index: 1, opacity: 0.98 }
|
||||
];
|
||||
|
||||
/**
|
||||
* Get color palettes
|
||||
* Get AntD color palette
|
||||
*
|
||||
* @param color - Color
|
||||
* @param darkTheme - Dark theme
|
||||
* @param darkThemeMixColor - Dark theme mix color (default: #141414)
|
||||
*/
|
||||
export function getColorPalettes(color: AnyColor, darkTheme = false, darkThemeMixColor = '#141414'): string[] {
|
||||
const indexes: ColorIndex[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
|
||||
export function getAntDColorPalette(color: AnyColor, darkTheme = false, darkThemeMixColor = '#141414'): string[] {
|
||||
const indexes: ColorIndex[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11];
|
||||
|
||||
const patterns = indexes.map(index => getColorPalette(color, index));
|
||||
const patterns = indexes.map(index => getAntDPaletteColorByIndex(color, index));
|
||||
|
||||
if (darkTheme) {
|
||||
const darkPatterns = darkColorMap.map(({ index, opacity }) => {
|
||||
const darkColor = colord(darkThemeMixColor).mix(patterns[index], opacity);
|
||||
const darkColor = mixColor(darkThemeMixColor, patterns[index], opacity);
|
||||
|
||||
return darkColor;
|
||||
});
|
||||
|
||||
return darkPatterns.map(item => colord(item).toHex());
|
||||
return darkPatterns.map(item => getHex(item));
|
||||
}
|
||||
|
||||
return patterns;
|
||||
45
packages/color/src/palette/index.ts
Normal file
45
packages/color/src/palette/index.ts
Normal file
@@ -0,0 +1,45 @@
|
||||
import type { AnyColor } from 'colord';
|
||||
import { getHex } from '../shared';
|
||||
import type { ColorPaletteNumber } from '../types';
|
||||
import { getRecommendedColorPalette } from './recommend';
|
||||
import { getAntDColorPalette } from './antd';
|
||||
|
||||
/**
|
||||
* get color palette by provided color
|
||||
*
|
||||
* @param color
|
||||
* @param recommended whether to get recommended color palette (the provided color may not be the main color)
|
||||
*/
|
||||
export function getColorPalette(color: AnyColor, recommended = false) {
|
||||
const colorMap = new Map<ColorPaletteNumber, string>();
|
||||
|
||||
if (recommended) {
|
||||
const colorPalette = getRecommendedColorPalette(getHex(color));
|
||||
colorPalette.palettes.forEach(palette => {
|
||||
colorMap.set(palette.number, palette.hex);
|
||||
});
|
||||
} else {
|
||||
const colors = getAntDColorPalette(color);
|
||||
|
||||
const colorNumbers: ColorPaletteNumber[] = [50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950];
|
||||
|
||||
colorNumbers.forEach((number, index) => {
|
||||
colorMap.set(number, colors[index]);
|
||||
});
|
||||
}
|
||||
|
||||
return colorMap;
|
||||
}
|
||||
|
||||
/**
|
||||
* get color palette color by number
|
||||
*
|
||||
* @param color the provided color
|
||||
* @param number the color palette number
|
||||
* @param recommended whether to get recommended color palette (the provided color may not be the main color)
|
||||
*/
|
||||
export function getPaletteColorByNumber(color: AnyColor, number: ColorPaletteNumber, recommended = false) {
|
||||
const colorMap = getColorPalette(color, recommended);
|
||||
|
||||
return colorMap.get(number as ColorPaletteNumber)!;
|
||||
}
|
||||
152
packages/color/src/palette/recommend.ts
Normal file
152
packages/color/src/palette/recommend.ts
Normal file
@@ -0,0 +1,152 @@
|
||||
import { getColorName, getDeltaE, getHsl, isValidColor, transformHslToHex } from '../shared';
|
||||
import { colorPalettes } from '../constant';
|
||||
import type {
|
||||
ColorPalette,
|
||||
ColorPaletteFamily,
|
||||
ColorPaletteFamilyWithNearestPalette,
|
||||
ColorPaletteMatch,
|
||||
ColorPaletteNumber
|
||||
} from '../types';
|
||||
|
||||
/**
|
||||
* get recommended color palette by provided color
|
||||
*
|
||||
* @param color the provided color
|
||||
*/
|
||||
export function getRecommendedColorPalette(color: string) {
|
||||
const colorPaletteFamily = getRecommendedColorPaletteFamily(color);
|
||||
|
||||
const colorMap = new Map<ColorPaletteNumber, ColorPalette>();
|
||||
|
||||
colorPaletteFamily.palettes.forEach(palette => {
|
||||
colorMap.set(palette.number, palette);
|
||||
});
|
||||
|
||||
const mainColor = colorMap.get(500)!;
|
||||
const matchColor = colorPaletteFamily.palettes.find(palette => palette.hex === color)!;
|
||||
|
||||
const colorPalette: ColorPaletteMatch = {
|
||||
...colorPaletteFamily,
|
||||
colorMap,
|
||||
main: mainColor,
|
||||
match: matchColor
|
||||
};
|
||||
|
||||
return colorPalette;
|
||||
}
|
||||
|
||||
/**
|
||||
* get recommended palette color by provided color
|
||||
*
|
||||
* @param color the provided color
|
||||
* @param number the color palette number
|
||||
*/
|
||||
export function getRecommendedPaletteColorByNumber(color: string, number: ColorPaletteNumber) {
|
||||
const colorPalette = getRecommendedColorPalette(color);
|
||||
|
||||
const { hex } = colorPalette.colorMap.get(number)!;
|
||||
|
||||
return hex;
|
||||
}
|
||||
|
||||
/**
|
||||
* get color palette family by provided color and color name
|
||||
*
|
||||
* @param color the provided color
|
||||
*/
|
||||
export function getRecommendedColorPaletteFamily(color: string) {
|
||||
if (!isValidColor(color)) {
|
||||
throw new Error('Invalid color, please check color value!');
|
||||
}
|
||||
|
||||
let colorName = getColorName(color);
|
||||
|
||||
colorName = colorName.toLowerCase().replace(/\s/g, '-');
|
||||
|
||||
const { h: h1, s: s1 } = getHsl(color);
|
||||
|
||||
const { nearestLightnessPalette, palettes } = getNearestColorPaletteFamily(color, colorPalettes);
|
||||
|
||||
const { number, hex } = nearestLightnessPalette;
|
||||
|
||||
const { h: h2, s: s2 } = getHsl(hex);
|
||||
|
||||
const deltaH = h1 - h2;
|
||||
|
||||
const sRatio = s1 / s2;
|
||||
|
||||
const colorPaletteFamily: ColorPaletteFamily = {
|
||||
name: colorName,
|
||||
palettes: palettes.map(palette => {
|
||||
let hexValue = color;
|
||||
|
||||
const isSame = number === palette.number;
|
||||
|
||||
if (!isSame) {
|
||||
const { h: h3, s: s3, l } = getHsl(palette.hex);
|
||||
|
||||
const newH = deltaH < 0 ? h3 + deltaH : h3 - deltaH;
|
||||
const newS = s3 * sRatio;
|
||||
|
||||
hexValue = transformHslToHex({
|
||||
h: newH,
|
||||
s: newS,
|
||||
l
|
||||
});
|
||||
}
|
||||
|
||||
return {
|
||||
hex: hexValue,
|
||||
number: palette.number
|
||||
};
|
||||
})
|
||||
};
|
||||
|
||||
return colorPaletteFamily;
|
||||
}
|
||||
|
||||
/**
|
||||
* get nearest color palette family
|
||||
*
|
||||
* @param color color
|
||||
* @param families color palette families
|
||||
*/
|
||||
function getNearestColorPaletteFamily(color: string, families: ColorPaletteFamily[]) {
|
||||
const familyWithConfig = families.map(family => {
|
||||
const palettes = family.palettes.map(palette => {
|
||||
return {
|
||||
...palette,
|
||||
delta: getDeltaE(color, palette.hex)
|
||||
};
|
||||
});
|
||||
|
||||
const nearestPalette = palettes.reduce((prev, curr) => (prev.delta < curr.delta ? prev : curr));
|
||||
|
||||
return {
|
||||
...family,
|
||||
palettes,
|
||||
nearestPalette
|
||||
};
|
||||
});
|
||||
|
||||
const nearestPaletteFamily = familyWithConfig.reduce((prev, curr) =>
|
||||
prev.nearestPalette.delta < curr.nearestPalette.delta ? prev : curr
|
||||
);
|
||||
|
||||
const { l } = getHsl(color);
|
||||
|
||||
const paletteFamily: ColorPaletteFamilyWithNearestPalette = {
|
||||
...nearestPaletteFamily,
|
||||
nearestLightnessPalette: nearestPaletteFamily.palettes.reduce((prev, curr) => {
|
||||
const { l: prevLightness } = getHsl(prev.hex);
|
||||
const { l: currLightness } = getHsl(curr.hex);
|
||||
|
||||
const deltaPrev = Math.abs(prevLightness - l);
|
||||
const deltaCurr = Math.abs(currLightness - l);
|
||||
|
||||
return deltaPrev < deltaCurr ? prev : curr;
|
||||
})
|
||||
};
|
||||
|
||||
return paletteFamily;
|
||||
}
|
||||
93
packages/color/src/shared/colord.ts
Normal file
93
packages/color/src/shared/colord.ts
Normal file
@@ -0,0 +1,93 @@
|
||||
import { colord, extend } from 'colord';
|
||||
import namesPlugin from 'colord/plugins/names';
|
||||
import mixPlugin from 'colord/plugins/mix';
|
||||
import labPlugin from 'colord/plugins/lab';
|
||||
import type { AnyColor, HslColor, RgbColor } from 'colord';
|
||||
|
||||
extend([namesPlugin, mixPlugin, labPlugin]);
|
||||
|
||||
export function isValidColor(color: AnyColor) {
|
||||
return colord(color).isValid();
|
||||
}
|
||||
|
||||
export function getHex(color: AnyColor) {
|
||||
return colord(color).toHex();
|
||||
}
|
||||
|
||||
export function getRgb(color: AnyColor) {
|
||||
return colord(color).toRgb();
|
||||
}
|
||||
|
||||
export function getHsl(color: AnyColor) {
|
||||
return colord(color).toHsl();
|
||||
}
|
||||
|
||||
export function getHsv(color: AnyColor) {
|
||||
return colord(color).toHsv();
|
||||
}
|
||||
|
||||
export function getDeltaE(color1: AnyColor, color2: AnyColor) {
|
||||
return colord(color1).delta(color2);
|
||||
}
|
||||
|
||||
export function transformHslToHex(color: HslColor) {
|
||||
return colord(color).toHex();
|
||||
}
|
||||
|
||||
/**
|
||||
* Add color alpha
|
||||
*
|
||||
* @param color - Color
|
||||
* @param alpha - Alpha (0 - 1)
|
||||
*/
|
||||
export function addColorAlpha(color: AnyColor, alpha: number) {
|
||||
return colord(color).alpha(alpha).toHex();
|
||||
}
|
||||
|
||||
/**
|
||||
* Mix color
|
||||
*
|
||||
* @param firstColor - First color
|
||||
* @param secondColor - Second color
|
||||
* @param ratio - The ratio of the second color (0 - 1)
|
||||
*/
|
||||
export function mixColor(firstColor: AnyColor, secondColor: AnyColor, ratio: number) {
|
||||
return colord(firstColor).mix(secondColor, ratio).toHex();
|
||||
}
|
||||
|
||||
/**
|
||||
* Transform color with opacity to similar color without opacity
|
||||
*
|
||||
* @param color - Color
|
||||
* @param alpha - Alpha (0 - 1)
|
||||
* @param bgColor Background color (usually white or black)
|
||||
*/
|
||||
export function transformColorWithOpacity(color: AnyColor, alpha: number, bgColor = '#ffffff') {
|
||||
const originColor = addColorAlpha(color, alpha);
|
||||
const { r: oR, g: oG, b: oB } = colord(originColor).toRgb();
|
||||
|
||||
const { r: bgR, g: bgG, b: bgB } = colord(bgColor).toRgb();
|
||||
|
||||
function calRgb(or: number, bg: number, al: number) {
|
||||
return bg + (or - bg) * al;
|
||||
}
|
||||
|
||||
const resultRgb: RgbColor = {
|
||||
r: calRgb(oR, bgR, alpha),
|
||||
g: calRgb(oG, bgG, alpha),
|
||||
b: calRgb(oB, bgB, alpha)
|
||||
};
|
||||
|
||||
return colord(resultRgb).toHex();
|
||||
}
|
||||
|
||||
/**
|
||||
* Is white color
|
||||
*
|
||||
* @param color - Color
|
||||
*/
|
||||
export function isWhiteColor(color: AnyColor) {
|
||||
return colord(color).isEqual('#ffffff');
|
||||
}
|
||||
|
||||
export { colord };
|
||||
2
packages/color/src/shared/index.ts
Normal file
2
packages/color/src/shared/index.ts
Normal file
@@ -0,0 +1,2 @@
|
||||
export * from './colord';
|
||||
export * from './name';
|
||||
@@ -1,6 +1,11 @@
|
||||
import { getHex, getHsl, getRgb } from './color';
|
||||
import colorNames from './json/color-name.json';
|
||||
import { colorNames } from '../constant';
|
||||
import { getHex, getHsl, getRgb } from './colord';
|
||||
|
||||
/**
|
||||
* Get color name
|
||||
*
|
||||
* @param color
|
||||
*/
|
||||
export function getColorName(color: string) {
|
||||
const hex = getHex(color);
|
||||
const rgb = getRgb(color);
|
||||
@@ -17,15 +22,13 @@ export function getColorName(color: string) {
|
||||
colorNames.some((item, index) => {
|
||||
const [hexValue, colorName] = item;
|
||||
|
||||
const hexcode = `#${hexValue}`;
|
||||
|
||||
const match = hex === hexcode;
|
||||
const match = hex === hexValue;
|
||||
|
||||
if (match) {
|
||||
name = colorName;
|
||||
} else {
|
||||
const { r, g, b } = getRgb(hexcode);
|
||||
const { h, s, l } = getHsl(hexcode);
|
||||
const { r, g, b } = getRgb(hexValue);
|
||||
const { h, s, l } = getHsl(hexValue);
|
||||
|
||||
ndf1 = (rgb.r - r) ** 2 + (rgb.g - g) ** 2 + (rgb.b - b) ** 2;
|
||||
ndf2 = (hsl.h - h) ** 2 + (hsl.s - s) ** 2 + (hsl.l - l) ** 2;
|
||||
@@ -40,7 +43,7 @@ export function getColorName(color: string) {
|
||||
return match;
|
||||
});
|
||||
|
||||
name = cl < 0 ? 'Invalid Color' : colorNames[cl][1];
|
||||
name = colorNames[cl][1];
|
||||
|
||||
return name;
|
||||
}
|
||||
58
packages/color/src/types/index.ts
Normal file
58
packages/color/src/types/index.ts
Normal file
@@ -0,0 +1,58 @@
|
||||
/**
|
||||
* the color palette number
|
||||
*
|
||||
* the main color number is 500
|
||||
*/
|
||||
export type ColorPaletteNumber = 50 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 950;
|
||||
|
||||
/** the color palette */
|
||||
export type ColorPalette = {
|
||||
/** the color hex value */
|
||||
hex: string;
|
||||
/**
|
||||
* the color number
|
||||
*
|
||||
* - 50 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 950
|
||||
*/
|
||||
number: ColorPaletteNumber;
|
||||
};
|
||||
|
||||
/** the color palette family */
|
||||
export type ColorPaletteFamily = {
|
||||
/** the color palette family name */
|
||||
name: string;
|
||||
/** the color palettes */
|
||||
palettes: ColorPalette[];
|
||||
};
|
||||
|
||||
/** the color palette with delta */
|
||||
export type ColorPaletteWithDelta = ColorPalette & {
|
||||
delta: number;
|
||||
};
|
||||
|
||||
/** the color palette family with nearest palette */
|
||||
export type ColorPaletteFamilyWithNearestPalette = ColorPaletteFamily & {
|
||||
nearestPalette: ColorPaletteWithDelta;
|
||||
nearestLightnessPalette: ColorPaletteWithDelta;
|
||||
};
|
||||
|
||||
/** the color palette match */
|
||||
export type ColorPaletteMatch = ColorPaletteFamily & {
|
||||
/** the color map of the palette */
|
||||
colorMap: Map<ColorPaletteNumber, ColorPalette>;
|
||||
/**
|
||||
* the main color of the palette
|
||||
*
|
||||
* which number is 500
|
||||
*/
|
||||
main: ColorPalette;
|
||||
/** the match color of the palette */
|
||||
match: ColorPalette;
|
||||
};
|
||||
|
||||
/**
|
||||
* The color index of color palette
|
||||
*
|
||||
* From left to right, the color is from light to dark, 6 is main color
|
||||
*/
|
||||
export type ColorIndex = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11;
|
||||
20
packages/color/tsconfig.json
Normal file
20
packages/color/tsconfig.json
Normal file
@@ -0,0 +1,20 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ESNext",
|
||||
"jsx": "preserve",
|
||||
"lib": ["DOM", "ESNext"],
|
||||
"baseUrl": ".",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "node",
|
||||
"resolveJsonModule": true,
|
||||
"types": ["node"],
|
||||
"strict": true,
|
||||
"strictNullChecks": true,
|
||||
"noUnusedLocals": true,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"esModuleInterop": true,
|
||||
"forceConsistentCasingInFileNames": true
|
||||
},
|
||||
"include": ["src/**/*"],
|
||||
"exclude": ["node_modules", "dist"]
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sa/hooks",
|
||||
"version": "1.0.2",
|
||||
"version": "1.1.0-beta.2",
|
||||
"exports": {
|
||||
".": "./src/index.ts"
|
||||
},
|
||||
|
||||
@@ -7,4 +7,5 @@ import useHookTable from './use-table';
|
||||
|
||||
export { useBoolean, useLoading, useCountDown, useContext, useSvgIconRender, useHookTable };
|
||||
|
||||
export * from './use-signal';
|
||||
export * from './use-table';
|
||||
|
||||
144
packages/hooks/src/use-signal.ts
Normal file
144
packages/hooks/src/use-signal.ts
Normal file
@@ -0,0 +1,144 @@
|
||||
import { computed, ref, shallowRef, triggerRef } from 'vue';
|
||||
import type {
|
||||
ComputedGetter,
|
||||
DebuggerOptions,
|
||||
Ref,
|
||||
ShallowRef,
|
||||
WritableComputedOptions,
|
||||
WritableComputedRef
|
||||
} from 'vue';
|
||||
|
||||
type Updater<T> = (value: T) => T;
|
||||
type Mutator<T> = (value: T) => void;
|
||||
|
||||
/**
|
||||
* Signal is a reactive value that can be set, updated or mutated
|
||||
*
|
||||
* @example
|
||||
* ```ts
|
||||
* const count = useSignal(0);
|
||||
*
|
||||
* // `watchEffect`
|
||||
* watchEffect(() => {
|
||||
* console.log(count());
|
||||
* });
|
||||
*
|
||||
* // watch
|
||||
* watch(count, value => {
|
||||
* console.log(value);
|
||||
* });
|
||||
*
|
||||
* // useComputed
|
||||
* const double = useComputed(() => count() * 2);
|
||||
* const writeableDouble = useComputed({
|
||||
* get: () => count() * 2,
|
||||
* set: value => count.set(value / 2)
|
||||
* });
|
||||
* ```
|
||||
*/
|
||||
export interface Signal<T> {
|
||||
(): Readonly<T>;
|
||||
/**
|
||||
* Set the value of the signal
|
||||
*
|
||||
* It recommend use `set` for primitive values
|
||||
*
|
||||
* @param value
|
||||
*/
|
||||
set(value: T): void;
|
||||
/**
|
||||
* Update the value of the signal using an updater function
|
||||
*
|
||||
* It recommend use `update` for non-primitive values, only the first level of the object will be reactive.
|
||||
*
|
||||
* @param updater
|
||||
*/
|
||||
update(updater: Updater<T>): void;
|
||||
/**
|
||||
* Mutate the value of the signal using a mutator function
|
||||
*
|
||||
* this action will call `triggerRef`, so the value will be tracked on `watchEffect`.
|
||||
*
|
||||
* It recommend use `mutate` for non-primitive values, all levels of the object will be reactive.
|
||||
*
|
||||
* @param mutator
|
||||
*/
|
||||
mutate(mutator: Mutator<T>): void;
|
||||
/**
|
||||
* Get the reference of the signal
|
||||
*
|
||||
* Sometimes it can be useful to make `v-model` work with the signal
|
||||
*
|
||||
* ```vue
|
||||
* <template>
|
||||
* <input v-model="model.count" />
|
||||
* </template>;
|
||||
*
|
||||
* <script setup lang="ts">
|
||||
* const state = useSignal({ count: 0 }, { useRef: true });
|
||||
*
|
||||
* const model = state.getRef();
|
||||
* </script>
|
||||
* ```
|
||||
*/
|
||||
getRef(): Readonly<ShallowRef<Readonly<T>>>;
|
||||
}
|
||||
|
||||
export interface ReadonlySignal<T> {
|
||||
(): Readonly<T>;
|
||||
}
|
||||
|
||||
export interface SignalOptions {
|
||||
/**
|
||||
* Whether to use `ref` to store the value
|
||||
*
|
||||
* @default false use `sharedRef` to store the value
|
||||
*/
|
||||
useRef?: boolean;
|
||||
}
|
||||
|
||||
export function useSignal<T>(initialValue: T, options?: SignalOptions): Signal<T> {
|
||||
const { useRef } = options || {};
|
||||
|
||||
const state = useRef ? (ref(initialValue) as Ref<T>) : shallowRef(initialValue);
|
||||
|
||||
return createSignal(state);
|
||||
}
|
||||
|
||||
export function useComputed<T>(getter: ComputedGetter<T>, debugOptions?: DebuggerOptions): ReadonlySignal<T>;
|
||||
export function useComputed<T>(options: WritableComputedOptions<T>, debugOptions?: DebuggerOptions): Signal<T>;
|
||||
export function useComputed<T>(
|
||||
getterOrOptions: ComputedGetter<T> | WritableComputedOptions<T>,
|
||||
debugOptions?: DebuggerOptions
|
||||
) {
|
||||
const isGetter = typeof getterOrOptions === 'function';
|
||||
|
||||
const computedValue = computed(getterOrOptions as any, debugOptions);
|
||||
|
||||
if (isGetter) {
|
||||
return () => computedValue.value as ReadonlySignal<T>;
|
||||
}
|
||||
|
||||
return createSignal(computedValue);
|
||||
}
|
||||
|
||||
function createSignal<T>(state: ShallowRef<T> | WritableComputedRef<T>): Signal<T> {
|
||||
const signal = () => state.value;
|
||||
|
||||
signal.set = (value: T) => {
|
||||
state.value = value;
|
||||
};
|
||||
|
||||
signal.update = (updater: Updater<T>) => {
|
||||
state.value = updater(state.value);
|
||||
};
|
||||
|
||||
signal.mutate = (mutator: Mutator<T>) => {
|
||||
mutator(state.value);
|
||||
triggerRef(state);
|
||||
};
|
||||
|
||||
signal.getRef = () => state as Readonly<ShallowRef<Readonly<T>>>;
|
||||
|
||||
return signal;
|
||||
}
|
||||
@@ -57,6 +57,12 @@ export type TableConfig<A extends ApiFn, T, C> = {
|
||||
* @default true
|
||||
*/
|
||||
immediate?: boolean;
|
||||
/**
|
||||
* whether to display the total items count
|
||||
*
|
||||
* @default false
|
||||
*/
|
||||
showTotal?: boolean;
|
||||
};
|
||||
|
||||
export default function useHookTable<A extends ApiFn, T, C>(config: TableConfig<A, T, C>) {
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sa/materials",
|
||||
"version": "1.0.2",
|
||||
"version": "1.1.0-beta.2",
|
||||
"exports": {
|
||||
".": "./src/index.ts"
|
||||
},
|
||||
@@ -11,7 +11,7 @@
|
||||
},
|
||||
"dependencies": {
|
||||
"@sa/utils": "workspace:*",
|
||||
"simplebar-vue": "2.3.3"
|
||||
"simplebar-vue": "2.3.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"typed-css-modules": "0.9.1"
|
||||
|
||||
@@ -25,31 +25,6 @@ interface Emits {
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
|
||||
type SlotFn = (props?: Record<string, unknown>) => any;
|
||||
|
||||
type Slots = {
|
||||
/**
|
||||
* Slot
|
||||
*
|
||||
* The center content of the tab
|
||||
*/
|
||||
default?: SlotFn;
|
||||
/**
|
||||
* Slot
|
||||
*
|
||||
* The left content of the tab
|
||||
*/
|
||||
prefix?: SlotFn;
|
||||
/**
|
||||
* Slot
|
||||
*
|
||||
* The right content of the tab
|
||||
*/
|
||||
suffix?: SlotFn;
|
||||
};
|
||||
|
||||
defineSlots<Slots>();
|
||||
|
||||
const activeTabComponent = computed(() => {
|
||||
const { mode, chromeClass, buttonClass } = props;
|
||||
|
||||
@@ -78,17 +53,30 @@ const bindProps = computed(() => {
|
||||
function handleClose() {
|
||||
emit('close');
|
||||
}
|
||||
|
||||
function handleMouseup(e: MouseEvent) {
|
||||
// close tab by mouse wheel button click
|
||||
if (e.button === 1) {
|
||||
handleClose();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<component :is="activeTabComponent.component" :class="activeTabComponent.class" :style="cssVars" v-bind="bindProps">
|
||||
<component
|
||||
:is="activeTabComponent.component"
|
||||
:class="activeTabComponent.class"
|
||||
:style="cssVars"
|
||||
v-bind="bindProps"
|
||||
@mouseup="handleMouseup"
|
||||
>
|
||||
<template #prefix>
|
||||
<slot name="prefix"></slot>
|
||||
</template>
|
||||
<slot></slot>
|
||||
<template #suffix>
|
||||
<slot name="suffix">
|
||||
<SvgClose v-if="closable" :class="[style['svg-close']]" @click="handleClose" />
|
||||
<SvgClose v-if="closable" :class="[style['svg-close']]" @click.stop="handleClose" />
|
||||
</slot>
|
||||
</template>
|
||||
</component>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { addColorAlpha, transformColorWithOpacity } from '@sa/utils';
|
||||
import { addColorAlpha, transformColorWithOpacity } from '@sa/color';
|
||||
import type { PageTabCssVars, PageTabCssVarsProps } from '../../types';
|
||||
|
||||
/** The active color of the tab */
|
||||
|
||||
@@ -2,23 +2,10 @@
|
||||
defineOptions({
|
||||
name: 'SvgClose'
|
||||
});
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
|
||||
interface Emits {
|
||||
(e: 'click'): void;
|
||||
}
|
||||
|
||||
function handleClick() {
|
||||
emit('click');
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class=":soy: relative h-16px w-16px inline-flex items-center justify-center rd-50% text-14px"
|
||||
@click.stop="handleClick"
|
||||
>
|
||||
<div class=":soy: relative h-16px w-16px inline-flex items-center justify-center rd-50% text-14px">
|
||||
<svg width="1em" height="1em" viewBox="0 0 1024 1024">
|
||||
<path
|
||||
fill="currentColor"
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sa/fetch",
|
||||
"version": "1.0.2",
|
||||
"version": "1.1.0-beta.2",
|
||||
"exports": {
|
||||
".": "./src/index.ts"
|
||||
},
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sa/scripts",
|
||||
"version": "1.0.2",
|
||||
"version": "1.1.0-beta.2",
|
||||
"bin": {
|
||||
"sa": "./bin.ts"
|
||||
},
|
||||
@@ -13,15 +13,15 @@
|
||||
}
|
||||
},
|
||||
"devDependencies": {
|
||||
"@soybeanjs/changelog": "0.3.15",
|
||||
"bumpp": "9.4.0",
|
||||
"@soybeanjs/changelog": "0.3.23",
|
||||
"bumpp": "9.4.1",
|
||||
"c12": "1.10.0",
|
||||
"cac": "6.7.14",
|
||||
"consola": "3.2.3",
|
||||
"enquirer": "2.4.1",
|
||||
"execa": "8.0.1",
|
||||
"kolorist": "1.8.0",
|
||||
"npm-check-updates": "16.14.18",
|
||||
"npm-check-updates": "16.14.20",
|
||||
"rimraf": "5.0.5"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -19,6 +19,7 @@ const defaultOptions: CliOption = {
|
||||
['style', 'Changes that do not affect the meaning of the code'],
|
||||
['refactor', 'A code change that neither fixes a bug nor adds a feature'],
|
||||
['perf', 'A code change that improves performance'],
|
||||
['optimize', 'A code change that optimizes code quality'],
|
||||
['test', 'Adding missing tests or correcting existing tests'],
|
||||
['build', 'Changes that affect the build system or external dependencies'],
|
||||
['ci', 'Changes to our CI configuration files and scripts'],
|
||||
@@ -27,6 +28,7 @@ const defaultOptions: CliOption = {
|
||||
],
|
||||
gitCommitScopes: [
|
||||
['projects', 'project'],
|
||||
['packages', 'packages'],
|
||||
['components', 'components'],
|
||||
['hooks', 'hook functions'],
|
||||
['utils', 'utils functions'],
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sa/uno-preset",
|
||||
"version": "1.0.2",
|
||||
"version": "1.1.0-beta.2",
|
||||
"exports": {
|
||||
".": "./src/index.ts"
|
||||
},
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@sa/utils",
|
||||
"version": "1.0.2",
|
||||
"version": "1.1.0-beta.2",
|
||||
"exports": {
|
||||
".": "./src/index.ts"
|
||||
},
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
export * from './color';
|
||||
export * from './crypto';
|
||||
export * from './storage';
|
||||
export * from './nanoid';
|
||||
|
||||
@@ -3,7 +3,7 @@ import localforage from 'localforage';
|
||||
/** The storage type */
|
||||
export type StorageType = 'local' | 'session';
|
||||
|
||||
export function createStorage<T extends object>(type: StorageType) {
|
||||
export function createStorage<T extends object>(type: StorageType, storagePrefix: string) {
|
||||
const stg = type === 'session' ? window.sessionStorage : window.localStorage;
|
||||
|
||||
const storage = {
|
||||
@@ -16,7 +16,7 @@ export function createStorage<T extends object>(type: StorageType) {
|
||||
set<K extends keyof T>(key: K, value: T[K]) {
|
||||
const json = JSON.stringify(value);
|
||||
|
||||
stg.setItem(key as string, json);
|
||||
stg.setItem(`${storagePrefix}${key as string}`, json);
|
||||
},
|
||||
/**
|
||||
* Get session
|
||||
@@ -24,7 +24,7 @@ export function createStorage<T extends object>(type: StorageType) {
|
||||
* @param key Session key
|
||||
*/
|
||||
get<K extends keyof T>(key: K): T[K] | null {
|
||||
const json = stg.getItem(key as string);
|
||||
const json = stg.getItem(`${storagePrefix}${key as string}`);
|
||||
if (json) {
|
||||
let storageData: T[K] | null = null;
|
||||
|
||||
@@ -37,12 +37,12 @@ export function createStorage<T extends object>(type: StorageType) {
|
||||
}
|
||||
}
|
||||
|
||||
stg.removeItem(key as string);
|
||||
stg.removeItem(`${storagePrefix}${key as string}`);
|
||||
|
||||
return null;
|
||||
},
|
||||
remove(key: keyof T) {
|
||||
stg.removeItem(key as string);
|
||||
stg.removeItem(`${storagePrefix}${key as string}`);
|
||||
},
|
||||
clear() {
|
||||
stg.clear();
|
||||
|
||||
20
packages/utils/tsconfig.json
Normal file
20
packages/utils/tsconfig.json
Normal file
@@ -0,0 +1,20 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ESNext",
|
||||
"jsx": "preserve",
|
||||
"lib": ["DOM", "ESNext"],
|
||||
"baseUrl": ".",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "node",
|
||||
"resolveJsonModule": true,
|
||||
"types": ["node"],
|
||||
"strict": true,
|
||||
"strictNullChecks": true,
|
||||
"noUnusedLocals": true,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"esModuleInterop": true,
|
||||
"forceConsistentCasingInFileNames": true
|
||||
},
|
||||
"include": ["src/**/*"],
|
||||
"exclude": ["node_modules", "dist"]
|
||||
}
|
||||
11209
pnpm-lock.yaml
generated
11209
pnpm-lock.yaml
generated
File diff suppressed because it is too large
Load Diff
@@ -1,4 +1,6 @@
|
||||
<script setup lang="ts">
|
||||
import { $t } from '@/locales';
|
||||
|
||||
defineOptions({
|
||||
name: 'TableHeaderOperation'
|
||||
});
|
||||
|
||||
@@ -9,9 +9,13 @@ interface Props {
|
||||
collapsed?: boolean;
|
||||
/** Arrow style icon */
|
||||
arrowIcon?: boolean;
|
||||
zIndex?: number;
|
||||
}
|
||||
|
||||
const props = defineProps<Props>();
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
arrowIcon: false,
|
||||
zIndex: 98
|
||||
});
|
||||
|
||||
type NumberBool = 0 | 1;
|
||||
|
||||
@@ -36,7 +40,11 @@ const icon = computed(() => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<ButtonIcon :tooltip-content="collapsed ? $t('icon.expand') : $t('icon.collapse')" tooltip-placement="bottom-start">
|
||||
<ButtonIcon
|
||||
:tooltip-content="collapsed ? $t('icon.expand') : $t('icon.collapse')"
|
||||
tooltip-placement="bottom-start"
|
||||
:z-index="zIndex"
|
||||
>
|
||||
<SvgIcon :icon="icon" />
|
||||
</ButtonIcon>
|
||||
</template>
|
||||
|
||||
@@ -15,7 +15,7 @@ const icon = computed(() => (props.pin ? 'mdi-pin-off' : 'mdi-pin'));
|
||||
|
||||
<template>
|
||||
<ButtonIcon
|
||||
:tooltip-content="pin ? $t('icon.pin') : $t('icon.unpin')"
|
||||
:tooltip-content="pin ? $t('icon.unpin') : $t('icon.pin')"
|
||||
tooltip-placement="bottom-start"
|
||||
:z-index="100"
|
||||
>
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
import { computed, useAttrs } from 'vue';
|
||||
import { Icon } from '@iconify/vue';
|
||||
|
||||
defineOptions({ name: 'SvgIcon' });
|
||||
defineOptions({ name: 'SvgIcon', inheritAttrs: false });
|
||||
|
||||
/**
|
||||
* Props
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
import { computed } from 'vue';
|
||||
import { getColorPalette } from '@sa/utils';
|
||||
import { getPaletteColorByNumber } from '@sa/color';
|
||||
|
||||
defineOptions({ name: 'WaveBg' });
|
||||
|
||||
@@ -11,8 +11,8 @@ interface Props {
|
||||
|
||||
const props = defineProps<Props>();
|
||||
|
||||
const lightColor = computed(() => getColorPalette(props.themeColor, 3));
|
||||
const darkColor = computed(() => getColorPalette(props.themeColor, 6));
|
||||
const lightColor = computed(() => getPaletteColorByNumber(props.themeColor, 200));
|
||||
const darkColor = computed(() => getPaletteColorByNumber(props.themeColor, 500));
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
@@ -92,7 +92,6 @@ export function useRouterPush(inSetup = true) {
|
||||
}
|
||||
|
||||
return {
|
||||
route,
|
||||
routerPush,
|
||||
routerBack,
|
||||
routerPushByKey,
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import { computed, effectScope, onScopeDispose, reactive, ref, watch } from 'vue';
|
||||
import type { Ref } from 'vue';
|
||||
import type { PaginationProps } from 'naive-ui';
|
||||
import { cloneDeep } from 'lodash-es';
|
||||
import { useBoolean, useHookTable } from '@sa/hooks';
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { $t } from '@/locales';
|
||||
@@ -13,10 +14,14 @@ export function useTable<A extends NaiveUI.TableApiFn>(config: NaiveUI.NaiveTabl
|
||||
const scope = effectScope();
|
||||
const appStore = useAppStore();
|
||||
|
||||
const { apiFn, apiParams, immediate } = config;
|
||||
const isMobile = computed(() => appStore.isMobile);
|
||||
|
||||
const { apiFn, apiParams, immediate, showTotal } = config;
|
||||
|
||||
const SELECTION_KEY = '__selection__';
|
||||
|
||||
const EXPAND_KEY = '__expand__';
|
||||
|
||||
const {
|
||||
loading,
|
||||
empty,
|
||||
@@ -65,6 +70,12 @@ export function useTable<A extends NaiveUI.TableApiFn>(config: NaiveUI.NaiveTabl
|
||||
title: $t('common.check'),
|
||||
checked: true
|
||||
});
|
||||
} else if (column.type === 'expand') {
|
||||
checks.push({
|
||||
key: EXPAND_KEY,
|
||||
title: $t('common.expandColumn'),
|
||||
checked: true
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
@@ -78,6 +89,8 @@ export function useTable<A extends NaiveUI.TableApiFn>(config: NaiveUI.NaiveTabl
|
||||
columnMap.set(column.key as string, column);
|
||||
} else if (column.type === 'selection') {
|
||||
columnMap.set(SELECTION_KEY, column);
|
||||
} else if (column.type === 'expand') {
|
||||
columnMap.set(EXPAND_KEY, column);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -124,14 +137,20 @@ export function useTable<A extends NaiveUI.TableApiFn>(config: NaiveUI.NaiveTabl
|
||||
});
|
||||
|
||||
getData();
|
||||
},
|
||||
...(showTotal
|
||||
? {
|
||||
prefix: page => $t('datatable.itemCount', { total: page.itemCount })
|
||||
}
|
||||
: {})
|
||||
});
|
||||
|
||||
// this is for mobile, if the system does not support mobile, you can use `pagination` directly
|
||||
const mobilePagination = computed(() => {
|
||||
const p: PaginationProps = {
|
||||
...pagination,
|
||||
pageSlot: appStore.isMobile ? 3 : 9
|
||||
pageSlot: isMobile.value ? 3 : 9,
|
||||
prefix: !isMobile.value && showTotal ? pagination.prefix : undefined
|
||||
};
|
||||
|
||||
return p;
|
||||
@@ -186,7 +205,8 @@ export function useTableOperate<T extends TableData = TableData>(data: Ref<T[]>,
|
||||
|
||||
function handleEdit(id: T['id']) {
|
||||
operateType.value = 'edit';
|
||||
editingData.value = data.value.find(item => item.id === id) || null;
|
||||
const findItem = data.value.find(item => item.id === id) || null;
|
||||
editingData.value = cloneDeep(findItem);
|
||||
|
||||
openDrawer();
|
||||
}
|
||||
|
||||
@@ -18,6 +18,7 @@ defineOptions({
|
||||
|
||||
const appStore = useAppStore();
|
||||
const themeStore = useThemeStore();
|
||||
const { menus } = setupMixMenuContext();
|
||||
|
||||
const layoutMode = computed(() => {
|
||||
const vertical: LayoutMode = 'vertical';
|
||||
@@ -65,7 +66,7 @@ function getSiderWidth() {
|
||||
|
||||
let w = isVerticalMix.value || isHorizontalMix.value ? mixWidth : width;
|
||||
|
||||
if (isVerticalMix.value && appStore.mixSiderFixed) {
|
||||
if (isVerticalMix.value && appStore.mixSiderFixed && menus.value.length) {
|
||||
w += mixChildMenuWidth;
|
||||
}
|
||||
|
||||
@@ -77,14 +78,12 @@ function getSiderCollapsedWidth() {
|
||||
|
||||
let w = isVerticalMix.value || isHorizontalMix.value ? mixCollapsedWidth : collapsedWidth;
|
||||
|
||||
if (isVerticalMix.value && appStore.mixSiderFixed) {
|
||||
if (isVerticalMix.value && appStore.mixSiderFixed && menus.value.length) {
|
||||
w += mixChildMenuWidth;
|
||||
}
|
||||
|
||||
return w;
|
||||
}
|
||||
|
||||
setupMixMenuContext();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
@@ -1,4 +1,47 @@
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useContext } from '@sa/hooks';
|
||||
import { useMixMenu } from '../hooks';
|
||||
import { useRouteStore } from '@/store/modules/route';
|
||||
|
||||
export const { setupStore: setupMixMenuContext, useStore: useMixMenuContext } = useContext('mix-menu', useMixMenu);
|
||||
|
||||
function useMixMenu() {
|
||||
const route = useRoute();
|
||||
const routeStore = useRouteStore();
|
||||
|
||||
const activeFirstLevelMenuKey = ref('');
|
||||
|
||||
function setActiveFirstLevelMenuKey(key: string) {
|
||||
activeFirstLevelMenuKey.value = key;
|
||||
}
|
||||
|
||||
function getActiveFirstLevelMenuKey() {
|
||||
const { hideInMenu, activeMenu } = route.meta;
|
||||
const name = route.name as string;
|
||||
|
||||
const routeName = (hideInMenu ? activeMenu : name) || name;
|
||||
|
||||
const [firstLevelRouteName] = routeName.split('_');
|
||||
|
||||
setActiveFirstLevelMenuKey(firstLevelRouteName);
|
||||
}
|
||||
|
||||
const menus = computed(
|
||||
() => routeStore.menus.find(menu => menu.key === activeFirstLevelMenuKey.value)?.children || []
|
||||
);
|
||||
|
||||
watch(
|
||||
() => route.name,
|
||||
() => {
|
||||
getActiveFirstLevelMenuKey();
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
return {
|
||||
activeFirstLevelMenuKey,
|
||||
setActiveFirstLevelMenuKey,
|
||||
getActiveFirstLevelMenuKey,
|
||||
menus
|
||||
};
|
||||
}
|
||||
|
||||
@@ -1,44 +0,0 @@
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useRouteStore } from '@/store/modules/route';
|
||||
|
||||
export function useMixMenu() {
|
||||
const route = useRoute();
|
||||
const routeStore = useRouteStore();
|
||||
|
||||
const activeFirstLevelMenuKey = ref('');
|
||||
|
||||
function setActiveFirstLevelMenuKey(key: string) {
|
||||
activeFirstLevelMenuKey.value = key;
|
||||
}
|
||||
|
||||
function getActiveFirstLevelMenuKey() {
|
||||
const { hideInMenu, activeMenu } = route.meta;
|
||||
const name = route.name as string;
|
||||
|
||||
const routeName = (hideInMenu ? activeMenu : name) || name;
|
||||
|
||||
const [firstLevelRouteName] = routeName.split('_');
|
||||
|
||||
setActiveFirstLevelMenuKey(firstLevelRouteName);
|
||||
}
|
||||
|
||||
const menus = computed(
|
||||
() => routeStore.menus.find(menu => menu.key === activeFirstLevelMenuKey.value)?.children || []
|
||||
);
|
||||
|
||||
watch(
|
||||
() => route.name,
|
||||
() => {
|
||||
getActiveFirstLevelMenuKey();
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
return {
|
||||
activeFirstLevelMenuKey,
|
||||
setActiveFirstLevelMenuKey,
|
||||
getActiveFirstLevelMenuKey,
|
||||
menus
|
||||
};
|
||||
}
|
||||
@@ -1,4 +1,5 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue';
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { useRouteStore } from '@/store/modules/route';
|
||||
@@ -19,12 +20,14 @@ withDefaults(defineProps<Props>(), {
|
||||
const appStore = useAppStore();
|
||||
const themeStore = useThemeStore();
|
||||
const routeStore = useRouteStore();
|
||||
|
||||
const transitionName = computed(() => (themeStore.page.animate ? themeStore.page.animateMode : ''));
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<RouterView v-slot="{ Component, route }">
|
||||
<Transition
|
||||
:name="themeStore.page.animateMode"
|
||||
:name="transitionName"
|
||||
mode="out-in"
|
||||
@before-leave="appStore.setContentXScrollable(true)"
|
||||
@after-enter="appStore.setContentXScrollable(false)"
|
||||
|
||||
@@ -57,7 +57,7 @@ function updateExpandedKeys() {
|
||||
}
|
||||
|
||||
function handleClickMenu(key: RouteKey) {
|
||||
const { query } = routeStore.getSelectedMenuMetaByKey(key) || {};
|
||||
const query = routeStore.getRouteQueryOfMetaByKey(key);
|
||||
|
||||
routerPushByKey(key, { query });
|
||||
}
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
import { computed } from 'vue';
|
||||
import { createReusableTemplate } from '@vueuse/core';
|
||||
import { SimpleScrollbar } from '@sa/materials';
|
||||
import { transformColorWithOpacity } from '@sa/utils';
|
||||
import { transformColorWithOpacity } from '@sa/color';
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { useRouteStore } from '@/store/modules/route';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
@@ -92,6 +92,7 @@ function handleClickMixMenu(menu: App.Global.Menu) {
|
||||
<MenuToggler
|
||||
arrow-icon
|
||||
:collapsed="appStore.siderCollapse"
|
||||
:z-index="99"
|
||||
:class="{ 'text-white:88 !hover:text-white': inverted }"
|
||||
@click="appStore.toggleSiderCollapse"
|
||||
/>
|
||||
|
||||
@@ -2,10 +2,10 @@
|
||||
import { computed } from 'vue';
|
||||
import { useBoolean } from '@sa/hooks';
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { useRouteStore } from '@/store/modules/route';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
import { useRouterPush } from '@/hooks/common/router';
|
||||
import { useMixMenu } from '../../hooks';
|
||||
import { $t } from '@/locales';
|
||||
import { useMixMenuContext } from '../../context';
|
||||
import FirstLevelMenu from './first-level-menu.vue';
|
||||
import BaseMenu from './base-menu.vue';
|
||||
|
||||
@@ -15,16 +15,15 @@ defineOptions({
|
||||
|
||||
const appStore = useAppStore();
|
||||
const themeStore = useThemeStore();
|
||||
const routeStore = useRouteStore();
|
||||
const { routerPushByKey } = useRouterPush();
|
||||
const { bool: drawerVisible, setBool: setDrawerVisible } = useBoolean();
|
||||
const { activeFirstLevelMenuKey, setActiveFirstLevelMenuKey, getActiveFirstLevelMenuKey } = useMixMenu();
|
||||
const { menus, activeFirstLevelMenuKey, setActiveFirstLevelMenuKey, getActiveFirstLevelMenuKey } = useMixMenuContext();
|
||||
|
||||
const siderInverted = computed(() => !themeStore.darkMode && themeStore.sider.inverted);
|
||||
|
||||
const menus = computed(() => routeStore.menus.find(menu => menu.key === activeFirstLevelMenuKey.value)?.children || []);
|
||||
const hasMenus = computed(() => menus.value.length > 0);
|
||||
|
||||
const showDrawer = computed(() => (drawerVisible.value && menus.value.length) || appStore.mixSiderFixed);
|
||||
const showDrawer = computed(() => hasMenus.value && (drawerVisible.value || appStore.mixSiderFixed));
|
||||
|
||||
function handleSelectMixMenu(menu: App.Global.Menu) {
|
||||
setActiveFirstLevelMenuKey(menu.key);
|
||||
@@ -49,7 +48,7 @@ function handleResetActiveMenu() {
|
||||
</FirstLevelMenu>
|
||||
<div
|
||||
class="relative h-full transition-width-300"
|
||||
:style="{ width: appStore.mixSiderFixed ? themeStore.sider.mixChildMenuWidth + 'px' : '0px' }"
|
||||
:style="{ width: appStore.mixSiderFixed && hasMenus ? themeStore.sider.mixChildMenuWidth + 'px' : '0px' }"
|
||||
>
|
||||
<DarkModeContainer
|
||||
class="absolute-lt h-full flex-col-stretch nowrap-hidden shadow-sm transition-all-300"
|
||||
|
||||
@@ -21,6 +21,10 @@ function handleSegmentChange(value: string | number) {
|
||||
themeStore.setThemeScheme(value as UnionKey.ThemeScheme);
|
||||
}
|
||||
|
||||
function handleGrayscaleChange(value: boolean) {
|
||||
themeStore.setGrayscale(value);
|
||||
}
|
||||
|
||||
const showSiderInverted = computed(() => !themeStore.darkMode && themeStore.layout.mode.includes('vertical'));
|
||||
</script>
|
||||
|
||||
@@ -46,6 +50,9 @@ const showSiderInverted = computed(() => !themeStore.darkMode && themeStore.layo
|
||||
<NSwitch v-model:value="themeStore.sider.inverted" />
|
||||
</SettingItem>
|
||||
</Transition>
|
||||
<SettingItem :label="$t('theme.grayscale')">
|
||||
<NSwitch :value="themeStore.grayscale" @update:value="handleGrayscaleChange" />
|
||||
</SettingItem>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -36,6 +36,27 @@ const swatches: string[] = [
|
||||
<template>
|
||||
<NDivider>{{ $t('theme.themeColor.title') }}</NDivider>
|
||||
<div class="flex-col-stretch gap-12px">
|
||||
<NTooltip placement="top-start">
|
||||
<template #trigger>
|
||||
<SettingItem key="recommend-color" :label="$t('theme.recommendColor')">
|
||||
<NSwitch v-model:value="themeStore.recommendColor" />
|
||||
</SettingItem>
|
||||
</template>
|
||||
<p>
|
||||
<span class="pr-12px">{{ $t('theme.recommendColorDesc') }}</span>
|
||||
<br />
|
||||
<NButton
|
||||
text
|
||||
tag="a"
|
||||
href="https://uicolors.app/create"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="text-gray"
|
||||
>
|
||||
https://uicolors.app/create
|
||||
</NButton>
|
||||
</p>
|
||||
</NTooltip>
|
||||
<SettingItem v-for="(_, key) in themeStore.themeColors" :key="key" :label="$t(`theme.themeColor.${key}`)">
|
||||
<template v-if="key === 'info'" #suffix>
|
||||
<NCheckbox v-model:checked="themeStore.isInfoFollowPrimary">
|
||||
|
||||
@@ -11,6 +11,7 @@ const local: App.I18n.Schema = {
|
||||
cancel: 'Cancel',
|
||||
close: 'Close',
|
||||
check: 'Check',
|
||||
expandColumn: 'Expand Column',
|
||||
columnSetting: 'Column Setting',
|
||||
config: 'Config',
|
||||
confirm: 'Confirm',
|
||||
@@ -57,6 +58,7 @@ const local: App.I18n.Schema = {
|
||||
dark: 'Dark',
|
||||
auto: 'Follow System'
|
||||
},
|
||||
grayscale: 'Grayscale',
|
||||
layoutMode: {
|
||||
title: 'Layout Mode',
|
||||
vertical: 'Vertical Menu Mode',
|
||||
@@ -64,6 +66,8 @@ const local: App.I18n.Schema = {
|
||||
'vertical-mix': 'Vertical Mix Menu Mode',
|
||||
'horizontal-mix': 'Horizontal Mix menu Mode'
|
||||
},
|
||||
recommendColor: 'Apply Recommended Color Algorithm',
|
||||
recommendColorDesc: 'The recommended color algorithm refers to',
|
||||
themeColor: {
|
||||
title: 'Theme Color',
|
||||
primary: 'Primary',
|
||||
@@ -137,7 +141,16 @@ const local: App.I18n.Schema = {
|
||||
403: 'No Permission',
|
||||
404: 'Page Not Found',
|
||||
500: 'Server Error',
|
||||
'iframe-page': 'Iframe',
|
||||
home: 'Home',
|
||||
document: 'Document',
|
||||
document_project: 'Project Document',
|
||||
'document_project-link': 'Project Document(External Link)',
|
||||
document_vue: 'Vue Document',
|
||||
document_vite: 'Vite Document',
|
||||
document_unocss: 'UnoCSS Document',
|
||||
document_naive: 'Naive UI Document',
|
||||
document_antd: 'Ant Design Vue Document',
|
||||
'user-center': 'User Center',
|
||||
about: 'About',
|
||||
function: 'System Function',
|
||||
@@ -284,6 +297,12 @@ const local: App.I18n.Schema = {
|
||||
superAdminVisible: 'Super Admin Visible',
|
||||
adminVisible: 'Admin Visible',
|
||||
adminOrUserVisible: 'Admin and User Visible'
|
||||
},
|
||||
request: {
|
||||
repeatedErrorOccurOnce: 'Repeated Request Error Occurs Once',
|
||||
repeatedError: 'Repeated Request Error',
|
||||
repeatedErrorMsg1: 'Custom Request Error 1',
|
||||
repeatedErrorMsg2: 'Custom Request Error 2'
|
||||
}
|
||||
},
|
||||
manage: {
|
||||
@@ -344,7 +363,7 @@ const local: App.I18n.Schema = {
|
||||
menuName: 'Menu Name',
|
||||
routeName: 'Route Name',
|
||||
routePath: 'Route Path',
|
||||
routeParams: 'Route Params',
|
||||
pathParam: 'Path Param',
|
||||
layout: 'Layout Component',
|
||||
page: 'Page Component',
|
||||
i18nKey: 'I18n Key',
|
||||
@@ -352,12 +371,14 @@ const local: App.I18n.Schema = {
|
||||
localIcon: 'Local Icon',
|
||||
iconTypeTitle: 'Icon Type',
|
||||
order: 'Order',
|
||||
constant: 'Constant',
|
||||
keepAlive: 'Keep Alive',
|
||||
href: 'Href',
|
||||
hideInMenu: 'Hide In Menu',
|
||||
activeMenu: 'Active Menu',
|
||||
multiTab: 'Multi Tab',
|
||||
fixedIndexInTab: 'Fixed Index In Tab',
|
||||
query: 'Query Params',
|
||||
button: 'Button',
|
||||
buttonCode: 'Button Code',
|
||||
buttonDesc: 'Button Desc',
|
||||
@@ -368,6 +389,7 @@ const local: App.I18n.Schema = {
|
||||
menuName: 'Please enter menu name',
|
||||
routeName: 'Please enter route name',
|
||||
routePath: 'Please enter route path',
|
||||
pathParam: 'Please enter path param',
|
||||
page: 'Please select page component',
|
||||
layout: 'Please select layout component',
|
||||
i18nKey: 'Please enter i18n key',
|
||||
@@ -377,10 +399,12 @@ const local: App.I18n.Schema = {
|
||||
keepAlive: 'Please select whether to cache route',
|
||||
href: 'Please enter href',
|
||||
hideInMenu: 'Please select whether to hide menu',
|
||||
activeMenu: 'Please enter the route name of the highlighted menu',
|
||||
activeMenu: 'Please select route name of the highlighted menu',
|
||||
multiTab: 'Please select whether to support multiple tabs',
|
||||
fixedInTab: 'Please select whether to fix in the tab',
|
||||
fixedIndexInTab: 'Please enter the index fixed in the tab',
|
||||
queryKey: 'Please enter route parameter Key',
|
||||
queryValue: 'Please enter route parameter Value',
|
||||
button: 'Please select whether it is a button',
|
||||
buttonCode: 'Please enter button code',
|
||||
buttonDesc: 'Please enter button description',
|
||||
@@ -445,6 +469,9 @@ const local: App.I18n.Schema = {
|
||||
expand: 'Expand Menu',
|
||||
pin: 'Pin',
|
||||
unpin: 'Unpin'
|
||||
},
|
||||
datatable: {
|
||||
itemCount: 'Total {total} items'
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -11,6 +11,7 @@ const local: App.I18n.Schema = {
|
||||
cancel: '取消',
|
||||
close: '关闭',
|
||||
check: '勾选',
|
||||
expandColumn: '展开列',
|
||||
columnSetting: '列设置',
|
||||
config: '配置',
|
||||
confirm: '确认',
|
||||
@@ -57,6 +58,7 @@ const local: App.I18n.Schema = {
|
||||
dark: '暗黑模式',
|
||||
auto: '跟随系统'
|
||||
},
|
||||
grayscale: '灰度模式',
|
||||
layoutMode: {
|
||||
title: '布局模式',
|
||||
vertical: '左侧菜单模式',
|
||||
@@ -64,6 +66,8 @@ const local: App.I18n.Schema = {
|
||||
horizontal: '顶部菜单模式',
|
||||
'horizontal-mix': '顶部菜单混合模式'
|
||||
},
|
||||
recommendColor: '应用推荐算法的颜色',
|
||||
recommendColorDesc: '推荐颜色的算法参照',
|
||||
themeColor: {
|
||||
title: '主题颜色',
|
||||
primary: '主色',
|
||||
@@ -137,7 +141,16 @@ const local: App.I18n.Schema = {
|
||||
403: '无权限',
|
||||
404: '页面不存在',
|
||||
500: '服务器错误',
|
||||
'iframe-page': '外链页面',
|
||||
home: '首页',
|
||||
document: '文档',
|
||||
document_project: '项目文档',
|
||||
'document_project-link': '项目文档(外链)',
|
||||
document_vue: 'Vue文档',
|
||||
document_vite: 'Vite文档',
|
||||
document_unocss: 'UnoCSS文档',
|
||||
document_naive: 'Naive UI文档',
|
||||
document_antd: 'Ant Design Vue文档',
|
||||
'user-center': '个人中心',
|
||||
about: '关于',
|
||||
function: '系统功能',
|
||||
@@ -284,6 +297,12 @@ const local: App.I18n.Schema = {
|
||||
superAdminVisible: '超级管理员可见',
|
||||
adminVisible: '管理员可见',
|
||||
adminOrUserVisible: '管理员和用户可见'
|
||||
},
|
||||
request: {
|
||||
repeatedErrorOccurOnce: '重复请求错误只出现一次',
|
||||
repeatedError: '重复请求错误',
|
||||
repeatedErrorMsg1: '自定义请求错误 1',
|
||||
repeatedErrorMsg2: '自定义请求错误 2'
|
||||
}
|
||||
},
|
||||
manage: {
|
||||
@@ -344,7 +363,7 @@ const local: App.I18n.Schema = {
|
||||
menuName: '菜单名称',
|
||||
routeName: '路由名称',
|
||||
routePath: '路由路径',
|
||||
routeParams: '路由参数',
|
||||
pathParam: '路径参数',
|
||||
layout: '布局',
|
||||
page: '页面组件',
|
||||
i18nKey: '国际化key',
|
||||
@@ -352,12 +371,14 @@ const local: App.I18n.Schema = {
|
||||
localIcon: '本地图标',
|
||||
iconTypeTitle: '图标类型',
|
||||
order: '排序',
|
||||
constant: '常量路由',
|
||||
keepAlive: '缓存路由',
|
||||
href: '外链',
|
||||
hideInMenu: '隐藏菜单',
|
||||
activeMenu: '高亮的菜单',
|
||||
multiTab: '支持多页签',
|
||||
fixedIndexInTab: '固定在页签中的序号',
|
||||
query: '路由参数',
|
||||
button: '按钮',
|
||||
buttonCode: '按钮编码',
|
||||
buttonDesc: '按钮描述',
|
||||
@@ -368,6 +389,7 @@ const local: App.I18n.Schema = {
|
||||
menuName: '请输入菜单名称',
|
||||
routeName: '请输入路由名称',
|
||||
routePath: '请输入路由路径',
|
||||
pathParam: '请输入路径参数',
|
||||
page: '请选择页面组件',
|
||||
layout: '请选择布局组件',
|
||||
i18nKey: '请输入国际化key',
|
||||
@@ -377,10 +399,12 @@ const local: App.I18n.Schema = {
|
||||
keepAlive: '请选择是否缓存路由',
|
||||
href: '请输入外链',
|
||||
hideInMenu: '请选择是否隐藏菜单',
|
||||
activeMenu: '请输入高亮的菜单的路由名称',
|
||||
activeMenu: '请选择高亮的菜单的路由名称',
|
||||
multiTab: '请选择是否支持多标签',
|
||||
fixedInTab: '请选择是否固定在页签中',
|
||||
fixedIndexInTab: '请输入固定在页签中的序号',
|
||||
queryKey: '请输入路由参数Key',
|
||||
queryValue: '请输入路由参数Value',
|
||||
button: '请选择是否按钮',
|
||||
buttonCode: '请输入按钮编码',
|
||||
buttonDesc: '请输入按钮描述',
|
||||
@@ -445,6 +469,9 @@ const local: App.I18n.Schema = {
|
||||
expand: '展开菜单',
|
||||
pin: '固定',
|
||||
unpin: '取消固定'
|
||||
},
|
||||
datatable: {
|
||||
itemCount: '共 {total} 条'
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
// @unocss-include
|
||||
import { getRgbOfColor } from '@sa/utils';
|
||||
import { getRgb } from '@sa/color';
|
||||
import { $t } from '@/locales';
|
||||
import { localStg } from '@/utils/storage';
|
||||
import systemLogo from '@/assets/svg-icon/logo.svg?raw';
|
||||
@@ -7,7 +7,7 @@ import systemLogo from '@/assets/svg-icon/logo.svg?raw';
|
||||
export function setupLoading() {
|
||||
const themeColor = localStg.get('themeColor') || '#646cff';
|
||||
|
||||
const { r, g, b } = getRgbOfColor(themeColor);
|
||||
const { r, g, b } = getRgb(themeColor);
|
||||
|
||||
const primaryColor = `--primary-color: ${r} ${g} ${b}`;
|
||||
|
||||
|
||||
@@ -18,6 +18,7 @@ export const views: Record<LastLevelRouteKey, RouteComponent | (() => Promise<Ro
|
||||
403: () => import("@/views/_builtin/403/index.vue"),
|
||||
404: () => import("@/views/_builtin/404/index.vue"),
|
||||
500: () => import("@/views/_builtin/500/index.vue"),
|
||||
"iframe-page": () => import("@/views/_builtin/iframe-page/[url].vue"),
|
||||
login: () => import("@/views/_builtin/login/index.vue"),
|
||||
about: () => import("@/views/about/index.vue"),
|
||||
"function_hide-child_one": () => import("@/views/function/hide-child/one/index.vue"),
|
||||
|
||||
@@ -179,6 +179,19 @@ export const generatedRoutes: GeneratedRoute[] = [
|
||||
order: 1
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'iframe-page',
|
||||
path: '/iframe-page/:url',
|
||||
component: 'layout.base$view.iframe-page',
|
||||
props: true,
|
||||
meta: {
|
||||
title: 'iframe-page',
|
||||
i18nKey: 'route.iframe-page',
|
||||
constant: true,
|
||||
hideInMenu: true,
|
||||
keepAlive: true
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'login',
|
||||
path: '/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?',
|
||||
|
||||
@@ -147,6 +147,14 @@ const routeMap: RouteMap = {
|
||||
"exception_403": "/exception/403",
|
||||
"exception_404": "/exception/404",
|
||||
"exception_500": "/exception/500",
|
||||
"document": "/document",
|
||||
"document_project": "/document/project",
|
||||
"document_project-link": "/document/project-link",
|
||||
"document_vue": "/document/vue",
|
||||
"document_vite": "/document/vite",
|
||||
"document_unocss": "/document/unocss",
|
||||
"document_naive": "/document/naive",
|
||||
"document_antd": "/document/antd",
|
||||
"403": "/403",
|
||||
"404": "/404",
|
||||
"500": "/500",
|
||||
@@ -162,6 +170,7 @@ const routeMap: RouteMap = {
|
||||
"function_tab": "/function/tab",
|
||||
"function_toggle-auth": "/function/toggle-auth",
|
||||
"home": "/home",
|
||||
"iframe-page": "/iframe-page/:url",
|
||||
"login": "/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?",
|
||||
"manage": "/manage",
|
||||
"manage_menu": "/manage/menu",
|
||||
|
||||
@@ -51,6 +51,115 @@ const customRoutes: CustomRoute[] = [
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'document',
|
||||
path: '/document',
|
||||
component: 'layout.base',
|
||||
meta: {
|
||||
title: 'document',
|
||||
i18nKey: 'route.document',
|
||||
order: 2,
|
||||
icon: 'mdi:file-document-multiple-outline'
|
||||
},
|
||||
children: [
|
||||
{
|
||||
name: 'document_antd',
|
||||
path: '/document/antd',
|
||||
component: 'view.iframe-page',
|
||||
props: {
|
||||
url: 'https://antdv.com/components/overview-cn'
|
||||
},
|
||||
meta: {
|
||||
title: 'document_antd',
|
||||
i18nKey: 'route.document_antd',
|
||||
order: 7,
|
||||
icon: 'logos:ant-design'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'document_naive',
|
||||
path: '/document/naive',
|
||||
component: 'view.iframe-page',
|
||||
props: {
|
||||
url: 'https://www.naiveui.com/zh-CN/os-theme/docs/introduction'
|
||||
},
|
||||
meta: {
|
||||
title: 'document_naive',
|
||||
i18nKey: 'route.document_naive',
|
||||
order: 6,
|
||||
icon: 'logos:naiveui'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'document_project',
|
||||
path: '/document/project',
|
||||
component: 'view.iframe-page',
|
||||
props: {
|
||||
url: 'https://docs.soybeanjs.cn/zh'
|
||||
},
|
||||
meta: {
|
||||
title: 'document_project',
|
||||
i18nKey: 'route.document_project',
|
||||
order: 1,
|
||||
localIcon: 'logo'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'document_project-link',
|
||||
path: '/document/project-link',
|
||||
component: 'view.iframe-page',
|
||||
meta: {
|
||||
title: 'document_project-link',
|
||||
i18nKey: 'route.document_project-link',
|
||||
order: 2,
|
||||
localIcon: 'logo',
|
||||
href: 'https://docs.soybeanjs.cn/zh'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'document_unocss',
|
||||
path: '/document/unocss',
|
||||
component: 'view.iframe-page',
|
||||
props: {
|
||||
url: 'https://unocss.dev/'
|
||||
},
|
||||
meta: {
|
||||
title: 'document_unocss',
|
||||
i18nKey: 'route.document_unocss',
|
||||
order: 5,
|
||||
icon: 'logos:unocss'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'document_vite',
|
||||
path: '/document/vite',
|
||||
component: 'view.iframe-page',
|
||||
props: {
|
||||
url: 'https://cn.vitejs.dev/'
|
||||
},
|
||||
meta: {
|
||||
title: 'document_vite',
|
||||
i18nKey: 'route.document_vite',
|
||||
order: 4,
|
||||
icon: 'logos:vitejs'
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'document_vue',
|
||||
path: '/document/vue',
|
||||
component: 'view.iframe-page',
|
||||
props: {
|
||||
url: 'https://cn.vuejs.org/'
|
||||
},
|
||||
meta: {
|
||||
title: 'document_vue',
|
||||
i18nKey: 'route.document_vue',
|
||||
order: 3,
|
||||
icon: 'logos:vue'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
@@ -30,18 +30,6 @@ export function fetchGetUserList(params?: Api.SystemManage.UserSearchParams) {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* get menu list
|
||||
*
|
||||
* @deprecated this will removed in next version 1.1.0
|
||||
*/
|
||||
export function fetchGetMenuListV1() {
|
||||
return request<Api.SystemManage.Menu[]>({
|
||||
url: '/systemManage/getMenuList',
|
||||
method: 'get'
|
||||
});
|
||||
}
|
||||
|
||||
/** get menu list */
|
||||
export function fetchGetMenuList() {
|
||||
return request<Api.SystemManage.MenuList>({
|
||||
|
||||
@@ -1,20 +1,16 @@
|
||||
import type { AxiosResponse } from 'axios';
|
||||
import { BACKEND_ERROR_CODE, createFlatRequest, createRequest } from '@sa/axios';
|
||||
import { useAuthStore } from '@/store/modules/auth';
|
||||
import { $t } from '@/locales';
|
||||
import { localStg } from '@/utils/storage';
|
||||
import { getServiceBaseURL } from '@/utils/service';
|
||||
import { $t } from '@/locales';
|
||||
import { handleRefreshToken } from './shared';
|
||||
import { handleRefreshToken, showErrorMsg } from './shared';
|
||||
import type { RequestInstanceState } from './type';
|
||||
|
||||
const isHttpProxy = import.meta.env.DEV && import.meta.env.VITE_HTTP_PROXY === 'Y';
|
||||
const { baseURL, otherBaseURL } = getServiceBaseURL(import.meta.env, isHttpProxy);
|
||||
|
||||
interface InstanceState {
|
||||
/** whether the request is refreshing token */
|
||||
isRefreshingToken: boolean;
|
||||
}
|
||||
|
||||
export const request = createFlatRequest<App.Service.Response, InstanceState>(
|
||||
export const request = createFlatRequest<App.Service.Response, RequestInstanceState>(
|
||||
{
|
||||
baseURL,
|
||||
headers: {
|
||||
@@ -35,7 +31,7 @@ export const request = createFlatRequest<App.Service.Response, InstanceState>(
|
||||
isBackendSuccess(response) {
|
||||
// when the backend response code is "0000"(default), it means the request is success
|
||||
// to change this logic by yourself, you can modify the `VITE_SERVICE_SUCCESS_CODE` in `.env` file
|
||||
return response.data.code === import.meta.env.VITE_SERVICE_SUCCESS_CODE;
|
||||
return String(response.data.code) === import.meta.env.VITE_SERVICE_SUCCESS_CODE;
|
||||
},
|
||||
async onBackendFail(response, instance) {
|
||||
const authStore = useAuthStore();
|
||||
@@ -47,6 +43,8 @@ export const request = createFlatRequest<App.Service.Response, InstanceState>(
|
||||
function logoutAndCleanup() {
|
||||
handleLogout();
|
||||
window.removeEventListener('beforeunload', handleLogout);
|
||||
|
||||
request.state.errMsgStack = request.state.errMsgStack.filter(msg => msg !== response.data.msg);
|
||||
}
|
||||
|
||||
// when the backend response code is in `logoutCodes`, it means the user will be logged out and redirected to login page
|
||||
@@ -58,13 +56,15 @@ export const request = createFlatRequest<App.Service.Response, InstanceState>(
|
||||
|
||||
// when the backend response code is in `modalLogoutCodes`, it means the user will be logged out by displaying a modal
|
||||
const modalLogoutCodes = import.meta.env.VITE_SERVICE_MODAL_LOGOUT_CODES?.split(',') || [];
|
||||
if (modalLogoutCodes.includes(response.data.code)) {
|
||||
if (modalLogoutCodes.includes(response.data.code) && !request.state.errMsgStack?.includes(response.data.msg)) {
|
||||
request.state.errMsgStack = [...(request.state.errMsgStack || []), response.data.msg];
|
||||
|
||||
// prevent the user from refreshing the page
|
||||
window.addEventListener('beforeunload', handleLogout);
|
||||
|
||||
window.$dialog?.error({
|
||||
title: 'Error',
|
||||
content: response.data.msg,
|
||||
content: response.data.code,
|
||||
positiveText: $t('common.confirm'),
|
||||
maskClosable: false,
|
||||
onPositiveClick() {
|
||||
@@ -122,7 +122,7 @@ export const request = createFlatRequest<App.Service.Response, InstanceState>(
|
||||
return;
|
||||
}
|
||||
|
||||
window.$message?.error?.(message);
|
||||
showErrorMsg(request.state, message);
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
@@ -2,6 +2,7 @@ import type { AxiosRequestConfig } from 'axios';
|
||||
import { useAuthStore } from '@/store/modules/auth';
|
||||
import { localStg } from '@/utils/storage';
|
||||
import { fetchRefreshToken } from '../api';
|
||||
import type { RequestInstanceState } from './type';
|
||||
|
||||
/**
|
||||
* refresh token
|
||||
@@ -29,3 +30,25 @@ export async function handleRefreshToken(axiosConfig: AxiosRequestConfig) {
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
export function showErrorMsg(state: RequestInstanceState, message: string) {
|
||||
if (!state.errMsgStack?.length) {
|
||||
state.errMsgStack = [];
|
||||
}
|
||||
|
||||
const isExist = state.errMsgStack.includes(message);
|
||||
|
||||
if (!isExist) {
|
||||
state.errMsgStack.push(message);
|
||||
|
||||
window.$message?.error(message, {
|
||||
onLeave: () => {
|
||||
state.errMsgStack = state.errMsgStack.filter(msg => msg !== message);
|
||||
|
||||
setTimeout(() => {
|
||||
state.errMsgStack = [];
|
||||
}, 5000);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
6
src/service/request/type.ts
Normal file
6
src/service/request/type.ts
Normal file
@@ -0,0 +1,6 @@
|
||||
export interface RequestInstanceState {
|
||||
/** whether the request is refreshing token */
|
||||
isRefreshingToken: boolean;
|
||||
/** the request error message stack */
|
||||
errMsgStack: string[];
|
||||
}
|
||||
@@ -1,6 +1,6 @@
|
||||
import { effectScope, onScopeDispose, ref, watch } from 'vue';
|
||||
import { effectScope, nextTick, onScopeDispose, ref, watch } from 'vue';
|
||||
import { defineStore } from 'pinia';
|
||||
import { breakpointsTailwind, useBreakpoints, useTitle } from '@vueuse/core';
|
||||
import { breakpointsTailwind, useBreakpoints, useEventListener, useTitle } from '@vueuse/core';
|
||||
import { useBoolean } from '@sa/hooks';
|
||||
import { SetupStoreId } from '@/enum';
|
||||
import { router } from '@/router';
|
||||
@@ -22,7 +22,11 @@ export const useAppStore = defineStore(SetupStoreId.App, () => {
|
||||
const { bool: fullContent, toggle: toggleFullContent } = useBoolean();
|
||||
const { bool: contentXScrollable, setBool: setContentXScrollable } = useBoolean();
|
||||
const { bool: siderCollapse, setBool: setSiderCollapse, toggle: toggleSiderCollapse } = useBoolean();
|
||||
const { bool: mixSiderFixed, setBool: setMixSiderFixed, toggle: toggleMixSiderFixed } = useBoolean();
|
||||
const {
|
||||
bool: mixSiderFixed,
|
||||
setBool: setMixSiderFixed,
|
||||
toggle: toggleMixSiderFixed
|
||||
} = useBoolean(localStg.get('mixSiderFixed') === 'Y');
|
||||
|
||||
/** Is mobile layout */
|
||||
const isMobile = breakpoints.smaller('sm');
|
||||
@@ -35,11 +39,11 @@ export const useAppStore = defineStore(SetupStoreId.App, () => {
|
||||
async function reloadPage(duration = 300) {
|
||||
setReloadFlag(false);
|
||||
|
||||
if (duration > 0) {
|
||||
const d = themeStore.page.animate ? duration : 40;
|
||||
|
||||
await new Promise(resolve => {
|
||||
setTimeout(resolve, duration);
|
||||
setTimeout(resolve, d);
|
||||
});
|
||||
}
|
||||
|
||||
setReloadFlag(true);
|
||||
}
|
||||
@@ -83,9 +87,26 @@ export const useAppStore = defineStore(SetupStoreId.App, () => {
|
||||
isMobile,
|
||||
newValue => {
|
||||
if (newValue) {
|
||||
setSiderCollapse(true);
|
||||
// backup theme setting before is mobile
|
||||
localStg.set('backupThemeSettingBeforeIsMobile', {
|
||||
layout: themeStore.layout.mode,
|
||||
siderCollapse: siderCollapse.value
|
||||
});
|
||||
|
||||
themeStore.setThemeLayout('vertical');
|
||||
setSiderCollapse(true);
|
||||
} else {
|
||||
// when is not mobile, recover the backup theme setting
|
||||
const backup = localStg.get('backupThemeSettingBeforeIsMobile');
|
||||
|
||||
if (backup) {
|
||||
nextTick(() => {
|
||||
themeStore.setThemeLayout(backup.layout);
|
||||
setSiderCollapse(backup.siderCollapse);
|
||||
|
||||
localStg.remove('backupThemeSettingBeforeIsMobile');
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
{ immediate: true }
|
||||
@@ -107,6 +128,11 @@ export const useAppStore = defineStore(SetupStoreId.App, () => {
|
||||
});
|
||||
});
|
||||
|
||||
// cache mixSiderFixed
|
||||
useEventListener(window, 'beforeunload', () => {
|
||||
localStg.set('mixSiderFixed', mixSiderFixed.value ? 'Y' : 'N');
|
||||
});
|
||||
|
||||
/** On scope dispose */
|
||||
onScopeDispose(() => {
|
||||
scope.stop();
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { computed, reactive, ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { defineStore } from 'pinia';
|
||||
import { useLoading } from '@sa/hooks';
|
||||
import { SetupStoreId } from '@/enum';
|
||||
@@ -10,8 +11,9 @@ import { useRouteStore } from '../route';
|
||||
import { clearAuthStorage, getToken, getUserInfo } from './shared';
|
||||
|
||||
export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
|
||||
const route = useRoute();
|
||||
const routeStore = useRouteStore();
|
||||
const { route, toLogin, redirectFromLogin } = useRouterPush(false);
|
||||
const { toLogin, redirectFromLogin } = useRouterPush(false);
|
||||
const { loading: loginLoading, startLoading, endLoading } = useLoading();
|
||||
|
||||
const token = ref(getToken());
|
||||
@@ -36,7 +38,7 @@ export const useAuthStore = defineStore(SetupStoreId.Auth, () => {
|
||||
|
||||
authStore.$reset();
|
||||
|
||||
if (!route.value.meta.constant) {
|
||||
if (!route.meta.constant) {
|
||||
await toLogin();
|
||||
}
|
||||
|
||||
|
||||
@@ -52,11 +52,24 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
||||
routeHome.value = routeKey;
|
||||
}
|
||||
|
||||
/** constant routes */
|
||||
const constantRoutes = shallowRef<ElegantConstRoute[]>([]);
|
||||
|
||||
function addConstantRoutes(routes: ElegantConstRoute[]) {
|
||||
const constantRoutesMap = new Map<string, ElegantConstRoute>([]);
|
||||
|
||||
routes.forEach(route => {
|
||||
constantRoutesMap.set(route.name, route);
|
||||
});
|
||||
|
||||
constantRoutes.value = Array.from(constantRoutesMap.values());
|
||||
}
|
||||
|
||||
/** auth routes */
|
||||
const authRoutes = shallowRef<ElegantConstRoute[]>([]);
|
||||
|
||||
function addAuthRoutes(routes: ElegantConstRoute[]) {
|
||||
const authRoutesMap = new Map(authRoutes.value.map(route => [route.name, route]));
|
||||
const authRoutesMap = new Map<string, ElegantConstRoute>([]);
|
||||
|
||||
routes.forEach(route => {
|
||||
authRoutesMap.set(route.name, route);
|
||||
@@ -167,18 +180,18 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
||||
if (isInitConstantRoute.value) return;
|
||||
|
||||
if (authRouteMode.value === 'static') {
|
||||
const { constantRoutes } = createStaticRoutes();
|
||||
const staticRoute = createStaticRoutes();
|
||||
|
||||
addAuthRoutes(constantRoutes);
|
||||
addConstantRoutes(staticRoute.constantRoutes);
|
||||
} else {
|
||||
const { data, error } = await fetchGetConstantRoutes();
|
||||
|
||||
if (!error) {
|
||||
addAuthRoutes(data);
|
||||
addConstantRoutes(data);
|
||||
}
|
||||
}
|
||||
|
||||
handleAuthRoutes();
|
||||
handleConstantAndAuthRoutes();
|
||||
|
||||
setIsInitConstantRoute(true);
|
||||
}
|
||||
@@ -206,7 +219,7 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
||||
addAuthRoutes(filteredAuthRoutes);
|
||||
}
|
||||
|
||||
handleAuthRoutes();
|
||||
handleConstantAndAuthRoutes();
|
||||
|
||||
setIsInitAuthRoute(true);
|
||||
}
|
||||
@@ -220,7 +233,7 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
||||
|
||||
addAuthRoutes(routes);
|
||||
|
||||
handleAuthRoutes();
|
||||
handleConstantAndAuthRoutes();
|
||||
|
||||
setRouteHome(home);
|
||||
|
||||
@@ -230,9 +243,11 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
||||
}
|
||||
}
|
||||
|
||||
/** handle auth routes */
|
||||
function handleAuthRoutes() {
|
||||
const sortRoutes = sortRoutesByOrder(authRoutes.value);
|
||||
/** handle constant and auth routes */
|
||||
function handleConstantAndAuthRoutes() {
|
||||
const allRoutes = [...constantRoutes.value, ...authRoutes.value];
|
||||
|
||||
const sortRoutes = sortRoutesByOrder(allRoutes);
|
||||
|
||||
const vueRoutes = getAuthVueRoutes(sortRoutes);
|
||||
|
||||
@@ -317,15 +332,31 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
||||
}
|
||||
|
||||
/**
|
||||
* Get selected menu meta by key
|
||||
* Get route meta by key
|
||||
*
|
||||
* @param selectedKey Selected menu key
|
||||
* @param key Route key
|
||||
*/
|
||||
function getSelectedMenuMetaByKey(selectedKey: string) {
|
||||
// The routes in router.options.routes are static, you need to use router.getRoutes() to get all the routes.
|
||||
function getRouteMetaByKey(key: string) {
|
||||
const allRoutes = router.getRoutes();
|
||||
|
||||
return allRoutes.find(route => route.name === selectedKey)?.meta || null;
|
||||
return allRoutes.find(route => route.name === key)?.meta || null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get route query of meta by key
|
||||
*
|
||||
* @param key
|
||||
*/
|
||||
function getRouteQueryOfMetaByKey(key: string) {
|
||||
const meta = getRouteMetaByKey(key);
|
||||
|
||||
const query: Record<string, string> = {};
|
||||
|
||||
meta?.query?.forEach(item => {
|
||||
query[item.key] = item.value;
|
||||
});
|
||||
|
||||
return query;
|
||||
}
|
||||
|
||||
return {
|
||||
@@ -345,6 +376,6 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
|
||||
setIsInitAuthRoute,
|
||||
getIsAuthRouteExist,
|
||||
getSelectedMenuKeyPath,
|
||||
getSelectedMenuMetaByKey
|
||||
getRouteQueryOfMetaByKey
|
||||
};
|
||||
});
|
||||
|
||||
@@ -16,17 +16,24 @@ export function getAllTabs(tabs: App.Global.Tab[], homeTab?: App.Global.Tab) {
|
||||
|
||||
const filterHomeTabs = tabs.filter(tab => tab.id !== homeTab.id);
|
||||
|
||||
const fixedTabs = filterHomeTabs
|
||||
.filter(tab => tab.fixedIndex !== undefined)
|
||||
.sort((a, b) => a.fixedIndex! - b.fixedIndex!);
|
||||
const fixedTabs = filterHomeTabs.filter(isFixedTab).sort((a, b) => a.fixedIndex! - b.fixedIndex!);
|
||||
|
||||
const remainTabs = filterHomeTabs.filter(tab => tab.fixedIndex === undefined);
|
||||
const remainTabs = filterHomeTabs.filter(tab => !isFixedTab(tab));
|
||||
|
||||
const allTabs = [homeTab, ...fixedTabs, ...remainTabs];
|
||||
|
||||
return updateTabsLabel(allTabs);
|
||||
}
|
||||
|
||||
/**
|
||||
* Is fixed tab
|
||||
*
|
||||
* @param tab
|
||||
*/
|
||||
function isFixedTab(tab: App.Global.Tab) {
|
||||
return tab.fixedIndex !== undefined && tab.fixedIndex !== null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get tab id by route
|
||||
*
|
||||
@@ -177,7 +184,7 @@ export function extractTabsByAllRoutes(router: Router, tabs: App.Global.Tab[]) {
|
||||
* @param tabs
|
||||
*/
|
||||
export function getFixedTabs(tabs: App.Global.Tab[]) {
|
||||
return tabs.filter(tab => tab.fixedIndex !== undefined);
|
||||
return tabs.filter(isFixedTab);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -2,9 +2,17 @@ import { computed, effectScope, onScopeDispose, ref, toRefs, watch } from 'vue';
|
||||
import type { Ref } from 'vue';
|
||||
import { defineStore } from 'pinia';
|
||||
import { useEventListener, usePreferredColorScheme } from '@vueuse/core';
|
||||
import { getPaletteColorByNumber } from '@sa/color';
|
||||
import { SetupStoreId } from '@/enum';
|
||||
import { localStg } from '@/utils/storage';
|
||||
import { addThemeVarsToHtml, createThemeToken, getNaiveTheme, initThemeSettings, toggleCssDarkMode } from './shared';
|
||||
import {
|
||||
addThemeVarsToHtml,
|
||||
createThemeToken,
|
||||
getNaiveTheme,
|
||||
initThemeSettings,
|
||||
toggleCssDarkMode,
|
||||
toggleGrayscaleMode
|
||||
} from './shared';
|
||||
|
||||
/** Theme store */
|
||||
export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
||||
@@ -22,6 +30,9 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
||||
return settings.value.themeScheme === 'dark';
|
||||
});
|
||||
|
||||
/** grayscale mode */
|
||||
const grayscaleMode = computed(() => settings.value.grayscale);
|
||||
|
||||
/** Theme colors */
|
||||
const themeColors = computed(() => {
|
||||
const { themeColor, otherColor, isInfoFollowPrimary } = settings.value;
|
||||
@@ -34,7 +45,7 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
||||
});
|
||||
|
||||
/** Naive theme */
|
||||
const naiveTheme = computed(() => getNaiveTheme(themeColors.value));
|
||||
const naiveTheme = computed(() => getNaiveTheme(themeColors.value, settings.value.recommendColor));
|
||||
|
||||
/**
|
||||
* Settings json
|
||||
@@ -59,6 +70,15 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
||||
settings.value.themeScheme = themeScheme;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set grayscale value
|
||||
*
|
||||
* @param isGrayscale
|
||||
*/
|
||||
function setGrayscale(isGrayscale: boolean) {
|
||||
settings.value.grayscale = isGrayscale;
|
||||
}
|
||||
|
||||
/** Toggle theme scheme */
|
||||
function toggleThemeScheme() {
|
||||
const themeSchemes: UnionKey.ThemeScheme[] = ['light', 'dark', 'auto'];
|
||||
@@ -79,10 +99,18 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
||||
* @param color Theme color
|
||||
*/
|
||||
function updateThemeColors(key: App.Theme.ThemeColorKey, color: string) {
|
||||
let colorValue = color;
|
||||
|
||||
if (settings.value.recommendColor) {
|
||||
// get a color palette by provided color and color name, and use the suitable color
|
||||
|
||||
colorValue = getPaletteColorByNumber(color, 500, true);
|
||||
}
|
||||
|
||||
if (key === 'primary') {
|
||||
settings.value.themeColor = color;
|
||||
settings.value.themeColor = colorValue;
|
||||
} else {
|
||||
settings.value.otherColor[key] = color;
|
||||
settings.value.otherColor[key] = colorValue;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -97,7 +125,7 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
||||
|
||||
/** Setup theme vars to html */
|
||||
function setupThemeVarsToHtml() {
|
||||
const { themeTokens, darkThemeTokens } = createThemeToken(themeColors.value);
|
||||
const { themeTokens, darkThemeTokens } = createThemeToken(themeColors.value, settings.value.recommendColor);
|
||||
addThemeVarsToHtml(themeTokens, darkThemeTokens);
|
||||
}
|
||||
|
||||
@@ -126,12 +154,19 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
watch(
|
||||
grayscaleMode,
|
||||
val => {
|
||||
toggleGrayscaleMode(val);
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
|
||||
// themeColors change, update css vars and storage theme color
|
||||
watch(
|
||||
themeColors,
|
||||
val => {
|
||||
setupThemeVarsToHtml();
|
||||
|
||||
localStg.set('themeColor', val.primary);
|
||||
},
|
||||
{ immediate: true }
|
||||
@@ -149,6 +184,7 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
||||
themeColors,
|
||||
naiveTheme,
|
||||
settingsJson,
|
||||
setGrayscale,
|
||||
resetStore,
|
||||
setThemeScheme,
|
||||
toggleThemeScheme,
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import type { GlobalThemeOverrides } from 'naive-ui';
|
||||
import { getColorByColorPaletteNumber, getColorPalette } from '@sa/color-palette';
|
||||
import { addColorAlpha, getRgbOfColor } from '@sa/utils';
|
||||
import { addColorAlpha, getColorPalette, getPaletteColorByNumber, getRgb } from '@sa/color';
|
||||
import { overrideThemeSettings, themeSettings } from '@/theme/settings';
|
||||
import { themeVars } from '@/theme/vars';
|
||||
import { toggleHtmlClass } from '@/utils/common';
|
||||
import { localStg } from '@/utils/storage';
|
||||
|
||||
const DARK_CLASS = 'dark';
|
||||
@@ -33,9 +33,10 @@ export function initThemeSettings() {
|
||||
* Create theme token
|
||||
*
|
||||
* @param colors Theme colors
|
||||
* @param [recommended=false] Use recommended color. Default is `false`
|
||||
*/
|
||||
export function createThemeToken(colors: App.Theme.ThemeColor) {
|
||||
const paletteColors = createThemePaletteColors(colors);
|
||||
export function createThemeToken(colors: App.Theme.ThemeColor, recommended = false) {
|
||||
const paletteColors = createThemePaletteColors(colors, recommended);
|
||||
|
||||
const themeTokens: App.Theme.ThemeToken = {
|
||||
colors: {
|
||||
@@ -75,18 +76,19 @@ export function createThemeToken(colors: App.Theme.ThemeColor) {
|
||||
* Create theme palette colors
|
||||
*
|
||||
* @param colors Theme colors
|
||||
* @param [recommended=false] Use recommended color. Default is `false`
|
||||
*/
|
||||
function createThemePaletteColors(colors: App.Theme.ThemeColor) {
|
||||
function createThemePaletteColors(colors: App.Theme.ThemeColor, recommended = false) {
|
||||
const colorKeys = Object.keys(colors) as App.Theme.ThemeColorKey[];
|
||||
const colorPaletteVar = {} as App.Theme.ThemePaletteColor;
|
||||
|
||||
colorKeys.forEach(key => {
|
||||
const { palettes, main } = getColorPalette(colors[key], key);
|
||||
const colorMap = getColorPalette(colors[key], recommended);
|
||||
|
||||
colorPaletteVar[key] = main.hexcode;
|
||||
colorPaletteVar[key] = colorMap.get(500)!;
|
||||
|
||||
palettes.forEach(item => {
|
||||
colorPaletteVar[`${key}-${item.number}`] = item.hexcode;
|
||||
colorMap.forEach((hex, number) => {
|
||||
colorPaletteVar[`${key}-${number}`] = hex;
|
||||
});
|
||||
});
|
||||
|
||||
@@ -116,7 +118,7 @@ function getCssVarByTokens(tokens: App.Theme.BaseToken) {
|
||||
|
||||
if (key === 'colors') {
|
||||
cssVarsKey = removeRgbPrefix(cssVarsKey);
|
||||
const { r, g, b } = getRgbOfColor(cssValue);
|
||||
const { r, g, b } = getRgb(cssValue);
|
||||
cssValue = `${r} ${g} ${b}`;
|
||||
}
|
||||
|
||||
@@ -167,18 +169,29 @@ export function addThemeVarsToHtml(tokens: App.Theme.BaseToken, darkTokens: App.
|
||||
* @param darkMode Is dark mode
|
||||
*/
|
||||
export function toggleCssDarkMode(darkMode = false) {
|
||||
function addDarkClass() {
|
||||
document.documentElement.classList.add(DARK_CLASS);
|
||||
}
|
||||
|
||||
function removeDarkClass() {
|
||||
document.documentElement.classList.remove(DARK_CLASS);
|
||||
}
|
||||
const { add, remove } = toggleHtmlClass(DARK_CLASS);
|
||||
|
||||
if (darkMode) {
|
||||
addDarkClass();
|
||||
add();
|
||||
} else {
|
||||
removeDarkClass();
|
||||
remove();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Toggle grayscale mode
|
||||
*
|
||||
* @param grayscaleMode Is grayscale mode
|
||||
*/
|
||||
export function toggleGrayscaleMode(grayscaleMode = false) {
|
||||
const GRAYSCALE_CLASS = 'grayscale';
|
||||
|
||||
const { add, remove } = toggleHtmlClass(GRAYSCALE_CLASS);
|
||||
|
||||
if (grayscaleMode) {
|
||||
add();
|
||||
} else {
|
||||
remove();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -194,13 +207,14 @@ interface NaiveColorAction {
|
||||
* Get naive theme colors
|
||||
*
|
||||
* @param colors Theme colors
|
||||
* @param [recommended=false] Use recommended color. Default is `false`
|
||||
*/
|
||||
function getNaiveThemeColors(colors: App.Theme.ThemeColor) {
|
||||
function getNaiveThemeColors(colors: App.Theme.ThemeColor, recommended = false) {
|
||||
const colorActions: NaiveColorAction[] = [
|
||||
{ scene: '', handler: color => color },
|
||||
{ scene: 'Suppl', handler: color => color },
|
||||
{ scene: 'Hover', handler: color => getColorByColorPaletteNumber(color, 500) },
|
||||
{ scene: 'Pressed', handler: color => getColorByColorPaletteNumber(color, 700) },
|
||||
{ scene: 'Hover', handler: color => getPaletteColorByNumber(color, 500, recommended) },
|
||||
{ scene: 'Pressed', handler: color => getPaletteColorByNumber(color, 700, recommended) },
|
||||
{ scene: 'Active', handler: color => addColorAlpha(color, 0.1) }
|
||||
];
|
||||
|
||||
@@ -223,13 +237,14 @@ function getNaiveThemeColors(colors: App.Theme.ThemeColor) {
|
||||
* Get naive theme
|
||||
*
|
||||
* @param colors Theme colors
|
||||
* @param [recommended=false] Use recommended color. Default is `false`
|
||||
*/
|
||||
export function getNaiveTheme(colors: App.Theme.ThemeColor) {
|
||||
export function getNaiveTheme(colors: App.Theme.ThemeColor, recommended = false) {
|
||||
const { primary: colorLoading } = colors;
|
||||
|
||||
const theme: GlobalThemeOverrides = {
|
||||
common: {
|
||||
...getNaiveThemeColors(colors),
|
||||
...getNaiveThemeColors(colors, recommended),
|
||||
borderRadius: '6px'
|
||||
},
|
||||
LoadingBar: {
|
||||
|
||||
@@ -11,3 +11,7 @@ body,
|
||||
html {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
html.grayscale {
|
||||
filter: grayscale(100%);
|
||||
}
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
/** Default theme settings */
|
||||
export const themeSettings: App.Theme.ThemeSetting = {
|
||||
themeScheme: 'light',
|
||||
grayscale: false,
|
||||
recommendColor: false,
|
||||
themeColor: '#646cff',
|
||||
otherColor: {
|
||||
info: '#2080f0',
|
||||
|
||||
50
src/typings/api.d.ts
vendored
50
src/typings/api.d.ts
vendored
@@ -171,6 +171,20 @@ declare namespace Api {
|
||||
*/
|
||||
type IconType = '1' | '2';
|
||||
|
||||
type MenuPropsOfRoute = Pick<
|
||||
import('vue-router').RouteMeta,
|
||||
| 'i18nKey'
|
||||
| 'keepAlive'
|
||||
| 'constant'
|
||||
| 'order'
|
||||
| 'href'
|
||||
| 'hideInMenu'
|
||||
| 'activeMenu'
|
||||
| 'multiTab'
|
||||
| 'fixedIndexInTab'
|
||||
| 'query'
|
||||
>;
|
||||
|
||||
type Menu = Common.CommonRecord<{
|
||||
/** parent menu id */
|
||||
parentId: number;
|
||||
@@ -184,42 +198,16 @@ declare namespace Api {
|
||||
routePath: string;
|
||||
/** component */
|
||||
component?: string;
|
||||
/**
|
||||
* i18n key
|
||||
*
|
||||
* it is for internationalization
|
||||
*/
|
||||
i18nKey?: App.I18n.I18nKey;
|
||||
/** iconify icon name or local icon name */
|
||||
icon: string;
|
||||
/** icon type */
|
||||
iconType: IconType;
|
||||
/** menu order */
|
||||
order: number;
|
||||
/** whether to cache the route */
|
||||
keepAlive?: boolean;
|
||||
/** outer link */
|
||||
href?: string;
|
||||
/** whether to hide the route in the menu */
|
||||
hideInMenu?: boolean;
|
||||
/**
|
||||
* The menu key will be activated when entering the route
|
||||
*
|
||||
* The route is not in the menu
|
||||
*
|
||||
* @example
|
||||
* the route is "user_detail", if it is set to "user_list", the menu "user_list" will be activated
|
||||
*/
|
||||
activeMenu?: import('@elegant-router/types').LastLevelRouteKey;
|
||||
/** By default, the same route path will use one tab, if set to true, it will use multiple tabs */
|
||||
multiTab?: boolean;
|
||||
/** If set, the route will be fixed in tabs, and the value is the order of fixed tabs */
|
||||
fixedIndexInTab?: number;
|
||||
/** menu buttons */
|
||||
buttons?: MenuButton[];
|
||||
/** buttons */
|
||||
buttons?: MenuButton[] | null;
|
||||
/** children menu */
|
||||
children?: Menu[];
|
||||
}>;
|
||||
children?: Menu[] | null;
|
||||
}> &
|
||||
MenuPropsOfRoute;
|
||||
|
||||
/** menu list */
|
||||
type MenuList = Common.PaginatingQueryRecord<Menu>;
|
||||
|
||||
32
src/typings/app.d.ts
vendored
32
src/typings/app.d.ts
vendored
@@ -2,7 +2,7 @@
|
||||
declare namespace App {
|
||||
/** Theme namespace */
|
||||
namespace Theme {
|
||||
type ColorPaletteNumber = import('@sa/color-palette').ColorPaletteNumber;
|
||||
type ColorPaletteNumber = import('@sa/color').ColorPaletteNumber;
|
||||
|
||||
/** Theme token */
|
||||
type ThemeToken = {
|
||||
@@ -18,6 +18,10 @@ declare namespace App {
|
||||
interface ThemeSetting {
|
||||
/** Theme scheme */
|
||||
themeScheme: UnionKey.ThemeScheme;
|
||||
/** grayscale mode */
|
||||
grayscale: boolean;
|
||||
/** Whether to recommend color */
|
||||
recommendColor: boolean;
|
||||
/** Theme color */
|
||||
themeColor: string;
|
||||
/** Other color */
|
||||
@@ -154,7 +158,7 @@ declare namespace App {
|
||||
/** The menu label */
|
||||
label: string;
|
||||
/** The menu i18n key */
|
||||
i18nKey?: I18n.I18nKey;
|
||||
i18nKey?: I18n.I18nKey | null;
|
||||
/** The route key */
|
||||
routeKey: RouteKey;
|
||||
/** The route path */
|
||||
@@ -198,7 +202,7 @@ declare namespace App {
|
||||
/** The tab route full path */
|
||||
fullPath: string;
|
||||
/** The tab fixed index */
|
||||
fixedIndex?: number;
|
||||
fixedIndex?: number | null;
|
||||
/**
|
||||
* Tab icon
|
||||
*
|
||||
@@ -212,7 +216,7 @@ declare namespace App {
|
||||
*/
|
||||
localIcon?: string;
|
||||
/** I18n key */
|
||||
i18nKey?: I18n.I18nKey;
|
||||
i18nKey?: I18n.I18nKey | null;
|
||||
};
|
||||
|
||||
/** Form rule */
|
||||
@@ -257,6 +261,7 @@ declare namespace App {
|
||||
cancel: string;
|
||||
close: string;
|
||||
check: string;
|
||||
expandColumn: string;
|
||||
columnSetting: string;
|
||||
config: string;
|
||||
confirm: string;
|
||||
@@ -298,7 +303,10 @@ declare namespace App {
|
||||
};
|
||||
theme: {
|
||||
themeSchema: { title: string } & Record<UnionKey.ThemeScheme, string>;
|
||||
grayscale: string;
|
||||
layoutMode: { title: string } & Record<UnionKey.ThemeLayoutMode, string>;
|
||||
recommendColor: string;
|
||||
recommendColorDesc: string;
|
||||
themeColor: {
|
||||
title: string;
|
||||
followPrimary: string;
|
||||
@@ -465,6 +473,12 @@ declare namespace App {
|
||||
adminVisible: string;
|
||||
adminOrUserVisible: string;
|
||||
};
|
||||
request: {
|
||||
repeatedErrorOccurOnce: string;
|
||||
repeatedError: string;
|
||||
repeatedErrorMsg1: string;
|
||||
repeatedErrorMsg2: string;
|
||||
};
|
||||
};
|
||||
manage: {
|
||||
common: {
|
||||
@@ -524,7 +538,7 @@ declare namespace App {
|
||||
menuName: string;
|
||||
routeName: string;
|
||||
routePath: string;
|
||||
routeParams: string;
|
||||
pathParam: string;
|
||||
layout: string;
|
||||
page: string;
|
||||
i18nKey: string;
|
||||
@@ -532,12 +546,14 @@ declare namespace App {
|
||||
localIcon: string;
|
||||
iconTypeTitle: string;
|
||||
order: string;
|
||||
constant: string;
|
||||
keepAlive: string;
|
||||
href: string;
|
||||
hideInMenu: string;
|
||||
activeMenu: string;
|
||||
multiTab: string;
|
||||
fixedIndexInTab: string;
|
||||
query: string;
|
||||
button: string;
|
||||
buttonCode: string;
|
||||
buttonDesc: string;
|
||||
@@ -548,6 +564,7 @@ declare namespace App {
|
||||
menuName: string;
|
||||
routeName: string;
|
||||
routePath: string;
|
||||
pathParam: string;
|
||||
layout: string;
|
||||
page: string;
|
||||
i18nKey: string;
|
||||
@@ -561,6 +578,8 @@ declare namespace App {
|
||||
multiTab: string;
|
||||
fixedInTab: string;
|
||||
fixedIndexInTab: string;
|
||||
queryKey: string;
|
||||
queryValue: string;
|
||||
button: string;
|
||||
buttonCode: string;
|
||||
buttonDesc: string;
|
||||
@@ -602,6 +621,9 @@ declare namespace App {
|
||||
pin: string;
|
||||
unpin: string;
|
||||
};
|
||||
datatable: {
|
||||
itemCount: string;
|
||||
};
|
||||
};
|
||||
|
||||
type GetI18nKey<T extends Record<string, unknown>, K extends keyof T = keyof T> = K extends string
|
||||
|
||||
5
src/typings/components.d.ts
vendored
5
src/typings/components.d.ts
vendored
@@ -1,10 +1,10 @@
|
||||
/* eslint-disable */
|
||||
/* prettier-ignore */
|
||||
// @ts-nocheck
|
||||
// Generated by unplugin-vue-components
|
||||
// Read more: https://github.com/vuejs/core/pull/3399
|
||||
export {}
|
||||
|
||||
/* prettier-ignore */
|
||||
declare module 'vue' {
|
||||
export interface GlobalComponents {
|
||||
AppProvider: typeof import('./../components/common/app-provider.vue')['default']
|
||||
@@ -19,9 +19,11 @@ declare module 'vue' {
|
||||
IconAntDesignSettingOutlined: typeof import('~icons/ant-design/setting-outlined')['default']
|
||||
IconGridiconsFullscreen: typeof import('~icons/gridicons/fullscreen')['default']
|
||||
IconGridiconsFullscreenExit: typeof import('~icons/gridicons/fullscreen-exit')['default']
|
||||
'IconIc:roundPlus': typeof import('~icons/ic/round-plus')['default']
|
||||
IconIcRoundDelete: typeof import('~icons/ic/round-delete')['default']
|
||||
IconIcRoundPlus: typeof import('~icons/ic/round-plus')['default']
|
||||
IconIcRoundRefresh: typeof import('~icons/ic/round-refresh')['default']
|
||||
IconIcRoundRemove: typeof import('~icons/ic/round-remove')['default']
|
||||
IconIcRoundSearch: typeof import('~icons/ic/round-search')['default']
|
||||
IconLocalBanner: typeof import('~icons/local/banner')['default']
|
||||
IconLocalLogo: typeof import('~icons/local/logo')['default']
|
||||
@@ -49,6 +51,7 @@ declare module 'vue' {
|
||||
NDrawer: typeof import('naive-ui')['NDrawer']
|
||||
NDrawerContent: typeof import('naive-ui')['NDrawerContent']
|
||||
NDropdown: typeof import('naive-ui')['NDropdown']
|
||||
NDynamicInput: typeof import('naive-ui')['NDynamicInput']
|
||||
NEmpty: typeof import('naive-ui')['NEmpty']
|
||||
NForm: typeof import('naive-ui')['NForm']
|
||||
NFormItem: typeof import('naive-ui')['NFormItem']
|
||||
|
||||
27
src/typings/elegant-router.d.ts
vendored
27
src/typings/elegant-router.d.ts
vendored
@@ -21,6 +21,14 @@ declare module "@elegant-router/types" {
|
||||
"exception_403": "/exception/403";
|
||||
"exception_404": "/exception/404";
|
||||
"exception_500": "/exception/500";
|
||||
"document": "/document";
|
||||
"document_project": "/document/project";
|
||||
"document_project-link": "/document/project-link";
|
||||
"document_vue": "/document/vue";
|
||||
"document_vite": "/document/vite";
|
||||
"document_unocss": "/document/unocss";
|
||||
"document_naive": "/document/naive";
|
||||
"document_antd": "/document/antd";
|
||||
"403": "/403";
|
||||
"404": "/404";
|
||||
"500": "/500";
|
||||
@@ -36,6 +44,7 @@ declare module "@elegant-router/types" {
|
||||
"function_tab": "/function/tab";
|
||||
"function_toggle-auth": "/function/toggle-auth";
|
||||
"home": "/home";
|
||||
"iframe-page": "/iframe-page/:url";
|
||||
"login": "/login/:module(pwd-login|code-login|register|reset-pwd|bind-wechat)?";
|
||||
"manage": "/manage";
|
||||
"manage_menu": "/manage/menu";
|
||||
@@ -72,6 +81,14 @@ declare module "@elegant-router/types" {
|
||||
| "exception_403"
|
||||
| "exception_404"
|
||||
| "exception_500"
|
||||
| "document"
|
||||
| "document_project"
|
||||
| "document_project-link"
|
||||
| "document_vue"
|
||||
| "document_vite"
|
||||
| "document_unocss"
|
||||
| "document_naive"
|
||||
| "document_antd"
|
||||
>;
|
||||
|
||||
/**
|
||||
@@ -90,6 +107,7 @@ declare module "@elegant-router/types" {
|
||||
| "about"
|
||||
| "function"
|
||||
| "home"
|
||||
| "iframe-page"
|
||||
| "login"
|
||||
| "manage"
|
||||
| "multi-menu"
|
||||
@@ -104,6 +122,7 @@ declare module "@elegant-router/types" {
|
||||
| "root"
|
||||
| "not-found"
|
||||
| "exception"
|
||||
| "document"
|
||||
>;
|
||||
|
||||
/**
|
||||
@@ -114,6 +133,7 @@ declare module "@elegant-router/types" {
|
||||
| "403"
|
||||
| "404"
|
||||
| "500"
|
||||
| "iframe-page"
|
||||
| "login"
|
||||
| "about"
|
||||
| "function_hide-child_one"
|
||||
@@ -144,6 +164,13 @@ declare module "@elegant-router/types" {
|
||||
| "exception_403"
|
||||
| "exception_404"
|
||||
| "exception_500"
|
||||
| "document_project"
|
||||
| "document_project-link"
|
||||
| "document_vue"
|
||||
| "document_vite"
|
||||
| "document_unocss"
|
||||
| "document_naive"
|
||||
| "document_antd"
|
||||
>;
|
||||
|
||||
/**
|
||||
|
||||
2
src/typings/env.d.ts
vendored
2
src/typings/env.d.ts
vendored
@@ -101,5 +101,7 @@ declare namespace Env {
|
||||
* @link https://docs.iconify.design/api/providers.html
|
||||
*/
|
||||
readonly VITE_ICONIFY_URL?: string;
|
||||
/** Used to differentiate storage across different domains */
|
||||
readonly VITE_STORAGE_PREFIX?: string;
|
||||
}
|
||||
}
|
||||
|
||||
4
src/typings/naive-ui.d.ts
vendored
4
src/typings/naive-ui.d.ts
vendored
@@ -41,7 +41,7 @@ declare namespace NaiveUI {
|
||||
type GetTableData<A extends TableApiFn> = A extends TableApiFn<infer T> ? T : never;
|
||||
|
||||
type NaiveTableConfig<A extends TableApiFn> = Pick<
|
||||
import('@sa/hooks').TableConfig<A, GetTableData<A>, TableColumn<NaiveUI.TableDataWithIndex<GetTableData<A>>>>,
|
||||
'apiFn' | 'apiParams' | 'columns' | 'immediate'
|
||||
import('@sa/hooks').TableConfig<A, GetTableData<A>, TableColumn<TableDataWithIndex<GetTableData<A>>>>,
|
||||
'apiFn' | 'apiParams' | 'columns' | 'immediate' | 'showTotal'
|
||||
>;
|
||||
}
|
||||
|
||||
22
src/typings/router.d.ts
vendored
22
src/typings/router.d.ts
vendored
@@ -13,21 +13,23 @@ declare module 'vue-router' {
|
||||
*
|
||||
* It's used in i18n, if it is set, the title will be ignored
|
||||
*/
|
||||
i18nKey?: App.I18n.I18nKey;
|
||||
i18nKey?: App.I18n.I18nKey | null;
|
||||
/**
|
||||
* Roles of the route
|
||||
*
|
||||
* Route can be accessed if the current user has at least one of the roles
|
||||
*
|
||||
* It only works when the route mode is "static", if the route mode is "dynamic", it will be ignored
|
||||
*/
|
||||
roles?: string[];
|
||||
/** Whether to cache the route */
|
||||
keepAlive?: boolean;
|
||||
keepAlive?: boolean | null;
|
||||
/**
|
||||
* Is constant route
|
||||
*
|
||||
* Does not need to login, and the route is defined in the front-end
|
||||
*/
|
||||
constant?: boolean;
|
||||
constant?: boolean | null;
|
||||
/**
|
||||
* Iconify icon
|
||||
*
|
||||
@@ -41,11 +43,11 @@ declare module 'vue-router' {
|
||||
*/
|
||||
localIcon?: string;
|
||||
/** Router order */
|
||||
order?: number;
|
||||
order?: number | null;
|
||||
/** The outer link of the route */
|
||||
href?: string;
|
||||
href?: string | null;
|
||||
/** Whether to hide the route in the menu */
|
||||
hideInMenu?: boolean;
|
||||
hideInMenu?: boolean | null;
|
||||
/**
|
||||
* The menu key will be activated when entering the route
|
||||
*
|
||||
@@ -54,12 +56,12 @@ declare module 'vue-router' {
|
||||
* @example
|
||||
* the route is "user_detail", if it is set to "user_list", the menu "user_list" will be activated
|
||||
*/
|
||||
activeMenu?: import('@elegant-router/types').RouteKey;
|
||||
activeMenu?: import('@elegant-router/types').RouteKey | null;
|
||||
/** By default, the same route path will use one tab, if set to true, it will use multiple tabs */
|
||||
multiTab?: boolean;
|
||||
multiTab?: boolean | null;
|
||||
/** If set, the route will be fixed in tabs, and the value is the order of fixed tabs */
|
||||
fixedIndexInTab?: number;
|
||||
fixedIndexInTab?: number | null;
|
||||
/** if set query parameters, it will be automatically carried when entering the route */
|
||||
query?: Record<string, string>;
|
||||
query?: { key: string; value: string }[] | null;
|
||||
}
|
||||
}
|
||||
|
||||
7
src/typings/storage.d.ts
vendored
7
src/typings/storage.d.ts
vendored
@@ -14,6 +14,8 @@ declare namespace StorageType {
|
||||
lang: App.I18n.LangType;
|
||||
/** The token */
|
||||
token: string;
|
||||
/** Fixed sider with mix-menu */
|
||||
mixSiderFixed: CommonType.YesOrNo;
|
||||
/** The refresh token */
|
||||
refreshToken: string;
|
||||
/** The user info */
|
||||
@@ -30,5 +32,10 @@ declare namespace StorageType {
|
||||
overrideThemeFlag: string;
|
||||
/** The global tabs */
|
||||
globalTabs: App.Global.Tab[];
|
||||
/** The backup theme setting before is mobile */
|
||||
backupThemeSettingBeforeIsMobile: {
|
||||
layout: UnionKey.ThemeLayoutMode;
|
||||
siderCollapse: boolean;
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
4
src/typings/union-key.d.ts
vendored
4
src/typings/union-key.d.ts
vendored
@@ -27,8 +27,8 @@ declare namespace UnionKey {
|
||||
/**
|
||||
* The scroll mode when content overflow
|
||||
*
|
||||
* - Wrapper the wrapper component's root element overflow
|
||||
* - Content the content component overflow
|
||||
* - wrapper: the wrapper component's root element overflow
|
||||
* - content: the content component overflow
|
||||
*/
|
||||
type ThemeScrollMode = import('@sa/materials').LayoutScrollMode;
|
||||
|
||||
|
||||
@@ -36,3 +36,23 @@ export function translateOptions(options: CommonType.Option<string>[]) {
|
||||
label: $t(option.label as App.I18n.I18nKey)
|
||||
}));
|
||||
}
|
||||
|
||||
/**
|
||||
* Toggle html class
|
||||
*
|
||||
* @param className
|
||||
*/
|
||||
export function toggleHtmlClass(className: string) {
|
||||
function add() {
|
||||
document.documentElement.classList.add(className);
|
||||
}
|
||||
|
||||
function remove() {
|
||||
document.documentElement.classList.remove(className);
|
||||
}
|
||||
|
||||
return {
|
||||
add,
|
||||
remove
|
||||
};
|
||||
}
|
||||
|
||||
@@ -1,7 +1,9 @@
|
||||
import { createLocalforage, createStorage } from '@sa/utils';
|
||||
|
||||
export const localStg = createStorage<StorageType.Local>('local');
|
||||
const storagePrefix = import.meta.env.VITE_STORAGE_PREFIX || '';
|
||||
|
||||
export const sessionStg = createStorage<StorageType.Session>('session');
|
||||
export const localStg = createStorage<StorageType.Local>('local', storagePrefix);
|
||||
|
||||
export const sessionStg = createStorage<StorageType.Session>('session', storagePrefix);
|
||||
|
||||
export const localforage = createLocalforage<StorageType.Local>('local');
|
||||
|
||||
25
src/views/_builtin/iframe-page/[url].vue
Normal file
25
src/views/_builtin/iframe-page/[url].vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<script setup lang="ts">
|
||||
import { onActivated, onMounted } from 'vue';
|
||||
|
||||
interface Props {
|
||||
url: string;
|
||||
}
|
||||
|
||||
defineProps<Props>();
|
||||
|
||||
onMounted(() => {
|
||||
console.log('mounted');
|
||||
});
|
||||
|
||||
onActivated(() => {
|
||||
console.log('activated');
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="h-full">
|
||||
<iframe id="iframePage" class="size-full" :src="url"></iframe>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
@@ -1,7 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { computed } from 'vue';
|
||||
import type { Component } from 'vue';
|
||||
import { getColorPalette, mixColor } from '@sa/utils';
|
||||
import { getPaletteColorByNumber, mixColor } from '@sa/color';
|
||||
import { $t } from '@/locales';
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { useThemeStore } from '@/store/modules/theme';
|
||||
@@ -38,7 +38,7 @@ const moduleMap: Record<UnionKey.LoginModule, LoginModule> = {
|
||||
const activeModule = computed(() => moduleMap[props.module || 'pwd-login']);
|
||||
|
||||
const bgThemeColor = computed(() =>
|
||||
themeStore.darkMode ? getColorPalette(themeStore.themeColor, 7) : themeStore.themeColor
|
||||
themeStore.darkMode ? getPaletteColorByNumber(themeStore.themeColor, 600) : themeStore.themeColor
|
||||
);
|
||||
|
||||
const bgColor = computed(() => {
|
||||
|
||||
@@ -13,6 +13,25 @@ async function logoutWithModal() {
|
||||
async function refreshToken() {
|
||||
await fetchCustomBackendError('9999', $t('request.tokenExpired'));
|
||||
}
|
||||
|
||||
async function handleRepeatedMessageError() {
|
||||
await Promise.all([
|
||||
fetchCustomBackendError('2222', $t('page.function.request.repeatedErrorMsg1')),
|
||||
fetchCustomBackendError('2222', $t('page.function.request.repeatedErrorMsg1')),
|
||||
fetchCustomBackendError('2222', $t('page.function.request.repeatedErrorMsg1')),
|
||||
fetchCustomBackendError('3333', $t('page.function.request.repeatedErrorMsg2')),
|
||||
fetchCustomBackendError('3333', $t('page.function.request.repeatedErrorMsg2')),
|
||||
fetchCustomBackendError('3333', $t('page.function.request.repeatedErrorMsg2'))
|
||||
]);
|
||||
}
|
||||
|
||||
async function handleRepeatedModalError() {
|
||||
await Promise.all([
|
||||
fetchCustomBackendError('7777', $t('request.logoutWithModalMsg')),
|
||||
fetchCustomBackendError('7777', $t('request.logoutWithModalMsg')),
|
||||
fetchCustomBackendError('7777', $t('request.logoutWithModalMsg'))
|
||||
]);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -26,6 +45,18 @@ async function refreshToken() {
|
||||
<NCard :title="$t('request.refreshToken')" :bordered="false" size="small" segmented class="card-wrapper">
|
||||
<NButton @click="refreshToken">{{ $t('common.trigger') }}</NButton>
|
||||
</NCard>
|
||||
<NCard
|
||||
:title="$t('page.function.request.repeatedErrorOccurOnce')"
|
||||
:bordered="false"
|
||||
size="small"
|
||||
segmented
|
||||
class="card-wrapper"
|
||||
>
|
||||
<NButton @click="handleRepeatedMessageError">{{ $t('page.function.request.repeatedError') }}(Message)</NButton>
|
||||
<NButton class="ml-12px" @click="handleRepeatedModalError">
|
||||
{{ $t('page.function.request.repeatedError') }}(Modal)
|
||||
</NButton>
|
||||
</NCard>
|
||||
</NSpace>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -1,13 +1,17 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useLoading } from '@sa/hooks';
|
||||
import { $t } from '@/locales';
|
||||
import { useAppStore } from '@/store/modules/app';
|
||||
import { useAuthStore } from '@/store/modules/auth';
|
||||
import { useTabStore } from '@/store/modules/tab';
|
||||
import { useAuth } from '@/hooks/business/auth';
|
||||
|
||||
const route = useRoute();
|
||||
const appStore = useAppStore();
|
||||
const authStore = useAuthStore();
|
||||
const tabStore = useTabStore();
|
||||
const { hasAuth } = useAuth();
|
||||
const { loading, startLoading, endLoading } = useLoading();
|
||||
|
||||
@@ -48,6 +52,7 @@ async function handleToggleAccount(account: Account) {
|
||||
|
||||
startLoading();
|
||||
await authStore.login(account.userName, account.password, false);
|
||||
tabStore.initTabStore(route);
|
||||
endLoading();
|
||||
appStore.reloadPage();
|
||||
}
|
||||
|
||||
@@ -10,11 +10,11 @@ import { $t } from '@/locales';
|
||||
import { yesOrNoRecord } from '@/constants/common';
|
||||
import { enableStatusRecord, menuTypeRecord } from '@/constants/business';
|
||||
import SvgIcon from '@/components/custom/svg-icon.vue';
|
||||
import MenuOperateDrawer, { type OperateType } from './modules/menu-operate-drawer.vue';
|
||||
import MenuOperateModal, { type OperateType } from './modules/menu-operate-modal.vue';
|
||||
|
||||
const appStore = useAppStore();
|
||||
|
||||
const { bool: drawerVisible, setTrue: openDrawer, setFalse: _closeDrawer } = useBoolean();
|
||||
const { bool: visible, setTrue: openModal } = useBoolean();
|
||||
|
||||
const wrapperRef = ref<HTMLElement | null>(null);
|
||||
|
||||
@@ -176,7 +176,7 @@ const operateType = ref<OperateType>('add');
|
||||
|
||||
function handleAdd() {
|
||||
operateType.value = 'add';
|
||||
openDrawer();
|
||||
openModal();
|
||||
}
|
||||
|
||||
async function handleBatchDelete() {
|
||||
@@ -200,7 +200,7 @@ function handleEdit(item: Api.SystemManage.Menu) {
|
||||
operateType.value = 'edit';
|
||||
editingData.value = { ...item };
|
||||
|
||||
openDrawer();
|
||||
openModal();
|
||||
}
|
||||
|
||||
function handleAddChildMenu(item: Api.SystemManage.Menu) {
|
||||
@@ -208,7 +208,7 @@ function handleAddChildMenu(item: Api.SystemManage.Menu) {
|
||||
|
||||
editingData.value = { ...item };
|
||||
|
||||
openDrawer();
|
||||
openModal();
|
||||
}
|
||||
|
||||
const allPages = ref<string[]>([]);
|
||||
@@ -252,8 +252,8 @@ init();
|
||||
:pagination="pagination"
|
||||
class="sm:h-full"
|
||||
/>
|
||||
<MenuOperateDrawer
|
||||
v-model:visible="drawerVisible"
|
||||
<MenuOperateModal
|
||||
v-model:visible="visible"
|
||||
:operate-type="operateType"
|
||||
:row-data="editingData"
|
||||
:all-pages="allPages"
|
||||
|
||||
@@ -1,256 +0,0 @@
|
||||
<script setup lang="tsx">
|
||||
import { computed, reactive, watch } from 'vue';
|
||||
import type { SelectOption } from 'naive-ui';
|
||||
import { useFormRules, useNaiveForm } from '@/hooks/common/form';
|
||||
import { $t } from '@/locales';
|
||||
import { enableStatusOptions, menuIconTypeOptions, menuTypeOptions } from '@/constants/business';
|
||||
import SvgIcon from '@/components/custom/svg-icon.vue';
|
||||
import { getLocalIcons } from '@/utils/icon';
|
||||
import { getLayoutAndPage, transformLayoutAndPageToComponent } from './shared';
|
||||
|
||||
defineOptions({
|
||||
name: 'MenuOperateDrawer'
|
||||
});
|
||||
|
||||
export type OperateType = NaiveUI.TableOperateType | 'addChild';
|
||||
|
||||
interface Props {
|
||||
/** the type of operation */
|
||||
operateType: OperateType;
|
||||
/** the edit menu data or the parent menu data when adding a child menu */
|
||||
rowData?: Api.SystemManage.Menu | null;
|
||||
/** all pages */
|
||||
allPages: string[];
|
||||
}
|
||||
|
||||
const props = defineProps<Props>();
|
||||
|
||||
interface Emits {
|
||||
(e: 'submitted'): void;
|
||||
}
|
||||
|
||||
const emit = defineEmits<Emits>();
|
||||
|
||||
const visible = defineModel<boolean>('visible', {
|
||||
default: false
|
||||
});
|
||||
|
||||
const { formRef, validate, restoreValidation } = useNaiveForm();
|
||||
const { defaultRequiredRule } = useFormRules();
|
||||
|
||||
const title = computed(() => {
|
||||
const titles: Record<OperateType, string> = {
|
||||
add: $t('page.manage.menu.addMenu'),
|
||||
addChild: $t('page.manage.menu.addChildMenu'),
|
||||
edit: $t('page.manage.menu.editMenu')
|
||||
};
|
||||
return titles[props.operateType];
|
||||
});
|
||||
|
||||
type Model = Pick<
|
||||
Api.SystemManage.Menu,
|
||||
| 'menuType'
|
||||
| 'menuName'
|
||||
| 'icon'
|
||||
| 'iconType'
|
||||
| 'routeName'
|
||||
| 'routePath'
|
||||
| 'component'
|
||||
| 'status'
|
||||
| 'hideInMenu'
|
||||
| 'order'
|
||||
| 'parentId'
|
||||
> & {
|
||||
layout: string;
|
||||
page: string;
|
||||
};
|
||||
|
||||
const model: Model = reactive(createDefaultModel());
|
||||
|
||||
function createDefaultModel(): Model {
|
||||
return {
|
||||
menuType: '1',
|
||||
menuName: '',
|
||||
icon: '',
|
||||
iconType: '1',
|
||||
routeName: '',
|
||||
routePath: '',
|
||||
layout: '',
|
||||
page: '',
|
||||
status: null,
|
||||
hideInMenu: false,
|
||||
order: 0,
|
||||
parentId: 0
|
||||
};
|
||||
}
|
||||
|
||||
type RuleKey = Extract<keyof Model, 'userName' | 'userStatus'>;
|
||||
|
||||
const rules: Record<RuleKey, App.Global.FormRule> = {
|
||||
userName: defaultRequiredRule,
|
||||
userStatus: defaultRequiredRule
|
||||
};
|
||||
|
||||
const disabledMenuType = computed(() => props.operateType === 'edit');
|
||||
|
||||
const localIcons = getLocalIcons();
|
||||
const localIconOptions = localIcons.map<SelectOption>(item => ({
|
||||
label: () => (
|
||||
<div class="flex-y-center gap-16px">
|
||||
<SvgIcon localIcon={item} class="text-icon" />
|
||||
<span>{item}</span>
|
||||
</div>
|
||||
),
|
||||
value: item
|
||||
}));
|
||||
|
||||
const showLayout = computed(() => model.parentId === 0);
|
||||
|
||||
const showPage = computed(() => model.menuType === '2');
|
||||
|
||||
const pageOptions = computed(() => {
|
||||
const allPages = [...props.allPages];
|
||||
|
||||
if (model.routeName && !allPages.includes(model.routeName)) {
|
||||
allPages.unshift(model.routeName);
|
||||
}
|
||||
|
||||
const opts: CommonType.Option[] = allPages.map(page => ({
|
||||
label: page,
|
||||
value: page
|
||||
}));
|
||||
|
||||
return opts;
|
||||
});
|
||||
|
||||
const layoutOptions: CommonType.Option[] = [
|
||||
{
|
||||
label: 'base',
|
||||
value: 'base'
|
||||
},
|
||||
{
|
||||
label: 'blank',
|
||||
value: 'blank'
|
||||
}
|
||||
];
|
||||
|
||||
function handleUpdateModel() {
|
||||
if (props.operateType === 'add') {
|
||||
Object.assign(model, createDefaultModel());
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (props.operateType === 'addChild' && props.rowData) {
|
||||
const { id } = props.rowData;
|
||||
|
||||
Object.assign(model, createDefaultModel(), { parentId: id });
|
||||
}
|
||||
|
||||
if (props.operateType === 'edit' && props.rowData) {
|
||||
const { component, ...rest } = props.rowData;
|
||||
|
||||
const { layout, page } = getLayoutAndPage(component);
|
||||
|
||||
Object.assign(model, rest, { layout, page });
|
||||
}
|
||||
}
|
||||
|
||||
function closeDrawer() {
|
||||
visible.value = false;
|
||||
}
|
||||
|
||||
async function handleSubmit() {
|
||||
await validate();
|
||||
|
||||
model.component = transformLayoutAndPageToComponent(model.layout, model.page);
|
||||
|
||||
// request
|
||||
window.$message?.success($t('common.updateSuccess'));
|
||||
closeDrawer();
|
||||
emit('submitted');
|
||||
}
|
||||
|
||||
watch(visible, () => {
|
||||
if (visible.value) {
|
||||
handleUpdateModel();
|
||||
restoreValidation();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<NDrawer v-model:show="visible" :title="title" display-directive="show" :width="360">
|
||||
<NDrawerContent :title="title" :native-scrollbar="false" closable>
|
||||
<NForm ref="formRef" :model="model" :rules="rules" label-placement="left" :label-width="80">
|
||||
<NFormItem :label="$t('page.manage.menu.menuType')" path="menuType">
|
||||
<NRadioGroup v-model:value="model.menuType" :disabled="disabledMenuType">
|
||||
<NRadio v-for="item in menuTypeOptions" :key="item.value" :value="item.value" :label="$t(item.label)" />
|
||||
</NRadioGroup>
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.manage.menu.menuName')" path="menuName">
|
||||
<NInput v-model:value="model.menuName" :placeholder="$t('page.manage.menu.form.menuName')" />
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.manage.menu.iconTypeTitle')" path="iconType">
|
||||
<NRadioGroup v-model:value="model.iconType">
|
||||
<NRadio v-for="item in menuIconTypeOptions" :key="item.value" :value="item.value" :label="$t(item.label)" />
|
||||
</NRadioGroup>
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.manage.menu.icon')" path="icon">
|
||||
<template v-if="model.iconType === '1'">
|
||||
<NInput v-model:value="model.icon" :placeholder="$t('page.manage.menu.form.icon')" class="flex-1">
|
||||
<template #suffix>
|
||||
<SvgIcon v-if="model.icon" :icon="model.icon" class="text-icon" />
|
||||
</template>
|
||||
</NInput>
|
||||
</template>
|
||||
<template v-if="model.iconType === '2'">
|
||||
<NSelect
|
||||
v-model:value="model.icon"
|
||||
:placeholder="$t('page.manage.menu.form.localIcon')"
|
||||
:options="localIconOptions"
|
||||
/>
|
||||
</template>
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.manage.menu.routeName')" path="routeName">
|
||||
<NInput v-model:value="model.routeName" :placeholder="$t('page.manage.menu.form.routeName')" />
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.manage.menu.routePath')" path="routePath">
|
||||
<NInput v-model:value="model.routePath" :placeholder="$t('page.manage.menu.form.routePath')" />
|
||||
</NFormItem>
|
||||
<NFormItem v-if="showLayout" :label="$t('page.manage.menu.layout')" path="layout">
|
||||
<NSelect
|
||||
v-model:value="model.layout"
|
||||
:options="layoutOptions"
|
||||
:placeholder="$t('page.manage.menu.form.layout')"
|
||||
/>
|
||||
</NFormItem>
|
||||
<NFormItem v-if="showPage" :label="$t('page.manage.menu.page')" path="page">
|
||||
<NSelect v-model:value="model.page" :options="pageOptions" :placeholder="$t('page.manage.menu.form.page')" />
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.manage.menu.menuStatus')" path="status">
|
||||
<NRadioGroup v-model:value="model.status">
|
||||
<NRadio v-for="item in enableStatusOptions" :key="item.value" :value="item.value" :label="$t(item.label)" />
|
||||
</NRadioGroup>
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.manage.menu.hideInMenu')" path="hideInMenu">
|
||||
<NRadioGroup v-model:value="model.hideInMenu">
|
||||
<NRadio value :label="$t('common.yesOrNo.yes')" />
|
||||
<NRadio :value="false" :label="$t('common.yesOrNo.no')" />
|
||||
</NRadioGroup>
|
||||
</NFormItem>
|
||||
<NFormItem :label="$t('page.manage.menu.order')" path="order">
|
||||
<NInputNumber v-model:value="model.order" :placeholder="$t('page.manage.menu.form.order')" />
|
||||
</NFormItem>
|
||||
</NForm>
|
||||
<template #footer>
|
||||
<NSpace :size="16">
|
||||
<NButton @click="closeDrawer">{{ $t('common.cancel') }}</NButton>
|
||||
<NButton type="primary" @click="handleSubmit">{{ $t('common.confirm') }}</NButton>
|
||||
</NSpace>
|
||||
</template>
|
||||
</NDrawerContent>
|
||||
</NDrawer>
|
||||
</template>
|
||||
|
||||
<style scoped></style>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user