settings.ts 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  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. export const useSettingsStore = defineStore('setting', () => {
  7. const storageSetting = useStorage<LayoutSetting>('layout-setting', {
  8. topNav: defaultSettings.topNav,
  9. tagsView: defaultSettings.tagsView,
  10. tagsIcon: defaultSettings.tagsIcon,
  11. fixedHeader: defaultSettings.fixedHeader,
  12. sidebarLogo: defaultSettings.sidebarLogo,
  13. dynamicTitle: defaultSettings.dynamicTitle,
  14. sideTheme: defaultSettings.sideTheme,
  15. theme: defaultSettings.theme
  16. });
  17. const title = ref<string>(defaultSettings.title);
  18. const theme = ref<string>(storageSetting.value.theme);
  19. const sideTheme = ref<string>(storageSetting.value.sideTheme);
  20. const showSettings = ref<boolean>(defaultSettings.showSettings);
  21. const topNav = ref<boolean>(true); // 固定使用 topNav,不检测缓存
  22. const tagsView = ref<boolean>(storageSetting.value.tagsView);
  23. const tagsIcon = ref<boolean>(storageSetting.value.tagsIcon);
  24. const fixedHeader = ref<boolean>(storageSetting.value.fixedHeader);
  25. const sidebarLogo = ref<boolean>(storageSetting.value.sidebarLogo);
  26. const dynamicTitle = ref<boolean>(storageSetting.value.dynamicTitle);
  27. const animationEnable = ref<boolean>(defaultSettings.animationEnable);
  28. const dark = ref<boolean>(defaultSettings.dark);
  29. const setTitle = (value: string) => {
  30. title.value = value;
  31. useDynamicTitle();
  32. };
  33. return {
  34. title,
  35. theme,
  36. sideTheme,
  37. showSettings,
  38. topNav,
  39. tagsView,
  40. tagsIcon,
  41. fixedHeader,
  42. sidebarLogo,
  43. dynamicTitle,
  44. animationEnable,
  45. dark,
  46. setTitle
  47. };
  48. });