rootandClaude Opus 5.5
4480fc346d
- 版本目标 → 收录版本(前后端用户可见字符串、能力描述、给模型的提示) - Agent 上游 / 上游 → 模型服务;界面上的 Agent / Agent 会话 → 智能体 / 智能体会话 - 身份歧义 / 识别有歧义 / 无法确定作品 → 没识别出作品;待识别(池) → 未识别 - 建档 → 加入媒体库;资产 → 文件;库根 → 媒体库目录;纳管 → 本工具 / 外部任务; 哨兵 → 标记文件 / 检查目录;站点快照 → 抓取;Feed / RSS 订阅 / 来源健康 → RSS - 代码标识符、API 字段名、迁移文件不改;glossary.md 同步;smoke 选择器跟随 Co-Authored-By: Claude Opus 5.5 <[email protected]>
242 lines
9.6 KiB
TypeScript
242 lines
9.6 KiB
TypeScript
import { useQueryClient } from "@tanstack/react-query";
|
|
import { SCHEDULE_CHANGED_EVENT, type ScheduledJob } from "@umt/contracts";
|
|
import { AlertTriangle, Bot, CalendarClock, CircleCheck, Coins, LoaderCircle, Plus, XCircle } from "lucide-react";
|
|
import { type ReactNode, useEffect, useRef, useState } from "react";
|
|
import { useLocation } from "react-router";
|
|
import { usePiUpstreamModels, usePiUpstreams } from "~/api/pi.ts";
|
|
import { useScheduleBoard } from "~/api/schedules.ts";
|
|
import { EmptyState, ErrorState, LoadingState } from "~/components/console/empty-state.tsx";
|
|
import { StatTile } from "~/components/console/stat-tile.tsx";
|
|
import { Button } from "~/components/ui/button.tsx";
|
|
import { qk } from "~/lib/query-keys.ts";
|
|
import { useSse } from "~/lib/sse.ts";
|
|
import { AgentCheckCard, type DefaultUpstream } from "./agent-check-card.tsx";
|
|
import { AgentCheckDialog } from "./agent-check-dialog.tsx";
|
|
import { AutoTaskList } from "./auto-task-list.tsx";
|
|
import { formatUsd } from "./labels.ts";
|
|
import { RunsSheet } from "./runs-sheet.tsx";
|
|
|
|
// 计划页(FE-6,/console/schedules):「自动任务」= 程序按固定周期执行的定时任务(紧凑列表);
|
|
// 「Agent 巡检」= 到点发起 Agent 会话的定时任务(卡片)。自动任务的运行记录跳任务页按该定时任务筛选。
|
|
|
|
/** 每秒一跳的当前时间(倒计时用) */
|
|
export function useNow(ms = 1000) {
|
|
const [now, setNow] = useState(() => Date.now());
|
|
useEffect(() => {
|
|
const t = setInterval(() => setNow(Date.now()), ms);
|
|
return () => clearInterval(t);
|
|
}, [ms]);
|
|
return now;
|
|
}
|
|
|
|
/** SSE:调度器每次开始/结束一次运行都会发 schedule.changed;1 秒节流 */
|
|
export function useLiveSchedules() {
|
|
const qc = useQueryClient();
|
|
const timer = useRef<ReturnType<typeof setTimeout> | null>(null);
|
|
useSse([SCHEDULE_CHANGED_EVENT], () => {
|
|
if (timer.current) return;
|
|
timer.current = setTimeout(() => {
|
|
timer.current = null;
|
|
qc.invalidateQueries({ queryKey: qk.all("schedules") });
|
|
}, 1000);
|
|
});
|
|
useEffect(
|
|
() => () => {
|
|
if (timer.current) clearTimeout(timer.current);
|
|
},
|
|
[],
|
|
);
|
|
return useScheduleBoard();
|
|
}
|
|
|
|
/** 两节的计数:自动任务 启用/失败/运行中;巡检 启用/失败/近 7 天费用(后端按巡检汇总的 agentRuns) */
|
|
export function planStats(items: ScheduledJob[]) {
|
|
const auto = items.filter((j) => j.kind === "task");
|
|
const checks = items.filter((j) => j.kind === "agent_check");
|
|
const count = (list: ScheduledJob[]) => ({
|
|
total: list.length,
|
|
enabled: list.filter((j) => j.enabled && j.available).length,
|
|
failed: list.filter((j) => j.lastStatus === "failed").length,
|
|
running: list.filter((j) => !!j.runningSince).length,
|
|
});
|
|
return {
|
|
auto: count(auto),
|
|
checks: {
|
|
...count(checks),
|
|
weekRuns: checks.reduce((s, j) => s + (j.agentRuns?.weekCount ?? 0), 0),
|
|
weekCost: checks.reduce((s, j) => s + (j.agentRuns?.weekCostUsd ?? 0), 0),
|
|
},
|
|
};
|
|
}
|
|
|
|
function SectionHead({ id, title, hint, actions }: { id: string; title: string; hint: string; actions?: ReactNode }) {
|
|
return (
|
|
<div className="mb-3 flex flex-wrap items-end gap-x-3 gap-y-2">
|
|
<div className="min-w-0">
|
|
<h2 id={id} className="scroll-mt-20 text-title-sm font-semibold text-foreground">
|
|
{title}
|
|
</h2>
|
|
<p className="mt-0.5 text-caption text-muted-foreground">{hint}</p>
|
|
</div>
|
|
{actions ? <div className="ml-auto flex items-center gap-2">{actions}</div> : null}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function PlanBoard({ highlightJob }: { highlightJob?: string }) {
|
|
const board = useLiveSchedules();
|
|
const upstreams = usePiUpstreams();
|
|
const now = useNow();
|
|
const { hash } = useLocation();
|
|
const [editing, setEditing] = useState<{ job: ScheduledJob | null; key: number } | null>(null);
|
|
const [history, setHistory] = useState<ScheduledJob | null>(null);
|
|
|
|
const data = board.data;
|
|
const items = data?.items ?? [];
|
|
const autoJobs = items.filter((j) => j.kind === "task");
|
|
const checks = items.filter((j) => j.kind === "agent_check");
|
|
const def = upstreams.data?.items.find((u) => u.isDefault);
|
|
// 上游没填默认模型时,运行时用模型目录的第一个(packages/agent pi/upstream.ts pickModel),这里同样取目录首个
|
|
const catalog = usePiUpstreamModels(def && !def.defaultModel ? def.id : null);
|
|
const catalogModel = catalog.data?.models[0]?.id ?? null;
|
|
const upstream: DefaultUpstream = def
|
|
? {
|
|
name: def.name,
|
|
model: def.defaultModel ?? catalogModel,
|
|
modelFromCatalog: !def.defaultModel && !!catalogModel,
|
|
}
|
|
: null;
|
|
const s = planStats(items);
|
|
const val = (n: number) => (board.isPending ? "…" : board.isError ? "—" : n);
|
|
|
|
// 首页计数链到 #auto / #checks:数据到了再滚过去
|
|
const loaded = !!data;
|
|
useEffect(() => {
|
|
if (!loaded || highlightJob) return;
|
|
const id = hash.replace(/^#/, "");
|
|
if (id === "auto" || id === "checks") document.getElementById(id)?.scrollIntoView({ block: "start" });
|
|
}, [loaded, hash, highlightJob]);
|
|
|
|
const jump = (id: string) => document.getElementById(id)?.scrollIntoView({ block: "start", behavior: "smooth" });
|
|
|
|
return (
|
|
<>
|
|
<div className="mb-4 grid gap-3 lg:grid-cols-2">
|
|
<div className="grid gap-1.5">
|
|
<p className="px-1 text-meta font-medium text-muted-foreground">自动任务</p>
|
|
<div className="grid grid-cols-3 gap-2">
|
|
<StatTile
|
|
label="已启用"
|
|
icon={CircleCheck}
|
|
value={val(s.auto.enabled)}
|
|
hint={board.isPending ? undefined : `共 ${s.auto.total} 项`}
|
|
onClick={() => jump("auto")}
|
|
/>
|
|
<StatTile
|
|
label="上次失败"
|
|
icon={XCircle}
|
|
tone={s.auto.failed > 0 ? "destructive" : "neutral"}
|
|
value={val(s.auto.failed)}
|
|
onClick={() => jump("auto")}
|
|
/>
|
|
<StatTile label="运行中" icon={LoaderCircle} value={val(s.auto.running)} onClick={() => jump("auto")} />
|
|
</div>
|
|
</div>
|
|
<div className="grid gap-1.5">
|
|
<p className="px-1 text-meta font-medium text-muted-foreground">智能体巡检</p>
|
|
<div className="grid grid-cols-3 gap-2">
|
|
<StatTile
|
|
label="已启用"
|
|
icon={Bot}
|
|
value={val(s.checks.enabled)}
|
|
hint={board.isPending ? undefined : `共 ${s.checks.total} 项`}
|
|
onClick={() => jump("checks")}
|
|
/>
|
|
<StatTile
|
|
label="上次失败"
|
|
icon={XCircle}
|
|
tone={s.checks.failed > 0 ? "destructive" : "neutral"}
|
|
value={val(s.checks.failed)}
|
|
onClick={() => jump("checks")}
|
|
/>
|
|
<StatTile
|
|
label="近 7 天费用"
|
|
icon={Coins}
|
|
value={data ? formatUsd(s.checks.weekCost) : "…"}
|
|
hint={data ? `${s.checks.weekRuns} 次会话` : undefined}
|
|
onClick={() => jump("checks")}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{data && !data.schedulerOnline ? (
|
|
<p
|
|
role="status"
|
|
className="mb-4 flex items-center gap-2 rounded-tight border border-warning/30 bg-warning/10 px-3 py-2 text-caption text-warning"
|
|
>
|
|
<AlertTriangle className="h-4 w-4 shrink-0" />
|
|
调度器未在线，定时任务不会按时运行。
|
|
</p>
|
|
) : null}
|
|
|
|
{board.isPending ? (
|
|
<LoadingState rows={8} />
|
|
) : board.isError ? (
|
|
<ErrorState error={board.error} onRetry={() => board.refetch()} />
|
|
) : (
|
|
<div className="grid gap-8">
|
|
<section aria-labelledby="auto">
|
|
<SectionHead
|
|
id="auto"
|
|
title="自动任务"
|
|
hint="程序按固定周期执行，不调用模型。间隔可直接改，改过的可恢复默认。"
|
|
/>
|
|
{autoJobs.length === 0 ? (
|
|
<EmptyState icon={CalendarClock} title="还没有自动任务" description="worker 启动后自动登记。" />
|
|
) : (
|
|
<AutoTaskList jobs={autoJobs} now={now} highlightJob={highlightJob} />
|
|
)}
|
|
</section>
|
|
|
|
<section aria-labelledby="checks">
|
|
<SectionHead
|
|
id="checks"
|
|
title="智能体巡检"
|
|
hint="到点按目标发起一次智能体会话，只在能力白名单和预算内执行；触发条件不满足时跳过，不调用模型。"
|
|
actions={
|
|
<Button size="sm" onClick={() => setEditing({ job: null, key: Date.now() })}>
|
|
<Plus />
|
|
新建巡检
|
|
</Button>
|
|
}
|
|
/>
|
|
{checks.length === 0 ? (
|
|
<EmptyState icon={Bot} title="还没有巡检" description="新建一个巡检，到点由智能体按目标检查并汇报。" />
|
|
) : (
|
|
<div className="grid items-start gap-4 md:grid-cols-2 2xl:grid-cols-3">
|
|
{checks.map((j) => (
|
|
<AgentCheckCard
|
|
key={j.id}
|
|
job={j}
|
|
now={now}
|
|
upstream={upstream}
|
|
highlight={highlightJob === j.id}
|
|
onEdit={(job) => setEditing({ job, key: Date.now() })}
|
|
onHistory={setHistory}
|
|
/>
|
|
))}
|
|
</div>
|
|
)}
|
|
</section>
|
|
</div>
|
|
)}
|
|
|
|
{editing ? (
|
|
<AgentCheckDialog key={editing.key} open job={editing.job} onOpenChange={(o) => !o && setEditing(null)} />
|
|
) : null}
|
|
<RunsSheet job={history} onClose={() => setHistory(null)} />
|
|
</>
|
|
);
|
|
}
|