修改模型价格展示样式

This commit is contained in:
guke
2026-07-14 10:53:34 +08:00
parent a392656d44
commit 9dedb48d9a
+11 -2
View File
@@ -38,6 +38,15 @@ const fmtCost = (c: number | null) => (c == null ? '-' : `¥${c.toFixed(4)}`);
const fmtTok = (inTok: number | null, outTok: number | null) =>
inTok == null && outTok == null ? '-' : `${inTok ?? 0}/${outTok ?? 0}`;
// LLM 价格快照只展示 prices 里各模型的单价(元/每百万 token),忽略 mode/_source 等元字段。
function llmPriceRows(snapshot: Record<string, unknown> | null): string[] {
const prices = snapshot?.prices;
if (!prices || typeof prices !== 'object') return [];
return Object.entries(prices as Record<string, { input_per_1m?: number; output_per_1m?: number }>).map(
([model, p]) => `${model} 输入 ${p?.input_per_1m ?? '-'}元/每百万tokens,输出${p?.output_per_1m ?? '-'}元/每百万tokens`,
);
}
// LLM message content 常是 json.dumps 的卡片列表;能 parse 成 JSON 就缩进展开,否则原样。
function pretty(s: string | null): string {
if (!s) return '';
@@ -357,8 +366,8 @@ export default function ComparisonRecordsPage() {
)}
</Descriptions.Item>
{detail.llm_price_snapshot ? (
<Descriptions.Item label="价格快照" span={2}>
<pre style={preStyle}>{JSON.stringify(detail.llm_price_snapshot, null, 2)}</pre>
<Descriptions.Item label="LLM价格快照" span={2}>
{llmPriceRows(detail.llm_price_snapshot).map((r) => <div key={r}>{r}</div>)}
</Descriptions.Item>
) : null}
<Descriptions.Item label="源平台">{detail.source_platform_name || '-'}{cents(detail.source_price_cents)}</Descriptions.Item>