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

refactor: support i18n

Browse Source
This commit is contained in:
mlogclub
2026-05-25 12:06:15 +08:00
parent 309ac1fe9e
commit 988f55c80d
179 changed files with 10968 additions and 3763 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/app/dashboard/agent-run-logs/_components/detail.tsx
+59 -21
View File
@@ -9,6 +9,7 @@ import { JsonTreeViewer } from "@/components/json-tree-viewer"
import { ProjectDialog } from "@/components/project-dialog"
import { Button } from "@/components/ui/button"
import { fetchAgentRunLog, type AgentRunLog } from "@/lib/api/admin"
import { useI18n } from "@/i18n/provider"
import { formatDateTime } from "@/lib/utils"
type AgentRunLogDetailDialogProps = {
@@ -17,11 +18,14 @@ type AgentRunLogDetailDialogProps = {
onOpenChange: (open: boolean) => void
}
type TFunction = (key: string, values?: Record<string, string | number>) => string
export function AgentRunLogDetailDialog({
open,
logId,
onOpenChange,
}: AgentRunLogDetailDialogProps) {
const t = useI18n()
const [loading, setLoading] = useState(false)
const [activeLog, setActiveLog] = useState<AgentRunLog | null>(null)
@@ -42,7 +46,7 @@ export function AgentRunLogDetailDialog({
}
} catch (error) {
if (!cancelled) {
toast.error(error instanceof Error ? error.message : "加载日志详情失败")
toast.error(error instanceof Error ? error.message : t("agentRunLog.loadDetailFailed"))
onOpenChange(false)
}
} finally {
@@ -57,7 +61,7 @@ export function AgentRunLogDetailDialog({
return () => {
cancelled = true
}
}, [logId, onOpenChange, open])
}, [logId, onOpenChange, open, t])
useEffect(() => {
if (open) {
@@ -87,35 +91,35 @@ export function AgentRunLogDetailDialog({
title={
<span className="flex items-center gap-2">
<WorkflowIcon className="size-4" />
Agent 运行详情
{t("agentRunLog.detailTitle")}
</span>
}
description="查看 planner 选择、最终动作、回复内容与错误信息。"
description={t("agentRunLog.detailDescription")}
size="xl"
allowFullscreen
defaultFullscreen
bodyClassName="min-h-0"
footer={
<Button variant="outline" onClick={() => onOpenChange(false)}>
关闭
{t("agentRunLog.close")}
</Button>
}
>
{loading ? (
<div className="py-10 text-sm text-muted-foreground">加载中...</div>
<div className="py-10 text-sm text-muted-foreground">{t("agentRunLog.loading")}</div>
) : activeLog ? (
<>
<MetaStrip
items={[
{ label: "日志ID", value: String(activeLog.id) },
{ label: "会话ID", value: String(activeLog.conversationId || "-") },
{ label: "消息ID", value: String(activeLog.messageId || "-") },
{ label: t("agentRunLog.logId"), value: String(activeLog.id) },
{ label: t("agentRunLog.conversationId"), value: String(activeLog.conversationId || "-") },
{ label: t("agentRunLog.messageId"), value: String(activeLog.messageId || "-") },
{ label: "AI Agent", value: String(activeLog.aiAgentId || "-") },
]}
/>
<InfoBlock
title="规划阶段"
title={t("agentRunLog.planningStage")}
lines={[
`plannedAction: ${activeLog.plannedAction || "-"}`,
`plannedSkillCode: ${activeLog.plannedSkillCode || "-"}`,
@@ -131,15 +135,15 @@ export function AgentRunLogDetailDialog({
]}
/>
<InfoBlock
title="HITL 状态"
title={t("agentRunLog.hitlStatus")}
lines={[
`hitlStatus: ${activeLog.hitlStatus || "-"}`,
`hitlStatusName: ${activeLog.hitlStatusName || "-"}`,
`hitlSummary: ${activeLog.hitlSummary || "-"}`,
`hitlStatusName: ${getHitlStatusLabel(activeLog.hitlStatus, t) || "-"}`,
`hitlSummary: ${getHitlSummary(activeLog.hitlStatus, t) || "-"}`,
]}
/>
<InfoBlock
title="执行结果"
title={t("agentRunLog.executionResult")}
lines={[
`finalAction: ${activeLog.finalAction || "-"}`,
`finalStatus: ${activeLog.finalStatus || "-"}`,
@@ -151,40 +155,74 @@ export function AgentRunLogDetailDialog({
/>
<JsonBlock
title="动态工具选择"
title={t("agentRunLog.dynamicTools")}
jsonValue={activeToolSearchTrace}
fallbackValue={activeLog.toolSearchTrace}
/>
<JsonBlock
title="Graph Tool 调用"
title={t("agentRunLog.graphToolCall")}
jsonValue={activeGraphToolTrace}
fallbackValue={activeLog.graphToolTrace}
/>
<TextBlock
icon={<BotMessageSquareIcon className="size-4" />}
title="用户问题"
title={t("agentRunLog.userMessage")}
value={activeLog.userMessage}
renderAsHtml
/>
<TextBlock
icon={<WorkflowIcon className="size-4" />}
title="机器人回复"
title={t("agentRunLog.botReply")}
value={activeLog.replyText}
/>
<TextBlock title="错误信息" value={activeLog.errorMessage} tone="danger" />
<TextBlock title={t("agentRunLog.errorMessage")} value={activeLog.errorMessage} tone="danger" />
<JsonBlock
title="链路 Trace"
title={t("agentRunLog.trace")}
jsonValue={activeTraceData}
fallbackValue={activeLog.traceData}
/>
</>
) : (
<div className="py-10 text-sm text-muted-foreground">未找到详情数据</div>
<div className="py-10 text-sm text-muted-foreground">{t("agentRunLog.notFound")}</div>
)}
</ProjectDialog>
)
}
function getHitlStatusLabel(status: string | undefined, t: TFunction) {
switch (status) {
case "pending":
return t("agentRunLog.hitlPending")
case "confirmed":
return t("agentRunLog.hitlConfirmed")
case "cancelled":
return t("agentRunLog.hitlCancelled")
case "expired":
return t("agentRunLog.hitlExpired")
case "triggered":
return t("agentRunLog.hitlTriggered")
default:
return ""
}
}
function getHitlSummary(status: string | undefined, t: TFunction) {
switch (status) {
case "pending":
return t("agentRunLog.hitlPendingSummary")
case "confirmed":
return t("agentRunLog.hitlConfirmedSummary")
case "cancelled":
return t("agentRunLog.hitlCancelledSummary")
case "expired":
return t("agentRunLog.hitlExpiredSummary")
case "triggered":
return t("agentRunLog.hitlTriggeredSummary")
default:
return ""
}
}
function safeParseJSON(value: string) {
if (!value.trim()) {
return null
web/app/dashboard/agent-run-logs/page.tsx
+100 -70
View File
@@ -22,36 +22,62 @@ import {
type AgentRunLog,
type PageResult,
} from "@/lib/api/admin"
import { useI18n } from "@/i18n/provider"
import { formatDateTime } from "@/lib/utils"
const actionOptions = [
{ value: "all", label: "全部动作" },
{ value: "rag", label: "RAG" },
{ value: "skill", label: "Skill" },
{ value: "tool", label: "Tool" },
{ value: "graph", label: "Graph" },
{ value: "handoff", label: "转人工" },
{ value: "reply", label: "回复" },
{ value: "fallback", label: "兜底" },
]
type TFunction = (key: string, values?: Record<string, string | number>) => string
const finalStatusOptions = [
{ value: "all", label: "全部状态" },
{ value: "completed", label: "completed" },
{ value: "interrupted", label: "interrupted" },
{ value: "expired", label: "expired" },
{ value: "error", label: "error" },
{ value: "fallback", label: "fallback" },
]
function getActionOptions(t: TFunction) {
return [
{ value: "all", label: t("agentRunLog.allActions") },
{ value: "rag", label: "RAG" },
{ value: "skill", label: "Skill" },
{ value: "tool", label: "Tool" },
{ value: "graph", label: "Graph" },
{ value: "handoff", label: t("agentRunLog.handoff") },
{ value: "reply", label: t("agentRunLog.reply") },
{ value: "fallback", label: t("agentRunLog.fallback") },
]
}
const hitlStatusOptions = [
{ value: "all", label: "全部 HITL" },
{ value: "pending", label: "等待确认" },
{ value: "confirmed", label: "已确认" },
{ value: "cancelled", label: "已取消" },
{ value: "expired", label: "已过期" },
{ value: "triggered", label: "已触发" },
]
function getFinalStatusOptions(t: TFunction) {
return [
{ value: "all", label: t("agentRunLog.allStatus") },
{ value: "completed", label: "completed" },
{ value: "interrupted", label: "interrupted" },
{ value: "expired", label: "expired" },
{ value: "error", label: "error" },
{ value: "fallback", label: "fallback" },
]
}
function getHitlStatusOptions(t: TFunction) {
return [
{ value: "all", label: t("agentRunLog.allHitl") },
{ value: "pending", label: t("agentRunLog.hitlPending") },
{ value: "confirmed", label: t("agentRunLog.hitlConfirmed") },
{ value: "cancelled", label: t("agentRunLog.hitlCancelled") },
{ value: "expired", label: t("agentRunLog.hitlExpired") },
{ value: "triggered", label: t("agentRunLog.hitlTriggered") },
]
}
function getHitlStatusLabel(status: string | undefined, t: TFunction) {
switch (status) {
case "pending":
return t("agentRunLog.hitlPending")
case "confirmed":
return t("agentRunLog.hitlConfirmed")
case "cancelled":
return t("agentRunLog.hitlCancelled")
case "expired":
return t("agentRunLog.hitlExpired")
case "triggered":
return t("agentRunLog.hitlTriggered")
default:
return ""
}
}
function actionBadgeVariant(action: string) {
switch (action) {
@@ -73,6 +99,7 @@ function actionBadgeVariant(action: string) {
}
export default function DashboardAgentRunLogsPage() {
const t = useI18n()
const [keywordInput, setKeywordInput] = useState("")
const [plannedActionInput, setPlannedActionInput] = useState("all")
const [finalActionInput, setFinalActionInput] = useState("all")
@@ -95,16 +122,19 @@ export default function DashboardAgentRunLogsPage() {
page: { page: 1, limit: 20, total: 0 },
})
const [aiAgents, setAiAgents] = useState<AIAgent[]>([])
const actionOptions = useMemo(() => getActionOptions(t), [t])
const finalStatusOptions = useMemo(() => getFinalStatusOptions(t), [t])
const hitlStatusOptions = useMemo(() => getHitlStatusOptions(t), [t])
const aiAgentOptions = useMemo(
() => [
{ value: "all", label: "全部 Agent" },
{ value: "all", label: t("agentRunLog.allAgents") },
...aiAgents.map((item) => ({
value: String(item.id),
label: item.name,
})),
],
[aiAgents]
[aiAgents, t]
)
const loadData = useCallback(async () => {
@@ -122,11 +152,11 @@ export default function DashboardAgentRunLogsPage() {
})
setResult(data)
} catch (error) {
toast.error(error instanceof Error ? error.message : "加载 Agent 运行日志失败")
toast.error(error instanceof Error ? error.message : t("agentRunLog.loadFailed"))
} finally {
setLoading(false)
}
}, [aiAgentId, finalAction, finalStatus, hitlStatus, keyword, limit, page, plannedAction])
}, [aiAgentId, finalAction, finalStatus, hitlStatus, keyword, limit, page, plannedAction, t])
useEffect(() => {
void loadData()
@@ -138,11 +168,11 @@ export default function DashboardAgentRunLogsPage() {
const data = await fetchAIAgentsAll()
setAiAgents(data)
} catch (error) {
toast.error(error instanceof Error ? error.message : "加载 AI Agent 列表失败")
toast.error(error instanceof Error ? error.message : t("agentRunLog.loadAgentsFailed"))
}
}
void loadAIAgents()
}, [])
}, [t])
function applyFilters() {
setKeyword(keywordInput)
@@ -174,7 +204,7 @@ export default function DashboardAgentRunLogsPage() {
className="w-full xl:w-auto"
>
<RefreshCwIcon className={loading ? "animate-spin" : ""} />
刷新
{t("agentRunLog.refresh")}
</Button>
}
>
@@ -184,7 +214,7 @@ export default function DashboardAgentRunLogsPage() {
value={keywordInput}
onChange={(event) => setKeywordInput(event.target.value)}
onKeyDown={handleFilterKeyDown}
placeholder="按用户问题筛选"
placeholder={t("agentRunLog.filterUserMessage")}
className="pl-9"
/>
</div>
@@ -192,9 +222,9 @@ export default function DashboardAgentRunLogsPage() {
<OptionCombobox
value={plannedActionInput}
options={actionOptions}
placeholder="规划动作"
searchPlaceholder="搜索动作"
emptyText="未找到动作"
placeholder={t("agentRunLog.plannedAction")}
searchPlaceholder={t("agentRunLog.searchAction")}
emptyText={t("agentRunLog.emptyAction")}
onChange={(value) => setPlannedActionInput(value || "all")}
/>
</div>
@@ -202,9 +232,9 @@ export default function DashboardAgentRunLogsPage() {
<OptionCombobox
value={finalActionInput}
options={actionOptions}
placeholder="最终动作"
searchPlaceholder="搜索动作"
emptyText="未找到动作"
placeholder={t("agentRunLog.finalAction")}
searchPlaceholder={t("agentRunLog.searchAction")}
emptyText={t("agentRunLog.emptyAction")}
onChange={(value) => setFinalActionInput(value || "all")}
/>
</div>
@@ -212,9 +242,9 @@ export default function DashboardAgentRunLogsPage() {
<OptionCombobox
value={finalStatusInput}
options={finalStatusOptions}
placeholder="最终状态"
searchPlaceholder="搜索状态"
emptyText="未找到状态"
placeholder={t("agentRunLog.finalStatus")}
searchPlaceholder={t("agentRunLog.searchStatus")}
emptyText={t("agentRunLog.emptyStatus")}
onChange={(value) => setFinalStatusInput(value || "all")}
/>
</div>
@@ -222,9 +252,9 @@ export default function DashboardAgentRunLogsPage() {
<OptionCombobox
value={hitlStatusInput}
options={hitlStatusOptions}
placeholder="HITL 状态"
searchPlaceholder="搜索 HITL 状态"
emptyText="未找到状态"
placeholder={t("agentRunLog.hitlStatus")}
searchPlaceholder={t("agentRunLog.searchHitl")}
emptyText={t("agentRunLog.emptyStatus")}
onChange={(value) => setHitlStatusInput(value || "all")}
/>
</div>
@@ -232,15 +262,15 @@ export default function DashboardAgentRunLogsPage() {
<OptionCombobox
value={aiAgentIdInput}
options={aiAgentOptions}
placeholder="选择 Agent"
searchPlaceholder="搜索 Agent"
emptyText="未找到 Agent"
placeholder={t("agentRunLog.selectAgent")}
searchPlaceholder={t("agentRunLog.searchAgent")}
emptyText={t("agentRunLog.emptyAgent")}
onChange={(value) => setAiAgentIdInput(value || "all")}
/>
</div>
<Button variant="outline" onClick={applyFilters} disabled={loading} className="w-full xl:w-auto">
<SearchIcon />
查询
{t("agentRunLog.query")}
</Button>
</DashboardToolbar>
@@ -261,18 +291,18 @@ export default function DashboardAgentRunLogsPage() {
>
{!loading && result.results.length === 0 ? (
<div className="py-14 text-center text-sm text-muted-foreground">
暂无 Agent 运行日志
{t("agentRunLog.emptyRows")}
</div>
) : (
<div>
<div className="hidden grid-cols-[160px_minmax(0,1.8fr)_110px_minmax(0,1.2fr)_130px_90px_76px] gap-3 border-b bg-muted/40 px-4 py-3 text-sm text-muted-foreground lg:grid">
<div>时间</div>
<div>用户问题</div>
<div>规划动作</div>
<div>Skill / Tool</div>
<div>最终状态</div>
<div className="text-right">耗时</div>
<div className="text-right">操作</div>
<div>{t("agentRunLog.time")}</div>
<div>{t("agentRunLog.userMessage")}</div>
<div>{t("agentRunLog.plannedAction")}</div>
<div>{t("agentRunLog.skillTool")}</div>
<div>{t("agentRunLog.finalStatus")}</div>
<div className="text-right">{t("agentRunLog.duration")}</div>
<div className="text-right">{t("agentRunLog.actions")}</div>
</div>
<div className="divide-y">
@@ -286,7 +316,7 @@ export default function DashboardAgentRunLogsPage() {
</div>
<div className="min-w-0">
<UserMessagePreview value={item.userMessage} />
<UserMessagePreview value={item.userMessage} t={t} />
{item.errorMessage ? (
<div className="truncate text-xs text-destructive">{item.errorMessage}</div>
) : null}
@@ -310,13 +340,13 @@ export default function DashboardAgentRunLogsPage() {
</div>
) : item.handoffReason ? (
<div className="truncate text-xs text-muted-foreground">
转人工原因：{item.handoffReason}
{t("agentRunLog.handoffReason", { reason: item.handoffReason })}
</div>
) : item.recommendedAction ? (
<div className="truncate text-xs text-muted-foreground">
分流建议：{item.recommendedAction}
{t("agentRunLog.routingRecommendation", { action: item.recommendedAction })}
{item.riskLevel ? ` / ${item.riskLevel} risk` : ""}
{item.ticketDraftReady ? " / 草稿已就绪" : ""}
{item.ticketDraftReady ? ` / ${t("agentRunLog.draftReady")}` : ""}
</div>
) : null}
</div>
@@ -331,8 +361,8 @@ export default function DashboardAgentRunLogsPage() {
{item.finalAction || "-"}
</Badge>
<div className="truncate text-xs text-muted-foreground">
{item.hitlStatusName
? `${item.hitlStatusName} / ${item.finalStatus || "-"}`
{getHitlStatusLabel(item.hitlStatus, t)
? `${getHitlStatusLabel(item.hitlStatus, t)} / ${item.finalStatus || "-"}`
: item.finalStatus || "-"}
</div>
</div>
@@ -351,7 +381,7 @@ export default function DashboardAgentRunLogsPage() {
setDetailOpen(true)
}}
>
详情
{t("agentRunLog.detail")}
</Button>
</div>
</article>
@@ -375,8 +405,8 @@ export default function DashboardAgentRunLogsPage() {
)
}
function UserMessagePreview({ value }: { value?: string }) {
const preview = useMemo(() => summarizeUserMessage(value), [value])
function UserMessagePreview({ value, t }: { value?: string; t: TFunction }) {
const preview = useMemo(() => summarizeUserMessage(value, t), [value, t])
return (
<div className="truncate text-sm text-foreground">
@@ -385,7 +415,7 @@ function UserMessagePreview({ value }: { value?: string }) {
)
}
function summarizeUserMessage(value?: string) {
function summarizeUserMessage(value: string | undefined, t: TFunction) {
const normalized = value?.trim()
if (!normalized) {
return "-"
@@ -396,9 +426,9 @@ function summarizeUserMessage(value?: string) {
}
if (containsHTML(normalized)) {
if (/<img[\s>]/i.test(normalized)) {
return "[图片]"
return t("agentRunLog.imageMessage")
}
return "[富文本消息]"
return t("agentRunLog.richMessage")
}
return normalized
}