fix(frontend): 同步 main 并修复 phase2 关闭审阅意见

frontend/src/features/agent/AgentView.vue

@@ -9,6 +9,7 @@ import type { AgentEvent } from '@/contracts'
 import { localizeDetails, permissionLabel, runStatusLabel, toolLabel } from './labels'
 import ToolOption from './ToolOption.vue'
 import { useCitationNavigation } from '@/composables/useCitationNavigation'
+import { localeTag, t } from '@/i18n'
 
 const route = useRoute()
 const router = useRouter()
@@ -30,19 +31,19 @@ onMounted(async () => {
   try {
     await Promise.all([providerStore.loadProviders(), skillStore.loadSkills(), agentStore.loadTools()])
     form.provider_id = providerStore.defaultProviderId
-  } catch (error) { pageError.value = error instanceof Error ? error.message : '智能体配置加载失败' }
+  } catch (error) { pageError.value = error instanceof Error ? error.message : t('智能体配置加载失败', 'Failed to load agent configuration') }
 })
 
 watch(() => route.params.runId, async (runId) => {
   if (typeof runId !== 'string') return
-  try { await agentStore.loadRun(runId) } catch (error) { pageError.value = error instanceof Error ? error.message : '运行记录加载失败' }
+  try { await agentStore.loadRun(runId) } catch (error) { pageError.value = error instanceof Error ? error.message : t('运行记录加载失败', 'Failed to load run') }
 }, { immediate: true })
 
 watch(() => form.provider_id, async (providerId) => {
   form.model = providerStore.providers.find(p => p.provider_id === providerId)?.default_model ?? ''
   if (!providerId) return
   try { await providerStore.loadModels(providerId) }
-  catch (error) { if (form.provider_id === providerId) pageError.value = error instanceof Error ? error.message : '模型列表加载失败，请手动填写模型 ID。' }
+  catch (error) { if (form.provider_id === providerId) pageError.value = error instanceof Error ? error.message : t('模型列表加载失败，请手动填写模型 ID。', 'Unable to load models. Enter a model ID manually.') }
 })
 
 function toggleTool(name: string) {
@@ -54,7 +55,7 @@ function toggleTool(name: string) {
 async function createRun() {
   pageError.value = ''
   try {
-    if (!form.provider_id || !form.model.trim()) throw new Error('请选择提供商并填写模型 ID。')
+    if (!form.provider_id || !form.model.trim()) throw new Error(t('请选择提供商并填写模型 ID。', 'Select a provider and enter a model ID.'))
     const run = await agentStore.createRun({
       input: form.input, provider_id: form.provider_id, model: form.model,
       skill_id: form.skill_id || undefined, allowed_tools: form.allowed_tools,
@@ -63,12 +64,12 @@ async function createRun() {
       allow_network: form.allow_network, max_concurrent_tools: form.max_concurrent_tools,
     })
     await router.replace({ name: 'agent', params: { runId: run.run_id } })
-  } catch (error) { pageError.value = error instanceof Error ? error.message : '运行创建失败' }
+  } catch (error) { pageError.value = error instanceof Error ? error.message : t('运行创建失败', 'Failed to create run') }
 }
 
 function eventText(event: AgentEvent) {
-  if (event.event === 'RunCompleted') return '任务已成功完成。'
-  if (event.event === 'RunCancelled') return '任务已取消。'
+  if (event.event === 'RunCompleted') return t('任务已成功完成。', 'The task completed successfully.')
+  if (event.event === 'RunCancelled') return t('任务已取消。', 'The task was cancelled.')
   const text = event.data.text ?? event.data.message ?? event.data.code
   if (text) return String(text)
   return ''
@@ -80,31 +81,31 @@ async function handleOpenCitation(data: Record<string, unknown>) {
   try {
     await openCitation(data)
   } catch (error) {
-    pageError.value = error instanceof Error ? error.message : '引用定位失败'
+    pageError.value = error instanceof Error ? error.message : t('引用定位失败', 'Failed to open citation')
   }
 }
 </script>
 
 <template>
   <section class="feature-page agent-page">
-    <header class="feature-header"><div><h1>{{ isNewRun ? '创建智能体运行' : '智能体执行轨迹' }}</h1><p>配置执行边界，并实时查看模型、工具和权限事件。</p></div>
-      <button v-if="!isNewRun" class="button-secondary" @click="router.push({ name: 'agent' })">新建运行</button></header>
+    <header class="feature-header"><div><h1>{{ isNewRun ? t('创建智能体运行', 'Create Agent Run') : t('智能体执行轨迹', 'Agent Trace') }}</h1><p>{{ t('配置执行边界，并实时查看模型、工具和权限事件。', 'Configure execution limits and inspect model, tool, and permission events in real time.') }}</p></div>
+      <button v-if="!isNewRun" class="button-secondary" @click="router.push({ name: 'agent' })">{{ t('新建运行', 'New run') }}</button></header>
     <div v-if="pageError || agentStore.error || providerStore.error" class="error-banner">{{ pageError || agentStore.error || providerStore.error }}</div>
     <form v-if="isNewRun" class="panel run-form" @submit.prevent="createRun">
-      <div class="field"><label>任务</label><textarea v-model="form.input" class="textarea" required placeholder="描述希望智能体完成的任务" /></div>
+      <div class="field"><label>{{ t('任务', 'Task') }}</label><textarea v-model="form.input" class="textarea" required :placeholder="t('描述希望智能体完成的任务', 'Describe the task for the agent')" /></div>
       <div class="form-grid">
-        <div class="field"><label>模型提供商</label><select v-model="form.provider_id" class="select"><option v-for="p in providerStore.enabledProviders" :key="p.provider_id" :value="p.provider_id">{{ p.name }}</option></select></div>
-        <div class="field"><label>模型</label><input v-model="form.model" class="input" list="agent-models" placeholder="填写模型 ID" required /><datalist id="agent-models"><option v-for="m in models" :key="m.model_id" :value="m.model_id">{{ m.name }}</option></datalist></div>
-        <div class="field"><label>技能</label><select v-model="form.skill_id" class="select"><option value="">不使用技能</option><option v-for="s in skillStore.readySkills" :key="s.skill_id" :value="s.skill_id">{{ s.name }}</option></select></div>
-        <div class="field"><label>最大步骤</label><input v-model.number="form.max_steps" class="input" type="number" min="1" max="100" /></div>
-        <div class="field"><label>工具超时（秒）</label><input v-model.number="form.tool_timeout_seconds" class="input" type="number" min="1" /></div>
-        <div class="field"><label>运行超时（秒）</label><input v-model.number="form.run_timeout_seconds" class="input" type="number" min="1" /></div>
-        <div class="field"><label>令牌预算</label><input v-model.number="form.token_budget" class="input" type="number" min="1" /></div>
-        <div class="field"><label>最大并发工具</label><input v-model.number="form.max_concurrent_tools" class="input" type="number" min="1" /></div>
+        <div class="field"><label>{{ t('模型提供商', 'Model provider') }}</label><select v-model="form.provider_id" class="select"><option v-for="p in providerStore.enabledProviders" :key="p.provider_id" :value="p.provider_id">{{ p.name }}</option></select></div>
+        <div class="field"><label>{{ t('模型', 'Model') }}</label><input v-model="form.model" class="input" list="agent-models" :placeholder="t('填写模型 ID', 'Enter model ID')" required /><datalist id="agent-models"><option v-for="m in models" :key="m.model_id" :value="m.model_id">{{ m.name }}</option></datalist></div>
+        <div class="field"><label>{{ t('技能', 'Skill') }}</label><select v-model="form.skill_id" class="select"><option value="">{{ t('不使用技能', 'No skill') }}</option><option v-for="s in skillStore.readySkills" :key="s.skill_id" :value="s.skill_id">{{ s.name }}</option></select></div>
+        <div class="field"><label>{{ t('最大步骤', 'Maximum steps') }}</label><input v-model.number="form.max_steps" class="input" type="number" min="1" max="100" /></div>
+        <div class="field"><label>{{ t('工具超时（秒）', 'Tool timeout (seconds)') }}</label><input v-model.number="form.tool_timeout_seconds" class="input" type="number" min="1" /></div>
+        <div class="field"><label>{{ t('运行超时（秒）', 'Run timeout (seconds)') }}</label><input v-model.number="form.run_timeout_seconds" class="input" type="number" min="1" /></div>
+        <div class="field"><label>{{ t('令牌预算', 'Token budget') }}</label><input v-model.number="form.token_budget" class="input" type="number" min="1" /></div>
+        <div class="field"><label>{{ t('最大并发工具', 'Maximum concurrent tools') }}</label><input v-model.number="form.max_concurrent_tools" class="input" type="number" min="1" /></div>
       </div>
-      <div class="field"><label>允许使用的工具</label><div class="tool-grid"><ToolOption v-for="tool in agentStore.tools" :key="tool.name" :name="tool.name" :description="tool.description" :selected="form.allowed_tools.includes(tool.name)" @toggle="toggleTool" /></div></div>
-      <label class="network"><input v-model="form.allow_network" type="checkbox" /> 允许本次运行调用网络工具</label>
-      <div class="inline-actions"><button class="button-primary" :disabled="agentStore.isCreating || !form.input.trim() || !form.provider_id || !form.model.trim()">{{ agentStore.isCreating ? '创建中…' : '创建并运行' }}</button></div>
+      <div class="field"><label>{{ t('允许使用的工具', 'Allowed tools') }}</label><div class="tool-grid"><ToolOption v-for="tool in agentStore.tools" :key="tool.name" :name="tool.name" :description="tool.description" :selected="form.allowed_tools.includes(tool.name)" @toggle="toggleTool" /></div></div>
+      <label class="network"><input v-model="form.allow_network" type="checkbox" /> {{ t('允许本次运行调用网络工具', 'Allow network tools for this run') }}</label>
+      <div class="inline-actions"><button class="button-primary" :disabled="agentStore.isCreating || !form.input.trim() || !form.provider_id || !form.model.trim()">{{ agentStore.isCreating ? t('创建中…', 'Creating…') : t('创建并运行', 'Create and run') }}</button></div>
     </form>
 
     <div v-else class="trace-layout">
@@ -118,15 +119,15 @@ async function handleOpenCitation(data: Record<string, unknown>) {
           }">{{ runStatusLabel(agentStore.activeRun?.status) }}</span>
           <h2>{{ agentStore.activeRun?.run_id ?? agentStore.activeRunId }}</h2>
           <p v-if="agentStore.activeRun" class="run-meta">
-            <span>步骤 {{ agentStore.currentStep }} / {{ agentStore.activeRun.max_steps }}</span>
+            <span>{{ t('步骤', 'Step') }} {{ agentStore.currentStep }} / {{ agentStore.activeRun.max_steps }}</span>
             <span>·</span>
             <span>Token: {{ agentStore.activeRun.token_usage?.total_tokens ?? 0 }}</span>
             <span v-if="agentStore.activeRun.started_at">·</span>
-            <span v-if="agentStore.activeRun.started_at">开始: {{ new Date(agentStore.activeRun.started_at).toLocaleString() }}</span>
+            <span v-if="agentStore.activeRun.started_at">{{ t('开始', 'Started') }}: {{ new Date(agentStore.activeRun.started_at).toLocaleString(localeTag()) }}</span>
           </p>
         </div>
         <div class="inline-actions">
-          <button v-if="agentStore.isRunning" class="button-danger" @click="agentStore.cancelRun(agentStore.activeRunId!)">取消运行</button>
+          <button v-if="agentStore.isRunning" class="button-danger" @click="agentStore.cancelRun(agentStore.activeRunId!)">{{ t('取消运行', 'Cancel run') }}</button>
           <button class="button-secondary" @click="agentStore.loadRun(agentStore.activeRunId!)">重新加载</button>
         </div>
       </div>
@@ -138,7 +139,7 @@ async function handleOpenCitation(data: Record<string, unknown>) {
     </div>
 
     <div v-if="agentStore.permissionRequest" class="modal-backdrop">
-      <div class="modal"><span class="badge warning">权限确认</span><h2>{{ toolLabel(agentStore.permissionRequest.tool_name) }}</h2><p>{{ agentStore.permissionRequest.impact }}</p><p class="subtle">所需权限：{{ permissionLabel(agentStore.permissionRequest.permission) }}（{{ agentStore.permissionRequest.permission }}）</p><pre>{{ JSON.stringify(localizeDetails(agentStore.permissionRequest.parameters), null, 2) }}</pre><div class="inline-actions permission-actions"><button class="button-primary" @click="agentStore.respondPermission('allow', 'once')">仅本次允许</button><button class="button-secondary" @click="agentStore.respondPermission('allow', 'session')">本次会话允许</button><button class="button-danger" @click="agentStore.respondPermission('deny')">拒绝</button></div></div>
+      <div class="modal"><span class="badge warning">{{ t('权限确认', 'Permission Confirmation') }}</span><h2>{{ toolLabel(agentStore.permissionRequest.tool_name) }}</h2><p>{{ agentStore.permissionRequest.impact }}</p><p class="subtle">{{ t('所需权限：', 'Required permission: ') }}{{ permissionLabel(agentStore.permissionRequest.permission) }} ({{ agentStore.permissionRequest.permission }})</p><pre>{{ JSON.stringify(localizeDetails(agentStore.permissionRequest.parameters), null, 2) }}</pre><div class="inline-actions permission-actions"><button class="button-primary" @click="agentStore.respondPermission('allow', 'once')">{{ t('仅本次允许', 'Allow once') }}</button><button class="button-secondary" @click="agentStore.respondPermission('allow', 'session')">{{ t('本次会话允许', 'Allow for session') }}</button><button class="button-danger" @click="agentStore.respondPermission('deny')">{{ t('拒绝', 'Deny') }}</button></div></div>
     </div>
   </section>
 </template>

frontend/src/features/agent/RunListPanel.vue

@@ -2,6 +2,7 @@
 import { onMounted, ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { useAgentStore } from '@/stores/agent'
+import { localeTag, t } from '@/i18n'
 import { runStatusLabel } from './labels'
 
 const agentStore = useAgentStore()
@@ -9,7 +10,7 @@ const router = useRouter()
 const error = ref('')
 
 onMounted(async () => {
-  try { await agentStore.loadRuns() } catch (reason) { error.value = reason instanceof Error ? reason.message : '运行记录加载失败' }
+  try { await agentStore.loadRuns() } catch (reason) { error.value = reason instanceof Error ? reason.message : t('运行记录加载失败', 'Failed to load runs') }
 })
 
 function selectRun(runId: string) { void router.push({ name: 'agent', params: { runId } }) }
@@ -17,13 +18,13 @@ function selectRun(runId: string) { void router.push({ name: 'agent', params: {
 
 <template>
   <div class="sidebar-panel">
-    <button class="button-primary new-button" @click="router.push({ name: 'agent' })">＋ 新建运行</button>
+    <button class="button-primary new-button" @click="router.push({ name: 'agent' })">＋ {{ t('新建运行', 'New run') }}</button>
     <p v-if="error" class="subtle error-text">{{ error }}</p>
     <div class="sidebar-list">
       <button v-for="run in agentStore.sortedRuns" :key="run.run_id" class="sidebar-list-item run-item"
         :class="{ active: agentStore.activeRunId === run.run_id }" @click="selectRun(run.run_id)">
         <span class="badge" :class="{ success: run.status === 'completed', error: run.status === 'failed', warning: run.status === 'waiting_permission' }">{{ runStatusLabel(run.status) }}</span>
-        <strong>{{ run.run_id.slice(0, 12) }}</strong><small>{{ run.started_at ? new Date(run.started_at).toLocaleString() : '等待开始' }}</small>
+        <strong>{{ run.run_id.slice(0, 12) }}</strong><small>{{ run.started_at ? new Date(run.started_at).toLocaleString(localeTag()) : t('等待开始', 'Waiting to start') }}</small>
       </button>
     </div>
   </div>

frontend/src/features/agent/ToolOption.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { computed } from 'vue'
 import { toolDescription, toolLabel } from './labels'
+import { t } from '@/i18n'
 
 const props = defineProps<{ name: string; description: string; selected: boolean }>()
 const emit = defineEmits<{ toggle: [name: string] }>()
@@ -19,7 +20,7 @@ const showOriginal = computed(() => props.description.length > 0)
       </span>
     </label>
     <details v-if="showOriginal" class="tool-original">
-      <summary>查看服务原文与参数</summary>
+      <summary>{{ t('查看服务原文与参数', 'View original service description and parameters') }}</summary>
       <p>{{ description }}</p>
     </details>
   </article>

frontend/src/features/agent/TraceTimeline.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
+import { localeTag, t } from '@/i18n'
 import { computed, ref } from 'vue'
 import type { TraceNode, AgentEvent } from '@/contracts'
 import { buildTraceNodes, getToolCallsFromEvents, getTotalDuration } from '@/services/traceService'
-import { eventLabel } from './labels'
+import { eventLabel, localizeDetails } from './labels'
 
 const props = defineProps<{
   events: AgentEvent[]
@@ -64,7 +65,7 @@ function isDetailOpen(nodeId: string): boolean {
 
 function formatTime(iso: string): string {
   const d = new Date(iso)
-  return d.toLocaleTimeString('zh-CN', { hour12: false }) + '.' + String(d.getMilliseconds()).padStart(3, '0')
+  return d.toLocaleTimeString(localeTag(), { hour12: false }) + '.' + String(d.getMilliseconds()).padStart(3, '0')
 }
 
 function formatDuration(ms: number): string {
@@ -111,7 +112,7 @@ function prettyData(data: Record<string, unknown>): string {
   if (typeof filtered.output === 'string' && filtered.output.length > 500) {
     filtered.output = filtered.output.slice(0, 500) + '...'
   }
-  return JSON.stringify(filtered, null, 2)
+  return JSON.stringify(localizeDetails(filtered), null, 2)
 }
 
 function flatNodes(nodes: TraceNode[], depth = 0): Array<{ node: TraceNode; depth: number }> {
@@ -213,7 +214,7 @@ const flatTrace = computed(() => flatNodes(traceNodes.value))
         </article>
 
         <div v-if="!events.length" class="empty-state">
-          <div><strong>等待执行轨迹</strong><p>事件连接建立后将在这里实时显示。</p></div>
+          <div><strong>{{ t('等待执行轨迹', 'Waiting for trace events') }}</strong><p>{{ t('事件连接建立后将在这里实时显示。', 'Events will appear here after the connection is established.') }}</p></div>
         </div>
       </div>
     </div>

frontend/src/features/agent/labels.ts

@@ -1,4 +1,5 @@
 import type { AgentEventType, AgentRunStatus } from '@/contracts'
+import { appLocale, t } from '@/i18n'
 
 const runStatusLabels: Record<AgentRunStatus, string> = {
   queued: '排队中',
@@ -27,6 +28,20 @@ const eventLabels: Record<AgentEventType, string> = {
   RunCancelled: '运行取消',
 }
 
+const runStatusLabelsEn: Record<AgentRunStatus, string> = {
+  queued: 'Queued', running: 'Running', waiting_permission: 'Waiting for permission',
+  completed: 'Completed', failed: 'Failed', cancelled: 'Cancelled',
+}
+
+const eventLabelsEn: Record<AgentEventType, string> = {
+  RunStarted: 'Run started', TextDelta: 'Response', ThinkingDelta: 'Reasoning',
+  ToolCall: 'Tool call', ToolResult: 'Tool result', PermissionRequired: 'Permission required',
+  Usage: 'Usage', Citation: 'Citation', ModelCallStarted: 'Model call started',
+  ModelCallCompleted: 'Model call completed', ModelCallFailed: 'Model call failed',
+  PermissionResolved: 'Permission resolved', RunCompleted: 'Run completed',
+  RunFailed: 'Run failed', RunCancelled: 'Run cancelled',
+}
+
 const toolLabels: Record<string, string> = {
   'system.echo': '回显测试',
   'math.add': '数值相加',
@@ -116,45 +131,50 @@ const detailLabels: Record<string, string> = {
 }
 
 export function runStatusLabel(status?: AgentRunStatus): string {
-  return status ? runStatusLabels[status] : '未知状态'
+  if (!status) return t('未知状态', 'Unknown status')
+  return appLocale.value === 'en' ? runStatusLabelsEn[status] : runStatusLabels[status]
 }
 
 export function eventLabel(event: AgentEventType): string {
-  return eventLabels[event]
+  return appLocale.value === 'en' ? eventLabelsEn[event] : eventLabels[event]
 }
 
 export function toolLabel(name: string): string {
   const remote = mcpName(name)
-  if (remote) return mcpTools[remote]?.label ?? `MCP 工具 · ${remote}`
+  if (remote) return appLocale.value === 'en' ? `MCP Tool · ${remote}` : (mcpTools[remote]?.label ?? `MCP 工具 · ${remote}`)
+  if (appLocale.value === 'en') return name.split('.').map(part => part[0]?.toUpperCase() + part.slice(1)).join(' ')
   return toolLabels[name] ?? name
 }
 
 export function toolDescription(name: string, fallback: string): string {
   const remote = mcpName(name)
   if (remote) {
+    if (appLocale.value === 'en') return fallback && !/\p{Script=Han}/u.test(fallback) ? fallback : `MCP tool ${remote}. See the original service description for full parameters.`
     if (/\p{Script=Han}/u.test(fallback)) return fallback
     return mcpTools[remote]?.description ?? '暂无中文说明，请展开查看服务原文。'
   }
+  if (appLocale.value === 'en') return fallback && !/\p{Script=Han}/u.test(fallback) ? fallback : `Built-in tool: ${name}`
   return toolDescriptions[name] ?? fallback
 }
 
 export function permissionLabel(permission: string): string {
+  if (appLocale.value === 'en') return permission.split('.').map(part => part[0]?.toUpperCase() + part.slice(1)).join(' ')
   return permissionLabels[permission] ?? permission
 }
 
 function localizeValue(value: unknown): unknown {
   if (Array.isArray(value)) return value.map(localizeValue)
   if (value && typeof value === 'object') return localizeDetails(value as Record<string, unknown>)
-  if (value === true) return '是'
-  if (value === false) return '否'
+  if (value === true) return t('是', 'Yes')
+  if (value === false) return t('否', 'No')
   if (typeof value === 'string' && value in runStatusLabels) {
-    return runStatusLabels[value as AgentRunStatus]
+    return runStatusLabel(value as AgentRunStatus)
   }
   return value
 }
 
 export function localizeDetails(data: Record<string, unknown>): Record<string, unknown> {
   return Object.fromEntries(
-    Object.entries(data).map(([key, value]) => [detailLabels[key] ?? key, localizeValue(value)])
+    Object.entries(data).map(([key, value]) => [appLocale.value === 'en' ? key.replaceAll('_', ' ') : (detailLabels[key] ?? key), localizeValue(value)])
   )
 }