预测结果展示增强:status 徽章 + 专家权重条形图

- types.ts: 添加 agent_weights / status 字段
- components.tsx: 添加 AgentWeightsBar 纯 CSS 权重分布条 + EmptyText 组件
- Predictions.tsx: 摘要行 degraded/failed 状态徽章、展开区 AgentWeightsBar、
  预测中防连点、中文错误映射
- EvalPage.tsx: 修复 EmptyText 导入

构建验证:tsc && vite build 通过
This commit is contained in:
Profeto Agent
2026-09-21 05:56:03 +00:00
parent 6a4994097a
commit f04e0df9e8
4 changed files with 406 additions and 1 deletions
+40
View File
@@ -396,3 +396,43 @@ export function Spinner({ className = '' }: { className?: string }) {
export function SkeletonBlock({ className = '' }: { className?: string }) {
return <div className={`skeleton ${className}`} />
}
/** 空状态文本 */
export function EmptyText({ text }: { text: string }) {
return (
<div className="py-10 text-center text-sm text-ink-400">
{text}
</div>
)
}
/** Agent 权重条形图 */
export function AgentWeightsBar({ weights, okCount }: { weights: Record<string, number>; okCount: number }) {
const entries = Object.entries(weights).filter(([, w]) => w > 0)
if (entries.length === 0) return null
const total = entries.reduce((s, [, w]) => s + w, 0) || 1
const colors = ['bg-ink-900', 'bg-ink-700', 'bg-ink-500', 'bg-press', 'bg-ink-300']
return (
<div className="mt-2 border-t border-ink-200 pt-2">
<div className="mb-1 text-2xs text-ink-400"></div>
<div className="space-y-1">
{entries.map(([k, w], i) => (
<div key={k} className="flex items-center gap-2 text-2xs">
<div className="h-3.5 flex-1 overflow-hidden rounded-sm bg-ink-200/60">
<div
className={`h-full ${colors[i % colors.length]} transition-all duration-500`}
style={{ width: `${Math.max(3, Math.round((w / total) * 100))}%` }}
/>
</div>
<span className="w-12 text-right tabular-nums text-ink-500">
{Math.round((w / total) * 100)}%
</span>
<span className="w-24 truncate text-ink-400" title={k}>{k}</span>
</div>
))}
</div>
<div className="mt-1 text-2xs text-ink-400">{okCount}/{entries.length}</div>
</div>
)
}