mirror of
https://github.com/QuantumNous/new-api.git
synced 2026-09-03 04:43:01 +00:00
t0ng7u
b505121790
- Add RightStatsCard and place it in RechargeCard header
- Shows current balance, historical spend, and request count
- Mobile: stacks under title; three metrics split equally (flex-1); vertical dividers hidden on small screens
- Remove extra margins; small card styling
- RechargeCard
- Replace redeem code Input icon with Semi UI IconGift
- Style “Payable amount” number in red and bold; keep same style in confirm modal
- Always render payment methods as Cards (remove Button variant) with adaptive grid
- Use brand color icons: SiAlipay (#1677FF), SiWechat (#07C160), SiStripe (#635BFF)
- Replace Stripe icon with SiStripe
- Integrate RightStatsCard props; adjust header to flex-col on mobile and flex-row on desktop
- Hide Banner close button when online top-up is disabled (closeIcon={null})
- InvitationCard
- Simplify to match RechargeCard’s minimalist slate style
- Use Card title for “Rewards” and place content directly in body
- Improve link input and copy button; use Badge dots for bullet points
- TopUp index
- Remove separate right-column stats card; pass userState and renderQuota to RechargeCard
- Cleanup
- Lint passes; no functional changes to APIs or business logic
83 lines
2.2 KiB
React
83 lines
2.2 KiB
React
/*
|
|
Copyright (C) 2025 QuantumNous
|
|
|
|
This program is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU Affero General Public License as
|
|
published by the Free Software Foundation, either version 3 of the
|
|
License, or (at your option) any later version.
|
|
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU Affero General Public License for more details.
|
|
|
|
You should have received a copy of the GNU Affero General Public License
|
|
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
|
|
For commercial licensing, please contact support@quantumnous.com
|
|
*/
|
|
|
|
import React from 'react';
|
|
import {
|
|
Modal,
|
|
Typography,
|
|
Input,
|
|
InputNumber,
|
|
} from '@douyinfe/semi-ui';
|
|
import { CreditCard } from 'lucide-react';
|
|
|
|
const TransferModal = ({
|
|
t,
|
|
openTransfer,
|
|
transfer,
|
|
handleTransferCancel,
|
|
userState,
|
|
renderQuota,
|
|
getQuotaPerUnit,
|
|
transferAmount,
|
|
setTransferAmount,
|
|
}) => {
|
|
return (
|
|
<Modal
|
|
title={
|
|
<div className='flex items-center'>
|
|
<CreditCard className='mr-2' size={18} />
|
|
{t('划转邀请额度')}
|
|
</div>
|
|
}
|
|
visible={openTransfer}
|
|
onOk={transfer}
|
|
onCancel={handleTransferCancel}
|
|
maskClosable={false}
|
|
centered
|
|
>
|
|
<div className='space-y-4'>
|
|
<div>
|
|
<Typography.Text strong className='block mb-2'>
|
|
{t('可用邀请额度')}
|
|
</Typography.Text>
|
|
<Input
|
|
value={renderQuota(userState?.user?.aff_quota)}
|
|
disabled
|
|
className='!rounded-lg'
|
|
/>
|
|
</div>
|
|
<div>
|
|
<Typography.Text strong className='block mb-2'>
|
|
{t('划转额度')} · {t('最低') + renderQuota(getQuotaPerUnit())}
|
|
</Typography.Text>
|
|
<InputNumber
|
|
min={getQuotaPerUnit()}
|
|
max={userState?.user?.aff_quota || 0}
|
|
value={transferAmount}
|
|
onChange={(value) => setTransferAmount(value)}
|
|
className='w-full !rounded-lg'
|
|
/>
|
|
</div>
|
|
</div>
|
|
</Modal>
|
|
);
|
|
};
|
|
|
|
export default TransferModal;
|