fix: 按WordPress配置隐藏博客顶部菜单
This commit is contained in:
parent
bc261f56b8
commit
d9aa7d9cc5
@ -137,7 +137,8 @@ describe('App', () => {
|
||||
});
|
||||
|
||||
expect(wrapper.find('.kt-blog__header-collapse').exists()).toBe(true);
|
||||
expect(wrapper.find('.kt-blog__header-nav').exists()).toBe(true);
|
||||
expect(wrapper.find('.kt-blog__header-nav--hover').exists()).toBe(false);
|
||||
expect(wrapper.find('.kt-blog__header-nav--end').exists()).toBe(true);
|
||||
});
|
||||
|
||||
it('loads local blog theme config by default', async () => {
|
||||
|
||||
@ -109,6 +109,7 @@ describe('useBlogTheme', () => {
|
||||
label: '首页',
|
||||
},
|
||||
],
|
||||
headerMenuVisible: false,
|
||||
home: 'https://blog.kwitsukasa.top',
|
||||
sidebarMenu: [
|
||||
{
|
||||
@ -147,6 +148,55 @@ describe('useBlogTheme', () => {
|
||||
expect(document.querySelector('#kt-blog-theme-style')?.textContent).toContain("url('http://s3.kwitsukasa.top/images/avatar-tsukasa-1.jpg')");
|
||||
});
|
||||
|
||||
it('keeps toolbar menu hidden unless WordPress exposes an explicit visibility flag', async () => {
|
||||
const { applyWordpressThemeConfig, siteConfig } = useBlogTheme();
|
||||
|
||||
applyWordpressThemeConfig({
|
||||
headerMenu: [
|
||||
{
|
||||
href: 'https://blog.kwitsukasa.top',
|
||||
label: '首页',
|
||||
},
|
||||
],
|
||||
site: {
|
||||
home: 'https://blog.kwitsukasa.top',
|
||||
},
|
||||
});
|
||||
await nextTick();
|
||||
|
||||
expect(siteConfig.value.headerMenu).toEqual([
|
||||
{
|
||||
external: false,
|
||||
href: '/',
|
||||
label: '首页',
|
||||
},
|
||||
]);
|
||||
expect(siteConfig.value.headerMenuVisible).toBe(false);
|
||||
|
||||
applyWordpressThemeConfig({
|
||||
headerMenu: [
|
||||
{
|
||||
href: 'https://blog.kwitsukasa.top/archives',
|
||||
label: '归档',
|
||||
},
|
||||
],
|
||||
headerMenuVisible: 'true',
|
||||
site: {
|
||||
home: 'https://blog.kwitsukasa.top',
|
||||
},
|
||||
});
|
||||
await nextTick();
|
||||
|
||||
expect(siteConfig.value.headerMenu).toEqual([
|
||||
{
|
||||
external: false,
|
||||
href: '/archives',
|
||||
label: '归档',
|
||||
},
|
||||
]);
|
||||
expect(siteConfig.value.headerMenuVisible).toBe(true);
|
||||
});
|
||||
|
||||
it('maps legacy Argon placeholder image config back to previous blog static assets', async () => {
|
||||
const { applyWordpressThemeConfig, siteConfig } = useBlogTheme();
|
||||
|
||||
|
||||
@ -106,26 +106,28 @@ export default defineComponent({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="kt-blog__header-nav kt-blog__header-nav--hover">
|
||||
{siteConfig.value.headerMenu.map((item) => (
|
||||
<li key={item.label} class="kt-blog__header-nav-item">
|
||||
{item.external ? (
|
||||
<a
|
||||
class="kt-blog__header-nav-link"
|
||||
href={item.href}
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
{item.label}
|
||||
</a>
|
||||
) : (
|
||||
<RouterLink class="kt-blog__header-nav-link" to={item.href}>
|
||||
{item.label}
|
||||
</RouterLink>
|
||||
)}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
{siteConfig.value.headerMenuVisible && siteConfig.value.headerMenu.length > 0 && (
|
||||
<ul class="kt-blog__header-nav kt-blog__header-nav--hover">
|
||||
{siteConfig.value.headerMenu.map((item) => (
|
||||
<li key={item.label} class="kt-blog__header-nav-item">
|
||||
{item.external ? (
|
||||
<a
|
||||
class="kt-blog__header-nav-link"
|
||||
href={item.href}
|
||||
rel="noopener noreferrer"
|
||||
target="_blank"
|
||||
>
|
||||
{item.label}
|
||||
</a>
|
||||
) : (
|
||||
<RouterLink class="kt-blog__header-nav-link" to={item.href}>
|
||||
{item.label}
|
||||
</RouterLink>
|
||||
)}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
|
||||
<ul class="kt-blog__header-nav kt-blog__header-nav--end">
|
||||
<li class="kt-blog__header-search-item">
|
||||
|
||||
@ -66,6 +66,7 @@ export interface WordpressArgonThemeConfig {
|
||||
darkmodeAutoSwitch?: 'alwaysoff' | 'alwayson' | 'system' | 'time' | string;
|
||||
enableCustomThemeColor?: boolean;
|
||||
headerMenu?: BlogThemeMenuItem[];
|
||||
headerMenuVisible?: boolean | string;
|
||||
htmlClass?: string | string[];
|
||||
site?: {
|
||||
authorAvatar?: string;
|
||||
@ -92,6 +93,7 @@ interface BlogRuntimeThemeConfig {
|
||||
backgroundOpacity: number;
|
||||
bodyClass: string[];
|
||||
headerMenu: BlogThemeMenuItem[];
|
||||
headerMenuVisible: boolean;
|
||||
siteAuthorAvatar: string;
|
||||
htmlClass: string[];
|
||||
immersionColor: boolean;
|
||||
@ -142,6 +144,7 @@ const runtimeConfig = reactive<BlogRuntimeThemeConfig>({
|
||||
backgroundOpacity: 1,
|
||||
bodyClass: ['home', 'blog', 'wp-theme-argon'],
|
||||
headerMenu: [...defaultHeaderMenu],
|
||||
headerMenuVisible: false,
|
||||
htmlClass: [
|
||||
'triple-column',
|
||||
'immersion-color',
|
||||
@ -173,6 +176,7 @@ const siteConfig = computed(() => ({
|
||||
authorName: runtimeConfig.siteAuthorName,
|
||||
description: runtimeConfig.siteDescription,
|
||||
headerMenu: runtimeConfig.headerMenu,
|
||||
headerMenuVisible: runtimeConfig.headerMenuVisible,
|
||||
home: runtimeConfig.siteHome,
|
||||
sidebarMenu: runtimeConfig.sidebarMenu,
|
||||
title: runtimeConfig.siteTitle,
|
||||
@ -296,6 +300,7 @@ function applyWordpressThemeConfig(config: WordpressArgonThemeConfig) {
|
||||
config.site?.home || config.site?.url || runtimeConfig.siteHome || runtimeConfig.siteUrl,
|
||||
);
|
||||
}
|
||||
runtimeConfig.headerMenuVisible = normalizeHeaderMenuVisible(config);
|
||||
runtimeConfig.tripleColumn = hasRemoteHtmlClass
|
||||
? nextHtmlClass.includes('triple-column')
|
||||
: runtimeConfig.tripleColumn;
|
||||
@ -915,6 +920,41 @@ function normalizePositiveNumber(value?: number | string) {
|
||||
return Number.isFinite(numericValue) ? Math.max(0, numericValue) : null;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param config WordPress/Argon 主题配置，`headerMenu` 只表示菜单数据，不表示 toolbar 菜单位置已启用。
|
||||
* @returns 是否渲染顶部工具栏菜单；未提供显式开关时默认关闭，复现当前线上 WordPress 未启用顶部菜单位置的行为。
|
||||
*/
|
||||
function normalizeHeaderMenuVisible(config: WordpressArgonThemeConfig) {
|
||||
const rawValue = config.headerMenuVisible ?? config.toolbarMenuVisible ?? config.showHeaderMenu ?? config.showToolbarMenu;
|
||||
|
||||
return normalizeBooleanFlag(rawValue) === true;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param value 后端或内联配置给出的布尔语义值，兼容 WordPress 字符串选项和真实 boolean。
|
||||
* @returns 可识别的布尔值；无法识别时返回 undefined，避免把菜单数据误当成显隐开关。
|
||||
*/
|
||||
function normalizeBooleanFlag(value: unknown): boolean | undefined {
|
||||
if (typeof value === 'boolean') {
|
||||
return value;
|
||||
}
|
||||
|
||||
if (typeof value !== 'string') {
|
||||
return undefined;
|
||||
}
|
||||
|
||||
const normalized = value.trim().toLowerCase();
|
||||
if (['1', 'true', 'yes', 'on', 'show', 'visible', 'enabled'].includes(normalized)) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (['0', 'false', 'no', 'off', 'hide', 'hidden', 'disabled'].includes(normalized)) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param value Theme image URL returned by the API or static defaults.
|
||||
* @returns CSS `url(...)` token after replacing legacy Argon demo placeholders with previous blog assets.
|
||||
|
||||
Loading…
Reference in New Issue
Block a user