feat(web): clean public home header (data date, 7d fans, video count), drop status panel
This commit is contained in:
1 parent
a392453851
commit
85b0f625a9
5 files changed
+9
-34
No files matched your search
+1
-1
@@ -539,7 +539,7 @@ P3 实现说明:
|
|||||||
|
|
||||||
| 页面 | 内容 |
|
| 页面 | 内容 |
|
||||||
|---|---|
|
|---|---|
|
||||||
| 首页 | 最新动态优先:顶部四个可点击数据卡片(今日入库→视频榜按入库排序、播放增量→视频榜按 1 日增长排序、粉丝日增→粉丝页、待确认候选→候选页);下方为最近发布、增长动态、热度速览与采集状态;三处视频区块统一使用竖排媒体卡(封面 + 两行截断标题 + 作者/数据行 + 高亮数据行),并统一为响应式网格:移动端每行 2 个、PC 每行 3 个,每处各取前 6 条。 |
|
| 首页 | 最新动态优先:标题下显示「收录视频 N」;顶部四个数据卡片为「今日入库→视频榜按入库排序 / 播放增量→视频榜按 1 日增长排序 / 7 日粉丝变化→粉丝页 / 数据日期」;下方为最近发布、增长动态、热度速览三个区块,统一使用竖排媒体卡(封面 + 两行截断标题 + 作者/数据行 + 高亮数据行)与响应式网格:移动端每行 2 个、PC 每行 3 个,每处各取前 6 条;采集/候选等运行期信息只在登录后的「系统」「候选」页可见。 |
|
||||||
| 视频(`/videos`) | 内容效率(默认)、综合热度、发布时间、入库时间、播放/投币/收藏/评论、互动率、播放增量、播放增速;工具条为「排序」下拉 + 时间下拉 + 右侧放大镜搜索框(一行展示),时间支持全部/7 天/30 天/90 天/1 年/年份。 |
|
| 视频(`/videos`) | 内容效率(默认)、综合热度、发布时间、入库时间、播放/投币/收藏/评论、互动率、播放增量、播放增速;工具条为「排序」下拉 + 时间下拉 + 右侧放大镜搜索框(一行展示),时间支持全部/7 天/30 天/90 天/1 年/年份。 |
|
||||||
| UP主(`/ups`) | 独立入口,不再与视频混排;卡片显示 UP 头像、视频数与总时长、最新粉丝数,以及当前排序的主/副指标(「总播放」排序时副指标为「平均播放」);排序下拉含内容效率、互动效率、内容量、总播放、视频数、平均播放、总互动、最近发布;不提供按视频数筛选。 |
|
| UP主(`/ups`) | 独立入口,不再与视频混排;卡片显示 UP 头像、视频数与总时长、最新粉丝数,以及当前排序的主/副指标(「总播放」排序时副指标为「平均播放」);排序下拉含内容效率、互动效率、内容量、总播放、视频数、平均播放、总互动、最近发布;不提供按视频数筛选。 |
|
||||||
| 数据说明(`/about`) | 数据来源与更新、发布时间/入库时间/快照日期、指标公式、时长与成熟窗口筛选、粉丝快照覆盖与已知局限;数值由 `/api/about` 动态读取。 |
|
| 数据说明(`/about`) | 数据来源与更新、发布时间/入库时间/快照日期、指标公式、时长与成熟窗口筛选、粉丝快照覆盖与已知局限;数值由 `/api/about` 动态读取。 |
|
||||||
|
|||||||
@@ -166,7 +166,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
|
||||||
```
|
```
|
||||||
|
|
||||||
- 首页默认“最新动态”:顶部四个数据卡片(今日入库 / 播放增量 / 粉丝日增 / 待确认候选)可点击跳转(视频榜按入库或增长排序、粉丝页、候选页);下方为最近发布、增长动态、热度速览与采集状态;“最近发布”“增长动态”“热度速览”三处统一使用竖排卡片(封面 + 两行截断标题 + 作者/数据行 + 高亮数据行),并统一为响应式网格(移动端每行 2 个、PC 每行 3 个),每处各取前 6 条;
|
- 首页默认“最新动态”:标题下显示「收录视频 N」,顶部四个数据卡片为「今日入库 / 播放增量 / 7 日粉丝变化 / 数据日期」(前三项可点击跳转);下方为最近发布、增长动态、热度速览三个区块,统一使用竖排卡片(封面 + 两行截断标题 + 作者/数据行 + 高亮数据行),并统一为响应式网格(移动端每行 2 个、PC 每行 3 个),每处各取前 6 条;采集/候选等运行期信息只在登录后的「系统」「候选」页可见;
|
||||||
- 「视频」与「UP主」是两个独立入口;工具条顺序为「排序」下拉 → 时间下拉(无需 label)→ 右侧自适应搜索框(最大 320px,放大镜按钮在输入框内),三者在 PC 与移动端都保持一行;
|
- 「视频」与「UP主」是两个独立入口;工具条顺序为「排序」下拉 → 时间下拉(无需 label)→ 右侧自适应搜索框(最大 320px,放大镜按钮在输入框内),三者在 PC 与移动端都保持一行;
|
||||||
- 视频排序:内容效率(默认)、综合热度、发布时间、入库时间、播放/投币/收藏/评论、互动率、播放增量/播放增速;UP 排序:内容效率、互动效率、内容量、总播放、视频数、平均播放、总互动、最近发布;
|
- 视频排序:内容效率(默认)、综合热度、发布时间、入库时间、播放/投币/收藏/评论、互动率、播放增量/播放增速;UP 排序:内容效率、互动效率、内容量、总播放、视频数、平均播放、总互动、最近发布;
|
||||||
- UP 卡片显示 UP 头像(无头像时显示首字母占位)、视频数/总时长与最新粉丝数;「总播放」排序时副指标显示「平均播放」(相当于平均播放榜,主副指标对调);UP 详情页也显示头像;
|
- UP 卡片显示 UP 头像(无头像时显示首字母占位)、视频数/总时长与最新粉丝数;「总播放」排序时副指标显示「平均播放」(相当于平均播放榜,主副指标对调);UP 详情页也显示头像;
|
||||||
|
|||||||
+1
-1
@@ -701,7 +701,7 @@ UP 内容效率 = EB 收缩后的 Σview / Σ内容小时
|
|||||||
|
|
||||||
| 页面 | 内容 |
|
| 页面 | 内容 |
|
||||||
|---|---|
|
|---|---|
|
||||||
| 首页 | 最新动态优先:顶部四个可点击数据卡片(今日入库 / 播放增量 / 粉丝日增 / 待确认候选)跳转对应页面;下方为最近发布、增长动态、热度速览与采集状态;三处视频区块统一竖排卡片(移动端每行 2 个、PC 每行 3 个),每处取前 6 条 |
|
| 首页 | 最新动态优先:标题下显示「收录视频 N」;顶部四个数据卡片为「今日入库 / 播放增量 / 7 日粉丝变化 / 数据日期」(前三项可点击跳转);下方为最近发布、增长动态、热度速览三个区块(竖排卡片,移动端每行 2 个、PC 每行 3 个,每处前 6 条);采集/候选等运行期信息只在登录后的「系统」「候选」页可见 |
|
||||||
| **视频** | 排序下拉:内容效率(默认)/综合热度/发布时间/入库时间/播放/投币/收藏/评论/互动率/播放增量/播放增速;时间下拉:全部/7 天/30 天/90 天/1 年/年份;搜索框约 230px;不再按收藏夹过滤 |
|
| **视频** | 排序下拉:内容效率(默认)/综合热度/发布时间/入库时间/播放/投币/收藏/评论/互动率/播放增量/播放增速;时间下拉:全部/7 天/30 天/90 天/1 年/年份;搜索框约 230px;不再按收藏夹过滤 |
|
||||||
| **UP主** | 独立入口;排序下拉:内容效率/互动效率/内容量/总播放/视频数/平均播放/总互动/最近发布;时间下拉同上;不按视频数筛选 |
|
| **UP主** | 独立入口;排序下拉:内容效率/互动效率/内容量/总播放/视频数/平均播放/总互动/最近发布;时间下拉同上;不按视频数筛选 |
|
||||||
| 工具条 | 顺序为「排序」(带 label)→ 时间(无 label)→ 右侧自适应搜索框(最大 320px,放大镜按钮内嵌),gap 10px,PC 与移动均一行 |
|
| 工具条 | 顺序为「排序」(带 label)→ 时间(无 label)→ 右侧自适应搜索框(最大 320px,放大镜按钮内嵌),gap 10px,PC 与移动均一行 |
|
||||||
|
|||||||
@@ -476,7 +476,6 @@ a.live-chip:hover { border-color: color-mix(in srgb, var(--accent) 55%, var(--bo
|
|||||||
.status-grid strong { display: block; margin-top: 2px; font-size: 12.5px; font-weight: 650; }
|
.status-grid strong { display: block; margin-top: 2px; font-size: 12.5px; font-weight: 650; }
|
||||||
/* 预计下次运行等 3 项:PC 与移动端都保持一行 */
|
/* 预计下次运行等 3 项:PC 与移动端都保持一行 */
|
||||||
.status-grid.status-row-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
|
.status-grid.status-row-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
|
||||||
.status-panel .text-link { display: inline-block; margin-top: 10px; }
|
|
||||||
|
|
||||||
.segmented {
|
.segmented {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
|
|||||||
@@ -1,9 +1,7 @@
|
|||||||
import { api } from "../api.js";
|
import { api } from "../api.js";
|
||||||
|
import { emptyState, mediaCard } from "../components.js";
|
||||||
import {
|
import {
|
||||||
emptyState, mediaCard, sectionHeader,
|
escapeAttr, escapeHtml, formatCount, formatDate, formatDelta,
|
||||||
} from "../components.js";
|
|
||||||
import {
|
|
||||||
escapeAttr, escapeHtml, formatCount, formatDate, formatDelta, formatDateTime,
|
|
||||||
formatDuration, formatPercent, formatScore,
|
formatDuration, formatPercent, formatScore,
|
||||||
} from "../format.js";
|
} from "../format.js";
|
||||||
|
|
||||||
@@ -51,20 +49,18 @@ export async function renderHome(root) {
|
|||||||
api("/api/videos", { sort: "growth", growth_days: 7, limit: 6 }),
|
api("/api/videos", { sort: "growth", growth_days: 7, limit: 6 }),
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const pending = overview.counts.candidates_pending || 0;
|
|
||||||
const fans = overview.fans;
|
const fans = overview.fans;
|
||||||
const firstDay = overview.is_first_day;
|
const firstDay = overview.is_first_day;
|
||||||
const addedLabel = firstDay
|
const addedLabel = firstDay
|
||||||
? 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 activeCount = overview.counts?.active || 0;
|
||||||
|
|
||||||
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">
|
||||||
<div>
|
<div>
|
||||||
<h1>最新动态</h1>
|
<h1>最新动态</h1>
|
||||||
<p class="page-sub">数据 ${escapeHtml(overview.data_date || "—")} ·
|
<p class="page-sub">收录视频 ${formatCount(activeCount)}</p>
|
||||||
采集 ${health.ok}/${health.total}${health.failed ? ` · 失败 ${health.failed}` : ""}</p>
|
|
||||||
</div>
|
</div>
|
||||||
<button class="icon-button" id="refresh-home" type="button" title="刷新">刷新</button>
|
<button class="icon-button" id="refresh-home" type="button" title="刷新">刷新</button>
|
||||||
</header>
|
</header>
|
||||||
@@ -76,19 +72,12 @@ export async function renderHome(root) {
|
|||||||
${statChip("播放增量", overview.view_delta_available ? formatDelta(overview.view_delta) : "—", {
|
${statChip("播放增量", overview.view_delta_available ? formatDelta(overview.view_delta) : "—", {
|
||||||
href: "/videos?sort=growth&growth_days=1",
|
href: "/videos?sort=growth&growth_days=1",
|
||||||
})}
|
})}
|
||||||
${statChip("粉丝日增", fans?.delta_1d === null || fans?.delta_1d === undefined ? "—" : formatDelta(fans.delta_1d), {
|
${statChip("7 日粉丝变化", fans?.delta_7d === null || fans?.delta_7d === undefined ? "—" : formatDelta(fans.delta_7d), {
|
||||||
href: "/fans",
|
href: "/fans",
|
||||||
})}
|
})}
|
||||||
${statChip("待确认候选", formatCount(pending), {
|
${statChip("数据日期", escapeHtml(overview.data_date || "—"))}
|
||||||
href: "/candidates", tone: pending ? "warning" : "",
|
|
||||||
})}
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
${pending ? `<a class="notice-row" href="/candidates">
|
|
||||||
<strong>${formatCount(pending)} 条候选待确认</strong>
|
|
||||||
<span>请在 Telegram 中处理 →</span>
|
|
||||||
</a>` : ""}
|
|
||||||
|
|
||||||
<section class="panel">
|
<section class="panel">
|
||||||
<div class="section-head">
|
<div class="section-head">
|
||||||
<h2>最近发布</h2>
|
<h2>最近发布</h2>
|
||||||
@@ -118,19 +107,6 @@ export async function renderHome(root) {
|
|||||||
</div>
|
</div>
|
||||||
${heatGrid(heat.items)}
|
${heatGrid(heat.items)}
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section class="panel status-panel">
|
|
||||||
${sectionHeader("采集状态")}
|
|
||||||
<div class="status-grid">
|
|
||||||
<div><span>快照完成</span><strong>${overview.snapshot_completed_today ? "是" : "否"}</strong></div>
|
|
||||||
<div><span>数据日期</span><strong>${escapeHtml(overview.data_date || "—")}</strong></div>
|
|
||||||
<div><span>粉丝</span><strong>${formatCount(fans?.follower)}</strong></div>
|
|
||||||
<div><span>7 日粉丝</span><strong>${fans?.delta_7d === null || fans?.delta_7d === undefined ? "—" : formatDelta(fans.delta_7d)}</strong></div>
|
|
||||||
<div><span>最近快照</span><strong>${escapeHtml(formatDateTime(overview.tasks?.snapshot?.finished_at))}</strong></div>
|
|
||||||
<div><span>最近发现</span><strong>${escapeHtml(formatDateTime(overview.tasks?.discovery?.finished_at))}</strong></div>
|
|
||||||
</div>
|
|
||||||
<a class="text-link" href="/system">查看系统状态 →</a>
|
|
||||||
</section>
|
|
||||||
</section>`;
|
</section>`;
|
||||||
|
|
||||||
root.querySelector("#refresh-home")?.addEventListener("click", () => window.location.reload());
|
root.querySelector("#refresh-home")?.addEventListener("click", () => window.location.reload());
|
||||||
|
|||||||
Reference in new issue
Block a user