Files
ao3-mirror-ssr/src/stores/themeScheme.js
UnknownMp 8d248a44ff
All checks were successful
Build / build-and-test (push) Successful in 27s
增加设置板块, 允许自定义界面设置, 使用 VueUse 存储
[Style]
为主视图增加 16px 间距
更新 mdui-card 的右边距问题 (老问题了, 还是没有解决)

[Base]
引入 VueUse
分离 Axios
HTML 部分紧凑化
2025-05-23 22:41:47 +08:00

44 lines
1.2 KiB
JavaScript

import { ref, computed } from 'vue'
import { defineStore } from 'pinia'
import { useDark } from '@vueuse/core'
import { setTheme } from 'mdui/functions/setTheme.js'
import { setColorScheme } from 'mdui/functions/setColorScheme.js'
import { useAppSettingStore } from './appSetting.js'
export const useThemeStore = defineStore('homePage', () => {
const isDark = useDark()
const appSetting = useAppSettingStore()
const mode = ref(appSetting.value.autoTheme ? 'auto' : appSetting.value.darkTheme ? 'dark' : 'light')
const color = ref(appSetting.value.colorScheme)
function setColor(target) {
if (color.value != target) {
color.value = target
}
setColorScheme(color.value)
}
function setMode(target) {
if (mode.value != target) {
mode.value = target
}
setTheme(mode.value)
}
function switchMode(callback) {
if (mode.value === 'auto') {
mode.value = isDark.value ? 'light' : 'dark'
} else {
mode.value = mode.value === 'dark' ? 'light' : 'dark'
}
setMode(mode.value)
if (callback) {
callback(mode.value)
}
}
function applyTheme() {
setColorScheme(color.value)
setTheme(mode.value)
}
return { setColor, setMode, switchMode, applyTheme }
})