settings.ts 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455
  1. import { defineStore } from 'pinia';
  2. import defaultSettings from '@/settings';
  3. import { useDynamicTitle } from '@/utils/dynamicTitle';
  4. import { useStorage } from '@vueuse/core';
  5. import { ref } from 'vue';
  6. import { NavTypeEnum } from '@/enums/NavTypeEnum';
  7. export const useSettingsStore = defineStore('setting', () => {
  8. const storageSetting = useStorage<LayoutSetting>('layout-setting', {
  9. topNav: defaultSettings.topNav,
  10. tagsView: defaultSettings.tagsView,
  11. tagsIcon: defaultSettings.tagsIcon,
  12. fixedHeader: defaultSettings.fixedHeader,
  13. sidebarLogo: defaultSettings.sidebarLogo,
  14. dynamicTitle: defaultSettings.dynamicTitle,
  15. sideTheme: defaultSettings.sideTheme,
  16. theme: defaultSettings.theme,
  17. navType: defaultSettings.navType,
  18. radiusBase: defaultSettings.radiusBase
  19. });
  20. const title = ref<string>(defaultSettings.title);
  21. const theme = ref<string>(storageSetting.value.theme);
  22. const sideTheme = ref<string>(storageSetting.value.sideTheme);
  23. const showSettings = ref<boolean>(defaultSettings.showSettings);
  24. const tagsView = ref<boolean>(storageSetting.value.tagsView);
  25. const tagsIcon = ref<boolean>(storageSetting.value.tagsIcon);
  26. const fixedHeader = ref<boolean>(storageSetting.value.fixedHeader);
  27. const sidebarLogo = ref<boolean>(storageSetting.value.sidebarLogo);
  28. const dynamicTitle = ref<boolean>(storageSetting.value.dynamicTitle);
  29. const animationEnable = ref<boolean>(defaultSettings.animationEnable);
  30. const dark = ref<boolean>(defaultSettings.dark);
  31. const navType = ref<NavTypeEnum>(storageSetting.value.navType || NavTypeEnum.LEFT);
  32. const radiusBase = ref<number>(storageSetting.value.radiusBase ?? defaultSettings.radiusBase);
  33. const setTitle = (value: string) => {
  34. title.value = value;
  35. useDynamicTitle();
  36. };
  37. return {
  38. title,
  39. theme,
  40. sideTheme,
  41. showSettings,
  42. tagsView,
  43. tagsIcon,
  44. fixedHeader,
  45. sidebarLogo,
  46. dynamicTitle,
  47. animationEnable,
  48. dark,
  49. navType,
  50. radiusBase,
  51. setTitle
  52. };
  53. });