fix: 横向模式的标题渲染

This commit is contained in:
wang_fan_w 2024-06-16 23:37:25 +08:00
parent b03fd269f9
commit 859845158f

View File

@ -1,7 +1,7 @@
<template> <template>
<div :class="layoutType == 'layoutHead' ? 'logo_head no-border' : 'logo_head'"> <div :class="layoutType == 'layoutHead' ? 'logo_head no-border' : 'logo_head'">
<img :src="Logo" class="logo" /> <img :src="Logo" class="logo" />
<span :class="isDark ? 'logo_title dark' : 'logo_title'" v-if="!collapsed">dc admin</span> <span :class="isDark ? 'logo_title dark' : 'logo_title'" v-if="isTitle">dc admin</span>
</div> </div>
</template> </template>
@ -12,6 +12,7 @@ import { useThemeConfig } from "@/store/modules/theme-config";
const themeStore = useThemeConfig(); const themeStore = useThemeConfig();
const { collapsed, asideDark, layoutType } = storeToRefs(themeStore); const { collapsed, asideDark, layoutType } = storeToRefs(themeStore);
//
const isDark = computed(() => { const isDark = computed(() => {
if (asideDark.value && layoutType.value != "layoutHead") { if (asideDark.value && layoutType.value != "layoutHead") {
return true; return true;
@ -19,6 +20,15 @@ const isDark = computed(() => {
return false; return false;
} }
}); });
//
const isTitle = computed(() => {
if (!collapsed.value || layoutType.value == "layoutHead") {
return true;
} else {
return false;
}
});
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>