refactor(projects): themeStore: isCustomizeInfoColor to isInfoFollowP…

…rimary
soybeanjs · Nov 14, 2023 · 0867f4b · 0867f4b
1 parent f0f0236
commit 0867f4b
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 22 deletions.
diff --git a/src/layouts/modules/theme-drawer/modules/theme-color.vue b/src/layouts/modules/theme-drawer/modules/theme-color.vue
@@ -13,24 +13,20 @@ const themeStore = useThemeStore();
 function handleUpdateColor(color: string, key: App.Theme.ThemeColorKey) {
   themeStore.updateThemeColors(key, color);
 }
-
-function handleUpdateCustomizeInfoColor(checked: boolean) {
-  themeStore.updateIsCustomizeInfoColor(!checked);
-}
 </script>
 
 <template>
   <ADivider>{{ $t('theme.themeColor.title') }}</ADivider>
   <div class="flex-vertical-stretch gap-12px">
     <SettingItem v-for="(_, key) in themeStore.themeColors" :key="key" :label="$t(`theme.themeColor.${key}`)">
       <template v-if="key === 'info'" #suffix>
-        <ACheckbox :checked="!themeStore.isCustomizeInfoColor" @update:checked="handleUpdateCustomizeInfoColor">
+        <ACheckbox v-model:checked="themeStore.isInfoFollowPrimary">
           {{ $t('theme.themeColor.followPrimary') }}
         </ACheckbox>
       </template>
       <ColorPicker
         :color="themeStore.themeColors[key]"
-        :disabled="key === 'info' && !themeStore.isCustomizeInfoColor"
+        :disabled="key === 'info' && themeStore.isInfoFollowPrimary"
         @update:color="handleUpdateColor($event, key)"
       />
     </SettingItem>

diff --git a/src/store/modules/theme/index.ts b/src/store/modules/theme/index.ts
@@ -68,11 +68,11 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
    * theme colors
    */
   const themeColors = computed(() => {
-    const { themeColor, otherColor, isCustomizeInfoColor } = settings.value;
+    const { themeColor, otherColor, isInfoFollowPrimary } = settings.value;
     const colors: App.Theme.ThemeColor = {
       primary: themeColor,
       ...otherColor,
-      info: isCustomizeInfoColor ? otherColor.info : themeColor
+      info: isInfoFollowPrimary ? themeColor : otherColor.info
     };
     return colors;
   });
@@ -90,14 +90,6 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
     }
   }
 
-  /**
-   * update is customize info color
-   * @param customize
-   */
-  function updateIsCustomizeInfoColor(customize: boolean) {
-    settings.value.isCustomizeInfoColor = customize;
-  }
-
   /**
    * setup theme vars to html
    */
@@ -142,7 +134,6 @@ export const useThemeStore = defineStore(SetupStoreId.Theme, () => {
     antdTheme,
     setThemeLayout,
     themeColors,
-    updateThemeColors,
-    updateIsCustomizeInfoColor
+    updateThemeColors
   };
 });
diff --git a/src/store/modules/theme/shared.ts b/src/store/modules/theme/shared.ts
@@ -20,7 +20,7 @@ export function initThemeSettings() {
       warning: '#faad14',
       error: '#f5222d'
     },
-    isCustomizeInfoColor: false,
+    isInfoFollowPrimary: true,
     layout: {
       mode: 'vertical',
       scrollMode: 'content'

diff --git a/src/typings/app.d.ts b/src/typings/app.d.ts
@@ -37,10 +37,9 @@ declare namespace App {
        */
       otherColor: OtherColor;
       /**
-       * is customize info color
-       * @description if not, the info color will transformed by the primary color
+       * whether info color is followed by the primary color
        */
-      isCustomizeInfoColor: boolean;
+      isInfoFollowPrimary: boolean;
       /**
        * layout
        */