Files
UHD_Media_Tool/apps/web/app/routes/console/agent.$runId.tsx
T
rootandClaude Opus 5.5 3692793dff feat(agent): 抽屉与会话页统一成一个对话界面,子会话在父会话里实时可见
- 抽屉和会话页渲染同一套 GoalComposer / AgentRunPanel;抽屉标题即最近会话切换,
  头部只有新对话、在页面打开、关闭;去掉右下角悬浮按钮和最小化小窗
- 会话列表合一:对话与巡检混排带类型小标签,搜索 + 一个状态下拉,只列顶层会话
  (GET /agent/runs?roots=true,新增可选参数)
- 子会话卡片:由镜像的 subagent_* 事件折成,显示任务、状态、当前步骤、用时、调用次数、费用,
  可展开看过程、可打开;顶部「N 个子会话运行中」跳到卡片;subagent_completed 加可选 durationMs
- 回答去内部字段:汇报规则禁止照抄键值与字段表;展示层 stripInternalFields 把字段行 / 字段表移进技术信息
- 开场建议按页面给 2 条完整问法、点了直接发;指令只留 /先给方案,/重跑 改成「重新运行」按钮

Co-Authored-By: Claude Opus 5.5 <[email protected]>
Claude-Session: https://claude.ai/code/session_01Cxwgnn2pbzQ7rXv3rq7fei
2026-10-08 13:56:38 +08:00

46 lines
1.8 KiB
TypeScript

import { ArrowLeft, PanelRightOpen } from "lucide-react";
import { Link, useNavigate, useParams } from "react-router";
import { agentMockEnabled } from "~/api/agent.ts";
import { agentListHref } from "~/components/agent/agent-nav.ts";
import { AgentRunPanel } from "~/components/agent/agent-run-panel.tsx";
import { agentReturnPath, showAgentRunInDrawer } from "~/components/agent/agent-store.ts";
import { Button } from "~/components/ui/button.tsx";
// 会话页的右栏:和抽屉里同一个会话组件(顶部状态与统计、会话流、底部输入区);标题与左栏会话列表在外壳 agent.tsx,
// 切换会话不重挂载。子会话在会话流里派出它的位置。
export default function AgentRunPage() {
const { runId = "" } = useParams();
const navigate = useNavigate();
const mock = agentMockEnabled();
return (
<div className="pg-slab flex h-[calc(100dvh-10.25rem)] min-h-[28rem] flex-col gap-2 rounded-2xl p-3 md:p-4 lg:h-[calc(100dvh-11.25rem)]">
<Button asChild variant="ghost" size="sm" className="-mt-1 -ml-2 self-start text-muted-foreground lg:hidden">
<Link to={agentListHref(mock)}>
<ArrowLeft />
全部会话
</Link>
</Button>
<AgentRunPanel
key={runId}
runId={runId}
className="min-h-0 flex-1"
actions={
// 整页 → 抽屉:回到进智能体页面之前的页面,会话在抽屉里接着看
<Button
variant="ghost"
size="icon-sm"
aria-label="在侧边打开"
title="在侧边打开,回到之前的页面"
onClick={() => {
showAgentRunInDrawer(runId);
navigate(agentReturnPath() ?? "/console");
}}
>
<PanelRightOpen />
</Button>
}
/>
</div>
);
}