diff --git a/src/components/trace/TokenUsage.tsx b/src/components/trace/TokenUsage.tsx index 5919e91..840a4b9 100644 --- a/src/components/trace/TokenUsage.tsx +++ b/src/components/trace/TokenUsage.tsx @@ -5,7 +5,7 @@ * 固定在详情面板中部,高度由内容自然决定。 */ -import { Box, Typography, Stack } from '@mui/material'; +import { Box, Typography, Stack, Table, TableBody, TableRow, TableCell } from '@mui/material'; import { Zap } from 'lucide-react'; import { useAgentStore } from '@renderer/stores/agent-store'; import { formatTokens } from '@renderer/lib/formatters'; @@ -46,12 +46,31 @@ export function TokenUsage(): React.JSX.Element { {/* 底部汇总 */} - - 0 ? formatTokens(tokenUsage.totalTokens) : '-'} highlight /> - 0 ? `${usagePercent.toFixed(1)}%` : '-'} - color={usagePercent > 80 ? 'error.main' : usagePercent > 60 ? 'warning.main' : undefined} /> - - + + + + 总计 + + {tokenUsage.totalTokens > 0 ? formatTokens(tokenUsage.totalTokens) : '-'} + + + + 上下文 + 80 ? 'error.main' : usagePercent > 60 ? 'warning.main' : 'text.secondary', + }}> + {tokenUsage.totalTokens > 0 ? `${usagePercent.toFixed(1)}%` : '-'} + + + + 迭代 + + {currentIteration} / {maxIterations} + + + +
); } @@ -65,12 +84,3 @@ function StatCard({ label, value, color }: { label: string; value: string; color ); } - -function SummaryRow({ label, value, highlight, color }: { label: string; value: string; highlight?: boolean; color?: string }) { - return ( - - {label} - {value} - - ); -}