epTheme.ts 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. import { defineStore } from "pinia";
  2. import {
  3. store,
  4. getConfig,
  5. storageLocal,
  6. responsiveStorageNameSpace
  7. } from "../utils";
  8. export const useEpThemeStore = defineStore("pure-epTheme", {
  9. state: () => ({
  10. epThemeColor:
  11. storageLocal().getItem<StorageConfigs>(
  12. `${responsiveStorageNameSpace()}layout`
  13. )?.epThemeColor ?? getConfig().EpThemeColor,
  14. epTheme:
  15. storageLocal().getItem<StorageConfigs>(
  16. `${responsiveStorageNameSpace()}layout`
  17. )?.theme ?? getConfig().Theme
  18. }),
  19. getters: {
  20. getEpThemeColor(state) {
  21. return state.epThemeColor;
  22. },
  23. /** 用于mix导航模式下hamburger-svg的fill属性 */
  24. fill(state) {
  25. if (state.epTheme === "light") {
  26. return "#409eff";
  27. } else {
  28. return "#fff";
  29. }
  30. }
  31. },
  32. actions: {
  33. setEpThemeColor(newColor: string): void {
  34. const layout = storageLocal().getItem<StorageConfigs>(
  35. `${responsiveStorageNameSpace()}layout`
  36. );
  37. this.epTheme = layout?.theme;
  38. this.epThemeColor = newColor;
  39. if (!layout) return;
  40. layout.epThemeColor = newColor;
  41. storageLocal().setItem(`${responsiveStorageNameSpace()}layout`, layout);
  42. }
  43. }
  44. });
  45. export function useEpThemeStoreHook() {
  46. return useEpThemeStore(store);
  47. }