跳转到主要内容

Documentation Index

Fetch the complete documentation index at: https://help.helloazhenweb.top/llms.txt

Use this file to discover all available pages before exploring further.

/report 报告页面把你的生日倒计时与完整音乐库整合到一个可分享的体验中。它被组织成三个标签页 — Overview(总览)、Birthday(生日)和 Music Report(音乐报告) — 每个标签都从不同视角呈现同一份数据。当前激活的标签会保存在 sessionStorage 中,跨页面刷新也能保留。

标签页

Overview(总览)

Overview 是默认的落地视图。它包含两个垂直堆叠的区块: 生日倒计时 — 与首页相同的”距离生日还有多少天”数字,以翠绿色大号字体显示。如果今天就是生日,这里会显示为 生日快乐! 音乐统计网格 — 一个 2×2 的卡片网格(在宽屏上为 4×1),数据来自 lib/music-config.ts
统计卡片数据来源强调色
歌曲总数所有歌单中歌曲的总数翠绿色
歌单总数歌单数量紫色
最爱风格musicConfig.preferences.favoriteGenre琥珀色
心情musicConfig.preferences.mood粉色
音乐统计区域中的 进入听歌报告 → 按钮可以直接跳转到 Music Report 标签页。

Birthday 标签页

Birthday 标签页显示一个全屏、垂直居中的倒计时 — 和 Overview 中的组件相同,但去除了周围内容,让它填满整个视口。这非常适合用于分享或在大屏上展示。

Music Report 标签页

Music Report 标签页是一个全屏、按吸附滚动的体验。导航栏和标签栏会被隐藏,让内容不被任何元素打扰。 歌曲库中的每一首歌都拥有自己的全屏段落。每个段落内你会看到:
  • 一张从歌曲 backgroundUrl 取来的 全屏背景图,并叠加一层深色渐变
  • 漂浮歌词,从歌曲的 lyrics 字段中取最多五行漂过背景
  • 歌曲序号(如 01 / 08)位于顶部居中位置
  • 用大号显示字体呈现的 歌曲标题
  • 翠绿色的 艺人名
  • 一张 个人留言 卡 — 歌曲的 description 字段,未设置时回退到默认文案
  • 在主内容下方左右交替排列的最多四张 歌词卡片
每个段落左下角的返回箭头可以回到 /report 页面。
在移动端,吸附滚动意味着向上滑动就能干净地切换到下一首歌段落。桌面端可以使用鼠标滚轮或触控板。每个段落底部(最后一个除外)有一个微动的下箭头,提示下方还有内容。

会话级保留

报告会在同一个浏览器会话内记住你上次查看的标签页。如果你离开后再回来,会回到原本的标签页。打开新的浏览器标签页则总是回到 Overview。

配置报告内容

Music Report 中显示的歌曲、描述、背景图和歌词都来自 lib/music-config.ts。请参阅 配置音乐,了解如何添加歌曲、撰写描述以及设置背景图。