docs(uiux): UIUX 设计方案大改 + 5 份作业指导书对齐 + 开发任务文档
- UIUX 文档:填充 19 个缺口(多主体画像/健康度/AI+看板/增长域/洞察域/创始人端/OODA/助推/商密) - UIUX 文档:插入 6 个新章节(十四~十九),旧章节重编号为二十~三十一,更新目录和交叉引用 - 作业指导书 x5:导航改为 6 域分组,新增 Context Bar/工作模式/Insight Rail/决策线程/多工作区等 UI 概念 - 新建 docs/2-task-uiux.md:50 个代码落地开发任务,按 P0-P6 分优先级 + 8 Sprint 规划 - 后端/前端:大量新增模型、路由、组件(来自之前 Phase 开发)
This commit is contained in:
@@ -0,0 +1,91 @@
|
||||
"use client";
|
||||
|
||||
import { useEffect, useState } from "react";
|
||||
import { Bot } from "lucide-react";
|
||||
import { listAgentExecutions, reviewAgentExecution } from "@/lib/api-v2";
|
||||
import { PageContainer, Badge, TableEmpty } from "@/components/shared/PageContainer";
|
||||
import { LoadingSpinner } from "@/components/shared/LoadingSpinner";
|
||||
import { EmptyState } from "@/components/shared/EmptyState";
|
||||
import { toast } from "sonner";
|
||||
|
||||
export default function AgentsPage() {
|
||||
const [items, setItems] = useState<Record<string, any>[]>([]);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
const load = () => {
|
||||
listAgentExecutions()
|
||||
.then((resp) => setItems((resp.data as Record<string, any>[]) ?? []))
|
||||
.catch(() => setItems([]))
|
||||
.finally(() => setIsLoading(false));
|
||||
};
|
||||
|
||||
useEffect(() => { load(); }, []);
|
||||
|
||||
const handleReview = async (id: string, status: string) => {
|
||||
try {
|
||||
await reviewAgentExecution(id, status);
|
||||
toast.success("审核完成");
|
||||
load();
|
||||
} catch {
|
||||
toast.error("审核失败");
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<PageContainer title="Agent 监控" description="L1-L4 分级自治执行 + 人工审核">
|
||||
{isLoading ? (
|
||||
<LoadingSpinner />
|
||||
) : items.length === 0 ? (
|
||||
<EmptyState description="暂无 Agent 执行记录" />
|
||||
) : (
|
||||
<div className="overflow-x-auto rounded-lg border border-gray-200">
|
||||
<table className="min-w-full divide-y divide-gray-200 text-sm">
|
||||
<thead className="bg-gray-50">
|
||||
<tr>
|
||||
<th className="px-4 py-2 text-left font-medium text-gray-500">Agent</th>
|
||||
<th className="px-4 py-2 text-left font-medium text-gray-500">自治级别</th>
|
||||
<th className="px-4 py-2 text-left font-medium text-gray-500">输出摘要</th>
|
||||
<th className="px-4 py-2 text-left font-medium text-gray-500">耗时</th>
|
||||
<th className="px-4 py-2 text-left font-medium text-gray-500">审核状态</th>
|
||||
<th className="px-4 py-2 text-left font-medium text-gray-500">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-gray-100 bg-white">
|
||||
{items.map((item, i) => (
|
||||
<tr key={i}>
|
||||
<td className="px-4 py-2 text-gray-900">{item.agent_name as string}</td>
|
||||
<td className="px-4 py-2"><Badge color={item.autonomy_level === "L4" ? "red" : item.autonomy_level === "L3" ? "amber" : "blue"}>{item.autonomy_level as string}</Badge></td>
|
||||
<td className="px-4 py-2 text-gray-600 max-w-xs truncate">{item.output_summary as string}</td>
|
||||
<td className="px-4 py-2 text-gray-500">{item.duration_ms ? `${item.duration_ms}ms` : "-"}</td>
|
||||
<td className="px-4 py-2">
|
||||
<Badge color={item.review_status === "approved" ? "green" : item.review_status === "rejected" ? "red" : "amber"}>
|
||||
{item.review_status as string}
|
||||
</Badge>
|
||||
</td>
|
||||
<td className="px-4 py-2">
|
||||
{item.review_status === "pending" && (
|
||||
<div className="flex gap-1">
|
||||
<button
|
||||
onClick={() => handleReview(item.id as string, "approved")}
|
||||
className="rounded bg-emerald-600 px-2 py-0.5 text-xs text-white hover:bg-emerald-700"
|
||||
>
|
||||
批准
|
||||
</button>
|
||||
<button
|
||||
onClick={() => handleReview(item.id as string, "rejected")}
|
||||
className="rounded bg-rose-600 px-2 py-0.5 text-xs text-white hover:bg-rose-700"
|
||||
>
|
||||
拒绝
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
)}
|
||||
</PageContainer>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user