diff --git a/web/src/components/table/ModelPricing.js b/web/src/components/table/ModelPricing.js
index cf498e70..6e7dab87 100644
--- a/web/src/components/table/ModelPricing.js
+++ b/web/src/components/table/ModelPricing.js
@@ -16,7 +16,8 @@ import {
Card,
Tabs,
TabPane,
- Empty
+ Empty,
+ Switch
} from '@douyinfe/semi-ui';
import {
IllustrationNoResult,
@@ -32,6 +33,7 @@ import {
} from '@douyinfe/semi-icons';
import { UserContext } from '../../context/User/index.js';
import { AlertCircle } from 'lucide-react';
+import { StatusContext } from '../../context/Status/index.js';
const ModelPricing = () => {
const { t } = useTranslation();
@@ -44,6 +46,13 @@ const ModelPricing = () => {
const [activeKey, setActiveKey] = useState('all');
const [pageSize, setPageSize] = useState(10);
+ const [currency, setCurrency] = useState('USD');
+ const [tokenUnit, setTokenUnit] = useState('M');
+ const [statusState] = useContext(StatusContext);
+ const priceRate = useMemo(() => {
+ return statusState?.status?.price || 1;
+ }, [statusState]);
+
const rowSelection = useMemo(
() => ({
onChange: (selectedRowKeys, selectedRows) => {
@@ -245,33 +254,61 @@ const ModelPricing = () => {
},
},
{
- title: t('模型价格'),
+ title: (
+
+ {t('模型价格')}
+ {/* 货币切换 */}
+ setCurrency(checked ? 'RMB' : 'USD')}
+ checkedText="¥"
+ uncheckedText="$"
+ />
+ {/* 计费单位切换 */}
+ setTokenUnit(checked ? 'K' : 'M')}
+ checkedText="K"
+ uncheckedText="M"
+ />
+
+ ),
dataIndex: 'model_price',
render: (text, record, index) => {
let content = text;
if (record.quota_type === 0) {
- let inputRatioPrice =
- record.model_ratio * 2 * groupRatio[selectedGroup];
+ let inputRatioPrice = record.model_ratio * 2 * groupRatio[selectedGroup];
let completionRatioPrice =
- record.model_ratio *
- record.completion_ratio *
- 2 *
- groupRatio[selectedGroup];
+ record.model_ratio * record.completion_ratio * 2 * groupRatio[selectedGroup];
+
+ if (currency === 'RMB') {
+ inputRatioPrice = inputRatioPrice * priceRate;
+ completionRatioPrice = completionRatioPrice * priceRate;
+ }
+
+ const unitDivisor = tokenUnit === 'K' ? 1000 : 1;
+ const unitLabel = tokenUnit === 'K' ? 'K' : 'M';
+ inputRatioPrice = inputRatioPrice / unitDivisor;
+ completionRatioPrice = completionRatioPrice / unitDivisor;
content = (
- {t('提示')} ${inputRatioPrice.toFixed(3)} / 1M tokens
+ {t('提示')} {currency === 'USD' ? '$' : '¥'}{inputRatioPrice.toFixed(3)} / 1{unitLabel} tokens
- {t('补全')} ${completionRatioPrice.toFixed(3)} / 1M tokens
+ {t('补全')} {currency === 'USD' ? '$' : '¥'}{completionRatioPrice.toFixed(3)} / 1{unitLabel} tokens
);
} else {
let price = parseFloat(text) * groupRatio[selectedGroup];
+
+ if (currency === 'RMB') {
+ price = price * priceRate;
+ }
content = (
- {t('模型价格')}:${price.toFixed(3)}
+ {t('模型价格')}:{currency === 'USD' ? '$' : '¥'}{price.toFixed(3)}
);
}