preferences-widget.vue 2.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. <script lang="ts" setup>
  2. import type { SupportedLanguagesType } from '@vben/types';
  3. import {
  4. COLOR_PRIMARY_RESETS,
  5. flatPreferences,
  6. updatePreferences,
  7. } from '@vben-core/preferences';
  8. import { loadLocaleMessages } from '@vben/locales';
  9. import Preferences from './preferences.vue';
  10. function updateLocale(value: string) {
  11. const locale = value as SupportedLanguagesType;
  12. updatePreferences({
  13. app: { locale },
  14. });
  15. // 更改预览
  16. loadLocaleMessages(locale);
  17. }
  18. </script>
  19. <template>
  20. <Preferences
  21. v-model:breadcrumb-visible="flatPreferences.breadcrumbEnable"
  22. v-model:breadcrumb-style="flatPreferences.breadcrumbStyleType"
  23. v-model:color-gray-mode="flatPreferences.appColorGrayMode"
  24. v-model:breadcrumb-icon="flatPreferences.breadcrumbShowIcon"
  25. v-model:color-primary="flatPreferences.themeColorPrimary"
  26. v-model:color-weak-mode="flatPreferences.appColorWeakMode"
  27. v-model:content-compact="flatPreferences.appContentCompact"
  28. v-model:breadcrumb-home="flatPreferences.breadcrumbShowHome"
  29. v-model:side-collapse="flatPreferences.sidebarCollapse"
  30. v-model:layout="flatPreferences.appLayout"
  31. v-model:semi-dark-menu="flatPreferences.appSemiDarkMenu"
  32. v-model:side-visible="flatPreferences.sidebarEnable"
  33. v-model:footer-visible="flatPreferences.footerEnable"
  34. v-model:tabs-visible="flatPreferences.tabbarEnable"
  35. v-model:header-visible="flatPreferences.headerEnable"
  36. v-model:header-mode="flatPreferences.headerMode"
  37. v-model:footer-fixed="flatPreferences.footerFixed"
  38. v-model:theme="flatPreferences.appThemeMode"
  39. v-model:dynamic-title="flatPreferences.appDynamicTitle"
  40. v-model:breadcrumb-hide-only-one="flatPreferences.breadcrumbHideOnlyOne"
  41. v-model:page-transition="flatPreferences.transitionName"
  42. v-model:page-progress="flatPreferences.transitionProgress"
  43. v-model:tabs-icon="flatPreferences.tabbarShowIcon"
  44. v-model:navigation-accordion="flatPreferences.navigationAccordion"
  45. v-model:navigation-style="flatPreferences.navigationStyleType"
  46. v-model:shortcut-keys="flatPreferences.shortcutKeysEnable"
  47. v-model:navigation-split="flatPreferences.navigationSplit"
  48. v-model:page-transition-enable="flatPreferences.transitionEnable"
  49. v-model:side-collapse-show-title="flatPreferences.sidebarCollapseShowTitle"
  50. :color-primary-presets="COLOR_PRIMARY_RESETS"
  51. :locale="flatPreferences.appLocale"
  52. @update:locale="updateLocale"
  53. />
  54. </template>