twh_eastasia/vue-pure-admin
1
0
Fork 0
mirror of https://github.com/pure-admin/vue-pure-admin.git synced 2025-11-03 13:44:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

perf: theme

Browse Source
This commit is contained in:
xiaoxian521
2021-12-24 10:46:39 +08:00
parent ef91f113ee
commit 5070568b89
7 changed files with 51 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/layout/components/setting/index.vue
View File

@@ -21,6 +21,7 @@ import { debounce } from "/@/utils/debounce";
import darkIcon from "/@/assets/svg/dark.svg";
import { themeColorsType } from "../../types";
import { useAppStoreHook } from "/@/store/modules/app";
import { shadeBgColor } from "../../theme/element-plus";
import { useEpThemeStoreHook } from "/@/store/modules/epTheme";
import { storageLocal, storageSession } from "/@/utils/storage";
import { useMultiTagsStoreHook } from "/@/store/modules/multiTags";
@@ -29,6 +30,7 @@ import { toggleTheme } from "@zougt/vite-plugin-theme-preprocessor/dist/browser-
const router = useRouter();
const { isSelect } = useCssModule();
const body = document.documentElement as HTMLElement;
const instance =
getCurrentInstance().appContext.app.config.globalProperties.$storage;
@@ -260,13 +262,13 @@ function setLayoutThemeColor(theme: string) {
const setEpThemeColor = (color: string) => {
writeNewStyle(createNewStyle(color));
useEpThemeStoreHook().setEpThemeColor(color);
body.style.setProperty("--el-color-primary-active", shadeBgColor(color));
};
let dataTheme = ref<boolean>(instance.layout.darkMode);
// 日间、夜间主题切换
function dataThemeChange() {
const body = document.documentElement as HTMLElement;
if (dataTheme.value) {
body.setAttribute("data-theme", "dark");
setLayoutThemeColor("light");