okooooooo/Sub-Router
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 分站货币符号切换功能（¥/$ 可配置，默认人民币）

Browse Source 
后端:
- Distributor 模型新增 CurrencySymbol 字段 (default: ¥)
- /api/dist/site/info 响应中返回 currency_symbol
- PUT /api/distributor/self 支持更新 currency_symbol

分站管理后台 (web):
- DistributorSettings 新增货币符号切换 (¥ CNY / $ USD)
- 添加 i18n 翻译 (en/zh/ja/fr/ru/vi)

分站前端 (dist-site):
- Dashboard: 余额、已用额度使用动态符号
- Packages: 套餐价格、原价、订阅余额使用动态符号
- Pricing: 模型输入/输出价格使用动态符号
- Topup: 预设金额、支付金额、历史记录使用动态符号
- 7 个主题 Home 页: 套餐价格展示使用动态符号
- 所有页面通过 useSite().currency_symbol 读取，统一 fallback ¥

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
abingyydsandClaude Sonnet 4.6 committed 2026-03-21 23:09:46 +09:00
1 parent 3ed0f67be0
commit 7a4cbb60d3
11 files changed
+46 -29
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/pages/Dashboard.jsx
+5 -2
View File
@@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react';
import { Link } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { useAuth } from '../context/AuthContext';
import { useSite } from '../context/SiteContext';
import { getUserUsage, redeemCode, Q, quotaToDollar } from '../api';
import SpotlightCard from '../components/bits/SpotlightCard';
import CountUp from '../components/bits/CountUp';
@@ -11,6 +12,8 @@ import toast from 'react-hot-toast';
export default function Dashboard() {
const { t } = useTranslation();
const { user, refreshUser } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [usage, setUsage] = useState(null);
const [redeemInput, setRedeemInput] = useState('');
const [redeeming, setRedeeming] = useState(false);
@@ -61,7 +64,7 @@ export default function Dashboard() {
<SpotlightCard className="!bg-neutral-900/60 !border-neutral-800/60 !p-6" spotlightColor="rgba(34,197,94,0.15)">
<p className="text-sm text-page-secondary mb-2">{t('dashboard.balance')}</p>
<div className="text-3xl font-bold text-page">
$<CountUp from={0} to={balanceDollars} duration={1.5} />
{cs}<CountUp from={0} to={balanceDollars} duration={1.5} />
</div>
<p className="text-xs text-page-muted mt-1">{t('dashboard.quotaUnits', { count: quota.toLocaleString() })}</p>
</SpotlightCard>
@@ -69,7 +72,7 @@ export default function Dashboard() {
<SpotlightCard className="!bg-neutral-900/60 !border-neutral-800/60 !p-6" spotlightColor="rgba(129,140,248,0.15)">
<p className="text-sm text-page-secondary mb-2">{t('dashboard.used')}</p>
<div className="text-3xl font-bold text-page">
$<CountUp from={0} to={usedQuota / Q} duration={1.5} />
{cs}<CountUp from={0} to={usedQuota / Q} duration={1.5} />
</div>
<p className="text-xs text-page-muted mt-1">{t('dashboard.quotaUnits', { count: usedQuota.toLocaleString() })}</p>
</SpotlightCard>
src/pages/Packages.jsx
+7 -4
View File
@@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react';
import { Link, useNavigate } from 'react-router-dom';
import { useTranslation } from 'react-i18next';
import { useAuth } from '../context/AuthContext';
import { useSite } from '../context/SiteContext';
import { getSitePackages, subscribePackage, getActiveSubscriptions, Q } from '../api';
import SpotlightCard from '../components/bits/SpotlightCard';
import toast from 'react-hot-toast';
@@ -21,6 +22,8 @@ function formatDate(unix) {
export default function Packages() {
const { t } = useTranslation();
const { user, refreshUser } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const navigate = useNavigate();
const [packages, setPackages] = useState([]);
const [loading, setLoading] = useState(true);
@@ -138,7 +141,7 @@ export default function Packages() {
style={{ width: `${pct}%` }} />
</div>
<span className="text-xs text-page-secondary whitespace-nowrap">
${(remain / Q).toFixed(2)} / ${(total / Q).toFixed(2)}
{cs}{(remain / Q).toFixed(2)} / {cs}{(total / Q).toFixed(2)}
</span>
</div>
</div>
@@ -185,9 +188,9 @@ export default function Packages() {
{/* Price */}
<div className="mb-6">
<div className="flex items-baseline gap-2">
<span className="text-4xl font-bold text-page">${Number(pkg.price).toFixed(2)}</span>
<span className="text-4xl font-bold text-page">{cs}{Number(pkg.price).toFixed(2)}</span>
{pkg.original_price > 0 && pkg.original_price > pkg.price && (
<span className="text-lg text-page-muted line-through">${Number(pkg.original_price).toFixed(2)}</span>
<span className="text-lg text-page-muted line-through">{cs}{Number(pkg.original_price).toFixed(2)}</span>
)}
</div>
{pkg.duration > 0 && (
@@ -270,7 +273,7 @@ export default function Packages() {
</div>
)}
<p className="text-sm text-page-secondary mb-4">
{t('packages.yourBalance')} <span className={`font-medium ${insufficient ? 'text-red-400' : 'text-green-400'}`}>${userBalance.toFixed(2)}</span>
{t('packages.yourBalance')} <span className={`font-medium ${insufficient ? 'text-red-400' : 'text-green-400'}`}>{cs}{userBalance.toFixed(2)}</span>
</p>
{insufficient && (
<div className="bg-red-500/10 border border-red-500/20 rounded-xl p-3 mb-4">
src/pages/Pricing.jsx
+5 -2
View File
@@ -1,9 +1,12 @@
import React, { useState, useEffect } from 'react';
import { useTranslation } from 'react-i18next';
import { useSite } from '../context/SiteContext';
import { getSiteModels } from '../api';
export default function Pricing() {
const { t } = useTranslation();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [models, setModels] = useState([]);
const [search, setSearch] = useState('');
const [loading, setLoading] = useState(true);
@@ -79,10 +82,10 @@ export default function Pricing() {
<span className="font-mono text-page">{m.display_name || m.model_name}</span>
</td>
<td className="px-5 py-3.5 text-right font-mono text-page-label">
{m.input_price != null ? `$${(Number(m.input_price) * 1000).toFixed(4)}` : '-'}
{m.input_price != null ? `${cs}${(Number(m.input_price) * 1000).toFixed(4)}` : '-'}
</td>
<td className="px-5 py-3.5 text-right font-mono text-page-label">
{m.output_price != null ? `$${(Number(m.output_price) * 1000).toFixed(4)}` : '-'}
{m.output_price != null ? `${cs}${(Number(m.output_price) * 1000).toFixed(4)}` : '-'}
</td>
<td className="px-5 py-3.5 text-center">
<span className={`inline-flex items-center gap-1.5 px-2 py-0.5 rounded-full text-xs border ${
src/pages/Topup.jsx
+8 -7
View File
@@ -16,6 +16,7 @@ export default function Topup() {
const { t } = useTranslation();
const { user, refreshUser } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [usage, setUsage] = useState(null);
const [topupInfo, setTopupInfo] = useState(null);
@@ -325,7 +326,7 @@ export default function Topup() {
<SpotlightCard className="!bg-neutral-900/60 !border-neutral-800/60 !p-6" spotlightColor="rgba(34,197,94,0.15)">
<p className="text-sm text-page-secondary mb-2">{t('dashboard.balance')}</p>
<div className="text-3xl font-bold text-page">
$<CountUp from={0} to={balanceDollars} duration={1.5} />
{cs}<CountUp from={0} to={balanceDollars} duration={1.5} />
</div>
<p className="text-xs text-page-muted mt-1">{t('dashboard.quotaUnits', { count: quota.toLocaleString() })}</p>
</SpotlightCard>
@@ -333,7 +334,7 @@ export default function Topup() {
<SpotlightCard className="!bg-neutral-900/60 !border-neutral-800/60 !p-6" spotlightColor="rgba(129,140,248,0.15)">
<p className="text-sm text-page-secondary mb-2">{t('dashboard.used')}</p>
<div className="text-3xl font-bold text-page">
$<CountUp from={0} to={usedQuota / Q} duration={1.5} />
{cs}<CountUp from={0} to={usedQuota / Q} duration={1.5} />
</div>
</SpotlightCard>
@@ -372,7 +373,7 @@ export default function Topup() {
: 'glass-sm text-page-label hover:text-page hover:bg-white/[0.08]'
}`}
>
${val}
{cs}{val}
</button>
))}
</div>
@@ -399,7 +400,7 @@ export default function Topup() {
<p className="text-xs text-page-muted mt-2">{t('topup.calculating')}</p>
) : payAmount ? (
<p className="text-xs text-page-secondary mt-2">
{t('topup.payAmountLabel')}: <span className="text-green-400 font-medium">${payAmount}</span>
{t('topup.payAmountLabel')}: <span className="text-green-400 font-medium">{cs}{payAmount}</span>
</p>
) : null}
</div>
@@ -443,7 +444,7 @@ export default function Topup() {
>
<h3 className="text-sm font-semibold text-page mb-1">{product.name}</h3>
<p className="text-xl font-bold text-green-400 mb-1">
${product.price} <span className="text-xs text-page-muted font-normal">{product.currency || 'USD'}</span>
{cs}{product.price} <span className="text-xs text-page-muted font-normal">{product.currency || 'USD'}</span>
</p>
{product.quota && (
<p className="text-xs text-page-secondary">{t('topup.quotaIncluded') || `${product.quota} quota`}</p>
@@ -460,7 +461,7 @@ export default function Topup() {
>
{paymentLoading && payingMethod === 'creem'
? t('topup.processing')
: `${t('topup.payNow') || 'Pay'} $${selectedCreemProduct.price}`}
: `${t('topup.payNow') || 'Pay'} ${cs}${selectedCreemProduct.price}`}
</button>
</div>
)}
@@ -592,7 +593,7 @@ export default function Topup() {
{history.map((item, i) => (
<div key={i} className="flex items-center justify-between glass-sm rounded-xl px-4 py-3">
<div>
<p className="text-sm text-page">${item.amount}</p>
<p className="text-sm text-page">{cs}{item.amount}</p>
<p className="text-xs text-page-muted">
{new Date(item.create_time * 1000).toLocaleString()} · {item.payment_method || t('topup.redeemCode')}
</p>
src/themes/claude/Home.jsx
+3 -2
View File
@@ -16,6 +16,7 @@ export default function ClaudeHome() {
const { t } = useTranslation();
const { user } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [models, setModels] = useState([]);
const [packages, setPackages] = useState([]);
@@ -230,9 +231,9 @@ export default function ClaudeHome() {
{pkg.description && <p className="text-sm text-[#6B5D4F] mb-4">{pkg.description}</p>}
<div className="mt-auto pt-4">
<div className="flex items-baseline gap-1">
<span className="text-3xl font-bold text-[#3D3024]">${pkg.price}</span>
<span className="text-3xl font-bold text-[#3D3024]">{cs}{pkg.price}</span>
{pkg.original_price > pkg.price && (
<span className="text-sm text-[#8B7D6E] line-through">${pkg.original_price}</span>
<span className="text-sm text-[#8B7D6E] line-through">{cs}{pkg.original_price}</span>
)}
</div>
{pkg.duration > 0 && <p className="text-xs text-[#8B7D6E] mt-1">{t('home.days', { count: pkg.duration })}</p>}
src/themes/clean/Home.jsx
+3 -2
View File
@@ -15,6 +15,7 @@ export default function CleanHome() {
const { t } = useTranslation();
const { user } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [models, setModels] = useState([]);
const [packages, setPackages] = useState([]);
@@ -207,9 +208,9 @@ export default function CleanHome() {
{pkg.description && <p className="text-sm text-gray-500 mb-4">{pkg.description}</p>}
<div className="mt-auto pt-4">
<div className="flex items-baseline gap-1">
<span className="text-3xl font-bold text-gray-900">${pkg.price}</span>
<span className="text-3xl font-bold text-gray-900">{cs}{pkg.price}</span>
{pkg.original_price > pkg.price && (
<span className="text-sm text-gray-500 line-through">${pkg.original_price}</span>
<span className="text-sm text-gray-500 line-through">{cs}{pkg.original_price}</span>
)}
</div>
{pkg.duration > 0 && <p className="text-xs text-gray-500 mt-1">{t('home.days', { count: pkg.duration })}</p>}
src/themes/corporate/Home.jsx
+3 -2
View File
@@ -14,6 +14,7 @@ export default function CorporateHome() {
const { t } = useTranslation();
const { user } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [models, setModels] = useState([]);
const [packages, setPackages] = useState([]);
@@ -217,9 +218,9 @@ export default function CorporateHome() {
{pkg.description && <p className="text-sm text-slate-500 mb-6">{pkg.description}</p>}
<div className="mt-auto">
<div className="flex items-baseline gap-1.5">
<span className="text-4xl font-bold text-slate-900">${pkg.price}</span>
<span className="text-4xl font-bold text-slate-900">{cs}{pkg.price}</span>
{pkg.original_price > pkg.price && (
<span className="text-sm text-slate-500 line-through">${pkg.original_price}</span>
<span className="text-sm text-slate-500 line-through">{cs}{pkg.original_price}</span>
)}
</div>
{pkg.duration > 0 && <p className="text-sm text-slate-500 mt-1">{t('home.days', { count: pkg.duration })}</p>}
src/themes/dark/Home.jsx
+3 -2
View File
@@ -12,6 +12,7 @@ export default function DarkHome() {
const { t } = useTranslation();
const { user } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [models, setModels] = useState([]);
const [packages, setPackages] = useState([]);
@@ -178,9 +179,9 @@ export default function DarkHome() {
<h3 className="text-lg font-semibold text-white mb-1">{pkg.name}</h3>
{pkg.description && <p className="text-sm text-neutral-400 mb-4">{pkg.description}</p>}
<div className="mt-auto pt-4">
<span className="text-3xl font-bold text-emerald-400 font-mono">${pkg.price}</span>
<span className="text-3xl font-bold text-emerald-400 font-mono">{cs}{pkg.price}</span>
{pkg.original_price > pkg.price && (
<span className="text-sm text-neutral-600 line-through ml-2">${pkg.original_price}</span>
<span className="text-sm text-neutral-600 line-through ml-2">{cs}{pkg.original_price}</span>
)}
{pkg.duration > 0 && <p className="text-xs text-neutral-600 mt-1">{t('home.days', { count: pkg.duration })}</p>}
</div>
src/themes/default/Home.jsx
+3 -2
View File
@@ -14,6 +14,7 @@ export default function DefaultHome() {
const { t } = useTranslation();
const { user } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [models, setModels] = useState([]);
const [packages, setPackages] = useState([]);
@@ -181,9 +182,9 @@ export default function DefaultHome() {
{pkg.description && <p className="text-sm text-neutral-400 mb-4">{pkg.description}</p>}
<div className="mt-auto pt-4">
<div className="flex items-baseline gap-1">
<span className="text-3xl font-bold text-white">${pkg.price}</span>
<span className="text-3xl font-bold text-white">{cs}{pkg.price}</span>
{pkg.original_price > pkg.price && (
<span className="text-sm text-neutral-500 line-through">${pkg.original_price}</span>
<span className="text-sm text-neutral-500 line-through">{cs}{pkg.original_price}</span>
)}
</div>
{pkg.duration > 0 && <p className="text-xs text-neutral-500 mt-1">{t('home.days', { count: pkg.duration })}</p>}
src/themes/minimal/Home.jsx
+3 -2
View File
@@ -11,6 +11,7 @@ export default function MinimalHome() {
const { t } = useTranslation();
const { user } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [models, setModels] = useState([]);
const [packages, setPackages] = useState([]);
@@ -142,9 +143,9 @@ export default function MinimalHome() {
<h3 className="text-base font-semibold text-white">{pkg.name}</h3>
{pkg.description && <p className="text-sm text-neutral-500 mt-1">{pkg.description}</p>}
<div className="mt-auto pt-6">
<span className="text-3xl font-bold text-white">${pkg.price}</span>
<span className="text-3xl font-bold text-white">{cs}{pkg.price}</span>
{pkg.original_price > pkg.price && (
<span className="text-sm text-neutral-600 line-through ml-2">${pkg.original_price}</span>
<span className="text-sm text-neutral-600 line-through ml-2">{cs}{pkg.original_price}</span>
)}
{pkg.duration > 0 && <p className="text-xs text-neutral-600 mt-1">{t('home.days', { count: pkg.duration })}</p>}
</div>
src/themes/starter/Home.jsx
+3 -2
View File
@@ -14,6 +14,7 @@ export default function StarterHome() {
const { t } = useTranslation();
const { user } = useAuth();
const { site } = useSite();
const cs = site?.currency_symbol || '¥';
const [models, setModels] = useState([]);
const [packages, setPackages] = useState([]);
@@ -186,9 +187,9 @@ export default function StarterHome() {
)}
<div className="mt-auto pt-4">
<div className="flex items-baseline gap-1">
<span className="text-3xl font-bold text-white">${pkg.price}</span>
<span className="text-3xl font-bold text-white">{cs}{pkg.price}</span>
{pkg.original_price > pkg.price && (
<span className="text-sm text-neutral-500 line-through">${pkg.original_price}</span>
<span className="text-sm text-neutral-500 line-through">{cs}{pkg.original_price}</span>
)}
</div>
{pkg.duration > 0 && (