Commit 9942045b by t0ng7u

refactor(wallet): Top-up layout to embed subscription plans into the recharge card tabs

- Defaulting to subscriptions when available and avoiding initial flash when no plans exist.
- Adjust the wide-screen layout to place wallet and invite sections side by side, simplify the subscription header and controls, and add padding to prevent card borders from clipping.
- Update related i18n strings by adding the new tab label and removing the obsolete subscription blurb.
parent 725473d3
...@@ -17,7 +17,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>. ...@@ -17,7 +17,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
For commercial licensing, please contact support@quantumnous.com For commercial licensing, please contact support@quantumnous.com
*/ */
import React, { useRef } from 'react'; import React, { useEffect, useRef, useState } from 'react';
import { import {
Avatar, Avatar,
Typography, Typography,
...@@ -32,6 +32,8 @@ import { ...@@ -32,6 +32,8 @@ import {
Col, Col,
Spin, Spin,
Tooltip, Tooltip,
Tabs,
TabPane,
} from '@douyinfe/semi-ui'; } from '@douyinfe/semi-ui';
import { SiAlipay, SiWechat, SiStripe } from 'react-icons/si'; import { SiAlipay, SiWechat, SiStripe } from 'react-icons/si';
import { import {
...@@ -41,10 +43,12 @@ import { ...@@ -41,10 +43,12 @@ import {
BarChart2, BarChart2,
TrendingUp, TrendingUp,
Receipt, Receipt,
Sparkles,
} from 'lucide-react'; } from 'lucide-react';
import { IconGift } from '@douyinfe/semi-icons'; import { IconGift } from '@douyinfe/semi-icons';
import { useMinimumLoadingTime } from '../../hooks/common/useMinimumLoadingTime'; import { useMinimumLoadingTime } from '../../hooks/common/useMinimumLoadingTime';
import { getCurrencyConfig } from '../../helpers/render'; import { getCurrencyConfig } from '../../helpers/render';
import SubscriptionPlansCard from './SubscriptionPlansCard';
const { Text } = Typography; const { Text } = Typography;
...@@ -83,506 +87,565 @@ const RechargeCard = ({ ...@@ -83,506 +87,565 @@ const RechargeCard = ({
statusLoading, statusLoading,
topupInfo, topupInfo,
onOpenHistory, onOpenHistory,
subscriptionLoading = false,
subscriptionPlans = [],
billingPreference,
onChangeBillingPreference,
activeSubscriptions = [],
allSubscriptions = [],
reloadSubscriptionSelf,
}) => { }) => {
const onlineFormApiRef = useRef(null); const onlineFormApiRef = useRef(null);
const redeemFormApiRef = useRef(null); const redeemFormApiRef = useRef(null);
const initialTabSetRef = useRef(false);
const showAmountSkeleton = useMinimumLoadingTime(amountLoading); const showAmountSkeleton = useMinimumLoadingTime(amountLoading);
console.log( const [activeTab, setActiveTab] = useState('topup');
' enabled screem ?', const shouldShowSubscription =
enableCreemTopUp, !subscriptionLoading && subscriptionPlans.length > 0;
' products ?',
creemProducts,
);
return (
<Card className='!rounded-2xl shadow-sm border-0'>
{/* 卡片头部 */}
<div className='flex items-center justify-between mb-4'>
<div className='flex items-center'>
<Avatar size='small' color='blue' className='mr-3 shadow-md'>
<CreditCard size={16} />
</Avatar>
<div>
<Typography.Text className='text-lg font-medium'>
{t('账户充值')}
</Typography.Text>
<div className='text-xs'>{t('多种充值方式,安全便捷')}</div>
</div>
</div>
<Button
icon={<Receipt size={16} />}
theme='solid'
onClick={onOpenHistory}
>
{t('账单')}
</Button>
</div>
<Space vertical style={{ width: '100%' }}> useEffect(() => {
{/* 统计数据 */} if (initialTabSetRef.current) return;
<Card if (subscriptionLoading) return;
className='!rounded-xl w-full' setActiveTab(shouldShowSubscription ? 'subscription' : 'topup');
cover={ initialTabSetRef.current = true;
<div }, [shouldShowSubscription, subscriptionLoading]);
className='relative h-30'
style={{ useEffect(() => {
'--palette-primary-darkerChannel': '37 99 235', if (!shouldShowSubscription && activeTab !== 'topup') {
backgroundImage: `linear-gradient(0deg, rgba(var(--palette-primary-darkerChannel) / 80%), rgba(var(--palette-primary-darkerChannel) / 80%)), url('/cover-4.webp')`, setActiveTab('topup');
backgroundSize: 'cover', }
backgroundPosition: 'center', }, [shouldShowSubscription, activeTab]);
backgroundRepeat: 'no-repeat', const topupContent = (
}} <Space vertical style={{ width: '100%' }}>
> {/* 统计数据 */}
<div className='relative z-10 h-full flex flex-col justify-between p-4'> <Card
<div className='flex justify-between items-center'> className='!rounded-xl w-full'
<Text strong style={{ color: 'white', fontSize: '16px' }}> cover={
{t('账户统计')} <div
</Text> className='relative h-30'
</div> style={{
'--palette-primary-darkerChannel': '37 99 235',
backgroundImage: `linear-gradient(0deg, rgba(var(--palette-primary-darkerChannel) / 80%), rgba(var(--palette-primary-darkerChannel) / 80%)), url('/cover-4.webp')`,
backgroundSize: 'cover',
backgroundPosition: 'center',
backgroundRepeat: 'no-repeat',
}}
>
<div className='relative z-10 h-full flex flex-col justify-between p-4'>
<div className='flex justify-between items-center'>
<Text strong style={{ color: 'white', fontSize: '16px' }}>
{t('账户统计')}
</Text>
</div>
{/* 统计数据 */} {/* 统计数据 */}
<div className='grid grid-cols-3 gap-6 mt-4'> <div className='grid grid-cols-3 gap-6 mt-4'>
{/* 当前余额 */} {/* 当前余额 */}
<div className='text-center'> <div className='text-center'>
<div <div
className='text-base sm:text-2xl font-bold mb-2' className='text-base sm:text-2xl font-bold mb-2'
style={{ color: 'white' }} style={{ color: 'white' }}
>
{renderQuota(userState?.user?.quota)}
</div>
<div className='flex items-center justify-center text-sm'>
<Wallet
size={14}
className='mr-1'
style={{ color: 'rgba(255,255,255,0.8)' }}
/>
<Text
style={{
color: 'rgba(255,255,255,0.8)',
fontSize: '12px',
}}
> >
{renderQuota(userState?.user?.quota)} {t('当前余额')}
</div> </Text>
<div className='flex items-center justify-center text-sm'>
<Wallet
size={14}
className='mr-1'
style={{ color: 'rgba(255,255,255,0.8)' }}
/>
<Text
style={{
color: 'rgba(255,255,255,0.8)',
fontSize: '12px',
}}
>
{t('当前余额')}
</Text>
</div>
</div> </div>
</div>
{/* 历史消耗 */} {/* 历史消耗 */}
<div className='text-center'> <div className='text-center'>
<div <div
className='text-base sm:text-2xl font-bold mb-2' className='text-base sm:text-2xl font-bold mb-2'
style={{ color: 'white' }} style={{ color: 'white' }}
>
{renderQuota(userState?.user?.used_quota)}
</div>
<div className='flex items-center justify-center text-sm'>
<TrendingUp
size={14}
className='mr-1'
style={{ color: 'rgba(255,255,255,0.8)' }}
/>
<Text
style={{
color: 'rgba(255,255,255,0.8)',
fontSize: '12px',
}}
> >
{renderQuota(userState?.user?.used_quota)} {t('历史消耗')}
</div> </Text>
<div className='flex items-center justify-center text-sm'>
<TrendingUp
size={14}
className='mr-1'
style={{ color: 'rgba(255,255,255,0.8)' }}
/>
<Text
style={{
color: 'rgba(255,255,255,0.8)',
fontSize: '12px',
}}
>
{t('历史消耗')}
</Text>
</div>
</div> </div>
</div>
{/* 请求次数 */} {/* 请求次数 */}
<div className='text-center'> <div className='text-center'>
<div <div
className='text-base sm:text-2xl font-bold mb-2' className='text-base sm:text-2xl font-bold mb-2'
style={{ color: 'white' }} style={{ color: 'white' }}
>
{userState?.user?.request_count || 0}
</div>
<div className='flex items-center justify-center text-sm'>
<BarChart2
size={14}
className='mr-1'
style={{ color: 'rgba(255,255,255,0.8)' }}
/>
<Text
style={{
color: 'rgba(255,255,255,0.8)',
fontSize: '12px',
}}
> >
{userState?.user?.request_count || 0} {t('请求次数')}
</div> </Text>
<div className='flex items-center justify-center text-sm'>
<BarChart2
size={14}
className='mr-1'
style={{ color: 'rgba(255,255,255,0.8)' }}
/>
<Text
style={{
color: 'rgba(255,255,255,0.8)',
fontSize: '12px',
}}
>
{t('请求次数')}
</Text>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
} </div>
> }
{/* 在线充值表单 */} >
{statusLoading ? ( {/* 在线充值表单 */}
<div className='py-8 flex justify-center'> {statusLoading ? (
<Spin size='large' /> <div className='py-8 flex justify-center'>
</div> <Spin size='large' />
) : enableOnlineTopUp || enableStripeTopUp || enableCreemTopUp ? ( </div>
<Form ) : enableOnlineTopUp || enableStripeTopUp || enableCreemTopUp ? (
getFormApi={(api) => (onlineFormApiRef.current = api)} <Form
initValues={{ topUpCount: topUpCount }} getFormApi={(api) => (onlineFormApiRef.current = api)}
> initValues={{ topUpCount: topUpCount }}
<div className='space-y-6'> >
{(enableOnlineTopUp || enableStripeTopUp) && ( <div className='space-y-6'>
<Row gutter={12}> {(enableOnlineTopUp || enableStripeTopUp) && (
<Col xs={24} sm={24} md={24} lg={10} xl={10}> <Row gutter={12}>
<Form.InputNumber <Col xs={24} sm={24} md={24} lg={10} xl={10}>
field='topUpCount' <Form.InputNumber
label={t('充值数量')} field='topUpCount'
disabled={!enableOnlineTopUp && !enableStripeTopUp} label={t('充值数量')}
placeholder={ disabled={!enableOnlineTopUp && !enableStripeTopUp}
t('充值数量,最低 ') + renderQuotaWithAmount(minTopUp) placeholder={
} t('充值数量,最低 ') + renderQuotaWithAmount(minTopUp)
value={topUpCount} }
min={minTopUp} value={topUpCount}
max={999999999} min={minTopUp}
step={1} max={999999999}
precision={0} step={1}
onChange={async (value) => { precision={0}
if (value && value >= 1) { onChange={async (value) => {
setTopUpCount(value); if (value && value >= 1) {
setSelectedPreset(null); setTopUpCount(value);
await getAmount(value); setSelectedPreset(null);
} await getAmount(value);
}}
onBlur={(e) => {
const value = parseInt(e.target.value);
if (!value || value < 1) {
setTopUpCount(1);
getAmount(1);
}
}}
formatter={(value) => (value ? `${value}` : '')}
parser={(value) =>
value ? parseInt(value.replace(/[^\d]/g, '')) : 0
} }
extraText={ }}
<Skeleton onBlur={(e) => {
loading={showAmountSkeleton} const value = parseInt(e.target.value);
active if (!value || value < 1) {
placeholder={ setTopUpCount(1);
<Skeleton.Title getAmount(1);
style={{
width: 120,
height: 20,
borderRadius: 6,
}}
/>
}
>
<Text type='secondary' className='text-red-600'>
{t('实付金额:')}
<span style={{ color: 'red' }}>
{renderAmount()}
</span>
</Text>
</Skeleton>
} }
style={{ width: '100%' }} }}
/> formatter={(value) => (value ? `${value}` : '')}
</Col> parser={(value) =>
<Col xs={24} sm={24} md={24} lg={14} xl={14}> value ? parseInt(value.replace(/[^\d]/g, '')) : 0
<Form.Slot label={t('选择支付方式')}> }
{payMethods && payMethods.length > 0 ? ( extraText={
<Space wrap> <Skeleton
{payMethods.map((payMethod) => { loading={showAmountSkeleton}
const minTopupVal = active
Number(payMethod.min_topup) || 0; placeholder={
const isStripe = payMethod.type === 'stripe'; <Skeleton.Title
const disabled =
(!enableOnlineTopUp && !isStripe) ||
(!enableStripeTopUp && isStripe) ||
minTopupVal > Number(topUpCount || 0);
const buttonEl = (
<Button
key={payMethod.type}
theme='outline'
type='tertiary'
onClick={() => preTopUp(payMethod.type)}
disabled={disabled}
loading={
paymentLoading && payWay === payMethod.type
}
icon={
payMethod.type === 'alipay' ? (
<SiAlipay size={18} color='#1677FF' />
) : payMethod.type === 'wxpay' ? (
<SiWechat size={18} color='#07C160' />
) : payMethod.type === 'stripe' ? (
<SiStripe size={18} color='#635BFF' />
) : (
<CreditCard
size={18}
color={
payMethod.color ||
'var(--semi-color-text-2)'
}
/>
)
}
className='!rounded-lg !px-4 !py-2'
>
{payMethod.name}
</Button>
);
return disabled &&
minTopupVal > Number(topUpCount || 0) ? (
<Tooltip
content={
t('此支付方式最低充值金额为') +
' ' +
minTopupVal
}
key={payMethod.type}
>
{buttonEl}
</Tooltip>
) : (
<React.Fragment key={payMethod.type}>
{buttonEl}
</React.Fragment>
);
})}
</Space>
) : (
<div className='text-gray-500 text-sm p-3 bg-gray-50 rounded-lg border border-dashed border-gray-300'>
{t('暂无可用的支付方式,请联系管理员配置')}
</div>
)}
</Form.Slot>
</Col>
</Row>
)}
{(enableOnlineTopUp || enableStripeTopUp) && (
<Form.Slot
label={
<div className='flex items-center gap-2'>
<span>{t('选择充值额度')}</span>
{(() => {
const { symbol, rate, type } = getCurrencyConfig();
if (type === 'USD') return null;
return (
<span
style={{ style={{
color: 'var(--semi-color-text-2)', width: 120,
fontSize: '12px', height: 20,
fontWeight: 'normal', borderRadius: 6,
}} }}
> />
(1 $ = {rate.toFixed(2)} {symbol}) }
>
<Text type='secondary' className='text-red-600'>
{t('实付金额:')}
<span style={{ color: 'red' }}>
{renderAmount()}
</span> </span>
); </Text>
})()} </Skeleton>
</div> }
} style={{ width: '100%' }}
> />
<div className='grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-2'> </Col>
{presetAmounts.map((preset, index) => { <Col xs={24} sm={24} md={24} lg={14} xl={14}>
const discount = <Form.Slot label={t('选择支付方式')}>
preset.discount || {payMethods && payMethods.length > 0 ? (
topupInfo?.discount?.[preset.value] || <Space wrap>
1.0; {payMethods.map((payMethod) => {
const originalPrice = preset.value * priceRatio; const minTopupVal = Number(payMethod.min_topup) || 0;
const discountedPrice = originalPrice * discount; const isStripe = payMethod.type === 'stripe';
const hasDiscount = discount < 1.0; const disabled =
const actualPay = discountedPrice; (!enableOnlineTopUp && !isStripe) ||
const save = originalPrice - discountedPrice; (!enableStripeTopUp && isStripe) ||
minTopupVal > Number(topUpCount || 0);
// 根据当前货币类型换算显示金额和数量 const buttonEl = (
const { symbol, rate, type } = getCurrencyConfig(); <Button
const statusStr = localStorage.getItem('status'); key={payMethod.type}
let usdRate = 7; // 默认CNY汇率 theme='outline'
try { type='tertiary'
if (statusStr) { onClick={() => preTopUp(payMethod.type)}
const s = JSON.parse(statusStr); disabled={disabled}
usdRate = s?.usd_exchange_rate || 7; loading={
} paymentLoading && payWay === payMethod.type
} catch (e) {} }
icon={
payMethod.type === 'alipay' ? (
<SiAlipay size={18} color='#1677FF' />
) : payMethod.type === 'wxpay' ? (
<SiWechat size={18} color='#07C160' />
) : payMethod.type === 'stripe' ? (
<SiStripe size={18} color='#635BFF' />
) : (
<CreditCard
size={18}
color={
payMethod.color ||
'var(--semi-color-text-2)'
}
/>
)
}
className='!rounded-lg !px-4 !py-2'
>
{payMethod.name}
</Button>
);
let displayValue = preset.value; // 显示的数量 return disabled &&
let displayActualPay = actualPay; minTopupVal > Number(topUpCount || 0) ? (
let displaySave = save; <Tooltip
content={
t('此支付方式最低充值金额为') +
' ' +
minTopupVal
}
key={payMethod.type}
>
{buttonEl}
</Tooltip>
) : (
<React.Fragment key={payMethod.type}>
{buttonEl}
</React.Fragment>
);
})}
</Space>
) : (
<div className='text-gray-500 text-sm p-3 bg-gray-50 rounded-lg border border-dashed border-gray-300'>
{t('暂无可用的支付方式,请联系管理员配置')}
</div>
)}
</Form.Slot>
</Col>
</Row>
)}
if (type === 'USD') { {(enableOnlineTopUp || enableStripeTopUp) && (
// 数量保持USD,价格从CNY转USD <Form.Slot
displayActualPay = actualPay / usdRate; label={
displaySave = save / usdRate; <div className='flex items-center gap-2'>
} else if (type === 'CNY') { <span>{t('选择充值额度')}</span>
// 数量转CNY,价格已是CNY {(() => {
displayValue = preset.value * usdRate; const { symbol, rate, type } = getCurrencyConfig();
} else if (type === 'CUSTOM') { if (type === 'USD') return null;
// 数量和价格都转自定义货币
displayValue = preset.value * rate;
displayActualPay = (actualPay / usdRate) * rate;
displaySave = (save / usdRate) * rate;
}
return ( return (
<Card <span
key={index}
style={{ style={{
cursor: 'pointer', color: 'var(--semi-color-text-2)',
border: fontSize: '12px',
selectedPreset === preset.value fontWeight: 'normal',
? '2px solid var(--semi-color-primary)'
: '1px solid var(--semi-color-border)',
height: '100%',
width: '100%',
}}
bodyStyle={{ padding: '12px' }}
onClick={() => {
selectPresetAmount(preset);
onlineFormApiRef.current?.setValue(
'topUpCount',
preset.value,
);
}} }}
> >
<div style={{ textAlign: 'center' }}> (1 $ = {rate.toFixed(2)} {symbol})
<Typography.Title </span>
heading={6}
style={{ margin: '0 0 8px 0' }}
>
<Coins size={18} />
{formatLargeNumber(displayValue)} {symbol}
{hasDiscount && (
<Tag style={{ marginLeft: 4 }} color='green'>
{t('折').includes('off')
? (
(1 - parseFloat(discount)) *
100
).toFixed(1)
: (discount * 10).toFixed(1)}
{t('折')}
</Tag>
)}
</Typography.Title>
<div
style={{
color: 'var(--semi-color-text-2)',
fontSize: '12px',
margin: '4px 0',
}}
>
{t('实付')} {symbol}
{displayActualPay.toFixed(2)}
{hasDiscount
? `${t('节省')} ${symbol}${displaySave.toFixed(2)}`
: `${t('节省')} ${symbol}0.00`}
</div>
</div>
</Card>
); );
})} })()}
</div> </div>
</Form.Slot> }
)} >
<div className='grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-2'>
{presetAmounts.map((preset, index) => {
const discount =
preset.discount || topupInfo?.discount?.[preset.value] || 1.0;
const originalPrice = preset.value * priceRatio;
const discountedPrice = originalPrice * discount;
const hasDiscount = discount < 1.0;
const actualPay = discountedPrice;
const save = originalPrice - discountedPrice;
// 根据当前货币类型换算显示金额和数量
const { symbol, rate, type } = getCurrencyConfig();
const statusStr = localStorage.getItem('status');
let usdRate = 7; // 默认CNY汇率
try {
if (statusStr) {
const s = JSON.parse(statusStr);
usdRate = s?.usd_exchange_rate || 7;
}
} catch (e) { }
let displayValue = preset.value; // 显示的数量
let displayActualPay = actualPay;
let displaySave = save;
{/* Creem 充值区域 */} if (type === 'USD') {
{enableCreemTopUp && creemProducts.length > 0 && ( // 数量保持USD,价格从CNY转USD
<Form.Slot label={t('Creem 充值')}> displayActualPay = actualPay / usdRate;
<div className='grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3'> displaySave = save / usdRate;
{creemProducts.map((product, index) => ( } else if (type === 'CNY') {
// 数量转CNY,价格已是CNY
displayValue = preset.value * usdRate;
} else if (type === 'CUSTOM') {
// 数量和价格都转自定义货币
displayValue = preset.value * rate;
displayActualPay = (actualPay / usdRate) * rate;
displaySave = (save / usdRate) * rate;
}
return (
<Card <Card
key={index} key={index}
onClick={() => creemPreTopUp(product)} style={{
className='cursor-pointer !rounded-2xl transition-all hover:shadow-md border-gray-200 hover:border-gray-300' cursor: 'pointer',
bodyStyle={{ textAlign: 'center', padding: '16px' }} border:
selectedPreset === preset.value
? '2px solid var(--semi-color-primary)'
: '1px solid var(--semi-color-border)',
height: '100%',
width: '100%',
}}
bodyStyle={{ padding: '12px' }}
onClick={() => {
selectPresetAmount(preset);
onlineFormApiRef.current?.setValue(
'topUpCount',
preset.value,
);
}}
> >
<div className='font-medium text-lg mb-2'> <div style={{ textAlign: 'center' }}>
{product.name} <Typography.Title
</div> heading={6}
<div className='text-sm text-gray-600 mb-2'> style={{ margin: '0 0 8px 0' }}
{t('充值额度')}: {product.quota} >
</div> <Coins size={18} />
<div className='text-lg font-semibold text-blue-600'> {formatLargeNumber(displayValue)} {symbol}
{product.currency === 'EUR' ? '€' : '$'} {hasDiscount && (
{product.price} <Tag style={{ marginLeft: 4 }} color='green'>
{t('折').includes('off')
? ((1 - parseFloat(discount)) * 100).toFixed(1)
: (discount * 10).toFixed(1)}
{t('折')}
</Tag>
)}
</Typography.Title>
<div
style={{
color: 'var(--semi-color-text-2)',
fontSize: '12px',
margin: '4px 0',
}}
>
{t('实付')} {symbol}
{displayActualPay.toFixed(2)}
{hasDiscount
? `${t('节省')} ${symbol}${displaySave.toFixed(2)}`
: `${t('节省')} ${symbol}0.00`}
</div>
</div> </div>
</Card> </Card>
))} );
</div> })}
</Form.Slot> </div>
)} </Form.Slot>
</div>
</Form>
) : (
<Banner
type='info'
description={t(
'管理员未开启在线充值功能,请联系管理员开启或使用兑换码充值。',
)} )}
className='!rounded-xl'
closeIcon={null}
/>
)}
</Card>
{/* 兑换码充值 */} {/* Creem 充值区域 */}
<Card {enableCreemTopUp && creemProducts.length > 0 && (
className='!rounded-xl w-full' <Form.Slot label={t('Creem 充值')}>
title={ <div className='grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3'>
<Text type='tertiary' strong> {creemProducts.map((product, index) => (
{t('兑换码充值')} <Card
</Text> key={index}
} onClick={() => creemPreTopUp(product)}
className='cursor-pointer !rounded-2xl transition-all hover:shadow-md border-gray-200 hover:border-gray-300'
bodyStyle={{ textAlign: 'center', padding: '16px' }}
>
<div className='font-medium text-lg mb-2'>
{product.name}
</div>
<div className='text-sm text-gray-600 mb-2'>
{t('充值额度')}: {product.quota}
</div>
<div className='text-lg font-semibold text-blue-600'>
{product.currency === 'EUR' ? '€' : '$'}
{product.price}
</div>
</Card>
))}
</div>
</Form.Slot>
)}
</div>
</Form>
) : (
<Banner
type='info'
description={t(
'管理员未开启在线充值功能,请联系管理员开启或使用兑换码充值。',
)}
className='!rounded-xl'
closeIcon={null}
/>
)}
</Card>
{/* 兑换码充值 */}
<Card
className='!rounded-xl w-full'
title={
<Text type='tertiary' strong>
{t('兑换码充值')}
</Text>
}
>
<Form
getFormApi={(api) => (redeemFormApiRef.current = api)}
initValues={{ redemptionCode: redemptionCode }}
> >
<Form <Form.Input
getFormApi={(api) => (redeemFormApiRef.current = api)} field='redemptionCode'
initValues={{ redemptionCode: redemptionCode }} noLabel={true}
> placeholder={t('请输入兑换码')}
<Form.Input value={redemptionCode}
field='redemptionCode' onChange={(value) => setRedemptionCode(value)}
noLabel={true} prefix={<IconGift />}
placeholder={t('请输入兑换码')} suffix={
value={redemptionCode} <div className='flex items-center gap-2'>
onChange={(value) => setRedemptionCode(value)} <Button
prefix={<IconGift />} type='primary'
suffix={ theme='solid'
<div className='flex items-center gap-2'> onClick={topUp}
<Button loading={isSubmitting}
type='primary' >
theme='solid' {t('兑换额度')}
onClick={topUp} </Button>
loading={isSubmitting} </div>
}
showClear
style={{ width: '100%' }}
extraText={
topUpLink && (
<Text type='tertiary'>
{t('在找兑换码?')}
<Text
type='secondary'
underline
className='cursor-pointer'
onClick={openTopUpLink}
> >
{t('兑换额度')} {t('购买兑换码')}
</Button>
</div>
}
showClear
style={{ width: '100%' }}
extraText={
topUpLink && (
<Text type='tertiary'>
{t('在找兑换码?')}
<Text
type='secondary'
underline
className='cursor-pointer'
onClick={openTopUpLink}
>
{t('购买兑换码')}
</Text>
</Text> </Text>
) </Text>
} )
/> }
</Form> />
</Card> </Form>
</Space> </Card>
</Space>
);
return (
<Card className='!rounded-2xl shadow-sm border-0'>
{/* 卡片头部 */}
<div className='flex items-center justify-between mb-4'>
<div className='flex items-center'>
<Avatar size='small' color='blue' className='mr-3 shadow-md'>
<CreditCard size={16} />
</Avatar>
<div>
<Typography.Text className='text-lg font-medium'>
{t('账户充值')}
</Typography.Text>
<div className='text-xs'>{t('多种充值方式,安全便捷')}</div>
</div>
</div>
<Button
icon={<Receipt size={16} />}
theme='solid'
onClick={onOpenHistory}
>
{t('账单')}
</Button>
</div>
{shouldShowSubscription ? (
<Tabs type='card' activeKey={activeTab} onChange={setActiveTab}>
<TabPane
tab={
<div className='flex items-center gap-2'>
<Sparkles size={16} />
{t('订阅套餐')}
</div>
}
itemKey='subscription'
>
<div className='py-2'>
<SubscriptionPlansCard
t={t}
loading={subscriptionLoading}
plans={subscriptionPlans}
payMethods={payMethods}
enableOnlineTopUp={enableOnlineTopUp}
enableStripeTopUp={enableStripeTopUp}
enableCreemTopUp={enableCreemTopUp}
billingPreference={billingPreference}
onChangeBillingPreference={onChangeBillingPreference}
activeSubscriptions={activeSubscriptions}
allSubscriptions={allSubscriptions}
reloadSubscriptionSelf={reloadSubscriptionSelf}
withCard={false}
/>
</div>
</TabPane>
<TabPane
tab={
<div className='flex items-center gap-2'>
<Wallet size={16} />
{t('额度充值')}
</div>
}
itemKey='topup'
>
<div className='py-2'>{topupContent}</div>
</TabPane>
</Tabs>
) : (
topupContent
)}
</Card> </Card>
); );
}; };
......
...@@ -19,7 +19,6 @@ For commercial licensing, please contact support@quantumnous.com ...@@ -19,7 +19,6 @@ For commercial licensing, please contact support@quantumnous.com
import React, { useMemo, useState } from 'react'; import React, { useMemo, useState } from 'react';
import { import {
Avatar,
Badge, Badge,
Button, Button,
Card, Card,
...@@ -33,7 +32,7 @@ import { ...@@ -33,7 +32,7 @@ import {
} from '@douyinfe/semi-ui'; } from '@douyinfe/semi-ui';
import { API, showError, showSuccess, renderQuota } from '../../helpers'; import { API, showError, showSuccess, renderQuota } from '../../helpers';
import { getCurrencyConfig } from '../../helpers/render'; import { getCurrencyConfig } from '../../helpers/render';
import { Crown, RefreshCw, Sparkles } from 'lucide-react'; import { RefreshCw, Sparkles } from 'lucide-react';
import SubscriptionPurchaseModal from './modals/SubscriptionPurchaseModal'; import SubscriptionPurchaseModal from './modals/SubscriptionPurchaseModal';
import { import {
formatSubscriptionDuration, formatSubscriptionDuration,
...@@ -83,6 +82,7 @@ const SubscriptionPlansCard = ({ ...@@ -83,6 +82,7 @@ const SubscriptionPlansCard = ({
activeSubscriptions = [], activeSubscriptions = [],
allSubscriptions = [], allSubscriptions = [],
reloadSubscriptionSelf, reloadSubscriptionSelf,
withCard = true,
}) => { }) => {
const [open, setOpen] = useState(false); const [open, setOpen] = useState(false);
const [selectedPlan, setSelectedPlan] = useState(null); const [selectedPlan, setSelectedPlan] = useState(null);
...@@ -241,33 +241,9 @@ const SubscriptionPlansCard = ({ ...@@ -241,33 +241,9 @@ const SubscriptionPlansCard = ({
return Math.round((used / total) * 100); return Math.round((used / total) * 100);
}; };
return ( const cardContent = (
<Card className='!rounded-2xl shadow-sm border-0'> <>
{/* 卡片头部 */} {/* 卡片头部 */}
<div className='flex items-center justify-between mb-3'>
<div className='flex items-center'>
<Avatar size='small' color='violet' className='mr-3 shadow-md'>
<Crown size={16} />
</Avatar>
<div>
<Text className='text-lg font-medium'>{t('订阅套餐')}</Text>
<div className='text-xs'>{t('购买订阅获得模型额度/次数')}</div>
</div>
</div>
{/* 扣费策略 - 右上角 */}
<Select
value={billingPreference}
onChange={onChangeBillingPreference}
size='small'
optionList={[
{ value: 'subscription_first', label: t('优先订阅') },
{ value: 'wallet_first', label: t('优先钱包') },
{ value: 'subscription_only', label: t('仅用订阅') },
{ value: 'wallet_only', label: t('仅用钱包') },
]}
/>
</div>
{loading ? ( {loading ? (
<div className='space-y-4'> <div className='space-y-4'>
{/* 我的订阅骨架屏 */} {/* 我的订阅骨架屏 */}
...@@ -281,7 +257,7 @@ const SubscriptionPlansCard = ({ ...@@ -281,7 +257,7 @@ const SubscriptionPlansCard = ({
</div> </div>
</Card> </Card>
{/* 套餐列表骨架屏 */} {/* 套餐列表骨架屏 */}
<div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-5 w-full'> <div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-5 w-full px-1'>
{[1, 2, 3].map((i) => ( {[1, 2, 3].map((i) => (
<Card <Card
key={i} key={i}
...@@ -317,8 +293,8 @@ const SubscriptionPlansCard = ({ ...@@ -317,8 +293,8 @@ const SubscriptionPlansCard = ({
<Space vertical style={{ width: '100%' }} spacing={8}> <Space vertical style={{ width: '100%' }} spacing={8}>
{/* 当前订阅状态 */} {/* 当前订阅状态 */}
<Card className='!rounded-xl w-full' bodyStyle={{ padding: '12px' }}> <Card className='!rounded-xl w-full' bodyStyle={{ padding: '12px' }}>
<div className='flex items-center justify-between mb-2'> <div className='flex items-center justify-between mb-2 gap-3'>
<div className='flex items-center gap-2'> <div className='flex items-center gap-2 flex-1 min-w-0'>
<Text strong>{t('我的订阅')}</Text> <Text strong>{t('我的订阅')}</Text>
{hasActiveSubscription ? ( {hasActiveSubscription ? (
<Tag <Tag
...@@ -341,19 +317,32 @@ const SubscriptionPlansCard = ({ ...@@ -341,19 +317,32 @@ const SubscriptionPlansCard = ({
</Tag> </Tag>
)} )}
</div> </div>
<Button <div className='flex items-center gap-2'>
size='small' <Select
theme='light' value={billingPreference}
type='tertiary' onChange={onChangeBillingPreference}
icon={ size='small'
<RefreshCw optionList={[
size={12} { value: 'subscription_first', label: t('优先订阅') },
className={refreshing ? 'animate-spin' : ''} { value: 'wallet_first', label: t('优先钱包') },
/> { value: 'subscription_only', label: t('仅用订阅') },
} { value: 'wallet_only', label: t('仅用钱包') },
onClick={handleRefresh} ]}
loading={refreshing} />
/> <Button
size='small'
theme='light'
type='tertiary'
icon={
<RefreshCw
size={12}
className={refreshing ? 'animate-spin' : ''}
/>
}
onClick={handleRefresh}
loading={refreshing}
/>
</div>
</div> </div>
{hasAnySubscription ? ( {hasAnySubscription ? (
...@@ -451,7 +440,7 @@ const SubscriptionPlansCard = ({ ...@@ -451,7 +440,7 @@ const SubscriptionPlansCard = ({
{/* 可购买套餐 - 标准定价卡片 */} {/* 可购买套餐 - 标准定价卡片 */}
{plans.length > 0 ? ( {plans.length > 0 ? (
<div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-5 w-full'> <div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-2 xl:grid-cols-3 gap-5 w-full px-1'>
{plans.map((p, index) => { {plans.map((p, index) => {
const plan = p?.plan; const plan = p?.plan;
const totalAmount = Number(plan?.total_amount || 0); const totalAmount = Number(plan?.total_amount || 0);
...@@ -482,9 +471,9 @@ const SubscriptionPlansCard = ({ ...@@ -482,9 +471,9 @@ const SubscriptionPlansCard = ({
resetLabel ? { label: resetLabel } : null, resetLabel ? { label: resetLabel } : null,
totalAmount > 0 totalAmount > 0
? { ? {
label: totalLabel, label: totalLabel,
tooltip: `${t('原生额度')}:${totalAmount}`, tooltip: `${t('原生额度')}:${totalAmount}`,
} }
: { label: totalLabel }, : { label: totalLabel },
limitLabel ? { label: limitLabel } : null, limitLabel ? { label: limitLabel } : null,
upgradeLabel ? { label: upgradeLabel } : null, upgradeLabel ? { label: upgradeLabel } : null,
...@@ -493,9 +482,8 @@ const SubscriptionPlansCard = ({ ...@@ -493,9 +482,8 @@ const SubscriptionPlansCard = ({
return ( return (
<Card <Card
key={plan?.id} key={plan?.id}
className={`!rounded-xl transition-all hover:shadow-lg w-full h-full ${ className={`!rounded-xl transition-all hover:shadow-lg w-full h-full ${isPopular ? 'ring-2 ring-purple-500' : ''
isPopular ? 'ring-2 ring-purple-500' : '' }`}
}`}
bodyStyle={{ padding: 0 }} bodyStyle={{ padding: 0 }}
> >
<div className='p-4 h-full flex flex-col'> <div className='p-4 h-full flex flex-col'>
...@@ -583,7 +571,7 @@ const SubscriptionPlansCard = ({ ...@@ -583,7 +571,7 @@ const SubscriptionPlansCard = ({
const buttonEl = ( const buttonEl = (
<Button <Button
theme='outline' theme='outline'
type='tertiary' type='primary'
block block
disabled={reached} disabled={reached}
onClick={() => { onClick={() => {
...@@ -614,6 +602,16 @@ const SubscriptionPlansCard = ({ ...@@ -614,6 +602,16 @@ const SubscriptionPlansCard = ({
)} )}
</Space> </Space>
)} )}
</>
);
return (
<>
{withCard ? (
<Card className='!rounded-2xl shadow-sm border-0'>{cardContent}</Card>
) : (
<div className='space-y-3'>{cardContent}</div>
)}
{/* 购买确认弹窗 */} {/* 购买确认弹窗 */}
<SubscriptionPurchaseModal <SubscriptionPurchaseModal
...@@ -631,16 +629,16 @@ const SubscriptionPlansCard = ({ ...@@ -631,16 +629,16 @@ const SubscriptionPlansCard = ({
purchaseLimitInfo={ purchaseLimitInfo={
selectedPlan?.plan?.id selectedPlan?.plan?.id
? { ? {
limit: Number(selectedPlan?.plan?.max_purchase_per_user || 0), limit: Number(selectedPlan?.plan?.max_purchase_per_user || 0),
count: getPlanPurchaseCount(selectedPlan?.plan?.id), count: getPlanPurchaseCount(selectedPlan?.plan?.id),
} }
: null : null
} }
onPayStripe={payStripe} onPayStripe={payStripe}
onPayCreem={payCreem} onPayCreem={payCreem}
onPayEpay={payEpay} onPayEpay={payEpay}
/> />
</Card> </>
); );
}; };
......
...@@ -35,7 +35,6 @@ import { StatusContext } from '../../context/Status'; ...@@ -35,7 +35,6 @@ import { StatusContext } from '../../context/Status';
import RechargeCard from './RechargeCard'; import RechargeCard from './RechargeCard';
import InvitationCard from './InvitationCard'; import InvitationCard from './InvitationCard';
import SubscriptionPlansCard from './SubscriptionPlansCard';
import TransferModal from './modals/TransferModal'; import TransferModal from './modals/TransferModal';
import PaymentConfirmModal from './modals/PaymentConfirmModal'; import PaymentConfirmModal from './modals/PaymentConfirmModal';
import TopupHistoryModal from './modals/TopupHistoryModal'; import TopupHistoryModal from './modals/TopupHistoryModal';
...@@ -733,80 +732,58 @@ const TopUp = () => { ...@@ -733,80 +732,58 @@ const TopUp = () => {
</Modal> </Modal>
{/* 主布局区域 */} {/* 主布局区域 */}
<div className='grid grid-cols-1 lg:grid-cols-12 gap-6'> <div className='grid grid-cols-1 lg:grid-cols-2 gap-6'>
{/* 左侧 - 订阅套餐(无套餐时隐藏整块卡片) */} <RechargeCard
{(subscriptionLoading || subscriptionPlans.length > 0) && ( t={t}
<div className='lg:col-span-7'> enableOnlineTopUp={enableOnlineTopUp}
<SubscriptionPlansCard enableStripeTopUp={enableStripeTopUp}
t={t} enableCreemTopUp={enableCreemTopUp}
loading={subscriptionLoading} creemProducts={creemProducts}
plans={subscriptionPlans} creemPreTopUp={creemPreTopUp}
payMethods={payMethods} presetAmounts={presetAmounts}
enableOnlineTopUp={enableOnlineTopUp} selectedPreset={selectedPreset}
enableStripeTopUp={enableStripeTopUp} selectPresetAmount={selectPresetAmount}
enableCreemTopUp={enableCreemTopUp} formatLargeNumber={formatLargeNumber}
billingPreference={billingPreference} priceRatio={priceRatio}
onChangeBillingPreference={updateBillingPreference} topUpCount={topUpCount}
activeSubscriptions={activeSubscriptions} minTopUp={minTopUp}
allSubscriptions={allSubscriptions} renderQuotaWithAmount={renderQuotaWithAmount}
reloadSubscriptionSelf={getSubscriptionSelf} getAmount={getAmount}
/> setTopUpCount={setTopUpCount}
</div> setSelectedPreset={setSelectedPreset}
)} renderAmount={renderAmount}
amountLoading={amountLoading}
{/* 右侧 - 账户充值 + 邀请奖励 */} payMethods={payMethods}
<div preTopUp={preTopUp}
className={ paymentLoading={paymentLoading}
subscriptionLoading || subscriptionPlans.length > 0 payWay={payWay}
? 'lg:col-span-5 flex flex-col gap-6' redemptionCode={redemptionCode}
: 'lg:col-span-12 flex flex-col gap-6' setRedemptionCode={setRedemptionCode}
} topUp={topUp}
> isSubmitting={isSubmitting}
<RechargeCard topUpLink={topUpLink}
t={t} openTopUpLink={openTopUpLink}
enableOnlineTopUp={enableOnlineTopUp} userState={userState}
enableStripeTopUp={enableStripeTopUp} renderQuota={renderQuota}
enableCreemTopUp={enableCreemTopUp} statusLoading={statusLoading}
creemProducts={creemProducts} topupInfo={topupInfo}
creemPreTopUp={creemPreTopUp} onOpenHistory={handleOpenHistory}
presetAmounts={presetAmounts} subscriptionLoading={subscriptionLoading}
selectedPreset={selectedPreset} subscriptionPlans={subscriptionPlans}
selectPresetAmount={selectPresetAmount} billingPreference={billingPreference}
formatLargeNumber={formatLargeNumber} onChangeBillingPreference={updateBillingPreference}
priceRatio={priceRatio} activeSubscriptions={activeSubscriptions}
topUpCount={topUpCount} allSubscriptions={allSubscriptions}
minTopUp={minTopUp} reloadSubscriptionSelf={getSubscriptionSelf}
renderQuotaWithAmount={renderQuotaWithAmount} />
getAmount={getAmount} <InvitationCard
setTopUpCount={setTopUpCount} t={t}
setSelectedPreset={setSelectedPreset} userState={userState}
renderAmount={renderAmount} renderQuota={renderQuota}
amountLoading={amountLoading} setOpenTransfer={setOpenTransfer}
payMethods={payMethods} affLink={affLink}
preTopUp={preTopUp} handleAffLinkClick={handleAffLinkClick}
paymentLoading={paymentLoading} />
payWay={payWay}
redemptionCode={redemptionCode}
setRedemptionCode={setRedemptionCode}
topUp={topUp}
isSubmitting={isSubmitting}
topUpLink={topUpLink}
openTopUpLink={openTopUpLink}
userState={userState}
renderQuota={renderQuota}
statusLoading={statusLoading}
topupInfo={topupInfo}
onOpenHistory={handleOpenHistory}
/>
<InvitationCard
t={t}
userState={userState}
renderQuota={renderQuota}
setOpenTransfer={setOpenTransfer}
affLink={affLink}
handleAffLinkClick={handleAffLinkClick}
/>
</div>
</div> </div>
</div> </div>
); );
......
...@@ -2721,7 +2721,7 @@ ...@@ -2721,7 +2721,7 @@
"绑定订阅套餐": "Bind Subscription Plan", "绑定订阅套餐": "Bind Subscription Plan",
"绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "After binding, a user subscription is created immediately (no payment required); validity follows the plan configuration.", "绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "After binding, a user subscription is created immediately (no payment required); validity follows the plan configuration.",
"订阅套餐": "Subscription Plans", "订阅套餐": "Subscription Plans",
"购买订阅获得模型额度/次数": "Purchase a subscription to get model quota/usage", "额度充值": "Quota Top-up",
"优先订阅": "Subscription first", "优先订阅": "Subscription first",
"优先钱包": "Wallet first", "优先钱包": "Wallet first",
"仅用订阅": "Subscription only", "仅用订阅": "Subscription only",
......
...@@ -2684,7 +2684,7 @@ ...@@ -2684,7 +2684,7 @@
"绑定订阅套餐": "Lier un plan d'abonnement", "绑定订阅套餐": "Lier un plan d'abonnement",
"绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "Après liaison, un abonnement utilisateur est créé immédiatement (sans paiement) ; la validité suit la configuration du plan.", "绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "Après liaison, un abonnement utilisateur est créé immédiatement (sans paiement) ; la validité suit la configuration du plan.",
"订阅套餐": "Plans d'abonnement", "订阅套餐": "Plans d'abonnement",
"购买订阅获得模型额度/次数": "Acheter un abonnement pour obtenir des quotas/usages de modèles", "额度充值": "Recharge de quota",
"优先订阅": "Abonnement en priorité", "优先订阅": "Abonnement en priorité",
"优先钱包": "Portefeuille en priorité", "优先钱包": "Portefeuille en priorité",
"仅用订阅": "Abonnement uniquement", "仅用订阅": "Abonnement uniquement",
......
...@@ -2667,7 +2667,7 @@ ...@@ -2667,7 +2667,7 @@
"绑定订阅套餐": "サブスクリプションプランを紐付け", "绑定订阅套餐": "サブスクリプションプランを紐付け",
"绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "紐付け後、ユーザーサブスクリプションが即時に作成されます(支払い不要)。有効期限はプラン設定に従います。", "绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "紐付け後、ユーザーサブスクリプションが即時に作成されます(支払い不要)。有効期限はプラン設定に従います。",
"订阅套餐": "サブスクリプションプラン", "订阅套餐": "サブスクリプションプラン",
"购买订阅获得模型额度/次数": "サブスクリプション購入でモデルのクォータ/回数を取得", "额度充值": "クォータ補充",
"优先订阅": "サブスクリプション優先", "优先订阅": "サブスクリプション優先",
"优先钱包": "ウォレット優先", "优先钱包": "ウォレット優先",
"仅用订阅": "サブスクリプションのみ", "仅用订阅": "サブスクリプションのみ",
......
...@@ -2697,7 +2697,7 @@ ...@@ -2697,7 +2697,7 @@
"绑定订阅套餐": "Привязать план подписки", "绑定订阅套餐": "Привязать план подписки",
"绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "После привязки подписка будет создана сразу (без оплаты); срок действия рассчитывается по настройкам плана.", "绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "После привязки подписка будет создана сразу (без оплаты); срок действия рассчитывается по настройкам плана.",
"订阅套餐": "Планы подписки", "订阅套餐": "Планы подписки",
"购买订阅获得模型额度/次数": "Купите подписку, чтобы получить лимит/количество использования моделей", "额度充值": "Пополнение квоты",
"优先订阅": "Сначала подписка", "优先订阅": "Сначала подписка",
"优先钱包": "Сначала кошелек", "优先钱包": "Сначала кошелек",
"仅用订阅": "Только подписка", "仅用订阅": "Только подписка",
......
...@@ -3246,7 +3246,7 @@ ...@@ -3246,7 +3246,7 @@
"绑定订阅套餐": "Liên kết gói đăng ký", "绑定订阅套餐": "Liên kết gói đăng ký",
"绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "Sau khi liên kết, sẽ tạo đăng ký cho người dùng ngay (không cần thanh toán); thời hạn theo cấu hình gói.", "绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "Sau khi liên kết, sẽ tạo đăng ký cho người dùng ngay (không cần thanh toán); thời hạn theo cấu hình gói.",
"订阅套餐": "Gói đăng ký", "订阅套餐": "Gói đăng ký",
"购买订阅获得模型额度/次数": "Mua đăng ký để nhận hạn mức/lượt dùng mô hình", "额度充值": "Nạp hạn mức",
"优先订阅": "Ưu tiên đăng ký", "优先订阅": "Ưu tiên đăng ký",
"优先钱包": "Ưu tiên ví", "优先钱包": "Ưu tiên ví",
"仅用订阅": "Chỉ dùng đăng ký", "仅用订阅": "Chỉ dùng đăng ký",
......
...@@ -2706,7 +2706,7 @@ ...@@ -2706,7 +2706,7 @@
"绑定订阅套餐": "绑定订阅套餐", "绑定订阅套餐": "绑定订阅套餐",
"绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。", "绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。": "绑定后会立即生成用户订阅(无需支付),有效期按套餐配置计算。",
"订阅套餐": "订阅套餐", "订阅套餐": "订阅套餐",
"购买订阅获得模型额度/次数": "购买订阅获得模型额度/次数", "额度充值": "额度充值",
"优先订阅": "优先订阅", "优先订阅": "优先订阅",
"优先钱包": "优先钱包", "优先钱包": "优先钱包",
"仅用订阅": "仅用订阅", "仅用订阅": "仅用订阅",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment