feat(web): regroup console nav into 7 groups, split downloads/plans/tasks, add legacy redirects
- Sidebar: 概览/资源/订阅/下载/整理/Agent/系统, 18 items (+ 定时任务); single active item via findNavItem; 待处理 badge; collapsed rail groups; mobile drawer shares NAV_GROUPS. - New pages: /downloads (queue + cache watermark header), /downloads/plans, /downloads/:id, /tasks (business tasks only) + /tasks/:id detail, /rules. - Legacy links: ?tab= on tasks/subscriptions/sources redirect via clientLoader; /tasks/:downloadId falls back to /downloads/:id. - List filters in URL query; settingsPath() helper for settings deep links. - Copy per glossary (待处理, 收录策略, 引擎面板, 文件管理, 版本目标). Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
1 parent
5843527317
commit
909cd2ad49
31 files changed
+1247
-609
No files matched your search
@@ -1,37 +1,162 @@
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
import { AssetOperation, DownloadTask, Task } from "@umt/contracts";
|
||||
import { ArrowLeft } from "lucide-react";
|
||||
import { Link, useParams } from "react-router";
|
||||
import { useDownloadTask } from "~/api/downloads.ts";
|
||||
import { Link, Navigate, useParams } from "react-router";
|
||||
import { z } from "zod";
|
||||
import { apiParsed, isMissingEndpoint } from "~/api/parse.ts";
|
||||
import { DetailSection } from "~/components/console/detail-sheet.tsx";
|
||||
import { ErrorState, LoadingState } from "~/components/console/empty-state.tsx";
|
||||
import { consolePath } from "~/components/console/nav.ts";
|
||||
import { PageHeader } from "~/components/console/page-header.tsx";
|
||||
import { DownloadDetail } from "~/components/downloads/download-detail.tsx";
|
||||
import type { StatusTone } from "~/components/console/status-badge.tsx";
|
||||
import { Timeline } from "~/components/console/timeline.tsx";
|
||||
import { TASK_KIND_LABEL, TaskActions, TaskStatusLine, TaskSummary } from "~/components/downloads/business-tasks.tsx";
|
||||
import { Button } from "~/components/ui/button.tsx";
|
||||
import { TTL_SECOND } from "~/lib/api.ts";
|
||||
|
||||
export default function DownloadTaskPage() {
|
||||
export const meta = () => [{ title: "业务任务 · UHD 媒体自动化控制台" }];
|
||||
|
||||
const OP_TONE: Record<AssetOperation["status"], StatusTone> = {
|
||||
planned: "neutral",
|
||||
started: "neutral",
|
||||
succeeded: "success",
|
||||
failed: "destructive",
|
||||
skipped: "neutral",
|
||||
compensated: "warning",
|
||||
};
|
||||
const OP_STATUS: Record<AssetOperation["status"], string> = {
|
||||
planned: "计划",
|
||||
started: "进行中",
|
||||
succeeded: "成功",
|
||||
failed: "失败",
|
||||
skipped: "跳过",
|
||||
compensated: "已回滚",
|
||||
};
|
||||
|
||||
const OP_PHASE: Record<AssetOperation["phase"], string> = {
|
||||
decision: "判定",
|
||||
prepare: "准备",
|
||||
transfer: "传输",
|
||||
verify: "校验",
|
||||
commit: "提交",
|
||||
cleanup: "清理",
|
||||
compensate: "回滚",
|
||||
};
|
||||
const OP_KIND: Record<AssetOperation["kind"], string> = {
|
||||
copy: "复制",
|
||||
move: "移动",
|
||||
rename: "改名",
|
||||
mkdir: "建目录",
|
||||
hardlink: "硬链接",
|
||||
delete_source: "删除源文件",
|
||||
delete_target: "删除目标文件",
|
||||
verify: "校验",
|
||||
register: "登记资产",
|
||||
qb_pause: "暂停下载",
|
||||
qb_resume: "恢复下载",
|
||||
qb_remove: "移除下载",
|
||||
qb_set_tags: "改下载标签",
|
||||
other: "其他",
|
||||
};
|
||||
|
||||
function useTask(id: string) {
|
||||
return useQuery({
|
||||
queryKey: ["tasks", "one", id],
|
||||
retry: false,
|
||||
queryFn: ({ signal }) => apiParsed(Task, "/api/v1/tasks/:id", { pathParams: { id }, signal }),
|
||||
refetchInterval: (q) =>
|
||||
q.state.data && ["pending", "running", "waiting"].includes(q.state.data.status) ? 5 * TTL_SECOND : false,
|
||||
});
|
||||
}
|
||||
|
||||
/** 旧链接 /console/tasks/:id 指向下载任务:业务任务查不到时再查下载任务,查到就跳到下载详情 */
|
||||
function useLegacyDownload(id: string, enabled: boolean) {
|
||||
return useQuery({
|
||||
queryKey: ["downloads", "legacy-probe", id],
|
||||
enabled,
|
||||
retry: false,
|
||||
queryFn: ({ signal }) => apiParsed(DownloadTask, "/api/v1/download-tasks/:id", { pathParams: { id }, signal }),
|
||||
});
|
||||
}
|
||||
|
||||
function Operations({ taskId }: { taskId: string }) {
|
||||
const ops = useQuery({
|
||||
queryKey: ["tasks", "operations", taskId],
|
||||
queryFn: ({ signal }) =>
|
||||
apiParsed(z.object({ items: z.array(AssetOperation) }), "/api/v1/tasks/:id/operations", {
|
||||
pathParams: { id: taskId },
|
||||
signal,
|
||||
}),
|
||||
});
|
||||
if (ops.isPending) return <LoadingState rows={3} />;
|
||||
if (ops.error) return <ErrorState plain error={ops.error} onRetry={() => void ops.refetch()} />;
|
||||
if (!ops.data.items.length) return <p className="text-caption text-muted-foreground">这个任务没有文件操作。</p>;
|
||||
return (
|
||||
<Timeline
|
||||
items={ops.data.items.map((o) => ({
|
||||
id: o.id,
|
||||
at: o.startedAt ?? o.createdAt,
|
||||
tone: OP_TONE[o.status],
|
||||
title: `${OP_PHASE[o.phase]} · ${OP_KIND[o.kind]}:${OP_STATUS[o.status]}`,
|
||||
meta: o.attempts > 1 ? `${o.attempts} 次` : undefined,
|
||||
description: o.organizationRecordId ? (
|
||||
<Link to={consolePath("organize", o.organizationRecordId)} className="underline underline-offset-4">
|
||||
整理记录 {o.organizationRecordId.slice(0, 8)}
|
||||
</Link>
|
||||
) : o.downloadTaskId ? (
|
||||
<Link to={consolePath("downloads", o.downloadTaskId)} className="underline underline-offset-4">
|
||||
下载任务 {o.downloadTaskId.slice(0, 8)}
|
||||
</Link>
|
||||
) : undefined,
|
||||
}))}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
export default function BusinessTaskPage() {
|
||||
const { id = "" } = useParams();
|
||||
const task = useDownloadTask(id);
|
||||
const task = useTask(id);
|
||||
const notFound = !!task.error && isMissingEndpoint(task.error);
|
||||
const legacy = useLegacyDownload(id, notFound);
|
||||
|
||||
if (notFound && legacy.data) return <Navigate to={consolePath("downloads", id)} replace />;
|
||||
const t = task.data;
|
||||
|
||||
return (
|
||||
<>
|
||||
<PageHeader
|
||||
title={task.data?.name ?? "下载任务"}
|
||||
className="[&_h1]:break-all"
|
||||
title={t ? (TASK_KIND_LABEL[t.kind] ?? t.kind) : "业务任务"}
|
||||
description={t ? <TaskStatusLine t={t} /> : undefined}
|
||||
actions={
|
||||
<Button asChild variant="ghost" size="sm">
|
||||
<Link to="/console/tasks">
|
||||
<ArrowLeft />
|
||||
下载与任务
|
||||
</Link>
|
||||
</Button>
|
||||
<>
|
||||
<Button asChild variant="ghost" size="sm">
|
||||
<Link to={consolePath("tasks")}>
|
||||
<ArrowLeft />
|
||||
业务任务
|
||||
</Link>
|
||||
</Button>
|
||||
{t ? <TaskActions t={t} /> : null}
|
||||
</>
|
||||
}
|
||||
/>
|
||||
<div className="pg-slab rounded-xl p-4 md:p-5">
|
||||
{task.isPending ? (
|
||||
{task.isPending || (notFound && legacy.isPending) ? (
|
||||
<div className="pg-slab rounded-xl p-4 md:p-5">
|
||||
<LoadingState rows={5} />
|
||||
) : task.error ? (
|
||||
<ErrorState plain error={task.error} onRetry={() => void task.refetch()} />
|
||||
) : (
|
||||
<DownloadDetail task={task.data} />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
) : !t ? (
|
||||
<ErrorState error={task.error} onRetry={() => void task.refetch()} />
|
||||
) : (
|
||||
<div className="space-y-5">
|
||||
<div className="pg-slab rounded-xl p-4 md:p-5">
|
||||
<TaskSummary t={t} />
|
||||
</div>
|
||||
<div className="pg-slab rounded-xl p-4 md:p-5">
|
||||
<DetailSection title="文件操作">
|
||||
<Operations taskId={t.id} />
|
||||
</DetailSection>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user