diff --git a/packages/effects/layouts/src/basic/layout.vue b/packages/effects/layouts/src/basic/layout.vue index 59b45e99c..f8d8dc5eb 100644 --- a/packages/effects/layouts/src/basic/layout.vue +++ b/packages/effects/layouts/src/basic/layout.vue @@ -38,7 +38,10 @@ import { useLayoutScroll } from './use-layout-scroll'; defineOptions({ name: 'BasicLayout' }); -withDefaults(defineProps(), { +const props = withDefaults(defineProps(), { + logoSrc: '', + logoSrcDark: '', + logoText: '', avatar: '', text: '', }); @@ -50,10 +53,27 @@ const emit = defineEmits<{ }>(); interface Props { + /** 自定义 Logo 图片地址,不传则使用偏好设置默认值 */ + logoSrc?: string; + /** 自定义暗色主题 Logo 图片地址 */ + logoSrcDark?: string; + /** 自定义 Logo 文本,不传则使用偏好设置默认值 */ + logoText?: string; + /** 用户头像图片地址 */ avatar?: string; + /** 用户文本(如用户名) */ text?: string; } +/** 最终使用的 Logo 图片地址(自定义优先,否则使用默认) */ +const finalLogoSrc = computed(() => props.logoSrc || preferences.logo.source); +/** 最终使用的暗色 Logo 图片地址 */ +const finalLogoSrcDark = computed( + () => props.logoSrcDark || preferences.logo.sourceDark, +); +/** 最终使用的 Logo 文本(自定义优先,否则使用默认应用名称) */ +const finalLogoText = computed(() => props.logoText || preferences.app.name); + const { isDark, isHeaderNav, @@ -323,9 +343,9 @@ const headerSlots = computed(() => { :fit="preferences.logo.fit" :class="logoClass" :collapsed="logoCollapsed" - :src="preferences.logo.source" - :src-dark="preferences.logo.sourceDark" - :text="preferences.app.name" + :src="finalLogoSrc" + :src-dark="finalLogoSrcDark" + :text="finalLogoText" :show-text="preferences.logo.showText" :logo-mode="preferences.logo.logoMode" :full-logo-height="preferences.logo.fullLogoHeight" @@ -419,8 +439,8 @@ const headerSlots = computed(() => {