huangzhenpc/new-api-hunter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

💱 feat(RechargeCard): enhance currency display logic for top-up amounts based on user settings

Browse Source
This commit is contained in:
CaIon
2025-10-03 21:39:28 +08:00
parent 2958114205
commit 3a7f42e5a1
1 changed files with 86 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
web/src/components/topup/RechargeCard.jsx
View File

@@ -338,7 +338,40 @@ const RechargeCard = ({
)}
{(enableOnlineTopUp || enableStripeTopUp) && (
<Form.Slot label={t('选择充值额度')}>
<Form.Slot
label={
<div className='flex items-center gap-2'>
<span>{t('选择充值额度')}</span>
{(() => {
const quotaDisplayType = localStorage.getItem('quota_display_type') || 'USD';
if (quotaDisplayType === 'USD') return null;
const statusStr = localStorage.getItem('status');
let symbol = '¥';
let rate = 7;
try {
if (statusStr) {
const s = JSON.parse(statusStr);
if (quotaDisplayType === 'CNY') {
rate = s?.usd_exchange_rate || 7;
symbol = '¥';
} else if (quotaDisplayType === 'CUSTOM') {
rate = s?.custom_currency_exchange_rate || 1;
symbol = s?.custom_currency_symbol || '¤';
}
}
} catch (e) {}
return (
<span style={{ color: 'var(--semi-color-text-2)', fontSize: '12px', fontWeight: 'normal' }}>
(1 $ = {rate.toFixed(2)} {symbol})
</span>
);
})()}
</div>
}
>
<div className='grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-2'>
{presetAmounts.map((preset, index) => {
const discount =
@@ -351,6 +384,54 @@ const RechargeCard = ({
const actualPay = discountedPrice;
const save = originalPrice - discountedPrice;
// 根据当前货币类型换算显示金额和数量
const quotaDisplayType = localStorage.getItem('quota_display_type') || 'USD';
let symbol = '¥';
let displayValue = preset.value; // 显示的数量
let displayActualPay = actualPay;
let displaySave = save;
// 获取汇率
const statusStr = localStorage.getItem('status');
let usdRate = 7; // 默认汇率 1 USD = 7 CNY
try {
if (statusStr) {
const s = JSON.parse(statusStr);
usdRate = s?.usd_exchange_rate || 7;
}
} catch (e) {}
if (quotaDisplayType === 'USD') {
symbol = '$';
// 数量和价格都保持美元（系统默认）
displayValue = preset.value;
displayActualPay = actualPay / usdRate;
displaySave = save / usdRate;
} else if (quotaDisplayType === 'CNY') {
symbol = '¥';
// 数量需要换算为人民币
displayValue = preset.value * usdRate;
// 价格已经是人民币，保持不变
displayActualPay = actualPay;
displaySave = save;
} else if (quotaDisplayType === 'CUSTOM') {
let customSymbol = '¤';
let customRate = 1;
try {
if (statusStr) {
const s = JSON.parse(statusStr);
customSymbol = s?.custom_currency_symbol || '¤';
customRate = s?.custom_currency_exchange_rate || 1;
}
} catch (e) {}
symbol = customSymbol;
// 数量从USD转为自定义货币
displayValue = preset.value * customRate;
// 价格从CNY先转USD再转自定义货币
displayActualPay = (actualPay / usdRate) * customRate;
displaySave = (save / usdRate) * customRate;
}
return (
<Card
key={index}
@@ -378,7 +459,7 @@ const RechargeCard = ({
style={{ margin: '0 0 8px 0' }}
>
<Coins size={18} />
{formatLargeNumber(preset.value)}
{formatLargeNumber(preset.value)} $
{hasDiscount && (
<Tag style={{ marginLeft: 4 }} color='green'>
{t('折').includes('off')
@@ -398,10 +479,10 @@ const RechargeCard = ({
margin: '4px 0',
}}
>
{t('实付')} {actualPay.toFixed(2)}，
{t('实付')} {symbol}{displayActualPay.toFixed(2)}，
{hasDiscount
? `${t('节省')} ${save.toFixed(2)}`
: `${t('节省')} 0.00`}
? `${t('节省')} ${symbol}${displaySave.toFixed(2)}`
: `${t('节省')} ${symbol}0.00`}
</div>
</div>
</Card>