feat(web): clickable home stats, drop recent-ingest panel, rename watch link
This commit is contained in:
1 parent
bfde231b90
commit
1ed3746f4b
6 files changed
+26
-31
No files matched your search
+1
-1
@@ -530,7 +530,7 @@ P3 实现说明:
|
|||||||
|
|
||||||
| 页面 | 内容 |
|
| 页面 | 内容 |
|
||||||
|---|---|
|
|---|---|
|
||||||
| 首页 | 最新动态优先:今日增量、最新入库、最近发布、增长动态、热度速览、容量与采集状态。 |
|
| 首页 | 最新动态优先:顶部四个可点击数据卡片(今日入库→视频榜按入库排序、播放增量→视频榜按 1 日增长排序、粉丝日增→粉丝页、待确认候选→候选页);下方为最近发布、增长动态、热度速览、历史收藏夹与采集状态。 |
|
||||||
| 视频(`/videos`) | 内容效率(默认)、综合热度、发布时间、入库时间、播放/投币/收藏/评论、互动率、播放增量、播放增速;工具条为「排序」下拉 + 时间下拉 + 右侧放大镜搜索框(一行展示),时间支持全部/7 天/30 天/90 天/1 年/年份。 |
|
| 视频(`/videos`) | 内容效率(默认)、综合热度、发布时间、入库时间、播放/投币/收藏/评论、互动率、播放增量、播放增速;工具条为「排序」下拉 + 时间下拉 + 右侧放大镜搜索框(一行展示),时间支持全部/7 天/30 天/90 天/1 年/年份。 |
|
||||||
| UP主(`/ups`) | 独立入口,不再与视频混排;排序下拉含内容效率、互动效率、内容量、总播放、视频数、平均播放、总互动、最近发布;不提供按视频数筛选。 |
|
| UP主(`/ups`) | 独立入口,不再与视频混排;排序下拉含内容效率、互动效率、内容量、总播放、视频数、平均播放、总互动、最近发布;不提供按视频数筛选。 |
|
||||||
| 数据说明(`/about`) | 数据来源与更新、发布时间/入库时间/快照日期、指标公式、时长与成熟窗口筛选、粉丝快照覆盖与已知局限;数值由 `/api/about` 动态读取。 |
|
| 数据说明(`/about`) | 数据来源与更新、发布时间/入库时间/快照日期、指标公式、时长与成熟窗口筛选、粉丝快照覆盖与已知局限;数值由 `/api/about` 动态读取。 |
|
||||||
|
|||||||
@@ -165,7 +165,7 @@ uv run python tools/seed_preview_db.py --days 7
|
|||||||
uv run python app.py serve --preview --config data/preview/config.json
|
uv run python app.py serve --preview --config data/preview/config.json
|
||||||
```
|
```
|
||||||
|
|
||||||
- 首页默认“最新动态”:今日增量、最新入库、最近发布、增长动态、热度速览、历史收藏夹与采集状态;
|
- 首页默认“最新动态”:顶部四个数据卡片(今日入库 / 播放增量 / 粉丝日增 / 待确认候选)可点击跳转(视频榜按入库或增长排序、粉丝页、候选页);下方为最近发布、增长动态、热度速览、历史收藏夹与采集状态;
|
||||||
- 「视频」与「UP主」是两个独立入口;工具条顺序为「排序」下拉 → 时间下拉(无需 label)→ 右侧自适应搜索框(最大 320px,放大镜按钮在输入框内),三者在 PC 与移动端都保持一行;
|
- 「视频」与「UP主」是两个独立入口;工具条顺序为「排序」下拉 → 时间下拉(无需 label)→ 右侧自适应搜索框(最大 320px,放大镜按钮在输入框内),三者在 PC 与移动端都保持一行;
|
||||||
- 视频排序:内容效率(默认)、综合热度、发布时间、入库时间、播放/投币/收藏/评论、互动率、播放增量/播放增速;UP 排序:内容效率、互动效率、内容量、总播放、视频数、平均播放、总互动、最近发布;
|
- 视频排序:内容效率(默认)、综合热度、发布时间、入库时间、播放/投币/收藏/评论、互动率、播放增量/播放增速;UP 排序:内容效率、互动效率、内容量、总播放、视频数、平均播放、总互动、最近发布;
|
||||||
- 时间筛选:全部 / 近 7 天 / 近 30 天 / 近 90 天 / 近 1 年 / 已入库的年份;不再提供按收藏夹过滤,UP 页也不再按视频数筛选;
|
- 时间筛选:全部 / 近 7 天 / 近 30 天 / 近 90 天 / 近 1 年 / 已入库的年份;不再提供按收藏夹过滤,UP 页也不再按视频数筛选;
|
||||||
|
|||||||
+1
-1
@@ -700,7 +700,7 @@ UP 内容效率 = EB 收缩后的 Σview / Σ内容小时
|
|||||||
|
|
||||||
| 页面 | 内容 |
|
| 页面 | 内容 |
|
||||||
|---|---|
|
|---|---|
|
||||||
| 首页 | 最新动态优先:今日增量、最新入库、最近发布、增长动态、热度速览、收藏夹容量、采集状态 |
|
| 首页 | 最新动态优先:顶部四个可点击数据卡片(今日入库 / 播放增量 / 粉丝日增 / 待确认候选)跳转对应页面;下方为最近发布、增长动态、热度速览、历史收藏夹、采集状态 |
|
||||||
| **视频** | 排序下拉:内容效率(默认)/综合热度/发布时间/入库时间/播放/投币/收藏/评论/互动率/播放增量/播放增速;时间下拉:全部/7 天/30 天/90 天/1 年/年份;搜索框约 230px;不再按收藏夹过滤 |
|
| **视频** | 排序下拉:内容效率(默认)/综合热度/发布时间/入库时间/播放/投币/收藏/评论/互动率/播放增量/播放增速;时间下拉:全部/7 天/30 天/90 天/1 年/年份;搜索框约 230px;不再按收藏夹过滤 |
|
||||||
| **UP主** | 独立入口;排序下拉:内容效率/互动效率/内容量/总播放/视频数/平均播放/总互动/最近发布;时间下拉同上;不按视频数筛选 |
|
| **UP主** | 独立入口;排序下拉:内容效率/互动效率/内容量/总播放/视频数/平均播放/总互动/最近发布;时间下拉同上;不按视频数筛选 |
|
||||||
| 工具条 | 顺序为「排序」(带 label)→ 时间(无 label)→ 右侧自适应搜索框(最大 320px,放大镜按钮内嵌),gap 10px,PC 与移动均一行 |
|
| 工具条 | 顺序为「排序」(带 label)→ 时间(无 label)→ 右侧自适应搜索框(最大 320px,放大镜按钮内嵌),gap 10px,PC 与移动均一行 |
|
||||||
|
|||||||
@@ -278,6 +278,8 @@ h1, h2, h3, p { margin: 0; }
|
|||||||
}
|
}
|
||||||
.live-chip span { display: block; color: var(--muted); font-size: 11px; }
|
.live-chip span { display: block; color: var(--muted); font-size: 11px; }
|
||||||
.live-chip strong { display: block; margin-top: 2px; font-size: 17px; letter-spacing: -0.2px; }
|
.live-chip strong { display: block; margin-top: 2px; font-size: 17px; letter-spacing: -0.2px; }
|
||||||
|
a.live-chip { text-decoration: none; color: inherit; transition: border-color 0.15s ease, background 0.15s ease; }
|
||||||
|
a.live-chip:hover { border-color: color-mix(in srgb, var(--accent) 55%, var(--border)); }
|
||||||
.live-chip.accent { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); background: var(--accent-soft); }
|
.live-chip.accent { border-color: color-mix(in srgb, var(--accent) 45%, var(--border)); background: var(--accent-soft); }
|
||||||
.live-chip.warning { border-color: color-mix(in srgb, var(--warning) 45%, var(--border)); background: var(--warning-soft); }
|
.live-chip.warning { border-color: color-mix(in srgb, var(--warning) 45%, var(--border)); background: var(--warning-soft); }
|
||||||
|
|
||||||
|
|||||||
@@ -3,14 +3,16 @@ import {
|
|||||||
emptyState, cover, sectionHeader, videoCard,
|
emptyState, cover, sectionHeader, videoCard,
|
||||||
} from "../components.js";
|
} from "../components.js";
|
||||||
import {
|
import {
|
||||||
escapeHtml, formatCount, formatDate, formatDelta, formatDateTime,
|
escapeAttr, escapeHtml, formatCount, formatDate, formatDelta, formatDateTime,
|
||||||
formatPercent, formatScore,
|
formatPercent, formatScore,
|
||||||
} from "../format.js";
|
} from "../format.js";
|
||||||
|
|
||||||
function statChip(label, value, tone = "") {
|
function statChip(label, value, { href = null, tone = "" } = {}) {
|
||||||
return `<div class="live-chip ${tone}">
|
const inner = `<span>${escapeHtml(label)}</span><strong>${value}</strong>`;
|
||||||
<span>${escapeHtml(label)}</span><strong>${value}</strong>
|
if (href) {
|
||||||
</div>`;
|
return `<a class="live-chip ${tone}" href="${escapeAttr(href)}">${inner}</a>`;
|
||||||
|
}
|
||||||
|
return `<div class="live-chip ${tone}">${inner}</div>`;
|
||||||
}
|
}
|
||||||
|
|
||||||
function heatStrip(items) {
|
function heatStrip(items) {
|
||||||
@@ -45,9 +47,8 @@ function capacity(folders) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export async function renderHome(root) {
|
export async function renderHome(root) {
|
||||||
const [overview, added, published, heat, growth] = await Promise.all([
|
const [overview, published, heat, growth] = await Promise.all([
|
||||||
api("/api/overview"),
|
api("/api/overview"),
|
||||||
api("/api/videos", { sort: "added", within_days: 7, limit: 5 }),
|
|
||||||
api("/api/videos", { sort: "published", within_days: 14, limit: 5 }),
|
api("/api/videos", { sort: "published", within_days: 14, limit: 5 }),
|
||||||
api("/api/videos", { sort: "heat", limit: 5 }),
|
api("/api/videos", { sort: "heat", limit: 5 }),
|
||||||
api("/api/videos", { sort: "growth", growth_days: 7, limit: 3 }),
|
api("/api/videos", { sort: "growth", growth_days: 7, limit: 3 }),
|
||||||
@@ -60,10 +61,6 @@ export async function renderHome(root) {
|
|||||||
? formatCount(overview.initial_import_count)
|
? formatCount(overview.initial_import_count)
|
||||||
: formatCount(overview.added_today);
|
: formatCount(overview.added_today);
|
||||||
const health = overview.snapshot_health || { total: 0, ok: 0, failed: 0 };
|
const health = overview.snapshot_health || { total: 0, ok: 0, failed: 0 };
|
||||||
const addedNote = firstDay
|
|
||||||
? `<p class="section-note">首次导入共 ${formatCount(overview.initial_import_count)} 条,
|
|
||||||
按发布时间倒序展示。后续每日增量从下一次快照开始。</p>`
|
|
||||||
: `<p class="section-note">按入库时间排序,展示最近 7 天新收录的视频。</p>`;
|
|
||||||
|
|
||||||
root.innerHTML = `<section class="page home-page">
|
root.innerHTML = `<section class="page home-page">
|
||||||
<header class="page-head home-head">
|
<header class="page-head home-head">
|
||||||
@@ -76,10 +73,18 @@ export async function renderHome(root) {
|
|||||||
</header>
|
</header>
|
||||||
|
|
||||||
<div class="live-strip">
|
<div class="live-strip">
|
||||||
${statChip(firstDay ? "首次导入" : "今日入库", escapeHtml(addedLabel), "accent")}
|
${statChip(firstDay ? "首次导入" : "今日入库", escapeHtml(addedLabel), {
|
||||||
${statChip("播放增量", overview.view_delta_available ? formatDelta(overview.view_delta) : "—")}
|
href: "/videos?sort=added&within_days=7", tone: "accent",
|
||||||
${statChip("粉丝日增", fans?.delta_1d === null || fans?.delta_1d === undefined ? "—" : formatDelta(fans.delta_1d))}
|
})}
|
||||||
${statChip("待确认候选", formatCount(pending), pending ? "warning" : "")}
|
${statChip("播放增量", overview.view_delta_available ? formatDelta(overview.view_delta) : "—", {
|
||||||
|
href: "/videos?sort=growth&growth_days=1",
|
||||||
|
})}
|
||||||
|
${statChip("粉丝日增", fans?.delta_1d === null || fans?.delta_1d === undefined ? "—" : formatDelta(fans.delta_1d), {
|
||||||
|
href: "/fans",
|
||||||
|
})}
|
||||||
|
${statChip("待确认候选", formatCount(pending), {
|
||||||
|
href: "/candidates", tone: pending ? "warning" : "",
|
||||||
|
})}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
${pending ? `<a class="notice-row" href="/candidates">
|
${pending ? `<a class="notice-row" href="/candidates">
|
||||||
@@ -87,18 +92,6 @@ export async function renderHome(root) {
|
|||||||
<span>请在 Telegram 中处理 →</span>
|
<span>请在 Telegram 中处理 →</span>
|
||||||
</a>` : ""}
|
</a>` : ""}
|
||||||
|
|
||||||
<section class="panel">
|
|
||||||
<div class="section-head">
|
|
||||||
<h2>最新入库</h2>
|
|
||||||
<a class="text-link" href="/videos?sort=added&within_days=7">查看全部</a>
|
|
||||||
</div>
|
|
||||||
${addedNote}
|
|
||||||
<div class="video-list">
|
|
||||||
${added.items.length ? added.items.map((item) => videoCard(item)).join("")
|
|
||||||
: emptyState("最近 7 天没有新入库视频", "搜索发现确认或 Telegram 私聊手动入库后会出现在这里。")}
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<section class="panel">
|
<section class="panel">
|
||||||
<div class="section-head">
|
<div class="section-head">
|
||||||
<h2>最近发布</h2>
|
<h2>最近发布</h2>
|
||||||
|
|||||||
@@ -48,7 +48,7 @@ export async function renderVideo(root, { params, query }) {
|
|||||||
<header class="page-head">
|
<header class="page-head">
|
||||||
<a class="back-link" href="/videos">← 返回视频榜</a>
|
<a class="back-link" href="/videos">← 返回视频榜</a>
|
||||||
<div class="head-actions">
|
<div class="head-actions">
|
||||||
${detail.url ? `<a class="button ghost" href="${escapeAttr(detail.url)}" target="_blank" rel="noreferrer">打开 B 站</a>` : ""}
|
${detail.url ? `<a class="button ghost" href="${escapeAttr(detail.url)}" target="_blank" rel="noreferrer">B 站观看</a>` : ""}
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
|||||||
Reference in new issue
Block a user