wlw/ai-agent
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: refactor log detail display into MetaStrip component for improved readability

Browse Source
This commit is contained in:
mlogclub
2026-04-14 23:31:58 +08:00
parent 1ccdd182b4
commit e6df473664
1 changed files with 22 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/app/(console)/agent-run-logs/_components/detail.tsx
+22 -10
View File
@@ -104,12 +104,14 @@ export function AgentRunLogDetailDialog({
<div className="py-10 text-sm text-muted-foreground">加载中...</div> <div className="py-10 text-sm text-muted-foreground">加载中...</div>
) : activeLog ? ( ) : activeLog ? (
<> <>
<div className="grid gap-4 md:grid-cols-2 xl:grid-cols-4"> <MetaStrip
<MetricCard label="日志ID" value={String(activeLog.id)} /> items={[
<MetricCard label="会话ID" value={String(activeLog.conversationId || "-")} /> { label: "日志ID", value: String(activeLog.id) },
<MetricCard label="消息ID" value={String(activeLog.messageId || "-")} /> { label: "会话ID", value: String(activeLog.conversationId || "-") },
<MetricCard label="AI Agent" value={String(activeLog.aiAgentId || "-")} /> { label: "消息ID", value: String(activeLog.messageId || "-") },
</div> { label: "AI Agent", value: String(activeLog.aiAgentId || "-") },
]}
/>
<InfoBlock <InfoBlock
title="规划阶段" title="规划阶段"
@@ -202,11 +204,21 @@ function safeParseJSON(value: string) {
} }
} }
function MetricCard({ label, value }: { label: string; value: string }) { function MetaStrip({
items,
}: {
items: Array<{ label: string; value: string }>
}) {
return ( return (
<div className="rounded-lg border bg-muted/20 p-4"> <div className="rounded-lg border bg-muted/20 px-4 py-3">
<div className="text-xs text-muted-foreground">{label}</div> <div className="flex flex-wrap gap-x-6 gap-y-2 text-sm">
<div className="mt-2 text-lg font-semibold">{value}</div> {items.map((item) => (
<div key={item.label} className="flex min-w-0 items-center gap-2">
<span className="shrink-0 text-xs text-muted-foreground">{item.label}</span>
<span className="min-w-0 truncate font-medium">{item.value}</span>
</div>
))}
</div>
</div> </div>
) )
} }