merge(sj_1.2.0-beta1): 合并 sa 1.3.4
This commit is contained in:
parent
e9d25b88c3
commit
48611f7169
3
.env
3
.env
@ -2,7 +2,8 @@ VITE_APP_TITLE=Snail Job
|
|||||||
|
|
||||||
VITE_APP_DESC=A flexible, reliable, and fast platform for distributed task retry and distributed task scheduling.
|
VITE_APP_DESC=A flexible, reliable, and fast platform for distributed task retry and distributed task scheduling.
|
||||||
|
|
||||||
VITE_APP_VERSION=1.2.0-beta1
|
VITE_APP_VERSION=1.2.0
|
||||||
|
|
||||||
VITE_APP_DEFAULT_TOKEN=SJ_Wyz3dmsdbDOkDujOTSSoBjGQP1BMsVnj
|
VITE_APP_DEFAULT_TOKEN=SJ_Wyz3dmsdbDOkDujOTSSoBjGQP1BMsVnj
|
||||||
|
|
||||||
# the prefix of the icon name
|
# the prefix of the icon name
|
||||||
|
40
package.json
40
package.json
@ -64,48 +64,48 @@
|
|||||||
"highlight.js": "^11.10.0",
|
"highlight.js": "^11.10.0",
|
||||||
"naive-ui": "2.39.0",
|
"naive-ui": "2.39.0",
|
||||||
"nprogress": "0.2.0",
|
"nprogress": "0.2.0",
|
||||||
"pinia": "2.1.7",
|
"pinia": "2.2.0",
|
||||||
"tailwind-merge": "2.4.0",
|
"tailwind-merge": "2.4.0",
|
||||||
"ts-md5": "1.3.1",
|
"ts-md5": "1.3.1",
|
||||||
"vue": "3.4.33",
|
"vue": "3.4.35",
|
||||||
"vue-codemirror6": "^1.3.4",
|
"vue-codemirror6": "^1.3.4",
|
||||||
"vue-drag-resize": "^1.5.4",
|
"vue-drag-resize": "^1.5.4",
|
||||||
"vue-draggable-plus": "0.5.2",
|
"vue-draggable-plus": "0.5.2",
|
||||||
"vue-i18n": "9.13.1",
|
"vue-i18n": "9.13.1",
|
||||||
"vue-router": "4.4.0",
|
"vue-router": "4.4.1",
|
||||||
"vue3-puzzle-vcode": "^1.1.7"
|
"vue3-puzzle-vcode": "^1.1.7"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@elegant-router/vue": "0.3.7",
|
"@elegant-router/vue": "0.3.8",
|
||||||
"@iconify/json": "2.2.230",
|
"@iconify/json": "2.2.232",
|
||||||
"@sa/scripts": "workspace:*",
|
"@sa/scripts": "workspace:*",
|
||||||
"@sa/uno-preset": "workspace:*",
|
"@sa/uno-preset": "workspace:*",
|
||||||
"@soybeanjs/eslint-config": "1.3.7",
|
"@soybeanjs/eslint-config": "1.4.0",
|
||||||
"@types/node": "20.14.11",
|
"@types/node": "22.0.1",
|
||||||
"@types/nprogress": "0.2.3",
|
"@types/nprogress": "0.2.3",
|
||||||
"@unocss/eslint-config": "0.61.5",
|
"@unocss/eslint-config": "0.61.9",
|
||||||
"@unocss/preset-icons": "0.61.5",
|
"@unocss/preset-icons": "0.61.9",
|
||||||
"@unocss/preset-uno": "0.61.5",
|
"@unocss/preset-uno": "0.61.9",
|
||||||
"@unocss/transformer-directives": "0.61.5",
|
"@unocss/transformer-directives": "0.61.9",
|
||||||
"@unocss/transformer-variant-group": "0.61.5",
|
"@unocss/transformer-variant-group": "0.61.9",
|
||||||
"@unocss/vite": "0.61.5",
|
"@unocss/vite": "0.61.9",
|
||||||
"@vitejs/plugin-vue": "5.0.5",
|
"@vitejs/plugin-vue": "5.1.1",
|
||||||
"@vitejs/plugin-vue-jsx": "4.0.0",
|
"@vitejs/plugin-vue-jsx": "4.0.0",
|
||||||
"eslint": "9.7.0",
|
"eslint": "9.8.0",
|
||||||
"eslint-plugin-vue": "9.27.0",
|
"eslint-plugin-vue": "9.27.0",
|
||||||
"lint-staged": "15.2.7",
|
"lint-staged": "15.2.7",
|
||||||
"sass": "1.77.8",
|
"sass": "1.77.8",
|
||||||
"simple-git-hooks": "2.11.1",
|
"simple-git-hooks": "2.11.1",
|
||||||
"tsx": "4.16.2",
|
"tsx": "4.16.3",
|
||||||
"typescript": "5.5.4",
|
"typescript": "5.5.4",
|
||||||
"unplugin-icons": "0.19.0",
|
"unplugin-icons": "0.19.1",
|
||||||
"unplugin-vue-components": "0.27.3",
|
"unplugin-vue-components": "0.27.3",
|
||||||
"vite": "5.3.4",
|
"vite": "5.3.5",
|
||||||
"vite-plugin-progress": "0.0.7",
|
"vite-plugin-progress": "0.0.7",
|
||||||
"vite-plugin-svg-icons": "2.0.1",
|
"vite-plugin-svg-icons": "2.0.1",
|
||||||
"vite-plugin-vue-devtools": "7.3.6",
|
"vite-plugin-vue-devtools": "7.3.7",
|
||||||
"vue-eslint-parser": "9.4.3",
|
"vue-eslint-parser": "9.4.3",
|
||||||
"vue-tsc": "2.0.28"
|
"vue-tsc": "2.0.29"
|
||||||
},
|
},
|
||||||
"simple-git-hooks": {
|
"simple-git-hooks": {
|
||||||
"commit-msg": "pnpm sa git-commit-verify",
|
"commit-msg": "pnpm sa git-commit-verify",
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sa/axios",
|
"name": "@sa/axios",
|
||||||
"version": "1.3.1",
|
"version": "1.3.4",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": "./src/index.ts"
|
".": "./src/index.ts"
|
||||||
},
|
},
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sa/color",
|
"name": "@sa/color",
|
||||||
"version": "1.3.1",
|
"version": "1.3.4",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": "./src/index.ts"
|
".": "./src/index.ts"
|
||||||
},
|
},
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sa/hooks",
|
"name": "@sa/hooks",
|
||||||
"version": "1.3.1",
|
"version": "1.3.4",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": "./src/index.ts"
|
".": "./src/index.ts"
|
||||||
},
|
},
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sa/materials",
|
"name": "@sa/materials",
|
||||||
"version": "1.3.1",
|
"version": "1.3.4",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": "./src/index.ts"
|
".": "./src/index.ts"
|
||||||
},
|
},
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sa/fetch",
|
"name": "@sa/fetch",
|
||||||
"version": "1.3.1",
|
"version": "1.3.4",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": "./src/index.ts"
|
".": "./src/index.ts"
|
||||||
},
|
},
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sa/scripts",
|
"name": "@sa/scripts",
|
||||||
"version": "1.3.1",
|
"version": "1.3.4",
|
||||||
"bin": {
|
"bin": {
|
||||||
"sa": "./bin.ts"
|
"sa": "./bin.ts"
|
||||||
},
|
},
|
||||||
@ -21,7 +21,7 @@
|
|||||||
"enquirer": "2.4.1",
|
"enquirer": "2.4.1",
|
||||||
"execa": "9.3.0",
|
"execa": "9.3.0",
|
||||||
"kolorist": "1.8.0",
|
"kolorist": "1.8.0",
|
||||||
"npm-check-updates": "16.14.20",
|
"npm-check-updates": "17.0.0",
|
||||||
"rimraf": "6.0.1"
|
"rimraf": "6.0.1"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sa/uno-preset",
|
"name": "@sa/uno-preset",
|
||||||
"version": "1.3.1",
|
"version": "1.3.4",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": "./src/index.ts"
|
".": "./src/index.ts"
|
||||||
},
|
},
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@sa/utils",
|
"name": "@sa/utils",
|
||||||
"version": "1.3.1",
|
"version": "1.3.4",
|
||||||
"exports": {
|
"exports": {
|
||||||
".": "./src/index.ts"
|
".": "./src/index.ts"
|
||||||
},
|
},
|
||||||
|
3723
pnpm-lock.yaml
3723
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
18
src/App.vue
18
src/App.vue
@ -1,6 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
import { NConfigProvider, darkTheme } from 'naive-ui';
|
import { NConfigProvider, darkTheme } from 'naive-ui';
|
||||||
|
import type { WatermarkProps } from 'naive-ui';
|
||||||
import { useAppStore } from './store/modules/app';
|
import { useAppStore } from './store/modules/app';
|
||||||
import { useThemeStore } from './store/modules/theme';
|
import { useThemeStore } from './store/modules/theme';
|
||||||
import { naiveDateLocales, naiveLocales } from './locales/naive';
|
import { naiveDateLocales, naiveLocales } from './locales/naive';
|
||||||
@ -21,6 +22,22 @@ const naiveLocale = computed(() => {
|
|||||||
const naiveDateLocale = computed(() => {
|
const naiveDateLocale = computed(() => {
|
||||||
return naiveDateLocales[appStore.locale];
|
return naiveDateLocales[appStore.locale];
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const watermarkProps = computed<WatermarkProps>(() => {
|
||||||
|
return {
|
||||||
|
content: themeStore.watermark?.text || 'SoybeanAdmin',
|
||||||
|
cross: true,
|
||||||
|
fullscreen: true,
|
||||||
|
fontSize: 16,
|
||||||
|
lineHeight: 16,
|
||||||
|
width: 384,
|
||||||
|
height: 384,
|
||||||
|
xOffset: 12,
|
||||||
|
yOffset: 60,
|
||||||
|
rotate: -15,
|
||||||
|
zIndex: 9999
|
||||||
|
};
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -33,6 +50,7 @@ const naiveDateLocale = computed(() => {
|
|||||||
>
|
>
|
||||||
<AppProvider>
|
<AppProvider>
|
||||||
<RouterView class="bg-layout" />
|
<RouterView class="bg-layout" />
|
||||||
|
<NWatermark v-if="themeStore.watermark?.visible" v-bind="watermarkProps" />
|
||||||
</AppProvider>
|
</AppProvider>
|
||||||
</NConfigProvider>
|
</NConfigProvider>
|
||||||
</template>
|
</template>
|
||||||
|
@ -26,10 +26,6 @@ interface Emits {
|
|||||||
|
|
||||||
const emit = defineEmits<Emits>();
|
const emit = defineEmits<Emits>();
|
||||||
|
|
||||||
const filterMenus = computed(() => {
|
|
||||||
return props.menus.filter(item => item.show !== false);
|
|
||||||
});
|
|
||||||
|
|
||||||
interface MixMenuItemProps {
|
interface MixMenuItemProps {
|
||||||
/** Menu item label */
|
/** Menu item label */
|
||||||
label: App.Global.Menu['label'];
|
label: App.Global.Menu['label'];
|
||||||
@ -86,7 +82,7 @@ function toggleSiderCollapse() {
|
|||||||
<slot></slot>
|
<slot></slot>
|
||||||
<SimpleScrollbar>
|
<SimpleScrollbar>
|
||||||
<MixMenuItem
|
<MixMenuItem
|
||||||
v-for="menu in filterMenus"
|
v-for="menu in menus"
|
||||||
:key="menu.key"
|
:key="menu.key"
|
||||||
:label="menu.label"
|
:label="menu.label"
|
||||||
:icon="menu.icon"
|
:icon="menu.icon"
|
||||||
|
@ -56,9 +56,7 @@ function handleSelectMixMenu(menu: App.Global.Menu) {
|
|||||||
:theme-color="themeStore.themeColor"
|
:theme-color="themeStore.themeColor"
|
||||||
@select="handleSelectMixMenu"
|
@select="handleSelectMixMenu"
|
||||||
@toggle-sider-collapse="appStore.toggleSiderCollapse"
|
@toggle-sider-collapse="appStore.toggleSiderCollapse"
|
||||||
>
|
/>
|
||||||
<slot></slot>
|
|
||||||
</FirstLevelMenu>
|
|
||||||
</Teleport>
|
</Teleport>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -49,8 +49,11 @@ function handleSelectMixMenu(menu: App.Global.Menu) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function handleResetActiveMenu() {
|
function handleResetActiveMenu() {
|
||||||
getActiveFirstLevelMenuKey();
|
|
||||||
setDrawerVisible(false);
|
setDrawerVisible(false);
|
||||||
|
|
||||||
|
if (!appStore.mixSiderFixed) {
|
||||||
|
getActiveFirstLevelMenuKey();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const selectedKey = computed(() => {
|
const selectedKey = computed(() => {
|
||||||
@ -117,6 +120,7 @@ watch(
|
|||||||
<NMenu
|
<NMenu
|
||||||
v-model:expanded-keys="expandedKeys"
|
v-model:expanded-keys="expandedKeys"
|
||||||
mode="vertical"
|
mode="vertical"
|
||||||
|
:value="selectedKey"
|
||||||
:options="childLevelMenus"
|
:options="childLevelMenus"
|
||||||
:collapsed="appStore.siderCollapse"
|
:collapsed="appStore.siderCollapse"
|
||||||
:collapsed-width="themeStore.sider.collapsedWidth"
|
:collapsed-width="themeStore.sider.collapsedWidth"
|
||||||
|
@ -25,6 +25,10 @@ function handleGrayscaleChange(value: boolean) {
|
|||||||
themeStore.setGrayscale(value);
|
themeStore.setGrayscale(value);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function handleColourWeaknessChange(value: boolean) {
|
||||||
|
themeStore.setColourWeakness(value);
|
||||||
|
}
|
||||||
|
|
||||||
const showSiderInverted = computed(() => !themeStore.darkMode && themeStore.layout.mode.includes('vertical'));
|
const showSiderInverted = computed(() => !themeStore.darkMode && themeStore.layout.mode.includes('vertical'));
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@ -53,6 +57,9 @@ const showSiderInverted = computed(() => !themeStore.darkMode && themeStore.layo
|
|||||||
<SettingItem :label="$t('theme.grayscale')">
|
<SettingItem :label="$t('theme.grayscale')">
|
||||||
<NSwitch :value="themeStore.grayscale" @update:value="handleGrayscaleChange" />
|
<NSwitch :value="themeStore.grayscale" @update:value="handleGrayscaleChange" />
|
||||||
</SettingItem>
|
</SettingItem>
|
||||||
|
<SettingItem :label="$t('theme.colourWeakness')">
|
||||||
|
<NSwitch :value="themeStore.colourWeakness" @update:value="handleColourWeaknessChange" />
|
||||||
|
</SettingItem>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
@ -230,6 +230,7 @@ const local: App.I18n.Schema = {
|
|||||||
auto: 'Follow System'
|
auto: 'Follow System'
|
||||||
},
|
},
|
||||||
grayscale: 'Grayscale',
|
grayscale: 'Grayscale',
|
||||||
|
colourWeakness: 'Colour Weakness',
|
||||||
layoutMode: {
|
layoutMode: {
|
||||||
title: 'Layout Mode',
|
title: 'Layout Mode',
|
||||||
vertical: 'Vertical Menu Mode',
|
vertical: 'Vertical Menu Mode',
|
||||||
@ -299,6 +300,10 @@ const local: App.I18n.Schema = {
|
|||||||
height: 'Footer Height',
|
height: 'Footer Height',
|
||||||
right: 'Right Footer'
|
right: 'Right Footer'
|
||||||
},
|
},
|
||||||
|
watermark: {
|
||||||
|
visible: 'Watermark Full Screen Visible',
|
||||||
|
text: 'Watermark Text'
|
||||||
|
},
|
||||||
themeDrawerTitle: 'Theme Configuration',
|
themeDrawerTitle: 'Theme Configuration',
|
||||||
pageFunTitle: 'Page Function',
|
pageFunTitle: 'Page Function',
|
||||||
configOperation: {
|
configOperation: {
|
||||||
@ -306,10 +311,6 @@ const local: App.I18n.Schema = {
|
|||||||
copySuccessMsg: 'Copy Success, Please replace the variable "themeSettings" in "src/theme/settings.ts"',
|
copySuccessMsg: 'Copy Success, Please replace the variable "themeSettings" in "src/theme/settings.ts"',
|
||||||
resetConfig: 'Reset Config',
|
resetConfig: 'Reset Config',
|
||||||
resetSuccessMsg: 'Reset Success'
|
resetSuccessMsg: 'Reset Success'
|
||||||
},
|
|
||||||
watermark: {
|
|
||||||
visible: 'Watermark Visible',
|
|
||||||
text: 'Watermark Text'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
route: {
|
route: {
|
||||||
|
@ -230,6 +230,7 @@ const local: App.I18n.Schema = {
|
|||||||
auto: '跟随系统'
|
auto: '跟随系统'
|
||||||
},
|
},
|
||||||
grayscale: '灰色模式',
|
grayscale: '灰色模式',
|
||||||
|
colourWeakness: '色弱模式',
|
||||||
layoutMode: {
|
layoutMode: {
|
||||||
title: '布局模式',
|
title: '布局模式',
|
||||||
vertical: '左侧菜单模式',
|
vertical: '左侧菜单模式',
|
||||||
@ -299,6 +300,10 @@ const local: App.I18n.Schema = {
|
|||||||
height: '底部高度',
|
height: '底部高度',
|
||||||
right: '底部局右'
|
right: '底部局右'
|
||||||
},
|
},
|
||||||
|
watermark: {
|
||||||
|
visible: '显示全屏水印',
|
||||||
|
text: '水印文本'
|
||||||
|
},
|
||||||
themeDrawerTitle: '主题配置',
|
themeDrawerTitle: '主题配置',
|
||||||
pageFunTitle: '页面功能',
|
pageFunTitle: '页面功能',
|
||||||
configOperation: {
|
configOperation: {
|
||||||
@ -306,10 +311,6 @@ const local: App.I18n.Schema = {
|
|||||||
copySuccessMsg: '复制成功,请替换 src/theme/settings.ts 中的变量 themeSettings',
|
copySuccessMsg: '复制成功,请替换 src/theme/settings.ts 中的变量 themeSettings',
|
||||||
resetConfig: '重置配置',
|
resetConfig: '重置配置',
|
||||||
resetSuccessMsg: '重置成功'
|
resetSuccessMsg: '重置成功'
|
||||||
},
|
|
||||||
watermark: {
|
|
||||||
visible: '开启水印',
|
|
||||||
text: '水印文字'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
route: {
|
route: {
|
||||||
|
@ -41,6 +41,7 @@ export const request = createFlatRequest<App.Service.Response, RequestInstanceSt
|
|||||||
},
|
},
|
||||||
async onBackendFail(response, instance) {
|
async onBackendFail(response, instance) {
|
||||||
const authStore = useAuthStore();
|
const authStore = useAuthStore();
|
||||||
|
const responseCode = String(response.data.status);
|
||||||
|
|
||||||
function handleLogout() {
|
function handleLogout() {
|
||||||
authStore.resetStore();
|
authStore.resetStore();
|
||||||
@ -55,14 +56,14 @@ export const request = createFlatRequest<App.Service.Response, RequestInstanceSt
|
|||||||
|
|
||||||
// when the backend response code is in `logoutCodes`, it means the user will be logged out and redirected to login page
|
// when the backend response code is in `logoutCodes`, it means the user will be logged out and redirected to login page
|
||||||
const logoutCodes = import.meta.env.VITE_SERVICE_LOGOUT_CODES?.split(',') || [];
|
const logoutCodes = import.meta.env.VITE_SERVICE_LOGOUT_CODES?.split(',') || [];
|
||||||
if (logoutCodes.includes(response.data.status?.toString())) {
|
if (logoutCodes.includes(responseCode)) {
|
||||||
handleLogout();
|
handleLogout();
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
// when the backend response code is in `modalLogoutCodes`, it means the user will be logged out by displaying a modal
|
// 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(',') || [];
|
const modalLogoutCodes = import.meta.env.VITE_SERVICE_MODAL_LOGOUT_CODES?.split(',') || [];
|
||||||
if (modalLogoutCodes.includes(response.data.status?.toString())) {
|
if (modalLogoutCodes.includes(responseCode) && !request.state.errMsgStack?.includes(response.data.message)) {
|
||||||
request.state.errMsgStack = [...(request.state.errMsgStack || []), response.data.message];
|
request.state.errMsgStack = [...(request.state.errMsgStack || []), response.data.message];
|
||||||
|
|
||||||
// prevent the user from refreshing the page
|
// prevent the user from refreshing the page
|
||||||
@ -94,7 +95,7 @@ export const request = createFlatRequest<App.Service.Response, RequestInstanceSt
|
|||||||
// when the backend response code is in `expiredTokenCodes`, it means the token is expired, and refresh token
|
// when the backend response code is in `expiredTokenCodes`, it means the token is expired, and refresh token
|
||||||
// the api `refreshToken` can not return error code in `expiredTokenCodes`, otherwise it will be a dead loop, should return `logoutCodes` or `modalLogoutCodes`
|
// the api `refreshToken` can not return error code in `expiredTokenCodes`, otherwise it will be a dead loop, should return `logoutCodes` or `modalLogoutCodes`
|
||||||
const expiredTokenCodes = import.meta.env.VITE_SERVICE_EXPIRED_TOKEN_CODES?.split(',') || [];
|
const expiredTokenCodes = import.meta.env.VITE_SERVICE_EXPIRED_TOKEN_CODES?.split(',') || [];
|
||||||
if (expiredTokenCodes.includes(response.data.status) && !request.state.isRefreshingToken) {
|
if (expiredTokenCodes.includes(responseCode) && !request.state.isRefreshingToken) {
|
||||||
request.state.isRefreshingToken = true;
|
request.state.isRefreshingToken = true;
|
||||||
|
|
||||||
const refreshConfig = await handleRefreshToken(response.config);
|
const refreshConfig = await handleRefreshToken(response.config);
|
||||||
|
@ -72,17 +72,15 @@ export function getGlobalMenusByAuthRoutes(routes: ElegantConstRoute[]) {
|
|||||||
const menus: App.Global.Menu[] = [];
|
const menus: App.Global.Menu[] = [];
|
||||||
|
|
||||||
routes.forEach(route => {
|
routes.forEach(route => {
|
||||||
|
if (!route.meta?.hideInMenu) {
|
||||||
const menu = getGlobalMenuByBaseRoute(route);
|
const menu = getGlobalMenuByBaseRoute(route);
|
||||||
|
|
||||||
if (route.children) {
|
if (route.children?.some(child => !child.meta?.hideInMenu)) {
|
||||||
menu.children = getGlobalMenusByAuthRoutes(route.children);
|
menu.children = getGlobalMenusByAuthRoutes(route.children);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (route.meta?.hideInMenu) {
|
|
||||||
menu.show = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
menus.push(menu);
|
menus.push(menu);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
return menus;
|
return menus;
|
||||||
|
@ -10,8 +10,8 @@ import {
|
|||||||
createThemeToken,
|
createThemeToken,
|
||||||
getNaiveTheme,
|
getNaiveTheme,
|
||||||
initThemeSettings,
|
initThemeSettings,
|
||||||
toggleCssDarkMode,
|
toggleAuxiliaryColorModes,
|
||||||
toggleGrayscaleMode
|
toggleCssDarkMode
|
||||||
} from './shared';
|
} from './shared';
|
||||||
|
|
||||||
/** Theme store */
|
/** Theme store */
|
||||||
@ -33,6 +33,9 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
|||||||
/** grayscale mode */
|
/** grayscale mode */
|
||||||
const grayscaleMode = computed(() => settings.value.grayscale);
|
const grayscaleMode = computed(() => settings.value.grayscale);
|
||||||
|
|
||||||
|
/** colourWeakness mode */
|
||||||
|
const colourWeaknessMode = computed(() => settings.value.colourWeakness);
|
||||||
|
|
||||||
/** Theme colors */
|
/** Theme colors */
|
||||||
const themeColors = computed(() => {
|
const themeColors = computed(() => {
|
||||||
const { themeColor, otherColor, isInfoFollowPrimary } = settings.value;
|
const { themeColor, otherColor, isInfoFollowPrimary } = settings.value;
|
||||||
@ -88,6 +91,15 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
|||||||
settings.value.grayscale = isGrayscale;
|
settings.value.grayscale = isGrayscale;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set colourWeakness value
|
||||||
|
*
|
||||||
|
* @param isColourWeakness
|
||||||
|
*/
|
||||||
|
function setColourWeakness(isColourWeakness: boolean) {
|
||||||
|
settings.value.colourWeakness = isColourWeakness;
|
||||||
|
}
|
||||||
|
|
||||||
/** Toggle theme scheme */
|
/** Toggle theme scheme */
|
||||||
function toggleThemeScheme() {
|
function toggleThemeScheme() {
|
||||||
const themeSchemes: UnionKey.ThemeScheme[] = ['light', 'dark', 'auto'];
|
const themeSchemes: UnionKey.ThemeScheme[] = ['light', 'dark', 'auto'];
|
||||||
@ -176,9 +188,9 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
|||||||
);
|
);
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
grayscaleMode,
|
[grayscaleMode, colourWeaknessMode],
|
||||||
val => {
|
val => {
|
||||||
toggleGrayscaleMode(val);
|
toggleAuxiliaryColorModes(val[0], val[1]);
|
||||||
},
|
},
|
||||||
{ immediate: true }
|
{ immediate: true }
|
||||||
);
|
);
|
||||||
@ -206,6 +218,7 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
|
|||||||
naiveTheme,
|
naiveTheme,
|
||||||
settingsJson,
|
settingsJson,
|
||||||
setGrayscale,
|
setGrayscale,
|
||||||
|
setColourWeakness,
|
||||||
resetStore,
|
resetStore,
|
||||||
setThemeScheme,
|
setThemeScheme,
|
||||||
toggleThemeScheme,
|
toggleThemeScheme,
|
||||||
|
@ -180,20 +180,16 @@ export function toggleCssDarkMode(darkMode = false) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Toggle grayscale mode
|
* Toggle auxiliary color modes
|
||||||
*
|
*
|
||||||
* @param grayscaleMode Is grayscale mode
|
* @param grayscaleMode
|
||||||
|
* @param colourWeakness
|
||||||
*/
|
*/
|
||||||
export function toggleGrayscaleMode(grayscaleMode = false) {
|
export function toggleAuxiliaryColorModes(grayscaleMode = false, colourWeakness = false) {
|
||||||
const GRAYSCALE_CLASS = 'grayscale';
|
const htmlElement = document.documentElement;
|
||||||
|
htmlElement.style.filter = [grayscaleMode ? 'grayscale(100%)' : '', colourWeakness ? 'invert(80%)' : '']
|
||||||
const { add, remove } = toggleHtmlClass(GRAYSCALE_CLASS);
|
.filter(Boolean)
|
||||||
|
.join(' ');
|
||||||
if (grayscaleMode) {
|
|
||||||
add();
|
|
||||||
} else {
|
|
||||||
remove();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
type NaiveColorScene = '' | 'Suppl' | 'Hover' | 'Pressed' | 'Active';
|
type NaiveColorScene = '' | 'Suppl' | 'Hover' | 'Pressed' | 'Active';
|
||||||
|
@ -12,7 +12,3 @@ body,
|
|||||||
html {
|
html {
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
html.grayscale {
|
|
||||||
filter: grayscale(100%);
|
|
||||||
}
|
|
||||||
|
@ -2,6 +2,7 @@
|
|||||||
export const themeSettings: App.Theme.ThemeSetting = {
|
export const themeSettings: App.Theme.ThemeSetting = {
|
||||||
themeScheme: 'light',
|
themeScheme: 'light',
|
||||||
grayscale: false,
|
grayscale: false,
|
||||||
|
colourWeakness: false,
|
||||||
recommendColor: false,
|
recommendColor: false,
|
||||||
themeColor: '#1366ff',
|
themeColor: '#1366ff',
|
||||||
otherColor: {
|
otherColor: {
|
||||||
@ -71,7 +72,8 @@ export const themeSettings: App.Theme.ThemeSetting = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
watermark: {
|
watermark: {
|
||||||
visible: false
|
visible: false,
|
||||||
|
text: 'Snail Job'
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
25
src/typings/app.d.ts
vendored
25
src/typings/app.d.ts
vendored
@ -10,6 +10,8 @@ declare namespace App {
|
|||||||
themeScheme: UnionKey.ThemeScheme;
|
themeScheme: UnionKey.ThemeScheme;
|
||||||
/** grayscale mode */
|
/** grayscale mode */
|
||||||
grayscale: boolean;
|
grayscale: boolean;
|
||||||
|
/** colour weakness mode */
|
||||||
|
colourWeakness: boolean;
|
||||||
/** Whether to recommend color */
|
/** Whether to recommend color */
|
||||||
recommendColor: boolean;
|
recommendColor: boolean;
|
||||||
/** Theme color */
|
/** Theme color */
|
||||||
@ -93,6 +95,13 @@ declare namespace App {
|
|||||||
/** Whether float the footer to the right when the layout is 'horizontal-mix' */
|
/** Whether float the footer to the right when the layout is 'horizontal-mix' */
|
||||||
right: boolean;
|
right: boolean;
|
||||||
};
|
};
|
||||||
|
/** Watermark */
|
||||||
|
watermark: {
|
||||||
|
/** Whether to show the watermark */
|
||||||
|
visible: boolean;
|
||||||
|
/** Watermark text */
|
||||||
|
text: string;
|
||||||
|
};
|
||||||
/** define some theme settings tokens, will transform to css variables */
|
/** define some theme settings tokens, will transform to css variables */
|
||||||
tokens: {
|
tokens: {
|
||||||
light: ThemeSettingToken;
|
light: ThemeSettingToken;
|
||||||
@ -100,11 +109,6 @@ declare namespace App {
|
|||||||
[K in keyof ThemeSettingToken]?: Partial<ThemeSettingToken[K]>;
|
[K in keyof ThemeSettingToken]?: Partial<ThemeSettingToken[K]>;
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
/** Watermark */
|
|
||||||
watermark: {
|
|
||||||
/** Whether to show the watermark */
|
|
||||||
visible: boolean;
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface OtherColor {
|
interface OtherColor {
|
||||||
@ -194,8 +198,6 @@ declare namespace App {
|
|||||||
icon?: () => VNode;
|
icon?: () => VNode;
|
||||||
/** The menu children */
|
/** The menu children */
|
||||||
children?: Menu[];
|
children?: Menu[];
|
||||||
/** The menu show */
|
|
||||||
show?: boolean;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
type Breadcrumb = Omit<Menu, 'children'> & {
|
type Breadcrumb = Omit<Menu, 'children'> & {
|
||||||
@ -504,6 +506,7 @@ declare namespace App {
|
|||||||
theme: {
|
theme: {
|
||||||
themeSchema: { title: string } & Record<UnionKey.ThemeScheme, string>;
|
themeSchema: { title: string } & Record<UnionKey.ThemeScheme, string>;
|
||||||
grayscale: string;
|
grayscale: string;
|
||||||
|
colourWeakness: string;
|
||||||
layoutMode: { title: string; reverseHorizontalMix: string } & Record<UnionKey.ThemeLayoutMode, string>;
|
layoutMode: { title: string; reverseHorizontalMix: string } & Record<UnionKey.ThemeLayoutMode, string>;
|
||||||
recommendColor: string;
|
recommendColor: string;
|
||||||
recommendColorDesc: string;
|
recommendColorDesc: string;
|
||||||
@ -544,6 +547,10 @@ declare namespace App {
|
|||||||
height: string;
|
height: string;
|
||||||
right: string;
|
right: string;
|
||||||
};
|
};
|
||||||
|
watermark: {
|
||||||
|
visible: string;
|
||||||
|
text: string;
|
||||||
|
};
|
||||||
themeDrawerTitle: string;
|
themeDrawerTitle: string;
|
||||||
pageFunTitle: string;
|
pageFunTitle: string;
|
||||||
configOperation: {
|
configOperation: {
|
||||||
@ -552,10 +559,6 @@ declare namespace App {
|
|||||||
resetConfig: string;
|
resetConfig: string;
|
||||||
resetSuccessMsg: string;
|
resetSuccessMsg: string;
|
||||||
};
|
};
|
||||||
watermark: {
|
|
||||||
visible: string;
|
|
||||||
text: string;
|
|
||||||
};
|
|
||||||
};
|
};
|
||||||
route: Record<I18nRouteKey, string>;
|
route: Record<I18nRouteKey, string>;
|
||||||
page: {
|
page: {
|
||||||
|
@ -57,6 +57,10 @@ const onClose = () => {
|
|||||||
const onSuccess = () => {
|
const onSuccess = () => {
|
||||||
handleSubmit();
|
handleSubmit();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const codePopoverStytle = {
|
||||||
|
padding: 0
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
@ -73,7 +77,7 @@ const onSuccess = () => {
|
|||||||
/>
|
/>
|
||||||
</NFormItem>
|
</NFormItem>
|
||||||
<NSpace vertical :size="24">
|
<NSpace vertical :size="24">
|
||||||
<NPopover :show="codeShow" row style="padding: 0">
|
<NPopover :show="codeShow" row :style="codePopoverStytle">
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<NButton type="primary" size="large" round block :loading="authStore.loginLoading" @click="validateCode">
|
<NButton type="primary" size="large" round block :loading="authStore.loginLoading" @click="validateCode">
|
||||||
{{ $t('page.login.common.login') }}
|
{{ $t('page.login.common.login') }}
|
||||||
|
Loading…
Reference in New Issue
Block a user