fix: 🐛 登录页设置的主题进入系统后不一致问题修复

This commit is contained in:
hxr 2023-11-05 10:56:08 +08:00
parent 2cb8057b89
commit 0f6344792e
3 changed files with 8 additions and 12 deletions

View File

@ -79,11 +79,8 @@ const currentThemeColor = computed(() => {
}); });
onMounted(() => { onMounted(() => {
window.document.body.setAttribute("layout", settingsStore.layout); window.document.body.setAttribute("layout", settingsStore.layout);
const theme = const theme = settingsStore.theme;
localStorage.getItem("vueuse-color-scheme") || defaultSettings.theme; if (theme == "dark") {
settingsStore.changeSetting({ key: "theme", value: theme });
if (theme != "light") {
document.documentElement.classList.add("dark"); document.documentElement.classList.add("dark");
} }

View File

@ -10,8 +10,6 @@ defineProps({
}, },
}); });
const layout = computed(() => settingsStore.layout);
const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href); const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href);
</script> </script>
@ -36,8 +34,8 @@ const logo = ref(new URL(`../../../assets/logo.png`, import.meta.url).href);
to="/" to="/"
> >
<img v-if="settingsStore.sidebarLogo" :src="logo" class="w-5 h-5" /> <img v-if="settingsStore.sidebarLogo" :src="logo" class="w-5 h-5" />
<span class="ml-3 text-white text-sm font-bold" <span class="ml-3 text-white text-sm font-bold">
>vue3-element-admin</span {{ $t("login.title") }}</span
> >
</router-link> </router-link>
</transition> </transition>

View File

@ -20,9 +20,7 @@ export const useSettingsStore = defineStore("setting", () => {
); );
const theme = useStorage<string>("theme", defaultSettings.theme); const theme = useStorage<string>("theme", defaultSettings.theme);
if (theme.value == "light") {
document.body.classList.remove("dark");
}
// actions // actions
function changeSetting(param: { key: string; value: any }) { function changeSetting(param: { key: string; value: any }) {
const { key, value } = param; const { key, value } = param;
@ -47,6 +45,9 @@ export const useSettingsStore = defineStore("setting", () => {
break; break;
case "theme": case "theme":
theme.value = value; theme.value = value;
if (theme.value !== "dark") {
document.documentElement.classList.remove("dark");
}
break; break;
} }
} }