feat(projects): support restore default theme config

src/layouts/modules/theme-drawer/modules/config-operation.vue

@@ -38,6 +38,14 @@ function handleReset() {
   }, 50);
 }
 
+function handleRestore() {
+  themeStore.restoreThemeSettings();
+
+  setTimeout(() => {
+    window.$message?.success($t('theme.configOperation.restoreSuccessMsg'));
+  }, 50);
+}
+
 const dataClipboardText = computed(() => getClipboardText());
 
 onMounted(() => {
@@ -49,6 +57,7 @@ onMounted(() => {
   <div class="w-full flex justify-between">
     <textarea id="themeConfigCopyTarget" v-model="dataClipboardText" class="absolute opacity-0 -z-1" />
     <NButton type="error" ghost @click="handleReset">{{ $t('theme.configOperation.resetConfig') }}</NButton>
+    <NButton type="success" ghost @click="handleRestore">{{ $t('theme.configOperation.restoreConfig') }}</NButton>
     <div ref="domRef" data-clipboard-target="#themeConfigCopyTarget">
       <NButton type="primary">{{ $t('theme.configOperation.copyConfig') }}</NButton>
     </div>

src/locales/langs/en-us.ts

@@ -132,8 +132,10 @@ const local: App.I18n.Schema = {
     configOperation: {
       copyConfig: 'Copy Config',
       copySuccessMsg: 'Copy Success, Please replace the variable "themeSettings" in "src/theme/settings.ts"',
-      resetConfig: 'Reset Config',
+      resetConfig: 'Reset',
-      resetSuccessMsg: 'Reset Success'
+      resetSuccessMsg: 'Reset Success',
+      restoreConfig: 'Restore',
+      restoreSuccessMsg: 'Restore Success'
     }
   },
   route: {

src/locales/langs/zh-cn.ts

@@ -133,7 +133,9 @@ const local: App.I18n.Schema = {
       copyConfig: '复制配置',
       copySuccessMsg: '复制成功，请替换 src/theme/settings.ts 中的变量 themeSettings',
       resetConfig: '重置配置',
-      resetSuccessMsg: '重置成功'
+      resetSuccessMsg: '重置成功',
+      restoreConfig: '恢复默认配置',
+      restoreSuccessMsg: '恢复成功'
     }
   },
   route: {

src/store/modules/theme/index.ts

@@ -56,10 +56,15 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
   const settingsJson = computed(() => JSON.stringify(settings.value));
 
   /** Reset store */
-  function resetStore() {
+  function resetStore(state?: Partial<typeof themeSettings>) {
     const themeStore = useThemeStore();
     const reset = themeStore.$reset as (arg?: Partial<typeof themeSettings>) => void;
-    reset(themeSettings);
+    reset(state);
+  }
+
+  /** Restore theme settings */
+  function restoreThemeSettings() {
+    resetStore(themeSettings);
   }
 
   /**
@@ -187,6 +192,7 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
     settingsJson,
     setGrayscale,
     resetStore,
+    restoreThemeSettings,
     setThemeScheme,
     toggleThemeScheme,
     updateThemeColors,

src/typings/app.d.ts

@@ -351,6 +351,8 @@ declare namespace App {
           copySuccessMsg: string;
           resetConfig: string;
           resetSuccessMsg: string;
+          restoreConfig: string;
+          restoreSuccessMsg: string;
         };
       };
       route: Record<I18nRouteKey, string>;