From dae2aa5513dfb0a183881d937e4389ad8a5d327e Mon Sep 17 00:00:00 2001 From: Soybean Date: Sat, 27 Apr 2024 13:07:19 +0800 Subject: [PATCH] fix(projects): recovery the layout config before is mobile. fixed #408, fixed #361 --- src/store/modules/app/index.ts | 21 +++++++++++++++++++-- src/typings/storage.d.ts | 5 +++++ 2 files changed, 24 insertions(+), 2 deletions(-) diff --git a/src/store/modules/app/index.ts b/src/store/modules/app/index.ts index 4805aaf8..f5185e99 100644 --- a/src/store/modules/app/index.ts +++ b/src/store/modules/app/index.ts @@ -1,4 +1,4 @@ -import { effectScope, onScopeDispose, ref, watch } from 'vue'; +import { effectScope, nextTick, onScopeDispose, ref, watch } from 'vue'; import { defineStore } from 'pinia'; import { breakpointsTailwind, useBreakpoints, useEventListener, useTitle } from '@vueuse/core'; import { useBoolean } from '@sa/hooks'; @@ -87,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 } diff --git a/src/typings/storage.d.ts b/src/typings/storage.d.ts index ae3d7211..1eb0bf26 100644 --- a/src/typings/storage.d.ts +++ b/src/typings/storage.d.ts @@ -32,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; + }; } }