theme.ts 963 B

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. import type { ConfigProviderThemeVars } from 'wot-design-uni'
  2. import { defineStore } from 'pinia'
  3. export const useThemeStore = defineStore(
  4. 'theme-store',
  5. () => {
  6. /** 主题 */
  7. const theme = ref<'light' | 'dark'>('light')
  8. /** 主题变量 */
  9. const themeVars = ref<ConfigProviderThemeVars>({
  10. // colorTheme: 'red',
  11. // buttonPrimaryBgColor: '#07c160',
  12. // buttonPrimaryColor: '#07c160',
  13. })
  14. /** 设置主题变量 */
  15. const setThemeVars = (partialVars: Partial<ConfigProviderThemeVars>) => {
  16. themeVars.value = { ...themeVars.value, ...partialVars }
  17. }
  18. /** 切换主题 */
  19. const toggleTheme = () => {
  20. theme.value = theme.value === 'light' ? 'dark' : 'light'
  21. }
  22. return {
  23. /** 设置主题变量 */
  24. setThemeVars,
  25. /** 切换主题 */
  26. toggleTheme,
  27. /** 主题变量 */
  28. themeVars,
  29. /** 主题 */
  30. theme,
  31. }
  32. },
  33. {
  34. persist: true,
  35. },
  36. )