From 60981b634dae9ff16e4b6127a655b759dabb2044 Mon Sep 17 00:00:00 2001 From: sinohqb Date: Thu, 20 Aug 2026 17:44:05 +0800 Subject: [PATCH] feat(ui): optimize intelligent eval drawer UI - Show estimated session progress in list (completed/estimated with running count) - Improve user input layout with scrollable sections for long text - Remove 50-item limit on activity feed, show all events - Enhance lifecycle steps and time distribution chart styling - Add pagination to decision log table (20/50/100 per page) - Unify font sizes across drawer tabs (12/13/14px scale) --- .../intelligent_eval/DecisionProcess.tsx | 13 ++-- .../intelligent_eval/EvalOverview.tsx | 63 +++++++++++++------ .../ExecutionProcess.test.tsx | 6 +- .../intelligent_eval/ExecutionProcess.tsx | 17 ++--- frontend/web/src/pages/IntelligentEvals.tsx | 11 +++- 5 files changed, 73 insertions(+), 37 deletions(-) diff --git a/frontend/web/src/components/intelligent_eval/DecisionProcess.tsx b/frontend/web/src/components/intelligent_eval/DecisionProcess.tsx index f9cb4f2..9baa31b 100644 --- a/frontend/web/src/components/intelligent_eval/DecisionProcess.tsx +++ b/frontend/web/src/components/intelligent_eval/DecisionProcess.tsx @@ -100,7 +100,7 @@ export default function DecisionProcess({ evalId, onBack }: DecisionProcessProps dataIndex: 'cron_id', key: 'cron_id', width: 120, - render: (val: string) => {val.slice(0, 8)}, + render: (val: string) => {val.slice(0, 8)}, }, { title: '操作', @@ -157,8 +157,8 @@ export default function DecisionProcess({ evalId, onBack }: DecisionProcessProps {formatDateTime(log.created_at)} -
{log.reason}
-
+
{log.reason}
+
Cron: {log.cron_id.slice(0, 8)}
@@ -174,7 +174,12 @@ export default function DecisionProcess({ evalId, onBack }: DecisionProcessProps loading={loading} dataSource={filteredLogs} columns={columns} - pagination={false} + pagination={{ + pageSize: 20, + showSizeChanger: true, + pageSizeOptions: [20, 50, 100], + showTotal: (total) => `共 ${total} 条`, + }} expandable={{ expandedRowKeys: expandedLog ? [expandedLog] : [], expandIcon: () => null, diff --git a/frontend/web/src/components/intelligent_eval/EvalOverview.tsx b/frontend/web/src/components/intelligent_eval/EvalOverview.tsx index 1c46be7..aa636ab 100644 --- a/frontend/web/src/components/intelligent_eval/EvalOverview.tsx +++ b/frontend/web/src/components/intelligent_eval/EvalOverview.tsx @@ -89,26 +89,49 @@ export default function EvalOverview({ ev, targetName }: EvalOverviewProps) { - - {ev.goal || '—'} - {ev.intent || '—'} - - {ev.role_description || '—'} - - - {Object.keys(ev.seeds ?? {}).length === 0 - ? '—' - : ( - 
-                    {JSON.stringify(ev.seeds, null, 2)}
-
- )} - - +
+
+
评估目标
+
+ {ev.goal || '—'} +
+
+
+
考察意图
+
+ {ev.intent || '—'} +
+
+
+
角色描述
+
+ {ev.role_description || '—'} +
+
+
+
种子集
+ {Object.keys(ev.seeds ?? {}).length === 0 ? ( +
—
+ ) : ( + 
+                  {JSON.stringify(ev.seeds, null, 2)}
+
+ )} +
+
diff --git a/frontend/web/src/components/intelligent_eval/ExecutionProcess.test.tsx b/frontend/web/src/components/intelligent_eval/ExecutionProcess.test.tsx index 7d9818c..9fb866a 100644 --- a/frontend/web/src/components/intelligent_eval/ExecutionProcess.test.tsx +++ b/frontend/web/src/components/intelligent_eval/ExecutionProcess.test.tsx @@ -110,13 +110,13 @@ describe('ExecutionProcess', () => { await waitFor(() => expect(screen.getByText('评估已取消')).toBeInTheDocument()) }) - it('caps the activity feed at 50 entries and hints at the decision tab', async () => { + it('shows all activity entries with total count', async () => { mockApi({}, 60) render() - await waitFor(() => expect(screen.getByText(/仅展示最近 50 条/)).toBeInTheDocument()) + await waitFor(() => expect(screen.getByText(/共 \d+ 条活动/)).toBeInTheDocument()) expect(screen.getByText(/决策·执行会话：时段欠账 59/)).toBeInTheDocument() - expect(screen.queryByText(/决策·执行会话：时段欠账 0/)).not.toBeInTheDocument() + expect(screen.getByText(/决策·执行会话：时段欠账 0/)).toBeInTheDocument() }) it('scopes task loading to the current evaluation', async () => { diff --git a/frontend/web/src/components/intelligent_eval/ExecutionProcess.tsx b/frontend/web/src/components/intelligent_eval/ExecutionProcess.tsx index 4902275..32d9190 100644 --- a/frontend/web/src/components/intelligent_eval/ExecutionProcess.tsx +++ b/frontend/web/src/components/intelligent_eval/ExecutionProcess.tsx @@ -13,7 +13,6 @@ import { colors, statusColors } from '../../tokens' import { formatDateTime } from '../../utils/date' import { usePolling } from '../../hooks/usePolling' -const ACTIVITY_LIMIT = 50 const ACTIVE_STATUSES = new Set(['planning', 'pending_approval', 'executing']) const STAGE_STEPS = [ @@ -123,7 +122,7 @@ export default function ExecutionProcess({ ev }: { ev: IntelligentEval }) { const activities = useMemo(() => { const all = [...sessionEvents(ev), ...taskEvents(tasks), ...decisionEvents(logs)] all.sort((a, b) => (a.time < b.time ? 1 : -1)) - return all.slice(0, ACTIVITY_LIMIT) + return all }, [ev, tasks, logs]) if (loading && progress == null) { @@ -151,7 +150,10 @@ export default function ExecutionProcess({ ev }: { ev: IntelligentEval }) { seriesField: 'kind', group: true, height: Math.max(200, progress.slots.length * 72), - color: [colors.textMuted, statusColors.running, statusColors.completed], + color: [colors.textMuted, colors.primary, statusColors.completed], + legend: { position: 'top' }, + xAxis: { label: { autoRotate: true } }, + yAxis: { min: 0 }, } return ( @@ -160,9 +162,10 @@ export default function ExecutionProcess({ ev }: { ev: IntelligentEval }) { ({ title: s.title, - status: undefined, + description: s.key === progress.current_stage ? '当前阶段' : undefined, }))} /> {progress.blocker != null && ( @@ -201,14 +204,14 @@ export default function ExecutionProcess({ ev }: { ev: IntelligentEval }) { color: a.color, children: (
-
{a.text}
-
{formatDateTime(a.time)}
+
{a.text}
+
{formatDateTime(a.time)}
), }))} />
- {`仅展示最近 ${ACTIVITY_LIMIT} 条，完整决策历史见「决策过程」`} + {`共 ${activities.length} 条活动，完整决策历史见「决策过程」`}
)} diff --git a/frontend/web/src/pages/IntelligentEvals.tsx b/frontend/web/src/pages/IntelligentEvals.tsx index 063f97d..ba74912 100644 --- a/frontend/web/src/pages/IntelligentEvals.tsx +++ b/frontend/web/src/pages/IntelligentEvals.tsx @@ -160,13 +160,18 @@ export default function IntelligentEvalsPage() { }, }, { - title: '会话进度', key: 'progress', width: 170, + title: '会话进度', key: 'progress', width: 200, render: (_, ev) => { - const pct = ev.session_count ? Math.round((ev.completed_sessions / ev.session_count) * 100) : 0 + const estimated = ev.plan?.estimated_sessions ?? ev.session_count + const running = (ev.sessions ?? []).filter((s) => s.status === 'running').length + const pct = estimated ? Math.round((ev.completed_sessions / estimated) * 100) : 0 return ( - {ev.completed_sessions}/{ev.session_count} + + {ev.completed_sessions}/{estimated} + {running > 0 && ({running} 进行中)} + ) },