JiaJun/36-character-flower
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(game): 更新游戏规则并优化充值提现界面

Browse Source 
- 在 api.type.ts 中为支付渠道、存款配置和取款字段添加新的接口属性
- 替换桌面端规则模态框中的纯文本内容为支持 Markdown 格式的组件
- 重构桌面端充值组件的 UI 结构，使用自定义按钮替代原生选择器
- 为取款组件添加最低最高金额验证及支付方式选择功能
- 更新英文本地化文件中的游戏规则内容，提供详细的玩法指南
This commit is contained in:
JiaJun
2026-07-09 16:43:52 +08:00
parent 1535cb243b
commit 69cd9a7521
18 changed files with 3071 additions and 1056 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
src/features/game/components/mobile/mobile-withdraw.tsx
View File

@@ -320,9 +320,12 @@ function MobileWithdraw() {
if (
vm.amountRequiredError ||
vm.amountExceedsBalance ||
vm.amountBelowPaymentMinimum ||
vm.amountAbovePaymentMaximum ||
vm.holderNameError ||
vm.bankAccountError ||
vm.paymentChannelCodeError ||
vm.paymentTypeError ||
vm.bankCodeError ||
vm.receiverEmailError ||
vm.receiverPhoneError
@@ -335,6 +338,7 @@ function MobileWithdraw() {
bank_code: vm.bankCode,
channel_code: vm.paymentChannelCode,
idempotency_key: String(Date.now()),
payment_type: vm.paymentType,
receive_account: vm.bankAccount.trim(),
receiver_email: vm.receiverEmail.trim(),
receiver_mobile: vm.receiverPhone.trim(),
@@ -383,6 +387,20 @@ function MobileWithdraw() {
{t('gameDesktop.withdraw.errors.amountExceedsBalance')}
</div>
) : null}
{hasSubmitted && vm.amountBelowPaymentMinimum ? (
<div className="pl-design-2 text-design-10 text-[#F44F4F]">
{t('gameDesktop.withdraw.errors.amountBelowPaymentMinimum', {
amount: vm.paymentMinimumAmountLabel,
})}
</div>
) : null}
{hasSubmitted && vm.amountAbovePaymentMaximum ? (
<div className="pl-design-2 text-design-10 text-[#F44F4F]">
{t('gameDesktop.withdraw.errors.amountAbovePaymentMaximum', {
amount: vm.paymentMaximumAmountLabel,
})}
</div>
) : null}
</WithdrawField>
<div className="grid min-w-0 grid-cols-3 gap-design-5">
@@ -399,31 +417,6 @@ function MobileWithdraw() {
))}
</div>
<WithdrawField
label={t('gameDesktop.withdraw.fields.currencyType')}
>
<Select
value={vm.currencyCode}
onValueChange={vm.setCurrencyCode}
>
<SelectTrigger
className="h-design-30 w-full rounded-[calc(var(--design-unit)*5)] border-[rgba(103,227,239,0.3)] bg-[linear-gradient(180deg,rgba(12,61,72,0.82),rgba(6,28,39,0.9))] px-design-8 text-left !text-design-12 text-[#A5EDF4] shadow-[inset_0_0_calc(var(--design-unit)*10)_rgba(94,237,255,0.08)] data-[size=default]:h-design-30 data-[placeholder]:text-[rgba(109,170,176,0.55)] [&_svg]:h-design-14 [&_svg]:w-design-14 [&_svg]:text-[#79DFEA]"
aria-label={t('gameDesktop.withdraw.currencySelection')}
>
<SelectValue
placeholder={t('gameDesktop.withdraw.selectCurrency')}
/>
</SelectTrigger>
<SelectContent>
{vm.config.currencies.map((option: FinanceCurrencyConfig) => (
<SelectItem key={option.code} value={option.code}>
{option.label}
</SelectItem>
))}
</SelectContent>
</Select>
</WithdrawField>
<WithdrawField
label={t('gameDesktop.withdraw.fields.paymentChannel')}
>
@@ -453,6 +446,72 @@ function MobileWithdraw() {
</div>
</WithdrawField>
<WithdrawField label={t('gameDesktop.withdraw.fields.paymentType')}>
<div className="flex w-full flex-col gap-design-3">
<Select
value={vm.paymentType || undefined}
onValueChange={vm.setPaymentType}
disabled={vm.availablePaymentMethods.length === 0}
>
<SelectTrigger
className={cn(
'h-design-30 w-full rounded-[calc(var(--design-unit)*5)] bg-[linear-gradient(180deg,rgba(12,61,72,0.82),rgba(6,28,39,0.9))] px-design-8 text-left !text-design-12 text-[#A5EDF4] shadow-[inset_0_0_calc(var(--design-unit)*10)_rgba(94,237,255,0.08)] data-[size=default]:h-design-30 data-[placeholder]:text-[rgba(109,170,176,0.55)] [&_svg]:h-design-14 [&_svg]:w-design-14 [&_svg]:text-[#79DFEA]',
hasSubmitted && vm.paymentTypeError
? 'border-[#B93F44]'
: 'border-[rgba(103,227,239,0.3)]',
)}
aria-label={t('gameDesktop.withdraw.fields.paymentType')}
>
<SelectValue
placeholder={t(
'gameDesktop.withdraw.placeholders.paymentType',
)}
/>
</SelectTrigger>
<SelectContent>
{vm.availablePaymentMethods.map((method) => (
<SelectItem key={method.code} value={method.code}>
{method.name}
</SelectItem>
))}
</SelectContent>
</Select>
{hasSubmitted && vm.paymentTypeError ? (
<div className="pl-design-2 text-design-10 text-[#F44F4F]">
{t('gameDesktop.withdraw.errors.paymentTypeRequired')}
</div>
) : null}
</div>
</WithdrawField>
<WithdrawField
label={t('gameDesktop.withdraw.fields.currencyType')}
>
<Select
value={vm.currencyCode || undefined}
onValueChange={vm.setCurrencyCode}
disabled={vm.availableCurrencies.length === 0}
>
<SelectTrigger
className="h-design-30 w-full rounded-[calc(var(--design-unit)*5)] border-[rgba(103,227,239,0.3)] bg-[linear-gradient(180deg,rgba(12,61,72,0.82),rgba(6,28,39,0.9))] px-design-8 text-left !text-design-12 text-[#A5EDF4] shadow-[inset_0_0_calc(var(--design-unit)*10)_rgba(94,237,255,0.08)] data-[size=default]:h-design-30 data-[placeholder]:text-[rgba(109,170,176,0.55)] [&_svg]:h-design-14 [&_svg]:w-design-14 [&_svg]:text-[#79DFEA]"
aria-label={t('gameDesktop.withdraw.currencySelection')}
>
<SelectValue
placeholder={t('gameDesktop.withdraw.selectCurrency')}
/>
</SelectTrigger>
<SelectContent>
{vm.availableCurrencies.map(
(option: FinanceCurrencyConfig) => (
<SelectItem key={option.code} value={option.code}>
{option.label}
</SelectItem>
),
)}
</SelectContent>
</Select>
</WithdrawField>
<WithdrawField label={t('gameDesktop.withdraw.fields.bankCode')}>
<div className="flex w-full flex-col gap-design-3">
<Select