|
|
@@ -2,7 +2,7 @@
|
|
|
|
|
|
import Link from "next/link";
|
|
|
import { GitBranch, ListVideo } from "lucide-react";
|
|
|
-import { useMemo, useState } from "react";
|
|
|
+import { useMemo } from "react";
|
|
|
import { AppShell } from "@/components/AppShell";
|
|
|
import { EmptyState, ErrorState, LoadingState } from "@/components/StateBlocks";
|
|
|
import {
|
|
|
@@ -18,33 +18,10 @@ import {
|
|
|
import type { FlowLedgerRow, VideoRef } from "@/lib/flow-ledger/types";
|
|
|
import { useFlowLedger } from "./useFlowLedger";
|
|
|
|
|
|
-type GroupId = "source" | "videos" | "rules" | "walk" | "assets";
|
|
|
-
|
|
|
-const GROUPS: Array<{ id: GroupId; label: string; tone: string }> = [
|
|
|
- { id: "source", label: "搜索词来源", tone: "gray" },
|
|
|
- { id: "videos", label: "首轮搜到的视频", tone: "green" },
|
|
|
- { id: "rules", label: "内容判断", tone: "green" },
|
|
|
- { id: "walk", label: "继续扩展", tone: "blue" },
|
|
|
- { id: "assets", label: "最终收获", tone: "blue" }
|
|
|
-];
|
|
|
-
|
|
|
export function LedgerPage({ runId }: { runId: string }) {
|
|
|
const { ledger, input, loading, error, reload } = useFlowLedger(runId);
|
|
|
- const [hidden, setHidden] = useState<Set<GroupId>>(new Set());
|
|
|
|
|
|
const rows = ledger?.rows || [];
|
|
|
- const tableClass = [
|
|
|
- hidden.has("source") ? "source-hidden" : ""
|
|
|
- ].filter(Boolean).join(" ");
|
|
|
-
|
|
|
- function toggle(group: GroupId) {
|
|
|
- setHidden((current) => {
|
|
|
- const next = new Set(current);
|
|
|
- if (next.has(group)) next.delete(group);
|
|
|
- else next.add(group);
|
|
|
- return next;
|
|
|
- });
|
|
|
- }
|
|
|
|
|
|
const headerSubtitle = useMemo(() => {
|
|
|
if (!input) return "查看搜索词如何一路产生内容";
|
|
|
@@ -72,43 +49,25 @@ export function LedgerPage({ runId }: { runId: string }) {
|
|
|
</div>
|
|
|
</details>
|
|
|
|
|
|
- <div className="legend">
|
|
|
- {GROUPS.map((group) => (
|
|
|
- <span className={`legend-group ${group.tone}`} key={group.id}>
|
|
|
- <button className={`legend-head ${hidden.has(group.id) ? "off" : ""}`} type="button" onClick={() => toggle(group.id)}>
|
|
|
- {group.label}
|
|
|
- </button>
|
|
|
- </span>
|
|
|
- ))}
|
|
|
- <span className="legend-hint">点击组名显示/隐藏 · 左侧来源列固定 · 视频卡片展示 V4 分项评分</span>
|
|
|
- </div>
|
|
|
-
|
|
|
<section className="table-wrap">
|
|
|
- <table className={`ledger-table ${tableClass}`}>
|
|
|
+ <table className="ledger-table">
|
|
|
<thead>
|
|
|
<tr>
|
|
|
- {!hidden.has("source") ? <th className="group-source sticky-source">搜索词来源</th> : null}
|
|
|
- {!hidden.has("videos") ? <th className="group-videos">首轮搜到的视频</th> : null}
|
|
|
- {!hidden.has("rules") ? <th className="group-rules">内容判断</th> : null}
|
|
|
- {!hidden.has("walk") ? <th className="group-walk">继续扩展</th> : null}
|
|
|
- {!hidden.has("assets") ? <th className="group-assets">最终收获</th> : null}
|
|
|
- </tr>
|
|
|
- <tr>
|
|
|
- {!hidden.has("source") ? <th className="sub-source sticky-source">搜什么 / 从哪里来</th> : null}
|
|
|
- {!hidden.has("videos") ? <th className="sub-videos">预览 / 统计 / 入口</th> : null}
|
|
|
- {!hidden.has("rules") ? <th className="sub-rules">判断结果</th> : null}
|
|
|
- {!hidden.has("walk") ? <th className="sub-walk">有没有继续找</th> : null}
|
|
|
- {!hidden.has("assets") ? <th className="sub-assets">留下了什么</th> : null}
|
|
|
+ <th className="group-source sticky-source">需求 -> query</th>
|
|
|
+ <th className="group-videos">query -> 渠道</th>
|
|
|
+ <th className="group-rules">渠道 -> 判断</th>
|
|
|
+ <th className="group-walk">判断 -> 游走</th>
|
|
|
+ <th className="group-assets">最终收获</th>
|
|
|
</tr>
|
|
|
</thead>
|
|
|
<tbody>
|
|
|
{rows.map((row) => (
|
|
|
<tr className="ledger-row" key={row.id}>
|
|
|
- {!hidden.has("source") ? <SourceCell row={row} /> : null}
|
|
|
- {!hidden.has("videos") ? <VideoCell runId={runId} row={row} /> : null}
|
|
|
- {!hidden.has("rules") ? <RuleSummaryCell row={row} /> : null}
|
|
|
- {!hidden.has("walk") ? <WalkCell runId={runId} row={row} /> : null}
|
|
|
- {!hidden.has("assets") ? <AssetCell row={row} /> : null}
|
|
|
+ <SourceCell row={row} />
|
|
|
+ <VideoCell runId={runId} row={row} />
|
|
|
+ <RuleSummaryCell row={row} />
|
|
|
+ <WalkCell runId={runId} row={row} />
|
|
|
+ <AssetCell row={row} />
|
|
|
</tr>
|
|
|
))}
|
|
|
</tbody>
|