Compare commits

...

16 Commits

Author SHA1 Message Date
Soybean
0c1741096b chore(projects): release v1.3.8 2024-10-25 01:14:09 +08:00
Soybean
71e6307db2 chore(projects): update deps & fix sass usage 2024-10-25 01:12:40 +08:00
Soybean
b667eab76a refactor(projects)!: refactor route cache & support reset route cache strategy 2024-10-25 00:58:29 +08:00
Scott Hu
4b3ac11bd5 feat(packages): optimistic subpackage @sa/alova (#646) 2024-10-17 17:22:58 +08:00
Soybean
24bb6d95cb chore(projects): update vscode extensions 2024-10-16 11:58:49 +08:00
Soybean
4726498faa fix(utils): fix isPC. fixed #644 2024-10-16 11:56:55 +08:00
青菜白玉汤
75cbfbbfe6 style(projects): reduce ambiguity in theme configuration instructions. 2024-10-15 19:55:18 +08:00
Soybean
8dcda38560 chore(deps): update deps 2024-10-09 22:58:33 +08:00
Scott Hu
2072f5850e feat(packages): add subpackage @sa/alova (#640)
* feat(packages): add @sa/alova

* typo(packages): add types & update code

* feat: add subpackage @sa/alova

---------

Co-authored-by: allenli178 <allenli178@qq.com>
Co-authored-by: 子殊 <yuyan@zishudeMac-mini.local>
2024-10-09 22:47:44 +08:00
青菜白玉汤
cfaab8527a feat(projects): login supports accessible operation. (#637) 2024-10-03 16:38:43 +08:00
zxin
83ba798781 chore(types): remove type declaration for document.startViewTransition (TypeScript 5.6 includes it) (#633) 2024-09-25 18:44:30 +08:00
Soybean
9669ca2041 chore(projects): release v1.3.7 2024-09-21 08:41:03 +08:00
Soybean
baefdfd8c4 chore(deps): update deps 2024-09-21 08:38:03 +08:00
Soybean
24e9e57a31 chore(projects)!: update scss config 2024-09-21 08:36:07 +08:00
Soybean
4da588c6ba refactor(packages): @sa/materials: remove tab close shortcut by mouse 2024-09-21 08:36:04 +08:00
Soybean
3e72c3b45a fix(projects): fix global-tab click conflict with contextmenu 2024-09-21 08:35:59 +08:00
40 changed files with 1606 additions and 1193 deletions

View File

@@ -6,9 +6,6 @@
"dbaeumer.vscode-eslint", "dbaeumer.vscode-eslint",
"editorconfig.editorconfig", "editorconfig.editorconfig",
"esbenp.prettier-vscode", "esbenp.prettier-vscode",
"formulahendry.auto-close-tag",
"formulahendry.auto-complete-tag",
"formulahendry.auto-rename-tag",
"lokalise.i18n-ally", "lokalise.i18n-ally",
"mhutchie.git-graph", "mhutchie.git-graph",
"mikestead.dotenv", "mikestead.dotenv",

View File

@@ -1,6 +1,64 @@
# Changelog # Changelog
## [v1.3.8](https://github.com/soybeanjs/soybean-admin/compare/v1.3.7...v1.3.8) (2024-10-25)
### &nbsp;&nbsp;&nbsp;🚨 Breaking Changes
- **projects**: refactor route cache & support reset route cache strategy &nbsp;-&nbsp; by @soybeanjs [<samp>(b667e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/b667eab)
### &nbsp;&nbsp;&nbsp;🚀 Features
- **packages**:
- add subpackage `@sa/alova` &nbsp;-&nbsp; by @JOU-amjs in https://github.com/soybeanjs/soybean-admin/issues/640 [<samp>(2072f)</samp>](https://github.com/soybeanjs/soybean-admin/commit/2072f58)
- optimistic subpackage `@sa/alova` &nbsp;-&nbsp; by @JOU-amjs in https://github.com/soybeanjs/soybean-admin/issues/646 [<samp>(4b3ac)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4b3ac11)
- **projects**:
- login supports accessible operation. &nbsp;-&nbsp; by @Azir-11 in https://github.com/soybeanjs/soybean-admin/issues/637 [<samp>(cfaab)</samp>](https://github.com/soybeanjs/soybean-admin/commit/cfaab85)
### &nbsp;&nbsp;&nbsp;🐞 Bug Fixes
- **utils**: fix `isPC`. fixed #644 &nbsp;-&nbsp; by @soybeanjs in https://github.com/soybeanjs/soybean-admin/issues/644 [<samp>(47264)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4726498)
### &nbsp;&nbsp;&nbsp;🏡 Chore
- **deps**:
- update deps &nbsp;-&nbsp; by @soybeanjs [<samp>(8dcda)</samp>](https://github.com/soybeanjs/soybean-admin/commit/8dcda38)
- **projects**:
- update vscode extensions &nbsp;-&nbsp; by @soybeanjs [<samp>(24bb6)</samp>](https://github.com/soybeanjs/soybean-admin/commit/24bb6d9)
- update deps & fix sass usage &nbsp;-&nbsp; by @soybeanjs [<samp>(71e63)</samp>](https://github.com/soybeanjs/soybean-admin/commit/71e6307)
- **types**:
- remove type declaration for document.startViewTransition (TypeScript 5.6 includes it) &nbsp;-&nbsp; by @NHZEX in https://github.com/soybeanjs/soybean-admin/issues/633 [<samp>(83ba7)</samp>](https://github.com/soybeanjs/soybean-admin/commit/83ba798)
### &nbsp;&nbsp;&nbsp;🎨 Styles
- **projects**: reduce ambiguity in theme configuration instructions. &nbsp;-&nbsp; by @Azir-11 [<samp>(75cbf)</samp>](https://github.com/soybeanjs/soybean-admin/commit/75cbfbb)
### &nbsp;&nbsp;&nbsp;❤️ Contributors
[![soybeanjs](https://github.com/soybeanjs.png?size=48)](https://github.com/soybeanjs)&nbsp;&nbsp;[![JOU-amjs](https://github.com/JOU-amjs.png?size=48)](https://github.com/JOU-amjs)&nbsp;&nbsp;[![Azir-11](https://github.com/Azir-11.png?size=48)](https://github.com/Azir-11)&nbsp;&nbsp;[![NHZEX](https://github.com/NHZEX.png?size=48)](https://github.com/NHZEX)&nbsp;&nbsp;
## [v1.3.7](https://github.com/soybeanjs/soybean-admin/compare/v1.3.6...v1.3.7) (2024-09-21)
### &nbsp;&nbsp;&nbsp;🚨 Breaking Changes
- **projects**: update scss config &nbsp;-&nbsp; by @soybeanjs [<samp>(24e9e)</samp>](https://github.com/soybeanjs/soybean-admin/commit/24e9e57)
### &nbsp;&nbsp;&nbsp;🐞 Bug Fixes
- **projects**: fix global-tab click conflict with contextmenu &nbsp;-&nbsp; by @soybeanjs [<samp>(3e72c)</samp>](https://github.com/soybeanjs/soybean-admin/commit/3e72c3b)
### &nbsp;&nbsp;&nbsp;💅 Refactors
- **packages**: @sa/materials: remove tab close shortcut by mouse &nbsp;-&nbsp; by @soybeanjs [<samp>(4da58)</samp>](https://github.com/soybeanjs/soybean-admin/commit/4da588c)
### &nbsp;&nbsp;&nbsp;🏡 Chore
- **deps**: update deps &nbsp;-&nbsp; by @soybeanjs [<samp>(baefd)</samp>](https://github.com/soybeanjs/soybean-admin/commit/baefdfd)
### &nbsp;&nbsp;&nbsp;❤️ Contributors
[![soybeanjs](https://github.com/soybeanjs.png?size=48)](https://github.com/soybeanjs)&nbsp;&nbsp;
## [v1.3.6](https://github.com/soybeanjs/soybean-admin/compare/v1.3.5...v1.3.6) (2024-09-20) ## [v1.3.6](https://github.com/soybeanjs/soybean-admin/compare/v1.3.5...v1.3.6) (2024-09-20)
### &nbsp;&nbsp;&nbsp;🐞 Bug Fixes ### &nbsp;&nbsp;&nbsp;🐞 Bug Fixes

View File

@@ -1,7 +1,7 @@
{ {
"name": "soybean-admin", "name": "soybean-admin",
"type": "module", "type": "module",
"version": "1.3.6", "version": "1.3.8",
"description": "A fresh and elegant admin template, based on Vue3、Vite3、TypeScript、NaiveUI and UnoCSS. 一个基于Vue3、Vite3、TypeScript、NaiveUI and UnoCSS的清新优雅的中后台模版。", "description": "A fresh and elegant admin template, based on Vue3、Vite3、TypeScript、NaiveUI and UnoCSS. 一个基于Vue3、Vite3、TypeScript、NaiveUI and UnoCSS的清新优雅的中后台模版。",
"author": { "author": {
"name": "Soybean", "name": "Soybean",
@@ -59,44 +59,44 @@
"dayjs": "1.11.13", "dayjs": "1.11.13",
"echarts": "5.5.1", "echarts": "5.5.1",
"json5": "2.2.3", "json5": "2.2.3",
"naive-ui": "2.39.0", "naive-ui": "2.40.1",
"nprogress": "0.2.0", "nprogress": "0.2.0",
"pinia": "2.2.2", "pinia": "2.2.4",
"tailwind-merge": "2.5.2", "tailwind-merge": "2.5.4",
"vue": "3.5.6", "vue": "3.5.12",
"vue-draggable-plus": "0.5.3", "vue-draggable-plus": "0.5.4",
"vue-i18n": "10.0.1", "vue-i18n": "10.0.4",
"vue-router": "4.4.5" "vue-router": "4.4.5"
}, },
"devDependencies": { "devDependencies": {
"@elegant-router/vue": "0.3.8", "@elegant-router/vue": "0.3.8",
"@iconify/json": "2.2.250", "@iconify/json": "2.2.263",
"@sa/scripts": "workspace:*", "@sa/scripts": "workspace:*",
"@sa/uno-preset": "workspace:*", "@sa/uno-preset": "workspace:*",
"@soybeanjs/eslint-config": "1.4.1", "@soybeanjs/eslint-config": "1.4.2",
"@types/node": "22.5.5", "@types/node": "22.7.9",
"@types/nprogress": "0.2.3", "@types/nprogress": "0.2.3",
"@unocss/eslint-config": "0.62.4", "@unocss/eslint-config": "0.63.6",
"@unocss/preset-icons": "0.62.4", "@unocss/preset-icons": "0.63.6",
"@unocss/preset-uno": "0.62.4", "@unocss/preset-uno": "0.63.6",
"@unocss/transformer-directives": "0.62.4", "@unocss/transformer-directives": "0.63.6",
"@unocss/transformer-variant-group": "0.62.4", "@unocss/transformer-variant-group": "0.63.6",
"@unocss/vite": "0.62.4", "@unocss/vite": "0.63.6",
"@vitejs/plugin-vue": "5.1.4", "@vitejs/plugin-vue": "5.1.4",
"@vitejs/plugin-vue-jsx": "4.0.1", "@vitejs/plugin-vue-jsx": "4.0.1",
"eslint": "9.10.0", "eslint": "9.13.0",
"eslint-plugin-vue": "9.28.0", "eslint-plugin-vue": "9.29.1",
"lint-staged": "15.2.10", "lint-staged": "15.2.10",
"sass": "1.79.2", "sass": "1.80.4",
"simple-git-hooks": "2.11.1", "simple-git-hooks": "2.11.1",
"tsx": "4.19.1", "tsx": "4.19.1",
"typescript": "5.6.2", "typescript": "5.6.3",
"unplugin-icons": "0.19.3", "unplugin-icons": "0.19.3",
"unplugin-vue-components": "0.27.4", "unplugin-vue-components": "0.27.4",
"vite": "5.4.6", "vite": "5.4.10",
"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.4.5", "vite-plugin-vue-devtools": "7.5.4",
"vue-eslint-parser": "9.4.3", "vue-eslint-parser": "9.4.3",
"vue-tsc": "2.1.6" "vue-tsc": "2.1.6"
}, },

View File

@@ -0,0 +1,20 @@
{
"name": "@sa/alova",
"version": "1.3.8",
"exports": {
".": "./src/index.ts",
"./fetch": "./src/fetch.ts",
"./client": "./src/client.ts",
"./mock": "./src/mock.ts"
},
"typesVersions": {
"*": {
"*": ["./src/*"]
}
},
"dependencies": {
"@alova/mock": "2.0.8",
"@sa/utils": "workspace:*",
"alova": "3.1.1"
}
}

View File

@@ -0,0 +1 @@
export * from 'alova/client';

View File

@@ -0,0 +1,2 @@
/** the backend error code key */
export const BACKEND_ERROR_CODE = 'BACKEND_ERROR';

View File

@@ -0,0 +1,2 @@
import adapterFetch from 'alova/fetch';
export default adapterFetch;

View File

@@ -0,0 +1,77 @@
import { createAlova } from 'alova';
import type { AlovaDefaultCacheAdapter, AlovaGenerics, AlovaGlobalCacheAdapter, AlovaRequestAdapter } from 'alova';
import VueHook from 'alova/vue';
import type { VueHookType } from 'alova/vue';
import adapterFetch from 'alova/fetch';
import { createServerTokenAuthentication } from 'alova/client';
import type { FetchRequestInit } from 'alova/fetch';
import { BACKEND_ERROR_CODE } from './constant';
import type { CustomAlovaConfig, RequestOptions } from './type';
export const createAlovaRequest = <
RequestConfig = FetchRequestInit,
ResponseType = Response,
ResponseHeader = Headers,
L1Cache extends AlovaGlobalCacheAdapter = AlovaDefaultCacheAdapter,
L2Cache extends AlovaGlobalCacheAdapter = AlovaDefaultCacheAdapter
>(
customConfig: CustomAlovaConfig<
AlovaGenerics<any, any, RequestConfig, ResponseType, ResponseHeader, L1Cache, L2Cache, any>
>,
options: RequestOptions<AlovaGenerics<any, any, RequestConfig, ResponseType, ResponseHeader, L1Cache, L2Cache, any>>
) => {
const { tokenRefresher } = options;
const { onAuthRequired, onResponseRefreshToken } = createServerTokenAuthentication<
VueHookType,
AlovaRequestAdapter<RequestConfig, ResponseType, ResponseHeader>
>({
refreshTokenOnSuccess: {
isExpired: (response, method) => tokenRefresher?.isExpired(response, method) || false,
handler: async (response, method) => tokenRefresher?.handler(response, method)
},
refreshTokenOnError: {
isExpired: (response, method) => tokenRefresher?.isExpired(response, method) || false,
handler: async (response, method) => tokenRefresher?.handler(response, method)
}
});
const instance = createAlova({
...customConfig,
timeout: customConfig.timeout ?? 10 * 1000,
requestAdapter: (customConfig.requestAdapter as any) ?? adapterFetch(),
statesHook: VueHook,
beforeRequest: onAuthRequired(options.onRequest as any),
responded: onResponseRefreshToken({
onSuccess: async (response, method) => {
// check if http status is success
let error: any = null;
let transformedData: any = null;
try {
if (await options.isBackendSuccess(response)) {
transformedData = await options.transformBackendResponse(response);
} else {
error = new Error('the backend request error');
error.code = BACKEND_ERROR_CODE;
}
} catch (err) {
error = err;
}
if (error) {
await options.onError?.(error, response, method);
throw error;
}
return transformedData;
},
onComplete: options.onComplete,
onError: (error, method) => options.onError?.(error, null, method)
})
});
return instance;
};
export { BACKEND_ERROR_CODE };
export type * from './type';
export type * from 'alova';

View File

@@ -0,0 +1 @@
export * from '@alova/mock';

View File

@@ -0,0 +1,52 @@
import type { AlovaGenerics, AlovaOptions, AlovaRequestAdapter, Method, ResponseCompleteHandler } from 'alova';
export type CustomAlovaConfig<AG extends AlovaGenerics> = Omit<
AlovaOptions<AG>,
'statesHook' | 'beforeRequest' | 'responded' | 'requestAdapter'
> & {
/** request adapter. all request of alova will be sent by it. */
requestAdapter?: AlovaRequestAdapter<AG['RequestConfig'], AG['Response'], AG['ResponseHeader']>;
};
export interface RequestOptions<AG extends AlovaGenerics> {
/**
* The hook before request
*
* For example: You can add header token in this hook
*
* @param method alova Method Instance
*/
onRequest?: AlovaOptions<AG>['beforeRequest'];
/**
* The hook to check backend response is success or not
*
* @param response alova response
*/
isBackendSuccess: (response: AG['Response']) => Promise<boolean>;
/** The config to refresh token */
tokenRefresher?: {
/** detect the token is expired */
isExpired(response: AG['Response'], Method: Method<AG>): Promise<boolean> | boolean;
/** refresh token handler */
handler(response: AG['Response'], Method: Method<AG>): Promise<void>;
};
/** The hook after backend request complete */
onComplete?: ResponseCompleteHandler<AG>;
/**
* The hook to handle error
*
* For example: You can show error message in this hook
*
* @param error
*/
onError?: (error: any, response: AG['Response'] | null, methodInstance: Method<AG>) => any | Promise<any>;
/**
* transform backend response when the responseType is json
*
* @param response alova response
*/
transformBackendResponse: (response: AG['Response']) => any;
}

View 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"]
}

View File

@@ -1,6 +1,6 @@
{ {
"name": "@sa/axios", "name": "@sa/axios",
"version": "1.3.6", "version": "1.3.8",
"exports": { "exports": {
".": "./src/index.ts" ".": "./src/index.ts"
}, },

View File

@@ -1,6 +1,6 @@
{ {
"name": "@sa/color", "name": "@sa/color",
"version": "1.3.6", "version": "1.3.8",
"exports": { "exports": {
".": "./src/index.ts" ".": "./src/index.ts"
}, },

View File

@@ -1,6 +1,6 @@
{ {
"name": "@sa/hooks", "name": "@sa/hooks",
"version": "1.3.6", "version": "1.3.8",
"exports": { "exports": {
".": "./src/index.ts" ".": "./src/index.ts"
}, },

View File

@@ -1,6 +1,6 @@
{ {
"name": "@sa/materials", "name": "@sa/materials",
"version": "1.3.6", "version": "1.3.8",
"exports": { "exports": {
".": "./src/index.ts" ".": "./src/index.ts"
}, },

View File

@@ -53,23 +53,10 @@ const bindProps = computed(() => {
function handleClose() { function handleClose() {
emit('close'); emit('close');
} }
function handleMouseup(e: MouseEvent) {
// close tab by mouse wheel button click
if (e.button === 1) {
handleClose();
}
}
</script> </script>
<template> <template>
<component <component :is="activeTabComponent.component" :class="activeTabComponent.class" :style="cssVars" v-bind="bindProps">
:is="activeTabComponent.component"
:class="activeTabComponent.class"
:style="cssVars"
v-bind="bindProps"
@mouseup="handleMouseup"
>
<template #prefix> <template #prefix>
<slot name="prefix"></slot> <slot name="prefix"></slot>
</template> </template>

View File

@@ -1,6 +1,6 @@
{ {
"name": "@sa/fetch", "name": "@sa/fetch",
"version": "1.3.6", "version": "1.3.8",
"exports": { "exports": {
".": "./src/index.ts" ".": "./src/index.ts"
}, },
@@ -10,6 +10,6 @@
} }
}, },
"dependencies": { "dependencies": {
"ofetch": "1.3.4" "ofetch": "1.4.1"
} }
} }

View File

@@ -1,6 +1,6 @@
{ {
"name": "@sa/scripts", "name": "@sa/scripts",
"version": "1.3.6", "version": "1.3.8",
"bin": { "bin": {
"sa": "./bin.ts" "sa": "./bin.ts"
}, },
@@ -14,14 +14,14 @@
}, },
"devDependencies": { "devDependencies": {
"@soybeanjs/changelog": "0.3.24", "@soybeanjs/changelog": "0.3.24",
"bumpp": "9.5.2", "bumpp": "9.7.1",
"c12": "1.11.2", "c12": "2.0.1",
"cac": "6.7.14", "cac": "6.7.14",
"consola": "3.2.3", "consola": "3.2.3",
"enquirer": "2.4.1", "enquirer": "2.4.1",
"execa": "9.4.0", "execa": "9.4.1",
"kolorist": "1.8.0", "kolorist": "1.8.0",
"npm-check-updates": "17.1.2", "npm-check-updates": "17.1.4",
"rimraf": "6.0.1" "rimraf": "6.0.1"
} }
} }

View File

@@ -1,6 +1,6 @@
{ {
"name": "@sa/uno-preset", "name": "@sa/uno-preset",
"version": "1.3.6", "version": "1.3.8",
"exports": { "exports": {
".": "./src/index.ts" ".": "./src/index.ts"
}, },

View File

@@ -1,6 +1,6 @@
{ {
"name": "@sa/utils", "name": "@sa/utils",
"version": "1.3.6", "version": "1.3.8",
"exports": { "exports": {
".": "./src/index.ts" ".": "./src/index.ts"
}, },

2301
pnpm-lock.yaml generated

File diff suppressed because it is too large Load Diff

View File

@@ -54,3 +54,10 @@ export const themePageAnimationModeRecord: Record<UnionKey.ThemePageAnimateMode,
}; };
export const themePageAnimationModeOptions = transformRecordToOption(themePageAnimationModeRecord); export const themePageAnimationModeOptions = transformRecordToOption(themePageAnimationModeRecord);
export const resetCacheStrategyRecord: Record<UnionKey.ResetCacheStrategy, App.I18n.I18nKey> = {
close: 'theme.resetCacheStrategy.close',
refresh: 'theme.resetCacheStrategy.refresh'
};
export const resetCacheStrategyOptions = transformRecordToOption(resetCacheStrategyRecord);

View File

@@ -42,7 +42,7 @@ function resetScroll() {
@after-leave="resetScroll" @after-leave="resetScroll"
@after-enter="appStore.setContentXScrollable(false)" @after-enter="appStore.setContentXScrollable(false)"
> >
<KeepAlive :include="routeStore.cacheRoutes"> <KeepAlive :include="routeStore.cacheRoutes" :exclude="routeStore.excludeCacheRoutes">
<component <component
:is="Component" :is="Component"
v-if="appStore.reloadFlag" v-if="appStore.reloadFlag"

View File

@@ -8,6 +8,7 @@ import { useAppStore } from '@/store/modules/app';
import { useThemeStore } from '@/store/modules/theme'; import { useThemeStore } from '@/store/modules/theme';
import { useRouteStore } from '@/store/modules/route'; import { useRouteStore } from '@/store/modules/route';
import { useTabStore } from '@/store/modules/tab'; import { useTabStore } from '@/store/modules/tab';
import { isPC } from '@/utils/agent';
import ContextMenu from './context-menu.vue'; import ContextMenu from './context-menu.vue';
defineOptions({ defineOptions({
@@ -24,6 +25,7 @@ const bsWrapper = ref<HTMLElement>();
const { width: bsWrapperWidth, left: bsWrapperLeft } = useElementBounding(bsWrapper); const { width: bsWrapperWidth, left: bsWrapperLeft } = useElementBounding(bsWrapper);
const bsScroll = ref<InstanceType<typeof BetterScroll>>(); const bsScroll = ref<InstanceType<typeof BetterScroll>>();
const tabRef = ref<HTMLElement>(); const tabRef = ref<HTMLElement>();
const isPCFlag = isPC();
const TAB_DATA_ID = 'data-tab-id'; const TAB_DATA_ID = 'data-tab-id';
@@ -82,7 +84,10 @@ function getContextMenuDisabledKeys(tabId: string) {
async function handleCloseTab(tab: App.Global.Tab) { async function handleCloseTab(tab: App.Global.Tab) {
await tabStore.removeTab(tab.id); await tabStore.removeTab(tab.id);
await routeStore.reCacheRoutesByKey(tab.routeKey);
if (themeStore.resetCacheStrategy === 'close') {
routeStore.resetRouteCache(tab.routeKey);
}
} }
async function refresh() { async function refresh() {
@@ -166,7 +171,7 @@ init();
<template> <template>
<DarkModeContainer class="size-full flex-y-center px-16px shadow-tab"> <DarkModeContainer class="size-full flex-y-center px-16px shadow-tab">
<div ref="bsWrapper" class="h-full flex-1-hidden"> <div ref="bsWrapper" class="h-full flex-1-hidden">
<BetterScroll ref="bsScroll" :options="{ scrollX: true, scrollY: false, click: true }" @click="removeFocus"> <BetterScroll ref="bsScroll" :options="{ scrollX: true, scrollY: false, click: !isPCFlag }" @click="removeFocus">
<div <div
ref="tabRef" ref="tabRef"
class="h-full flex pr-18px" class="h-full flex pr-18px"

View File

@@ -2,7 +2,12 @@
import { computed } from 'vue'; import { computed } from 'vue';
import { $t } from '@/locales'; import { $t } from '@/locales';
import { useThemeStore } from '@/store/modules/theme'; import { useThemeStore } from '@/store/modules/theme';
import { themePageAnimationModeOptions, themeScrollModeOptions, themeTabModeOptions } from '@/constants/app'; import {
resetCacheStrategyOptions,
themePageAnimationModeOptions,
themeScrollModeOptions,
themeTabModeOptions
} from '@/constants/app';
import { translateOptions } from '@/utils/common'; import { translateOptions } from '@/utils/common';
import SettingItem from '../components/setting-item.vue'; import SettingItem from '../components/setting-item.vue';
@@ -22,6 +27,14 @@ const isWrapperScrollMode = computed(() => themeStore.layout.scrollMode === 'wra
<template> <template>
<NDivider>{{ $t('theme.pageFunTitle') }}</NDivider> <NDivider>{{ $t('theme.pageFunTitle') }}</NDivider>
<TransitionGroup tag="div" name="setting-list" class="flex-col-stretch gap-12px"> <TransitionGroup tag="div" name="setting-list" class="flex-col-stretch gap-12px">
<SettingItem key="0" :label="$t('theme.resetCacheStrategy.title')">
<NSelect
v-model:value="themeStore.resetCacheStrategy"
:options="translateOptions(resetCacheStrategyOptions)"
size="small"
class="w-120px"
/>
</SettingItem>
<SettingItem key="1" :label="$t('theme.scrollMode.title')"> <SettingItem key="1" :label="$t('theme.scrollMode.title')">
<NSelect <NSelect
v-model:value="themeStore.layout.scrollMode" v-model:value="themeStore.layout.scrollMode"

View File

@@ -113,7 +113,7 @@ const local: App.I18n.Schema = {
}, },
tab: { tab: {
visible: 'Tab Visible', visible: 'Tab Visible',
cache: 'Tab Cache', cache: 'Tag Bar Info Cache',
height: 'Tab Height', height: 'Tab Height',
mode: { mode: {
title: 'Tab Mode', title: 'Tab Mode',
@@ -141,6 +141,11 @@ const local: App.I18n.Schema = {
}, },
themeDrawerTitle: 'Theme Configuration', themeDrawerTitle: 'Theme Configuration',
pageFunTitle: 'Page Function', pageFunTitle: 'Page Function',
resetCacheStrategy: {
title: 'Reset Cache Strategy',
close: 'Close Page',
refresh: 'Refresh Page'
},
configOperation: { configOperation: {
copyConfig: 'Copy Config', copyConfig: 'Copy Config',
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"',

View File

@@ -113,7 +113,7 @@ const local: App.I18n.Schema = {
}, },
tab: { tab: {
visible: '显示标签栏', visible: '显示标签栏',
cache: '缓存标签页', cache: '标签栏信息缓存',
height: '标签栏高度', height: '标签栏高度',
mode: { mode: {
title: '标签栏风格', title: '标签栏风格',
@@ -141,6 +141,11 @@ const local: App.I18n.Schema = {
}, },
themeDrawerTitle: '主题配置', themeDrawerTitle: '主题配置',
pageFunTitle: '页面功能', pageFunTitle: '页面功能',
resetCacheStrategy: {
title: '重置缓存策略',
close: '关闭页面',
refresh: '刷新页面'
},
configOperation: { configOperation: {
copyConfig: '复制配置', copyConfig: '复制配置',
copySuccessMsg: '复制成功,请替换 src/theme/settings.ts 中的变量 themeSettings', copySuccessMsg: '复制成功,请替换 src/theme/settings.ts 中的变量 themeSettings',

View File

@@ -46,6 +46,10 @@ export const useAppStore = defineStore(SetupStoreId.App, () => {
}); });
setReloadFlag(true); setReloadFlag(true);
if (themeStore.resetCacheStrategy === 'refresh') {
routeStore.resetRouteCache();
}
} }
const locale = ref<App.I18n.LangType>(localStg.get('lang') || 'zh-CN'); const locale = ref<App.I18n.LangType>(localStg.get('lang') || 'zh-CN');

View File

@@ -1,4 +1,4 @@
import { computed, ref, shallowRef } from 'vue'; import { computed, nextTick, ref, shallowRef } from 'vue';
import type { RouteRecordRaw } from 'vue-router'; import type { RouteRecordRaw } from 'vue-router';
import { defineStore } from 'pinia'; import { defineStore } from 'pinia';
import { useBoolean } from '@sa/hooks'; import { useBoolean } from '@sa/hooks';
@@ -9,7 +9,6 @@ import { createStaticRoutes, getAuthVueRoutes } from '@/router/routes';
import { ROOT_ROUTE } from '@/router/routes/builtin'; import { ROOT_ROUTE } from '@/router/routes/builtin';
import { getRouteName, getRoutePath } from '@/router/elegant/transform'; import { getRouteName, getRoutePath } from '@/router/elegant/transform';
import { fetchGetConstantRoutes, fetchGetUserRoutes, fetchIsRouteExist } from '@/service/api'; import { fetchGetConstantRoutes, fetchGetUserRoutes, fetchIsRouteExist } from '@/service/api';
import { useAppStore } from '../app';
import { useAuthStore } from '../auth'; import { useAuthStore } from '../auth';
import { useTabStore } from '../tab'; import { useTabStore } from '../tab';
import { import {
@@ -25,7 +24,6 @@ import {
} from './shared'; } from './shared';
export const useRouteStore = defineStore(SetupStoreId.Route, () => { export const useRouteStore = defineStore(SetupStoreId.Route, () => {
const appStore = useAppStore();
const authStore = useAuthStore(); const authStore = useAuthStore();
const tabStore = useTabStore(); const tabStore = useTabStore();
const { bool: isInitConstantRoute, setBool: setIsInitConstantRoute } = useBoolean(); const { bool: isInitConstantRoute, setBool: setIsInitConstantRoute } = useBoolean();
@@ -97,8 +95,12 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
/** Cache routes */ /** Cache routes */
const cacheRoutes = ref<RouteKey[]>([]); const cacheRoutes = ref<RouteKey[]>([]);
/** All cache routes */ /**
const allCacheRoutes = shallowRef<RouteKey[]>([]); * Exclude cache routes
*
* for reset route cache
*/
const excludeCacheRoutes = ref<RouteKey[]>([]);
/** /**
* Get cache routes * Get cache routes
@@ -106,69 +108,23 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
* @param routes Vue routes * @param routes Vue routes
*/ */
function getCacheRoutes(routes: RouteRecordRaw[]) { function getCacheRoutes(routes: RouteRecordRaw[]) {
const alls = getCacheRouteNames(routes); cacheRoutes.value = getCacheRouteNames(routes);
cacheRoutes.value = alls;
allCacheRoutes.value = [...alls];
} }
/** /**
* Add cache routes * Reset route cache
* *
* @default router.currentRoute.value.name current route name
* @param routeKey * @param routeKey
*/ */
function addCacheRoutes(routeKey: RouteKey) { async function resetRouteCache(routeKey?: RouteKey) {
if (cacheRoutes.value.includes(routeKey)) return; const routeName = routeKey || (router.currentRoute.value.name as RouteKey);
cacheRoutes.value.push(routeKey); excludeCacheRoutes.value.push(routeName);
}
/** await nextTick();
* Remove cache routes
*
* @param routeKey
*/
function removeCacheRoutes(routeKey: RouteKey) {
const index = cacheRoutes.value.findIndex(item => item === routeKey);
if (index === -1) return; excludeCacheRoutes.value = [];
cacheRoutes.value.splice(index, 1);
}
/**
* Is cached route
*
* @param routeKey
*/
function isCachedRoute(routeKey: RouteKey) {
return allCacheRoutes.value.includes(routeKey);
}
/**
* Re cache routes by route key
*
* @param routeKey
*/
async function reCacheRoutesByKey(routeKey: RouteKey) {
if (!isCachedRoute(routeKey)) return;
removeCacheRoutes(routeKey);
await appStore.reloadPage();
addCacheRoutes(routeKey);
}
/**
* Re cache routes by route keys
*
* @param routeKeys
*/
async function reCacheRoutesByKeys(routeKeys: RouteKey[]) {
for await (const key of routeKeys) {
await reCacheRoutesByKey(key);
}
} }
/** Global breadcrumbs */ /** Global breadcrumbs */
@@ -361,8 +317,8 @@ export const useRouteStore = defineStore(SetupStoreId.Route, () => {
searchMenus, searchMenus,
updateGlobalMenusByLocale, updateGlobalMenusByLocale,
cacheRoutes, cacheRoutes,
reCacheRoutesByKey, excludeCacheRoutes,
reCacheRoutesByKeys, resetRouteCache,
breadcrumbs, breadcrumbs,
initConstantRoute, initConstantRoute,
isInitConstantRoute, isInitConstantRoute,

View File

@@ -1 +1 @@
@import './scrollbar.scss'; @forward 'scrollbar';

View File

@@ -12,6 +12,7 @@ export const themeSettings: App.Theme.ThemeSetting = {
error: '#f5222d' error: '#f5222d'
}, },
isInfoFollowPrimary: true, isInfoFollowPrimary: true,
resetCacheStrategy: 'close',
layout: { layout: {
mode: 'vertical', mode: 'vertical',
scrollMode: 'content', scrollMode: 'content',
@@ -82,4 +83,10 @@ export const themeSettings: App.Theme.ThemeSetting = {
* *
* If publish new version, use `overrideThemeSettings` to override certain theme settings * If publish new version, use `overrideThemeSettings` to override certain theme settings
*/ */
export const overrideThemeSettings: Partial<App.Theme.ThemeSetting> = {}; export const overrideThemeSettings: Partial<App.Theme.ThemeSetting> = {
resetCacheStrategy: 'close',
watermark: {
visible: false,
text: 'SoybeanAdmin'
}
};

View File

@@ -20,6 +20,8 @@ declare namespace App {
otherColor: OtherColor; otherColor: OtherColor;
/** Whether info color is followed by the primary color */ /** Whether info color is followed by the primary color */
isInfoFollowPrimary: boolean; isInfoFollowPrimary: boolean;
/** Reset cache strategy */
resetCacheStrategy?: UnionKey.ResetCacheStrategy;
/** Layout */ /** Layout */
layout: { layout: {
/** Layout mode */ /** Layout mode */
@@ -388,6 +390,7 @@ declare namespace App {
}; };
themeDrawerTitle: string; themeDrawerTitle: string;
pageFunTitle: string; pageFunTitle: string;
resetCacheStrategy: { title: string } & Record<UnionKey.ResetCacheStrategy, string>;
configOperation: { configOperation: {
copyConfig: string; copyConfig: string;
copySuccessMsg: string; copySuccessMsg: string;

View File

@@ -14,14 +14,6 @@ declare global {
$notification?: import('naive-ui').NotificationProviderInst; $notification?: import('naive-ui').NotificationProviderInst;
} }
interface ViewTransition {
ready: Promise<void>;
}
export interface Document {
startViewTransition?: (callback: () => Promise<void> | void) => ViewTransition;
}
/** Build time of the project */ /** Build time of the project */
export const BUILD_TIME: string; export const BUILD_TIME: string;
} }

View File

@@ -14,6 +14,14 @@ declare namespace UnionKey {
/** Theme scheme */ /** Theme scheme */
type ThemeScheme = 'light' | 'dark' | 'auto'; type ThemeScheme = 'light' | 'dark' | 'auto';
/**
* Reset cache strategy
*
* - close: re-cache when close page
* - refresh: re-cache when refresh page
*/
type ResetCacheStrategy = 'close' | 'refresh';
/** /**
* The layout mode * The layout mode
* *

7
src/utils/agent.ts Normal file
View File

@@ -0,0 +1,7 @@
export function isPC() {
const agents = ['Android', 'iPhone', 'webOS', 'BlackBerry', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod'];
const isMobile = agents.some(agent => window.navigator.userAgent.includes(agent));
return !isMobile;
}

View File

@@ -40,7 +40,7 @@ async function handleSubmit() {
</script> </script>
<template> <template>
<NForm ref="formRef" :model="model" :rules="rules" size="large" :show-label="false"> <NForm ref="formRef" :model="model" :rules="rules" size="large" :show-label="false" @keyup.enter="handleSubmit">
<NFormItem path="phone"> <NFormItem path="phone">
<NInput v-model:value="model.phone" :placeholder="$t('page.login.common.phonePlaceholder')" /> <NInput v-model:value="model.phone" :placeholder="$t('page.login.common.phonePlaceholder')" />
</NFormItem> </NFormItem>

View File

@@ -75,7 +75,7 @@ async function handleAccountLogin(account: Account) {
</script> </script>
<template> <template>
<NForm ref="formRef" :model="model" :rules="rules" size="large" :show-label="false"> <NForm ref="formRef" :model="model" :rules="rules" size="large" :show-label="false" @keyup.enter="handleSubmit">
<NFormItem path="userName"> <NFormItem path="userName">
<NInput v-model:value="model.userName" :placeholder="$t('page.login.common.userNamePlaceholder')" /> <NInput v-model:value="model.userName" :placeholder="$t('page.login.common.userNamePlaceholder')" />
</NFormItem> </NFormItem>

View File

@@ -46,7 +46,7 @@ async function handleSubmit() {
</script> </script>
<template> <template>
<NForm ref="formRef" :model="model" :rules="rules" size="large" :show-label="false"> <NForm ref="formRef" :model="model" :rules="rules" size="large" :show-label="false" @keyup.enter="handleSubmit">
<NFormItem path="phone"> <NFormItem path="phone">
<NInput v-model:value="model.phone" :placeholder="$t('page.login.common.phonePlaceholder')" /> <NInput v-model:value="model.phone" :placeholder="$t('page.login.common.phonePlaceholder')" />
</NFormItem> </NFormItem>

View File

@@ -45,7 +45,7 @@ async function handleSubmit() {
</script> </script>
<template> <template>
<NForm ref="formRef" :model="model" :rules="rules" size="large" :show-label="false"> <NForm ref="formRef" :model="model" :rules="rules" size="large" :show-label="false" @keyup.enter="handleSubmit">
<NFormItem path="phone"> <NFormItem path="phone">
<NInput v-model:value="model.phone" :placeholder="$t('page.login.common.phonePlaceholder')" /> <NInput v-model:value="model.phone" :placeholder="$t('page.login.common.phonePlaceholder')" />
</NFormItem> </NFormItem>

View File

@@ -22,7 +22,8 @@ export default defineConfig(configEnv => {
css: { css: {
preprocessorOptions: { preprocessorOptions: {
scss: { scss: {
additionalData: `@use "./src/styles/scss/global.scss" as *;` api: 'modern-compiler',
additionalData: `@use "@/styles/scss/global.scss" as *;`
} }
} }
}, },