|
|
@@ -2,7 +2,6 @@
|
|
|
|
|
|
import Link from "next/link";
|
|
|
import { GitBranch, ListVideo } from "lucide-react";
|
|
|
-import { useMemo } from "react";
|
|
|
import { AppShell } from "@/components/AppShell";
|
|
|
import { EmptyState, ErrorState, LoadingState } from "@/components/StateBlocks";
|
|
|
import {
|
|
|
@@ -19,36 +18,21 @@ import type { FlowLedgerRow, VideoRef } from "@/lib/flow-ledger/types";
|
|
|
import { useFlowLedger } from "./useFlowLedger";
|
|
|
|
|
|
export function LedgerPage({ runId }: { runId: string }) {
|
|
|
- const { ledger, input, loading, error, reload } = useFlowLedger(runId);
|
|
|
+ const { ledger, loading, error, reload } = useFlowLedger(runId);
|
|
|
|
|
|
const rows = ledger?.rows || [];
|
|
|
|
|
|
- const headerSubtitle = useMemo(() => {
|
|
|
- if (!input) return "查看搜索词如何一路产生内容";
|
|
|
- const firstRound = Number(input.summary.first_round_query_count || rows.length);
|
|
|
- const extension = Number(input.summary.extension_query_count || 0);
|
|
|
- const videoCount = rows.reduce((sum, row) => sum + row.firstRoundVideoTotal, 0);
|
|
|
- return `首轮 ${firstRound} 个搜索词,继续扩展 ${extension} 个搜索词,首轮找到 ${videoCount} 条视频`;
|
|
|
- }, [input, rows]);
|
|
|
-
|
|
|
return (
|
|
|
- <AppShell title="流程账本" subtitle={headerSubtitle} onRefresh={reload}>
|
|
|
+ <AppShell
|
|
|
+ title="本次流程摘要"
|
|
|
+ titleExtra={ledger ? <HeaderSummaryChips rows={rows} dataOriginLabel={ledger.dataOriginLabel} /> : null}
|
|
|
+ onRefresh={reload}
|
|
|
+ >
|
|
|
{loading ? <LoadingState /> : null}
|
|
|
{error ? <ErrorState message={error} /> : null}
|
|
|
{!loading && !error && !rows.length ? <EmptyState label="没有可展示的搜索流程记录" /> : null}
|
|
|
{ledger ? (
|
|
|
<>
|
|
|
- <details className="source-block" open>
|
|
|
- <summary>本次流程摘要</summary>
|
|
|
- <div className="source-body">
|
|
|
- <span className="chip blue">搜索词 {rows.length}</span>
|
|
|
- <span className="chip green">首轮视频 {rows.reduce((sum, row) => sum + row.firstRoundVideoTotal, 0)}</span>
|
|
|
- <span className="chip yellow">待复看 {rows.reduce((sum, row) => sum + row.ruleSummary.reviewCount, 0)}</span>
|
|
|
- <span className="chip">入池 {rows.reduce((sum, row) => sum + row.finalAssets.assetCount, 0)}</span>
|
|
|
- <span className="chip blue">{ledger.dataOriginLabel}</span>
|
|
|
- </div>
|
|
|
- </details>
|
|
|
-
|
|
|
<section className="table-wrap">
|
|
|
<table className="ledger-table">
|
|
|
<thead>
|
|
|
@@ -79,6 +63,18 @@ export function LedgerPage({ runId }: { runId: string }) {
|
|
|
);
|
|
|
}
|
|
|
|
|
|
+function HeaderSummaryChips({ rows, dataOriginLabel }: { rows: FlowLedgerRow[]; dataOriginLabel: string }) {
|
|
|
+ return (
|
|
|
+ <div className="header-summary-chips">
|
|
|
+ <span className="chip blue">搜索词 {rows.length}</span>
|
|
|
+ <span className="chip green">首轮视频 {rows.reduce((sum, row) => sum + row.firstRoundVideoTotal, 0)}</span>
|
|
|
+ <span className="chip yellow">待复看 {rows.reduce((sum, row) => sum + row.ruleSummary.reviewCount, 0)}</span>
|
|
|
+ <span className="chip">入池 {rows.reduce((sum, row) => sum + row.finalAssets.assetCount, 0)}</span>
|
|
|
+ <span className="chip blue">{dataOriginLabel}</span>
|
|
|
+ </div>
|
|
|
+ );
|
|
|
+}
|
|
|
+
|
|
|
function SourceCell({ row }: { row: FlowLedgerRow }) {
|
|
|
const details = row.source.details.length ? row.source.details : [sourceEvidence(row)];
|
|
|
return (
|