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:
rootandClaude Opus 5.5 committed
1 parent
5843527317
commit
909cd2ad49
31 files changed
+1247
-609
No files matched your search
@@ -1,23 +1,76 @@
|
||||
import { readFileSync } from "node:fs";
|
||||
import { describe, expect, it } from "vitest";
|
||||
import { consolePath, findNavItem, NAV_ITEMS } from "./nav.ts";
|
||||
import { LEGACY_REDIRECTS, legacyRedirect } from "../../routes/console/redirects.ts";
|
||||
import { consolePath, findNavItem, NAV_GROUPS, NAV_ITEMS, settingsPath } from "./nav.ts";
|
||||
|
||||
/** routes.ts 里登记的控制台路由(相对 /console) */
|
||||
const ROUTE_PATTERNS = [
|
||||
"",
|
||||
...[...readFileSync(new URL("../../routes.ts", import.meta.url), "utf8").matchAll(/route\("([^"*]+)",/g)].map(
|
||||
(m) => m[1] as string,
|
||||
),
|
||||
];
|
||||
const matchesRoute = (pathname: string) => {
|
||||
const rest = pathname.replace(/^\/console\/?/, "");
|
||||
return ROUTE_PATTERNS.some((p) => new RegExp(`^${p.replace(/:[^/]+/g, "[^/]+")}$`).test(rest));
|
||||
};
|
||||
|
||||
describe("控制台导航", () => {
|
||||
it("12 个工作区 + 定时任务 + 引擎面板 + 审计,路径唯一且都在 /console 下", () => {
|
||||
expect(NAV_ITEMS).toHaveLength(16);
|
||||
expect(new Set(NAV_ITEMS.map((i) => i.to)).size).toBe(16);
|
||||
it("7 组 18 项(另加系统组的定时任务),路径唯一且都在 /console 下", () => {
|
||||
expect(NAV_GROUPS.map((g) => g.title)).toEqual(["概览", "资源", "订阅", "下载", "整理", "Agent", "系统"]);
|
||||
const core = NAV_ITEMS.filter((i) => i.to !== "/console/schedules");
|
||||
expect(core).toHaveLength(18);
|
||||
expect(new Set(NAV_ITEMS.map((i) => i.to)).size).toBe(NAV_ITEMS.length);
|
||||
expect(NAV_ITEMS.every((i) => i.to.startsWith("/console"))).toBe(true);
|
||||
for (const g of NAV_GROUPS) expect(g.items.length).toBeLessThanOrEqual(4);
|
||||
});
|
||||
|
||||
it("每个导航项都有路由", () => {
|
||||
for (const i of NAV_ITEMS) expect(matchesRoute(i.to), i.to).toBe(true);
|
||||
});
|
||||
|
||||
it("按最长前缀匹配当前项", () => {
|
||||
expect(findNavItem("/console")?.label).toBe("首页");
|
||||
expect(findNavItem("/console/")?.label).toBe("首页");
|
||||
expect(findNavItem("/console/library/abc")?.label).toBe("媒体库");
|
||||
expect(findNavItem("/console/engine/r1")?.label).toBe("工作流引擎");
|
||||
expect(findNavItem("/console/engine/r1")?.label).toBe("引擎面板");
|
||||
expect(findNavItem("/console/downloads")?.label).toBe("下载队列");
|
||||
expect(findNavItem("/console/downloads/plans")?.label).toBe("下载计划");
|
||||
expect(findNavItem("/console/downloads/abc")?.label).toBe("下载队列");
|
||||
expect(findNavItem("/console/tasks/abc")?.label).toBe("业务任务");
|
||||
expect(findNavItem("/console/sites/abc")?.label).toBe("站点工作台");
|
||||
expect(findNavItem("/nope")).toBeUndefined();
|
||||
});
|
||||
|
||||
it("consolePath 拼路径并编码", () => {
|
||||
expect(consolePath()).toBe("/console");
|
||||
expect(consolePath("library", "a b")).toBe("/console/library/a%20b");
|
||||
expect(consolePath("downloads", "plans")).toBe("/console/downloads/plans");
|
||||
});
|
||||
|
||||
it("settingsPath 只认新分区名", () => {
|
||||
expect(settingsPath("automation", "cache").startsWith("/console/settings")).toBe(true);
|
||||
expect(settingsPath("agent").startsWith("/console/settings")).toBe(true);
|
||||
});
|
||||
});
|
||||
|
||||
describe("旧链接重定向", () => {
|
||||
it.each(LEGACY_REDIRECTS)("$from → $to", ({ from, to }) => {
|
||||
const u = new URL(from, "http://x");
|
||||
expect(legacyRedirect(u.pathname, u.search)).toBe(to);
|
||||
});
|
||||
|
||||
it("新地址都有路由,且不会再次跳转", () => {
|
||||
for (const { to } of LEGACY_REDIRECTS) {
|
||||
const u = new URL(to, "http://x");
|
||||
expect(matchesRoute(u.pathname), to).toBe(true);
|
||||
if (u.pathname !== "/console/sites/abc") expect(legacyRedirect(u.pathname, u.search)).toBeNull();
|
||||
}
|
||||
});
|
||||
|
||||
it("不相关的 query 不跳转", () => {
|
||||
expect(legacyRedirect("/console/tasks", "?kind=submitDownload")).toBeNull();
|
||||
expect(legacyRedirect("/console/subscriptions", "")).toBeNull();
|
||||
expect(legacyRedirect("/console/sources", "?health=failing")).toBeNull();
|
||||
});
|
||||
});
|
||||
@@ -2,6 +2,7 @@ import {
|
||||
Activity,
|
||||
Bot,
|
||||
CalendarClock,
|
||||
ClipboardList,
|
||||
Download,
|
||||
FileStack,
|
||||
Fingerprint,
|
||||
@@ -10,6 +11,8 @@ import {
|
||||
House,
|
||||
Inbox,
|
||||
Library,
|
||||
ListChecks,
|
||||
ListTodo,
|
||||
type LucideIcon,
|
||||
Rss,
|
||||
ScrollText,
|
||||
@@ -18,7 +21,14 @@ import {
|
||||
Timer,
|
||||
} from "lucide-react";
|
||||
|
||||
export type NavItem = { to: string; label: string; icon: LucideIcon; description: string };
|
||||
export type NavItem = {
|
||||
to: string;
|
||||
label: string;
|
||||
icon: LucideIcon;
|
||||
description: string;
|
||||
/** 侧栏角标的数据来源 */
|
||||
badge?: "decisions";
|
||||
};
|
||||
export type NavGroup = { title: string; items: NavItem[] };
|
||||
|
||||
/** 控制台路由前缀 */
|
||||
@@ -30,7 +40,10 @@ export function consolePath(...segments: (string | number)[]): string {
|
||||
return rest ? `${CONSOLE_BASE}/${rest}` : CONSOLE_BASE;
|
||||
}
|
||||
|
||||
/** 控制台 12 个工作区(任务书 §3.1 第 10 条 / REQ §13.1)+ 引擎面板与审计两个运维页 */
|
||||
/**
|
||||
* 侧栏 7 组(docs/design/console-ia.md §3.2),按业务流程排:概览 → 资源 → 订阅 → 下载 → 整理 → Agent → 系统。
|
||||
* 移动端抽屉用同一份表。
|
||||
*/
|
||||
export const NAV_GROUPS: NavGroup[] = [
|
||||
{
|
||||
title: "概览",
|
||||
@@ -39,89 +52,123 @@ export const NAV_GROUPS: NavGroup[] = [
|
||||
to: "/console",
|
||||
label: "首页",
|
||||
icon: House,
|
||||
description: "自动化概览、当前工作、需要我处理、缓存与保留、来源健康、最近产出",
|
||||
description: "自动化概览、当前工作、待处理、缓存、来源健康、最近产出",
|
||||
},
|
||||
{
|
||||
to: "/console/inbox",
|
||||
label: "待处理中心",
|
||||
label: "待处理",
|
||||
icon: Inbox,
|
||||
description: "按作品与根因合并的待决定事项，Agent 已先行调查",
|
||||
description: "按作品和问题类型合并的待处理事项",
|
||||
badge: "decisions",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "媒体",
|
||||
title: "资源",
|
||||
items: [
|
||||
{ to: "/console/library", label: "媒体库", icon: Library, description: "作品、内容单元、版本目标与实际路径" },
|
||||
{
|
||||
to: "/console/identity",
|
||||
label: "身份与元数据",
|
||||
icon: Fingerprint,
|
||||
description: "外部身份映射、待识别池与元数据来源",
|
||||
to: "/console/sites",
|
||||
label: "站点工作台",
|
||||
icon: Globe,
|
||||
description: "站点、站点账号、快照与 Feed",
|
||||
},
|
||||
{
|
||||
to: "/console/organize",
|
||||
label: "整理记录",
|
||||
icon: FileStack,
|
||||
description: "Copy/Move 入库前后路径与逐文件结果",
|
||||
},
|
||||
{
|
||||
to: "/console/files",
|
||||
label: "文件",
|
||||
icon: FolderTree,
|
||||
description: "浏览已登记的库根与下载目录,改名、移动、删除与批量整理",
|
||||
to: "/console/sources",
|
||||
label: "来源健康",
|
||||
icon: Rss,
|
||||
description: "全部 Feed 与站点的抓取状态",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "获取",
|
||||
title: "订阅",
|
||||
items: [
|
||||
{
|
||||
to: "/console/subscriptions",
|
||||
label: "订阅与收录规则",
|
||||
label: "订阅",
|
||||
icon: CalendarClock,
|
||||
description: "单次收录与持续追踪，版本目标与预算",
|
||||
description: "单次收录与持续追踪",
|
||||
},
|
||||
{
|
||||
to: "/console/rules",
|
||||
label: "收录策略",
|
||||
icon: ListChecks,
|
||||
description: "新作品收录条件、默认版本目标与策略版本",
|
||||
},
|
||||
{
|
||||
to: "/console/preferences",
|
||||
label: "偏好标签",
|
||||
icon: Tags,
|
||||
description: "软偏好与硬规则，手动取消的偏好不会被自动加回",
|
||||
},
|
||||
{
|
||||
to: "/console/sites",
|
||||
label: "PT 站点工作台",
|
||||
icon: Globe,
|
||||
description: "统一格式浏览、搜索站点资源并关联本地库存",
|
||||
},
|
||||
{
|
||||
to: "/console/sources",
|
||||
label: "来源 / Feed / 快照",
|
||||
icon: Rss,
|
||||
description: "RSS 与站点快照的抓取状态、新鲜度与健康",
|
||||
},
|
||||
{
|
||||
to: "/console/tasks",
|
||||
label: "下载与任务",
|
||||
icon: Download,
|
||||
description: "下载、整理、核验的业务时间线与子任务",
|
||||
description: "软偏好影响排序,硬规则直接排除",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "助手与系统",
|
||||
title: "下载",
|
||||
items: [
|
||||
{
|
||||
to: "/console/downloads",
|
||||
label: "下载队列",
|
||||
icon: Download,
|
||||
description: "下载任务与缓存水位",
|
||||
},
|
||||
{
|
||||
to: "/console/downloads/plans",
|
||||
label: "下载计划",
|
||||
icon: ClipboardList,
|
||||
description: "选中候选后生成的计划与空间预留",
|
||||
},
|
||||
{
|
||||
to: "/console/tasks",
|
||||
label: "业务任务",
|
||||
icon: ListTodo,
|
||||
description: "提交下载、核验入库、清理缓存等后台任务",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "整理",
|
||||
items: [
|
||||
{ to: "/console/library", label: "媒体库", icon: Library, description: "作品、季 / 集、版本目标与实际路径" },
|
||||
{
|
||||
to: "/console/organize",
|
||||
label: "整理记录",
|
||||
icon: FileStack,
|
||||
description: "每次整理的前后路径与逐文件结果",
|
||||
},
|
||||
{
|
||||
to: "/console/files",
|
||||
label: "文件管理",
|
||||
icon: FolderTree,
|
||||
description: "浏览登记目录,改名、移动、删除与整理",
|
||||
},
|
||||
{
|
||||
to: "/console/identity",
|
||||
label: "身份与元数据",
|
||||
icon: Fingerprint,
|
||||
description: "外部身份、待识别资源与别名",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Agent",
|
||||
items: [
|
||||
{
|
||||
to: "/console/agent",
|
||||
label: "Agent 会话",
|
||||
icon: Bot,
|
||||
description: "用自然语言交代目标，Agent 在授权内执行并汇报",
|
||||
description: "交代目标,Agent 在授权内执行并汇报",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "系统",
|
||||
items: [
|
||||
{
|
||||
to: "/console/settings",
|
||||
label: "系统设置",
|
||||
label: "设置",
|
||||
icon: Settings,
|
||||
description: "下载器与媒体服务器实例、路径映射、API Key、Pi 上游与自动化开关",
|
||||
description: "下载器、媒体服务器、库根、站点账号、Agent 上游与自动化",
|
||||
},
|
||||
{
|
||||
to: "/console/schedules",
|
||||
@@ -131,9 +178,9 @@ export const NAV_GROUPS: NavGroup[] = [
|
||||
},
|
||||
{
|
||||
to: "/console/engine",
|
||||
label: "工作流引擎",
|
||||
label: "引擎面板",
|
||||
icon: Activity,
|
||||
description: "持久任务引擎的运行记录、步骤尝试与信号(只读诊断,仅管理员)",
|
||||
description: "排查用,业务进度看业务任务。仅管理员",
|
||||
},
|
||||
{
|
||||
to: "/console/audit",
|
||||
@@ -147,6 +194,35 @@ export const NAV_GROUPS: NavGroup[] = [
|
||||
|
||||
export const NAV_ITEMS = NAV_GROUPS.flatMap((g) => g.items);
|
||||
|
||||
/**
|
||||
* 设置页深链。IA-2 把设置改为 /console/settings/:section 之前,先落到现有 ?tab=;
|
||||
* 调用方只认新分区名,切换时只改这里。
|
||||
*/
|
||||
export type SettingsSection =
|
||||
| "automation"
|
||||
| "sites"
|
||||
| "downloaders"
|
||||
| "library"
|
||||
| "media-servers"
|
||||
| "metadata"
|
||||
| "agent"
|
||||
| "api-keys"
|
||||
| "account";
|
||||
const SETTINGS_LEGACY_TAB: Partial<Record<SettingsSection, string>> = {
|
||||
automation: "automation",
|
||||
sites: "site-credentials",
|
||||
downloaders: "downloaders",
|
||||
library: "library-roots",
|
||||
"media-servers": "media-servers",
|
||||
agent: "pi",
|
||||
"api-keys": "api-keys",
|
||||
};
|
||||
export function settingsPath(section: SettingsSection, anchor?: string): string {
|
||||
// 缓存阈值现在在"缓存与入库"页签,IA-2 后归到 automation#cache
|
||||
const tab = section === "automation" && anchor === "cache" ? "storage" : SETTINGS_LEGACY_TAB[section];
|
||||
return tab ? `${CONSOLE_BASE}/settings?tab=${tab}` : `${CONSOLE_BASE}/settings`;
|
||||
}
|
||||
|
||||
/** 按路径找当前导航项(最长前缀匹配) */
|
||||
export function findNavItem(pathname: string): NavItem | undefined {
|
||||
return (
|
||||
|
||||
@@ -0,0 +1,40 @@
|
||||
import { useCallback } from "react";
|
||||
import { useSearchParams } from "react-router";
|
||||
|
||||
/**
|
||||
* 列表页筛选状态写进 URL query(docs/design/console-ia.md §3.6),刷新和分享链接不丢筛选。
|
||||
* const f = useQueryState(["status", "managed"]);
|
||||
* f.values.status; f.set("status", "paused"); f.reset();
|
||||
*/
|
||||
export function useQueryState<K extends string>(keys: readonly K[]) {
|
||||
const [params, setParams] = useSearchParams();
|
||||
const values = Object.fromEntries(keys.map((k) => [k, params.get(k) ?? ""])) as Record<K, string>;
|
||||
const set = useCallback(
|
||||
(key: K, value: string) =>
|
||||
setParams(
|
||||
(prev) => {
|
||||
const next = new URLSearchParams(prev);
|
||||
if (value) next.set(key, value);
|
||||
else next.delete(key);
|
||||
return next;
|
||||
},
|
||||
{ replace: true },
|
||||
),
|
||||
[setParams],
|
||||
);
|
||||
const keyList = keys.join(",");
|
||||
const reset = useCallback(
|
||||
() =>
|
||||
setParams(
|
||||
(prev) => {
|
||||
const next = new URLSearchParams(prev);
|
||||
for (const k of keyList.split(",")) next.delete(k);
|
||||
return next;
|
||||
},
|
||||
{ replace: true },
|
||||
),
|
||||
[setParams, keyList],
|
||||
);
|
||||
const active = keys.some((k) => !!values[k]);
|
||||
return { values, set, reset, active };
|
||||
}
|
||||
@@ -6,13 +6,19 @@ 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 { formatDateTime } from "~/lib/utils.ts";
|
||||
|
||||
// 业务任务(/tasks):引擎只负责推进,task 表是面向用户的投影;取消只停后续步骤,重试只对失败任务。
|
||||
// 引擎运行只在详情里给链接,引擎面板在系统组。
|
||||
|
||||
const TaskPage = cursorPage(Task);
|
||||
|
||||
@@ -42,34 +48,54 @@ export const TASK_STATUS: Record<
|
||||
dead: { label: "放弃", tone: "destructive" },
|
||||
};
|
||||
|
||||
const ACTIVE: TaskStatus[] = ["pending", "running", "waiting"];
|
||||
export const ACTIVE_TASK: TaskStatus[] = ["pending", "running", "waiting"];
|
||||
|
||||
function subjectLink(t: Task): string | null {
|
||||
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: "Feed",
|
||||
site: "站点",
|
||||
library_root: "库根",
|
||||
cache_volume: "缓存卷",
|
||||
};
|
||||
|
||||
/** 业务任务的对象 → 它的"家"页面 */
|
||||
export function subjectLink(t: Pick<Task, "subjectType" | "subjectId">): string | null {
|
||||
if (!t.subjectId) return null;
|
||||
if (t.subjectType === "download_task") return `/console/tasks/${t.subjectId}`;
|
||||
if (t.subjectType === "organization_record") return `/console/organize/${t.subjectId}`;
|
||||
if (t.subjectType === "media_entity") return `/console/library/${t.subjectId}`;
|
||||
return null;
|
||||
switch (t.subjectType) {
|
||||
case "download_task":
|
||||
return consolePath("downloads", t.subjectId);
|
||||
case "acquisition_plan":
|
||||
return consolePath("downloads", "plans");
|
||||
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":
|
||||
return consolePath("sources");
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
export function BusinessTasks() {
|
||||
const [kind, setKind] = useState("");
|
||||
const [status, setStatus] = useState("");
|
||||
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();
|
||||
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.includes(t.status))) ? 5 * TTL_SECOND : false,
|
||||
});
|
||||
const action = useMutation({
|
||||
return useMutation({
|
||||
mutationFn: ({ id, op }: { id: string; op: "cancel" | "retry" }) =>
|
||||
apiMutate(`/api/v1/tasks/:id/${op}`, {
|
||||
pathParams: { id },
|
||||
@@ -81,27 +107,74 @@ export function BusinessTasks() {
|
||||
},
|
||||
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) => {
|
||||
const href = subjectLink(t);
|
||||
return (
|
||||
<div className="min-w-0">
|
||||
<p className="font-medium text-foreground">{TASK_KIND_LABEL[t.kind] ?? t.kind}</p>
|
||||
{href ? (
|
||||
<Link to={href} className="font-mono text-meta text-muted-foreground hover:underline">
|
||||
{t.subjectType} · {t.subjectId?.slice(0, 8)}
|
||||
</Link>
|
||||
) : (
|
||||
<p className="font-mono text-meta text-muted-foreground">{t.subjectType ?? "—"}</p>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
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",
|
||||
@@ -136,72 +209,22 @@ export function BusinessTasks() {
|
||||
hideBelow: "sm",
|
||||
cell: (t) => <span className="whitespace-nowrap text-muted-foreground">{relTime(t.createdAt)}</span>,
|
||||
},
|
||||
{
|
||||
key: "ops",
|
||||
header: "",
|
||||
align: "right",
|
||||
cell: (t) => (
|
||||
<div className="flex justify-end gap-1">
|
||||
{t.engineRunId ? (
|
||||
<Button variant="ghost" size="sm" asChild>
|
||||
<Link to={`/console/engine/${encodeURIComponent(t.engineRunId)}`}>引擎</Link>
|
||||
</Button>
|
||||
) : null}
|
||||
{ACTIVE.includes(t.status) ? (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
disabled={action.isPending}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
action.mutate({ id: t.id, op: "cancel" });
|
||||
}}
|
||||
>
|
||||
<Square />
|
||||
取消
|
||||
</Button>
|
||||
) : null}
|
||||
{t.status === "failed" || t.status === "dead" ? (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
disabled={action.isPending}
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
action.mutate({ id: t.id, op: "retry" });
|
||||
}}
|
||||
>
|
||||
<RotateCcw />
|
||||
重试
|
||||
</Button>
|
||||
) : null}
|
||||
</div>
|
||||
),
|
||||
},
|
||||
{ key: "ops", header: "", align: "right", cell: (t) => <TaskActions t={t} size="xs" /> },
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
<FilterBar
|
||||
onReset={
|
||||
kind || status
|
||||
? () => {
|
||||
setKind("");
|
||||
setStatus("");
|
||||
}
|
||||
: undefined
|
||||
}
|
||||
>
|
||||
<FilterBar onReset={f.active ? f.reset : undefined}>
|
||||
<FilterSelect
|
||||
label="类型"
|
||||
value={kind}
|
||||
onChange={setKind}
|
||||
onChange={(v) => f.set("kind", v)}
|
||||
options={Object.entries(TASK_KIND_LABEL).map(([value, label]) => ({ value, label }))}
|
||||
/>
|
||||
<FilterSelect
|
||||
label="状态"
|
||||
value={status}
|
||||
onChange={setStatus}
|
||||
onChange={(v) => f.set("status", v)}
|
||||
options={Object.entries(TASK_STATUS).map(([value, v]) => ({ value, label: v.label }))}
|
||||
/>
|
||||
</FilterBar>
|
||||
@@ -212,15 +235,106 @@ export function BusinessTasks() {
|
||||
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: kind || status ? "没有符合筛选的任务" : "还没有业务任务",
|
||||
description: "提交下载、核验入库、清理缓存、对账等后台任务会出现在这里。",
|
||||
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: 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("engine", t.engineRunId)} className="font-mono underline underline-offset-4">
|
||||
{t.engineRunId.slice(0, 12)}
|
||||
</Link>
|
||||
) : null,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</DetailSection>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,10 +1,11 @@
|
||||
import type { Dashboard } from "@umt/contracts";
|
||||
import { Brush, HardDrive } from "lucide-react";
|
||||
import { useNavigate } from "react-router";
|
||||
import { Brush, HardDrive, SlidersHorizontal } from "lucide-react";
|
||||
import { Link, useNavigate } from "react-router";
|
||||
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 { consolePath, settingsPath } from "~/components/console/nav.ts";
|
||||
import { StatusBadge } from "~/components/console/status-badge.tsx";
|
||||
import { Button } from "~/components/ui/button.tsx";
|
||||
import { errorMessage } from "~/lib/api.ts";
|
||||
@@ -76,7 +77,7 @@ function VolumeBar({ v }: { v: Volume }) {
|
||||
);
|
||||
}
|
||||
|
||||
/** 缓存卷用量 / 阈值条 + 手动清理入口 */
|
||||
/** 缓存卷水位 / 阈值条 + 阈值设置与手动清理入口(下载队列页头) */
|
||||
export function CacheVolumes() {
|
||||
const vols = useCacheVolumes();
|
||||
const cleanup = useCacheCleanup();
|
||||
@@ -84,34 +85,42 @@ export function CacheVolumes() {
|
||||
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) => {
|
||||
toast.success(`已排队清理任务 ${r.taskId.slice(0, 8)}`, { description: "结果见任务详情" });
|
||||
navigate(`/console/engine/${r.runId}`);
|
||||
},
|
||||
(e) => toast.error(errorMessage(e)),
|
||||
)
|
||||
}
|
||||
/>
|
||||
<h2 className="text-label font-semibold tracking-[0.18em] text-muted-foreground uppercase">缓存水位</h2>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Button asChild variant="ghost" size="sm">
|
||||
<Link to={settingsPath("automation", "cache")}>
|
||||
<SlidersHorizontal />
|
||||
调整阈值
|
||||
</Link>
|
||||
</Button>
|
||||
<ConfirmDialog
|
||||
trigger={
|
||||
<Button variant="outline" size="sm" disabled={cleanup.isPending}>
|
||||
<Brush />
|
||||
立即清理
|
||||
</Button>
|
||||
}
|
||||
title="按规则清理下载缓存?"
|
||||
description="只清理已入库、且满足保留期与 H&R 的纳管任务,其余不动。"
|
||||
confirmLabel="清理"
|
||||
onConfirm={() =>
|
||||
cleanup.mutateAsync(undefined).then(
|
||||
(r) => {
|
||||
toast.success("清理已排队");
|
||||
navigate(consolePath("tasks", r.taskId));
|
||||
},
|
||||
(e) => toast.error(errorMessage(e)),
|
||||
)
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</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>
|
||||
<p className="text-caption text-muted-foreground">还没有缓存卷数据。登记下载器并完成巡检后显示。</p>
|
||||
) : (
|
||||
<div className="grid gap-5 md:grid-cols-2">
|
||||
{vols.data.map((v) => (
|
||||
|
||||
@@ -648,7 +648,7 @@ export function DeleteDialog({
|
||||
const reason = filesErrorReason(e);
|
||||
setErr(
|
||||
reason === "permanent_disabled"
|
||||
? "系统设置未开启永久删除(files.allowPermanentDelete)"
|
||||
? "设置里未开启永久删除(files.allowPermanentDelete)"
|
||||
: reason === "approval_required"
|
||||
? "用 API Key 删除,每次都需要审批"
|
||||
: filesErrorText(e),
|
||||
@@ -701,7 +701,7 @@ export function DeleteDialog({
|
||||
{c.downloads.map((d) => (
|
||||
<p key={d.taskId}>
|
||||
下载任务{" "}
|
||||
<Link className="underline hover:text-foreground" to={`/console/tasks/${d.taskId}`}>
|
||||
<Link className="underline hover:text-foreground" to={`/console/downloads/${d.taskId}`}>
|
||||
{d.taskId.slice(0, 8)}
|
||||
</Link>{" "}
|
||||
· {d.status} · H&R{" "}
|
||||
@@ -774,7 +774,7 @@ export function DeleteDialog({
|
||||
<span>
|
||||
永久删除
|
||||
<span className="block text-meta text-muted-foreground">
|
||||
{isAdmin ? "不可恢复。需要在系统设置里开启。" : "仅管理员会话可用。"}
|
||||
{isAdmin ? "不可恢复。需要在设置里开启。" : "仅管理员会话可用。"}
|
||||
</span>
|
||||
</span>
|
||||
</label>
|
||||
@@ -858,7 +858,7 @@ export function CopyPathDialog({ root, entry, onClose }: { root: FileRoot; entry
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
<p className="text-meta text-muted-foreground">下载器与媒体服务器看到的路径按“系统设置 → 路径映射”换算。</p>
|
||||
<p className="text-meta text-muted-foreground">下载器与媒体服务器看到的路径按“设置 → 路径映射”换算。</p>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
);
|
||||
|
||||
@@ -132,7 +132,7 @@ export function FileDetail({
|
||||
{
|
||||
label: "任务",
|
||||
value: (
|
||||
<Link className="underline underline-offset-2" to={`/console/tasks/${e.download.taskId}`}>
|
||||
<Link className="underline underline-offset-2" to={`/console/downloads/${e.download.taskId}`}>
|
||||
{downloadLabel(e.download.status).label}
|
||||
</Link>
|
||||
),
|
||||
|
||||
@@ -66,7 +66,7 @@ export function EntryStatus({ e, compact = false }: { e: FileEntry; compact?: bo
|
||||
<StatusBadge tone={v.tone}>{v.label}</StatusBadge>
|
||||
{!compact && e.download ? (
|
||||
<Link
|
||||
to={`/console/tasks/${e.download.taskId}`}
|
||||
to={`/console/downloads/${e.download.taskId}`}
|
||||
onClick={(ev) => ev.stopPropagation()}
|
||||
className="truncate text-meta text-muted-foreground underline-offset-2 hover:text-foreground hover:underline"
|
||||
>
|
||||
|
||||
@@ -385,7 +385,7 @@ export function OrganizeWizard({
|
||||
</div>
|
||||
</section>
|
||||
<section className="space-y-1 rounded-xl border border-border px-3 py-2.5 text-caption text-muted-foreground">
|
||||
<p>命名:按系统设置的命名模板;已绑定的作品/季沿用原目录。</p>
|
||||
<p>命名:按设置里的命名模板;已绑定的作品/季沿用原目录。</p>
|
||||
<p>目标已存在:不覆盖,作为冲突进入待处理。</p>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
@@ -208,7 +208,6 @@ export function PolicyWorkspace({
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<p className="text-caption text-muted-foreground">草案发布后才生效。回滚会用旧版本内容发布一个新版本。</p>
|
||||
{q.isPending ? (
|
||||
<div className="pg-slab rounded-xl p-4">
|
||||
<LoadingState rows={4} />
|
||||
|
||||
@@ -56,7 +56,7 @@ export function DownloadDialog({
|
||||
if (r.submitted && r.plan) {
|
||||
setRejected(null);
|
||||
setDone(r.plan.id);
|
||||
toast.success(`已提交${slotName(r.slotId) ? `(${slotName(r.slotId)})` : ""},进度见“下载与任务”`);
|
||||
toast.success(`已提交${slotName(r.slotId) ? `(${slotName(r.slotId)})` : ""},进度见“下载队列”`);
|
||||
} else {
|
||||
setRejected(r.rejected);
|
||||
toast.warning("没有生成下载计划");
|
||||
@@ -121,7 +121,7 @@ export function DownloadDialog({
|
||||
{done ? (
|
||||
<p className="text-caption text-success">
|
||||
计划已生成。
|
||||
<Link to="/console/tasks" className="underline underline-offset-4">
|
||||
<Link to="/console/downloads/plans" className="underline underline-offset-4">
|
||||
查看
|
||||
</Link>
|
||||
</p>
|
||||
|
||||
Reference in new issue
Block a user