🐛 fix: group-ratio display & deduplicate price logic in model-pricing views

Summary
• Ensure “Group Ratio” shows correctly when “All” groups are selected.
• Eliminate redundant price calculations in both card and table views.

Details
1. PricingCardView.jsx
   • Removed obsolete renderPriceInfo function.
   • Calculate priceData once per model and reuse for header price string and footer ratio block.
   • Display priceData.usedGroupRatio as the group ratio fallback.

2. PricingTableColumns.js
   • Introduced WeakMap-based cache (getPriceData) to compute priceData only once per row.
   • Updated ratioColumn & priceColumn to reuse cached priceData.
   • Now displays priceData.usedGroupRatio, preventing empty cells for “All” group.

Benefits
• Correct visual output for group ratio across all views.
• Reduced duplicate calculations, improving render performance.
• Removed dead code, keeping components clean and maintainable.
This commit is contained in:
t0ng7u
2025-08-12 23:10:29 +08:00
parent 7997a04a68
commit 936b1f8d09
2 changed files with 36 additions and 28 deletions

View File

@@ -128,19 +128,6 @@ const PricingCardView = ({
return record.description || '';
};
// 渲染价格信息
const renderPriceInfo = (record) => {
const priceData = calculateModelPrice({
record,
selectedGroup,
groupRatio,
tokenUnit,
displayPrice,
currency,
});
return formatPriceInfo(priceData, t);
};
// 渲染标签
const renderTags = (record) => {
// 计费类型标签(左边)
@@ -221,6 +208,15 @@ const PricingCardView = ({
const modelKey = getModelKey(model);
const isSelected = selectedRowKeys.includes(modelKey);
const priceData = calculateModelPrice({
record: model,
selectedGroup,
groupRatio,
tokenUnit,
displayPrice,
currency,
});
return (
<Card
key={modelKey || index}
@@ -238,7 +234,7 @@ const PricingCardView = ({
{model.model_name}
</h3>
<div className="flex items-center gap-3 text-xs mt-1">
{renderPriceInfo(model)}
{formatPriceInfo(priceData, t)}
</div>
</div>
</div>
@@ -313,7 +309,7 @@ const PricingCardView = ({
{t('补全')}: {model.quota_type === 0 ? parseFloat(model.completion_ratio.toFixed(3)) : t('无')}
</div>
<div>
{t('分组')}: {priceData.usedGroupRatio}
{t('分组')}: {priceData?.usedGroupRatio ?? '-'}
</div>
</div>
</div>

View File

@@ -98,6 +98,25 @@ export const getPricingTableColumns = ({
displayPrice,
showRatio,
}) => {
const priceDataCache = new WeakMap();
const getPriceData = (record) => {
let cache = priceDataCache.get(record);
if (!cache) {
cache = calculateModelPrice({
record,
selectedGroup,
groupRatio,
tokenUnit,
displayPrice,
currency,
});
priceDataCache.set(record, cache);
}
return cache;
};
const endpointColumn = {
title: t('可用端点类型'),
dataIndex: 'supported_endpoint_types',
@@ -167,21 +186,21 @@ export const getPricingTableColumns = ({
dataIndex: 'model_ratio',
render: (text, record, index) => {
const completionRatio = parseFloat(record.completion_ratio.toFixed(3));
const content = (
const priceData = getPriceData(record);
return (
<div className="space-y-1">
<div className="text-gray-700">
{t('模型倍率')}{record.quota_type === 0 ? text : t('无')}
</div>
<div className="text-gray-700">
{t('补全倍率')}
{record.quota_type === 0 ? completionRatio : t('无')}
{t('补全倍率')}{record.quota_type === 0 ? completionRatio : t('无')}
</div>
<div className="text-gray-700">
{t('分组倍率')}{groupRatio[selectedGroup]}
{t('分组倍率')}{priceData?.usedGroupRatio ?? '-'}
</div>
</div>
);
return content;
},
};
@@ -190,14 +209,7 @@ export const getPricingTableColumns = ({
dataIndex: 'model_price',
fixed: 'right',
render: (text, record, index) => {
const priceData = calculateModelPrice({
record,
selectedGroup,
groupRatio,
tokenUnit,
displayPrice,
currency
});
const priceData = getPriceData(record);
if (priceData.isPerToken) {
return (