anian
128 lines
4.4 KiB
HTML
128 lines
4.4 KiB
HTML
<header id="masthead" class="site-header">
|
|
<div class="top_bar uk-sticky">
|
|
<div class="mobile_logo">
|
|
<a href="/"><img th:src="${theme.config.base_top_set.mobile_logo}"></a>
|
|
</div>
|
|
|
|
<th:block th:replace="~{'modules/header/header-search'}"></th:block>
|
|
|
|
<th:block th:if="${not #strings.contains('mod_third,mod_third_s',theme.config.style.layout_set)}">
|
|
<th:block th:replace="~{modules/header/header-tool :: header-tool}"></th:block>
|
|
</th:block>
|
|
|
|
<th:block th:unless="${not #strings.contains('mod_third,mod_third_s',theme.config.style.layout_set)}">
|
|
<th:block th:replace="~{modules/header/header-tool :: header-tool-third}"></th:block>
|
|
</th:block>
|
|
|
|
</div>
|
|
<div class="uk-sticky-placeholder" hidden="" style="height: 72px; width: 590px; margin: 0px;"></div>
|
|
|
|
|
|
</header><!-- #masthead -->
|
|
|
|
<div class="index_banner" id="banner" uk-img="loading: eager">
|
|
<div class="user_info">
|
|
<div class="top">
|
|
<div class="left">
|
|
<div class="name">[[${theme.config.base_set.nice_name}]]</div>
|
|
<div class="des">[[${theme.config.base_set.admin_des}]]</div>
|
|
</div>
|
|
<div class="avatar"><img th:src="${theme.config.base_set.default_avatar}"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// --------------------------
|
|
// 配置区域（请替换为实际图片地址）
|
|
// --------------------------
|
|
const BANNER_CONFIG = {
|
|
seasonal: {
|
|
'春': '/themes/theme-pix/assets/img/banner-chun.webp',
|
|
'夏': '/themes/theme-pix/assets/img/banner-xia.webp',
|
|
'秋': '/themes/theme-pix/assets/img/banner-qiu.webp',
|
|
'冬': '/themes/theme-pix/assets/img/banner-dong.webp'
|
|
},
|
|
fallback: '/themes/theme-pix/assets/img/banner-all.webp'
|
|
};
|
|
|
|
// --------------------------
|
|
// 原有 Cookie 工具函数（保持不变）
|
|
// --------------------------
|
|
function anian_setDailyCookie(name, value) {
|
|
const now = new Date();
|
|
const china = new Date(now.getTime() + 8 * 3600 * 1000);
|
|
const expires = new Date(Date.UTC(china.getUTCFullYear(), china.getUTCMonth(), china.getUTCDate(), 15, 59, 59));
|
|
document.cookie = `${encodeURIComponent(name)}=${encodeURIComponent(value)}; expires=${expires.toUTCString()}; path=/`;
|
|
}
|
|
|
|
function anian_getCookie(name) {
|
|
const nameEQ = encodeURIComponent(name) + '=';
|
|
const ca = document.cookie.split(';');
|
|
for (let i = 0; i < ca.length; i++) {
|
|
let c = ca[i];
|
|
while (c.charAt(0) === ' ') c = c.substring(1);
|
|
if (c.indexOf(nameEQ) === 0) return decodeURIComponent(c.substring(nameEQ.length));
|
|
}
|
|
return null;
|
|
}
|
|
|
|
// --------------------------
|
|
// 新增：Banner 图片切换逻辑
|
|
// --------------------------
|
|
function setBanner(lunarInfo) {
|
|
const banner = document.getElementById('banner');
|
|
if (!banner) return;
|
|
|
|
// 根据季节选图，无匹配则用兜底
|
|
const season = lunarInfo?.jijie;
|
|
const imgUrl = BANNER_CONFIG.seasonal[season] || BANNER_CONFIG.fallback;
|
|
|
|
// 可以根据日期、节日覆盖imgUrl
|
|
|
|
// 设置图片并触发 UIkit 加载
|
|
banner.setAttribute('data-src', imgUrl);
|
|
window.UIkit && UIkit.update(banner);
|
|
}
|
|
|
|
// --------------------------
|
|
// 初始化逻辑（优化版）
|
|
// --------------------------
|
|
(function() {
|
|
const apiUrl = 'https://api.anian.net/lunar/api';
|
|
const cookieName = 'anian_lunar_info';
|
|
|
|
// 1. 优先尝试从 Cookie 读取
|
|
const cached = anian_getCookie(cookieName);
|
|
if (cached) {
|
|
try {
|
|
setBanner(JSON.parse(cached));
|
|
return; // 有缓存直接结束
|
|
} catch (e) {}
|
|
}
|
|
|
|
// 2. 无缓存则请求 API
|
|
fetch(apiUrl)
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
// 组装农历信息，保持 cookie 字段名不变
|
|
const lunarInfo = {
|
|
ganzhiYear: data.nian || '',
|
|
lunarMonth: data.yue || '',
|
|
lunarDay: data.ri || '',
|
|
jieqi: data.jieqi || '',
|
|
jijie: data.jijie || '',
|
|
shengxiao: data.shengxiao || '',
|
|
traditionalFestival: data.jieri || ''
|
|
};
|
|
|
|
// 存 Cookie 并设置 Banner
|
|
anian_setDailyCookie(cookieName, JSON.stringify(lunarInfo));
|
|
setBanner(lunarInfo);
|
|
})
|
|
.catch(() => {
|
|
// 3. 失败兜底：显示默认图
|
|
setBanner(null);
|
|
});
|
|
})();
|
|
</script> |