wanwu/sub2apipay
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 页面标题/副标题更新、按钮和倍率跟随平台颜色、messages调度移到标题行、返回按钮统一

Browse Source 
1. 标题改为"选择适合你的 充值/订阅服务"，副标题改为"充值余额或者订阅套餐"
2. ChannelCard: 按钮bg、倍率数字、额度描述 跟随平台颜色
3. platform-style: 新增 button + accent 字段
4. SubscriptionPlanCard/SubscriptionConfirm: /v1/messages 调度 badge 移到标题行
5. 充值返回按钮样式与订阅确认页统一(灰色+箭头图标)
This commit is contained in:
erio
2026-03-14 02:08:14 +08:00
parent 5ce7ba3cb8
commit 8dd0d1144b
5 changed files with 80 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/ChannelCard.tsx
View File

@@ -26,8 +26,9 @@ interface ChannelCardProps {
export default function ChannelCard({ channel, onTopUp, isDark, locale }: ChannelCardProps) {
const usableQuota = (1 / channel.rateMultiplier).toFixed(2);
const platformStyle = getPlatformStyle(channel.platform);
const tagCls = isDark ? platformStyle.modelTag.dark : platformStyle.modelTag.light;
const ps = getPlatformStyle(channel.platform);
const tagCls = isDark ? ps.modelTag.dark : ps.modelTag.light;
const accentCls = isDark ? ps.accent.dark : ps.accent.light;
return (
<div
@@ -52,16 +53,16 @@ export default function ChannelCard({ channel, onTopUp, isDark, locale }: Channe
{pickLocaleText(locale, '当前倍率', 'Rate')}
</span>
<div className="flex items-baseline">
<span className="text-xl font-bold text-emerald-500">1</span>
<span className={['text-xl font-bold', accentCls].join(' ')}>1</span>
<span className={['mx-1.5 text-lg', isDark ? 'text-slate-500' : 'text-slate-400'].join(' ')}>:</span>
<span className="text-xl font-bold text-emerald-500">{channel.rateMultiplier}</span>
<span className={['text-xl font-bold', accentCls].join(' ')}>{channel.rateMultiplier}</span>
</div>
</div>
<p className={['mt-1 text-sm', isDark ? 'text-slate-400' : 'text-slate-500'].join(' ')}>
{pickLocaleText(
locale,
<>1元可用约<span className="font-medium text-emerald-500">{usableQuota}</span>美元额度</>,
<>1 CNY ≈ <span className="font-medium text-emerald-500">{usableQuota}</span> USD quota</>,
<>1元可用约<span className={['font-medium', accentCls].join(' ')}>{usableQuota}</span>美元额度</>,
<>1 CNY ≈ <span className={['font-medium', accentCls].join(' ')}>{usableQuota}</span> USD quota</>,
)}
</p>
</div>
@@ -89,7 +90,7 @@ export default function ChannelCard({ channel, onTopUp, isDark, locale }: Channe
tagCls,
].join(' ')}
>
<span className={['h-1.5 w-1.5 rounded-full', platformStyle.modelTag.dot].join(' ')} />
<span className={['h-1.5 w-1.5 rounded-full', ps.modelTag.dot].join(' ')} />
{model}
</span>
))}
@@ -126,7 +127,10 @@ export default function ChannelCard({ channel, onTopUp, isDark, locale }: Channe
<button
type="button"
onClick={onTopUp}
className="mt-2 inline-flex w-full items-center justify-center gap-2 rounded-xl bg-emerald-500 py-3 text-sm font-semibold text-white transition-colors hover:bg-emerald-600 active:bg-emerald-700"
className={[
'mt-2 inline-flex w-full items-center justify-center gap-2 rounded-xl py-3 text-sm font-semibold text-white transition-colors',
ps.button,
].join(' ')}
>
<svg className="h-4 w-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2}>
<polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2" />