UHD_Media_Tool/apps/web/app/components/downloads/business-tasks.tsx

import { keepPreviousData, useInfiniteQuery, useMutation, useQueryClient } from "@tanstack/react-query";
import { cursorPage, Task, type TaskKind, type TaskStatus } from "@umt/contracts";
import { ListTodo, RotateCcw, Square } from "lucide-react";
import { useState } from "react";
import { Link } from "react-router";
import { toast } from "sonner";
import { apiMutate, apiParsed, cleanParams } from "~/api/parse.ts";
import { type DataColumn, DataTable } from "~/components/console/data-table.tsx";
import { DetailSection, DetailSheet } from "~/components/console/detail-sheet.tsx";
import { FilterBar, FilterSelect } from "~/components/console/filter-bar.tsx";
import { KvList } from "~/components/console/kv-list.tsx";
import { consolePath } from "~/components/console/nav.ts";
import { StatusBadge } from "~/components/console/status-badge.tsx";
import { useQueryState } from "~/components/console/use-query-state.ts";
import { Button } from "~/components/ui/button.tsx";
import { relTime } from "~/components/workbench/release-fields.ts";
import { errorMessage, TTL_SECOND } from "~/lib/api.ts";
import { actorText } from "~/lib/labels.ts";
import { formatDateTime } from "~/lib/utils.ts";

// 业务任务(/tasks):引擎只负责推进,task 表是面向用户的投影;取消只停后续步骤,重试只对失败任务。
// 引擎运行只在详情里给链接,引擎面板在系统组。

const TaskPage = cursorPage(Task);

export const TASK_KIND_LABEL: Record<TaskKind, string> = {
  ingestFeed: "抓取 RSS",
  resolveObservation: "识别资源",
  evaluateAcquisition: "评估资源",
  submitDownload: "提交下载",
  verifyAndImport: "核验整理",
  refreshMetadata: "刷新元数据",
  reconcileLibrary: "文件核对",
  cleanupDownloadCache: "清理缓存",
  resolveDecision: "处理事项",
  agentRun: "智能体运行",
};

export const TASK_STATUS: Record<
  TaskStatus,
  { label: string; tone: "success" | "warning" | "destructive" | "neutral" }
> = {
  pending: { label: "排队中", tone: "neutral" },
  running: { label: "运行中", tone: "neutral" },
  waiting: { label: "等待中", tone: "warning" },
  succeeded: { label: "成功", tone: "success" },
  failed: { label: "失败", tone: "destructive" },
  cancelled: { label: "已取消", tone: "neutral" },
  dead: { label: "已放弃", tone: "destructive" },
};

export const ACTIVE_TASK: TaskStatus[] = ["pending", "running", "waiting"];

export const SUBJECT_LABEL: Record<string, string> = {
  download_task: "下载任务",
  acquisition_plan: "下载",
  acquisition_slot: "收录版本",
  organization_record: "整理记录",
  organize_request: "整理请求",
  media_entity: "作品",
  media_asset: "文件",
  source_release: "资源",
  feed_source: "RSS",
  site: "站点",
  library_root: "媒体库目录",
  cache_volume: "下载盘",
};

/** 业务任务的对象 → 它的"家"页面 */
export function subjectLink(t: Pick<Task, "subjectType" | "subjectId">): string | null {
  if (!t.subjectId) return null;
  switch (t.subjectType) {
    case "download_task":
      return consolePath("downloads", t.subjectId);
    case "acquisition_plan":
      return `${consolePath("downloads")}?plan=${encodeURIComponent(t.subjectId)}`;
    case "organization_record":
      return consolePath("organize", t.subjectId);
    case "media_entity":
      return consolePath("library", t.subjectId);
    case "site":
      return consolePath("sites", t.subjectId);
    case "feed_source":
      // RSS 属于站点(IA-2):按 ?feed= 查所属站点后跳到站点的 RSS Tab
      return `${consolePath("sources")}?feed=${encodeURIComponent(t.subjectId)}`;
    default:
      return null;
  }
}

export function subjectText(t: Pick<Task, "subjectType" | "subjectId">): string {
  if (!t.subjectType) return "—";
  const label = SUBJECT_LABEL[t.subjectType] ?? t.subjectType;
  return t.subjectId ? `${label} · ${t.subjectId.slice(0, 8)}` : label;
}

/** 取消 / 重试 */
export function useTaskAction() {
  const qc = useQueryClient();
  return useMutation({
    mutationFn: ({ id, op }: { id: string; op: "cancel" | "retry" }) =>
      apiMutate(`/api/v1/tasks/:id/${op}`, {
        pathParams: { id },
        body: op === "cancel" ? { reason: "控制台取消" } : {},
      }).then((d) => Task.parse(d)),
    onSuccess: (_t, v) => {
      toast.success(v.op === "cancel" ? "已请求取消，后续步骤不再执行" : "已重新排队");
      void qc.invalidateQueries({ queryKey: ["tasks"] });
    },
    onError: (e) => toast.error(errorMessage(e)),
  });
}

/** 取消 / 重试按钮(按状态二选一或都不显示) */
export function TaskActions({ t, size = "sm" }: { t: Task; size?: "sm" | "xs" }) {
  const action = useTaskAction();
  if (ACTIVE_TASK.includes(t.status))
    return (
      <Button
        variant="outline"
        size={size}
        disabled={action.isPending}
        onClick={(e) => {
          e.stopPropagation();
          action.mutate({ id: t.id, op: "cancel" });
        }}
      >
        <Square />
        取消
      </Button>
    );
  if (t.status === "failed" || t.status === "dead")
    return (
      <Button
        variant="outline"
        size={size}
        disabled={action.isPending}
        onClick={(e) => {
          e.stopPropagation();
          action.mutate({ id: t.id, op: "retry" });
        }}
      >
        <RotateCcw />
        重试
      </Button>
    );
  return null;
}

export function BusinessTasks() {
  const f = useQueryState(["kind", "status"] as const);
  const { kind, status } = f.values;
  const [openId, setOpenId] = useState<string | null>(null);
  const list = useInfiniteQuery({
    queryKey: ["tasks", "list", kind, status],
    initialPageParam: undefined as string | undefined,
    placeholderData: keepPreviousData,
    queryFn: ({ pageParam, signal }) =>
      apiParsed(TaskPage, "/api/v1/tasks", {
        params: cleanParams({ kind, status, cursor: pageParam, limit: 50 }),
        signal,
      }),
    getNextPageParam: (last) => last.nextCursor ?? undefined,
    refetchInterval: (q) =>
      q.state.data?.pages.some((p) => p.items.some((t) => ACTIVE_TASK.includes(t.status))) ? 5 * TTL_SECOND : false,
  });
  const rows = list.data?.pages.flatMap((p) => p.items);
  const open = rows?.find((t) => t.id === openId) ?? null;

  const columns: DataColumn<Task>[] = [
    {
      key: "kind",
      header: "任务",
      cell: (t) => (
        <div className="min-w-0">
          <p className="font-medium text-foreground">{TASK_KIND_LABEL[t.kind] ?? t.kind}</p>
          <p className="truncate text-meta text-muted-foreground">{subjectText(t)}</p>
        </div>
      ),
    },
    {
      key: "status",
      header: "状态",
      cell: (t) => (
        <div className="flex flex-col items-start gap-1">
          <StatusBadge tone={TASK_STATUS[t.status].tone}>{TASK_STATUS[t.status].label}</StatusBadge>
          {t.waitReason ? <span className="text-micro text-muted-foreground">{t.waitReason}</span> : null}
        </div>
      ),
    },
    {
      key: "attempts",
      header: "尝试",
      hideBelow: "md",
      align: "right",
      cell: (t) => (
        <span className="tabular-nums">
          {t.attempts}/{t.maxAttempts}
        </span>
      ),
    },
    {
      key: "by",
      header: "触发",
      hideBelow: "lg",
      cell: (t) => <span className="text-muted-foreground">{actorText(t.triggeredBy)}</span>,
    },
    {
      key: "at",
      header: "创建",
      hideBelow: "sm",
      cell: (t) => <span className="whitespace-nowrap text-muted-foreground">{relTime(t.createdAt)}</span>,
    },
    { key: "ops", header: "", align: "right", cell: (t) => <TaskActions t={t} size="xs" /> },
  ];

  return (
    <>
      <FilterBar onReset={f.active ? f.reset : undefined}>
        <FilterSelect
          label="类型"
          value={kind}
          onChange={(v) => f.set("kind", v)}
          options={Object.entries(TASK_KIND_LABEL).map(([value, label]) => ({ value, label }))}
        />
        <FilterSelect
          label="状态"
          value={status}
          onChange={(v) => f.set("status", v)}
          options={Object.entries(TASK_STATUS).map(([value, v]) => ({ value, label: v.label }))}
        />
      </FilterBar>
      <DataTable
        paginationKey={JSON.stringify(f.values)}
        columns={columns}
        rows={rows}
        rowKey={(t) => t.id}
        loading={list.isPending}
        error={list.error}
        onRetry={() => void list.refetch()}
        onRowClick={(t) => setOpenId(t.id)}
        selectedKey={openId}
        hasMore={list.hasNextPage}
        onLoadMore={() => void list.fetchNextPage()}
        loadingMore={list.isFetchingNextPage}
        empty={{
          icon: ListTodo,
          title: f.active ? "没有符合筛选的任务" : "还没有后台任务",
          description: f.active ? undefined : "提交下载、核验整理、清理缓存、文件核对等任务会出现在这里。",
        }}
      />
      <DetailSheet
        open={!!open}
        onOpenChange={(o) => !o && setOpenId(null)}
        title={open ? (TASK_KIND_LABEL[open.kind] ?? open.kind) : ""}
        description={open ? <TaskStatusLine t={open} /> : undefined}
        footer={
          open ? (
            <>
              <TaskActions t={open} />
              <Button asChild size="sm">
                <Link to={consolePath("tasks", open.id)}>打开详情页</Link>
              </Button>
            </>
          ) : null
        }
      >
        {open ? <TaskSummary t={open} /> : null}
      </DetailSheet>
    </>
  );
}

export function TaskStatusLine({ t }: { t: Task }) {
  return (
    <span className="flex flex-wrap items-center gap-1.5">
      <StatusBadge tone={TASK_STATUS[t.status].tone}>{TASK_STATUS[t.status].label}</StatusBadge>
      {t.waitReason ? <span className="text-meta text-muted-foreground">{t.waitReason}</span> : null}
    </span>
  );
}

/** 概况 + 关联对象(抽屉与详情页共用) */
export function TaskSummary({ t }: { t: Task }) {
  const href = subjectLink(t);
  const err = t.lastError
    ? String((t.lastError as { message?: unknown }).message ?? JSON.stringify(t.lastError))
    : null;
  return (
    <div className="space-y-5">
      {err ? (
        <p className="rounded-lg border border-destructive/40 bg-destructive/10 px-3 py-2 text-caption break-words text-destructive">
          {err}
        </p>
      ) : null}
      <DetailSection title="概况">
        <KvList
          items={[
            { label: "尝试", value: `${t.attempts}/${t.maxAttempts}` },
            { label: "触发", value: actorText(t.triggeredBy) },
            { label: "创建", value: formatDateTime(t.createdAt) },
            { label: "开始", value: formatDateTime(t.startedAt) },
            { label: "结束", value: formatDateTime(t.finishedAt) },
            { label: "下次执行", value: t.status === "pending" ? formatDateTime(t.nextRunAt) : null },
            { label: "取消原因", value: t.cancelReason, wide: true },
          ]}
        />
      </DetailSection>
      <DetailSection title="关联对象">
        <KvList
          items={[
            {
              label: "对象",
              value: href ? (
                <Link to={href} className="underline underline-offset-4">
                  {subjectText(t)}
                </Link>
              ) : (
                subjectText(t)
              ),
            },
            {
              label: "上级任务",
              value: t.parentTaskId ? (
                <Link to={consolePath("tasks", t.parentTaskId)} className="font-mono underline underline-offset-4">
                  {t.parentTaskId.slice(0, 8)}
                </Link>
              ) : null,
            },
            {
              label: "引擎运行",
              value: t.engineRunId ? (
                <Link to={consolePath("tasks", t.engineRunId)} className="font-mono underline underline-offset-4">
                  {t.engineRunId.slice(0, 12)}
                </Link>
              ) : null,
            },
          ]}
        />
      </DetailSection>
    </div>
  );
}