feat(web): W3-3 site workbench, sources/feeds/snapshots, downloads with business timeline, organization records and agent sessions

- sites + /sites/:siteId: organized view with snapshot-first release list, inventory overlay, candidate reasons, volatile-field recheck, stale marking that keeps existing data, live search, unified download entry; origin view placeholder (M2) - sources: feed CRUD/enable/fetch/reset, cursor/health/gap hints; per-site snapshot history - tasks: download tasks with pause/resume (threshold pause cannot be bypassed), plans, cache volume thresholds and cleanup, business timeline (observation → plan → download → organization → agent/engine) - organize: record list/detail with file-level results, manual organize with dryRun preview - agent: session list/page and layout drawer with context prefix; streaming events, tool cards, rejection alerts, compaction, budget meters, model text vs server report; mock switch (?mock=1) until W2-D endpoints land Co-Authored-By: Claude Opus 5.5 <[email protected]>
2026-09-27 20:52:32 +08:00
1 parent 6280d52ec3
commit 7103bc8f7c
@@ -0,0 +1,124 @@
+import type { Dashboard } from "@umt/contracts";
+import { Brush, HardDrive } from "lucide-react";
+import { toast } from "sonner";
+import { useCacheCleanup, useCacheVolumes } from "~/api/downloads.ts";
+import { ConfirmDialog } from "~/components/console/confirm-dialog.tsx";
+import { ErrorState, LoadingState } from "~/components/console/empty-state.tsx";
+import { StatusBadge } from "~/components/console/status-badge.tsx";
+import { Button } from "~/components/ui/button.tsx";
+import { errorMessage } from "~/lib/api.ts";
+import { cn, formatBytes } from "~/lib/utils.ts";
+
+type Volume = Dashboard["cache"]["volumes"][number];
+
+function VolumeBar({ v }: { v: Volume }) {
+  const pct = v.usedPercent;
+  const tripped = pct !== null && pct >= v.hardThresholdPercent;
+  const nearing = pct !== null && !tripped && pct >= v.resumePercent;
+  return (
+    <div className="min-w-0">
+      <div className="flex flex-wrap items-baseline justify-between gap-2">
+        <span className="flex min-w-0 items-center gap-1.5 text-sm font-medium text-foreground">
+          <HardDrive className="h-3.5 w-3.5 shrink-0 text-muted-foreground" />
+          <span className="truncate">{v.volumeKey}</span>
+        </span>
+        <span className="text-meta text-muted-foreground tabular-nums">
+          {pct === null ? "使用率未知" : `${pct.toFixed(1)}%`}
+          {v.usedBytes !== null && v.totalBytes !== null
+            ? ` · ${formatBytes(v.usedBytes, 1)} / ${formatBytes(v.totalBytes, 1)}`
+            : ""}
+        </span>
+      </div>
+      <div className="relative mt-1.5 h-1.5 rounded-full bg-foreground/[0.08]">
+        {pct !== null ? (
+          <div
+            className={cn(
+              "h-full rounded-full",
+              tripped ? "bg-destructive" : nearing ? "bg-warning" : "bg-foreground/60",
+            )}
+            style={{ width: `${Math.min(100, pct)}%` }}
+          />
+        ) : null}
+        <span
+          aria-hidden
+          className="absolute -top-1 h-3.5 w-px bg-destructive"
+          style={{ left: `${v.hardThresholdPercent}%` }}
+          title={`硬阈值 ${v.hardThresholdPercent}%`}
+        />
+        <span
+          aria-hidden
+          className="absolute -top-1 h-3.5 w-px bg-muted-foreground"
+          style={{ left: `${v.resumePercent}%` }}
+          title={`恢复水位 ${v.resumePercent}%`}
+        />
+      </div>
+      <div className="mt-1.5 flex flex-wrap gap-x-3 gap-y-1 text-meta text-muted-foreground">
+        <span>
+          硬阈值 {v.hardThresholdPercent}% / 恢复 {v.resumePercent}%
+        </span>
+        <span>在途 {formatBytes(v.pendingBytes, 1)}</span>
+        <span>预留 {formatBytes(v.reservedBytes, 1)}</span>
+        <span>可清理 {formatBytes(v.cleanableBytes, 1)}</span>
+        <span>保留锁定 {formatBytes(v.retentionLockedBytes, 1)}</span>
+      </div>
+      <div className="mt-1.5 flex flex-wrap gap-1.5">
+        {pct === null ? <StatusBadge tone="warning">读不到磁盘状态:已保守阻止新提交</StatusBadge> : null}
+        {tripped ? <StatusBadge tone="destructive">已达硬阈值:停止新提交</StatusBadge> : null}
+        {v.pausedByThreshold ? <StatusBadge tone="warning">阈值暂停 {v.pausedByThreshold} 个任务</StatusBadge> : null}
+      </div>
+      {v.notes.map((n) => (
+        <p key={n} className="mt-1 text-meta text-muted-foreground">
+          {n}
+        </p>
+      ))}
+    </div>
+  );
+}
+
+/** 缓存卷用量 / 阈值条 + 手动清理入口 */
+export function CacheVolumes() {
+  const vols = useCacheVolumes();
+  const cleanup = useCacheCleanup();
+  return (
+    <section className="pg-slab mb-6 rounded-xl p-4">
+      <div className="mb-3 flex flex-wrap items-center justify-between gap-2">
+        <h2 className="text-label font-semibold tracking-[0.18em] text-muted-foreground uppercase">缓存与保留</h2>
+        <ConfirmDialog
+          trigger={
+            <Button variant="outline" size="sm" disabled={cleanup.isPending}>
+              <Brush />
+              立即清理
+            </Button>
+          }
+          title="按规则清理下载缓存?"
+          description="只清理已核验入库、且满足保留期与 H&R 的纳管任务;未纳管任务与未满足保留的不会动。"
+          confirmLabel="清理"
+          onConfirm={() =>
+            cleanup.mutateAsync(undefined).then(
+              (r) => {
+                const vols = (r.report as { volumes?: { removed?: unknown[]; skipped?: unknown[] }[] }).volumes ?? [];
+                const removed = vols.reduce((n, v) => n + (v.removed?.length ?? 0), 0);
+                const skipped = vols.reduce((n, v) => n + (v.skipped?.length ?? 0), 0);
+                toast.success(`清理完成:移除 ${removed} 个任务的缓存${skipped ? `,${skipped} 个因保留/H&R 跳过` : ""}`);
+              },
+              (e) => toast.error(errorMessage(e)),
+            )
+          }
+        />
+      </div>
+      {vols.isPending ? (
+        <LoadingState rows={2} />
+      ) : vols.error ? (
+        <ErrorState plain error={vols.error} onRetry={() => void vols.refetch()} />
+      ) : !vols.data.length ? (
+        <p className="text-caption text-muted-foreground">还没有下载器缓存卷的统计(未配置下载器或尚未巡检)。</p>
+      ) : (
+        <div className="grid gap-5 md:grid-cols-2">
+          {vols.data.map((v) => (
+            <VolumeBar key={v.volumeKey} v={v} />
+          ))}
+        </div>
+      )}
+    </section>
+  );
+}