chore: remove flatPreferences

packages/business/common-ui/src/preferences/blocks/layout/breadcrumb.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 import type { SelectListItem } from '@vben/types';
 
+import { computed } from 'vue';
+
 import { $t } from '@vben/locales';
 
 import SwitchItem from '../switch-item.vue';
@@ -10,46 +12,41 @@ defineOptions({
   name: 'PreferenceBreadcrumbConfig',
 });
 
-defineProps<{ disabled: boolean }>();
+const props = defineProps<{ disabled?: boolean }>();
 
-const breadcrumbVisible = defineModel<boolean>('breadcrumbVisible');
-const breadcrumbIcon = defineModel<boolean>('breadcrumbIcon');
-const breadcrumbStyle = defineModel<string>('breadcrumbStyle');
-const breadcrumbHome = defineModel<boolean>('breadcrumbHome');
+const breadcrumbEnable = defineModel<boolean>('breadcrumbEnable');
+const breadcrumbShowIcon = defineModel<boolean>('breadcrumbShowIcon');
+const breadcrumbStyleType = defineModel<string>('breadcrumbStyleType');
+const breadcrumbShowHome = defineModel<boolean>('breadcrumbShowHome');
 const breadcrumbHideOnlyOne = defineModel<boolean>('breadcrumbHideOnlyOne');
 
 const typeItems: SelectListItem[] = [
   { label: $t('preference.normal'), value: 'normal' },
   { label: $t('preference.breadcrumb-background'), value: 'background' },
 ];
+
+const disableItem = computed(() => {
+  return !breadcrumbEnable.value || props.disabled;
+});
 </script>
 
 <template>
-  <SwitchItem v-model="breadcrumbVisible" :disabled="disabled">
+  <SwitchItem v-model="breadcrumbEnable" :disabled="disabled">
     {{ $t('preference.breadcrumb-enable') }}
   </SwitchItem>
-  <SwitchItem
-    v-model="breadcrumbHideOnlyOne"
-    :disabled="!breadcrumbVisible || disabled"
-  >
+  <SwitchItem v-model="breadcrumbHideOnlyOne" :disabled="disableItem">
     {{ $t('preference.breadcrumb-hide-only-one') }}
   </SwitchItem>
-  <SwitchItem
-    v-model="breadcrumbHome"
-    :disabled="!breadcrumbVisible || disabled"
-  >
+  <SwitchItem v-model="breadcrumbShowHome" :disabled="disableItem">
     {{ $t('preference.breadcrumb-home') }}
   </SwitchItem>
-  <SwitchItem
-    v-model="breadcrumbIcon"
-    :disabled="!breadcrumbVisible || disabled"
-  >
+  <SwitchItem v-model="breadcrumbShowIcon" :disabled="disableItem">
     {{ $t('preference.breadcrumb-icon') }}
   </SwitchItem>
   <ToggleItem
-    v-model="breadcrumbStyle"
+    v-model="breadcrumbStyleType"
     :items="typeItems"
-    :disabled="!breadcrumbVisible || disabled"
+    :disabled="disableItem"
   >
     {{ $t('preference.breadcrumb-style') }}
   </ToggleItem>

packages/business/common-ui/src/preferences/blocks/layout/footer.vue

@@ -7,15 +7,15 @@ defineOptions({
   name: 'PreferenceBreadcrumbConfig',
 });
 
-const footerVisible = defineModel<boolean>('footerVisible');
+const footerEnable = defineModel<boolean>('footerEnable');
 const footerFixed = defineModel<boolean>('footerFixed');
 </script>
 
 <template>
-  <SwitchItem v-model="footerVisible">
+  <SwitchItem v-model="footerEnable">
     {{ $t('preference.footer-visible') }}
   </SwitchItem>
-  <SwitchItem v-model="footerFixed" :disabled="!footerVisible">
+  <SwitchItem v-model="footerFixed" :disabled="!footerEnable">
     {{ $t('preference.footer-fixed') }}
   </SwitchItem>
 </template>

packages/business/common-ui/src/preferences/blocks/layout/header.vue

@@ -12,7 +12,7 @@ defineOptions({
 
 defineProps<{ disabled: boolean }>();
 
-const headerVisible = defineModel<boolean>('headerVisible');
+const headerEnable = defineModel<boolean>('headerEnable');
 const headerMode = defineModel<LayoutHeaderModeType>('headerMode');
 
 const localeItems: SelectListItem[] = [
@@ -36,13 +36,13 @@ const localeItems: SelectListItem[] = [
 </script>
 
 <template>
-  <SwitchItem v-model="headerVisible" :disabled="disabled">
+  <SwitchItem v-model="headerEnable" :disabled="disabled">
     {{ $t('preference.header-visible') }}
   </SwitchItem>
   <SelectItem
     v-model="headerMode"
     :items="localeItems"
-    :disabled="!headerVisible"
+    :disabled="!headerEnable"
   >
     {{ $t('preference.mode') }}
   </SelectItem>

packages/business/common-ui/src/preferences/blocks/layout/navigation.vue

@@ -12,7 +12,7 @@ defineOptions({
 
 defineProps<{ disabled?: boolean; disabledNavigationSplit?: boolean }>();
 
-const navigationStyle = defineModel<string>('navigationStyle');
+const navigationStyleType = defineModel<string>('navigationStyleType');
 const navigationSplit = defineModel<boolean>('navigationSplit');
 const navigationAccordion = defineModel<boolean>('navigationAccordion');
 
@@ -24,7 +24,7 @@ const stylesItems: SelectListItem[] = [
 
 <template>
   <ToggleItem
-    v-model="navigationStyle"
+    v-model="navigationStyleType"
     :items="stylesItems"
     :disabled="disabled"
   >

packages/business/common-ui/src/preferences/blocks/layout/sidebar.vue

@@ -9,21 +9,23 @@ defineOptions({
 
 defineProps<{ disabled: boolean }>();
 
-const sideVisible = defineModel<boolean>('sideVisible');
-const sideCollapseShowTitle = defineModel<boolean>('sideCollapseShowTitle');
-const sideCollapse = defineModel<boolean>('sideCollapse');
+const sidebarEnable = defineModel<boolean>('sidebarEnable');
+const sidebarCollapseShowTitle = defineModel<boolean>(
+  'sidebarCollapseShowTitle',
+);
+const sidebarCollapse = defineModel<boolean>('sidebarCollapse');
 </script>
 
 <template>
-  <SwitchItem v-model="sideVisible" :disabled="disabled">
+  <SwitchItem v-model="sidebarEnable" :disabled="disabled">
     {{ $t('preference.side-visible') }}
   </SwitchItem>
-  <SwitchItem v-model="sideCollapse" :disabled="!sideVisible || disabled">
+  <SwitchItem v-model="sidebarCollapse" :disabled="!sidebarEnable || disabled">
     {{ $t('preference.collapse') }}
   </SwitchItem>
   <SwitchItem
-    v-model="sideCollapseShowTitle"
-    :disabled="!sideVisible || disabled"
+    v-model="sidebarCollapseShowTitle"
+    :disabled="!sidebarEnable || disabled"
   >
     {{ $t('preference.collapse-show-title') }}
   </SwitchItem>

packages/business/common-ui/src/preferences/blocks/layout/tabbar.vue

@@ -9,15 +9,15 @@ defineOptions({
 
 defineProps<{ disabled?: boolean }>();
 
-const tabsVisible = defineModel<boolean>('tabsVisible');
-const tabsIcon = defineModel<boolean>('tabsIcon');
+const tabbarEnable = defineModel<boolean>('tabbarEnable');
+const tabbarShowIcon = defineModel<boolean>('tabbarShowIcon');
 </script>
 
 <template>
-  <SwitchItem v-model="tabsVisible" :disabled="disabled">
+  <SwitchItem v-model="tabbarEnable" :disabled="disabled">
     {{ $t('preference.tabs-visible') }}
   </SwitchItem>
-  <SwitchItem v-model="tabsIcon" :disabled="!tabsVisible">
+  <SwitchItem v-model="tabbarShowIcon" :disabled="!tabbarEnable">
     {{ $t('preference.tabs-icon') }}
   </SwitchItem>
   <!-- <SwitchItem v-model="sideCollapseShowTitle" :disabled="!tabsVisible">