solahqb/AgentEvalTool
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 1 Wiki Activity

feat(ui): restructure config snapshot detail view to match overview layout

Browse Source
This commit is contained in:
sinohqb 2026-08-20 20:02:17 +08:00
parent 68bf1876af
commit 09a808c0c5
1 changed files with 78 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

97
frontend/web/src/components/intelligent_eval/ConfigSnapshots.tsx
View File

@ -141,41 +141,92 @@ export default function ConfigSnapshots({ evalId, onBack }: ConfigSnapshotsProps
</Tag> </Tag>
</div> </div>
<Card size="small" title="配置信息" style={{ marginBottom: 16 }}> <Card size="small" title="基本信息" style={{ marginBottom: 16 }}>
<Descriptions column={1} size="small"> <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px 32px', padding: '4px 0' }}>
<Descriptions.Item label="评估目标">{selectedSnapshot.goal || '—'}</Descriptions.Item> <div style={{ display: 'flex', gap: 8, fontSize: 13, alignItems: 'center' }}>
<Descriptions.Item label="考察意图">{selectedSnapshot.intent || '—'}</Descriptions.Item> <span style={{ color: colors.textSecondary, fontSize: 12, width: 60, textAlign: 'right', flexShrink: 0 }}>创建时间</span>
<Descriptions.Item label="角色描述"> <span>{formatDateTime(selectedSnapshot.created_at)}</span>
<span style={{ whiteSpace: 'pre-wrap' }}>{selectedSnapshot.role_description || '—'}</span> </div>
</Descriptions.Item> <div style={{ display: 'flex', gap: 8, fontSize: 13, alignItems: 'center' }}>
<Descriptions.Item label="时间窗口">{selectedSnapshot.time_window_hours} 小时</Descriptions.Item> <span style={{ color: colors.textSecondary, fontSize: 12, width: 60, textAlign: 'right', flexShrink: 0 }}>创建者</span>
<Descriptions.Item label="种子集"> <span>{selectedSnapshot.created_by || '—'}</span>
{Object.keys(selectedSnapshot.seeds ?? {}).length === 0 </div>
? '—' <div style={{ display: 'flex', gap: 8, fontSize: 13, alignItems: 'center' }}>
: ( <span style={{ color: colors.textSecondary, fontSize: 12, width: 60, textAlign: 'right', flexShrink: 0 }}>时间窗口</span>
<span>{selectedSnapshot.time_window_hours} 小时</span>
</div>
</div>
</Card>
<Card size="small" title="用户输入" style={{ marginBottom: 16 }}>
<div style={{ display: 'grid', gridTemplateColumns: '2fr 3fr', gap: 16 }}>
<div style={{ display: 'flex', flexDirection: 'column', gap: 12 }}>
<div>
<div style={{ fontSize: 12, color: colors.textSecondary, marginBottom: 4 }}>评估目标</div>
<div style={{
fontSize: 13, lineHeight: 1.6, padding: '8px 12px', background: colors.bgSubtle,
borderRadius: 6, whiteSpace: 'pre-wrap',
}}>
{selectedSnapshot.goal || '—'}
</div>
</div>
<div>
<div style={{ fontSize: 12, color: colors.textSecondary, marginBottom: 4 }}>考察意图</div>
<div style={{
fontSize: 13, lineHeight: 1.6, padding: '8px 12px', background: colors.bgSubtle,
borderRadius: 6, whiteSpace: 'pre-wrap',
}}>
{selectedSnapshot.intent || '—'}
</div>
</div>
<div>
<div style={{ fontSize: 12, color: colors.textSecondary, marginBottom: 4 }}>角色描述</div>
<div style={{
fontSize: 13, lineHeight: 1.6, padding: '8px 12px', background: colors.bgSubtle,
borderRadius: 6, whiteSpace: 'pre-wrap',
}}>
{selectedSnapshot.role_description || '—'}
</div>
</div>
</div>
<div>
<div style={{ fontSize: 12, color: colors.textSecondary, marginBottom: 4 }}>种子集</div>
{Object.keys(selectedSnapshot.seeds ?? {}).length === 0 ? (
<div style={{
fontSize: 13, padding: '8px 12px', background: colors.bgSubtle, borderRadius: 6,
}}>—</div>
) : (
<pre style={{ <pre style={{
margin: 0, fontSize: 12, background: colors.bgSubtle, margin: 0, fontSize: 12, lineHeight: 1.6, background: colors.bgSubtle,
padding: 8, borderRadius: 6, overflowX: 'auto', padding: '12px 16px', borderRadius: 6, overflowX: 'auto',
}} height: 340, overflowY: 'auto',
> }}>
{JSON.stringify(selectedSnapshot.seeds, null, 2)} {JSON.stringify(selectedSnapshot.seeds, null, 2)}
</pre> </pre>
)} )}
</Descriptions.Item> </div>
</Descriptions> </div>
</Card> </Card>
{selectedSnapshot.plan && ( {selectedSnapshot.plan && (
<Card size="small" title="粗计划"> <Card size="small" title="粗计划" style={{ marginBottom: 16 }}>
<pre style={{ <pre style={{
margin: 0, fontSize: 12, background: colors.bgSubtle, margin: 0, fontSize: 12, lineHeight: 1.6, background: colors.bgSubtle,
padding: 8, borderRadius: 6, overflowX: 'auto', padding: '12px 16px', borderRadius: 6, overflowX: 'auto',
}} }}>
>
{JSON.stringify(selectedSnapshot.plan, null, 2)} {JSON.stringify(selectedSnapshot.plan, null, 2)}
</pre> </pre>
</Card> </Card>
)} )}
<div style={{
display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 12,
fontSize: 12, color: colors.textMuted, padding: '4px 0 8px',
}}>
<span style={{ height: 1, width: 80, background: colors.border }} />
已显示全部内容
<span style={{ height: 1, width: 80, background: colors.border }} />
</div>
</div> </div>
) )
} }