All checks were successful
Build / build-and-test (push) Successful in 27s
[Style] 为主视图增加 16px 间距 更新 mdui-card 的右边距问题 (老问题了, 还是没有解决) [Base] 引入 VueUse 分离 Axios HTML 部分紧凑化
44 lines
1.2 KiB
JavaScript
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 }
|
|
})
|