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

style: 统一代码格式 (prettier)

Browse Source
This commit is contained in:
erio
2026-03-10 18:20:36 +08:00
parent abff49222b
commit 9f621713c3
31 changed files with 631 additions and 406 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
src/components/PaymentQRCode.tsx
View File

@@ -4,12 +4,7 @@ import { useEffect, useMemo, useState, useCallback, useRef } from 'react';
import QRCode from 'qrcode';
import type { Locale } from '@/lib/locale';
import type { PublicOrderStatusSnapshot } from '@/lib/order/status';
import {
isStripeType,
getPaymentMeta,
getPaymentIconSrc,
getPaymentChannelLabel,
} from '@/lib/pay-utils';
import { isStripeType, getPaymentMeta, getPaymentIconSrc, getPaymentChannelLabel } from '@/lib/pay-utils';
import { buildOrderStatusUrl } from '@/lib/order/status-url';
import { TERMINAL_STATUSES } from '@/lib/constants';
@@ -84,24 +79,38 @@ export default function PaymentQRCode({
scanPay: locale === 'en' ? 'Please scan with your payment app' : '请使用支付应用扫码支付',
back: locale === 'en' ? 'Back' : '返回',
cancelOrder: locale === 'en' ? 'Cancel Order' : '取消订单',
h5Hint: locale === 'en' ? 'After payment, please return to this page. The system will confirm automatically.' : '支付完成后请返回此页面，系统将自动确认',
h5Hint:
locale === 'en'
? 'After payment, please return to this page. The system will confirm automatically.'
: '支付完成后请返回此页面，系统将自动确认',
paid: locale === 'en' ? 'Order Paid' : '订单已支付',
paidCancelBlocked:
locale === 'en' ? 'This order has already been paid and cannot be cancelled. The recharge will be credited automatically.' : '该订单已支付完成，无法取消。充值将自动到账。',
locale === 'en'
? 'This order has already been paid and cannot be cancelled. The recharge will be credited automatically.'
: '该订单已支付完成，无法取消。充值将自动到账。',
backToRecharge: locale === 'en' ? 'Back to Recharge' : '返回充值',
credited: locale === 'en' ? 'Credited ¥' : '到账 ¥',
stripeLoadFailed: locale === 'en' ? 'Failed to load payment component. Please refresh and try again.' : '支付组件加载失败，请刷新页面重试',
initFailed: locale === 'en' ? 'Payment initialization failed. Please go back and try again.' : '支付初始化失败，请返回重试',
stripeLoadFailed:
locale === 'en'
? 'Failed to load payment component. Please refresh and try again.'
: '支付组件加载失败，请刷新页面重试',
initFailed:
locale === 'en' ? 'Payment initialization failed. Please go back and try again.' : '支付初始化失败，请返回重试',
loadingForm: locale === 'en' ? 'Loading payment form...' : '正在加载支付表单...',
payFailed: locale === 'en' ? 'Payment failed. Please try again.' : '支付失败，请重试',
successProcessing: locale === 'en' ? 'Payment successful, processing your order...' : '支付成功，正在处理订单...',
processing: locale === 'en' ? 'Processing...' : '处理中...',
payNow: locale === 'en' ? 'Pay' : '支付',
popupBlocked:
locale === 'en' ? 'Popup was blocked by your browser. Please allow popups for this site and try again.' : '弹出窗口被浏览器拦截，请允许本站弹出窗口后重试',
locale === 'en'
? 'Popup was blocked by your browser. Please allow popups for this site and try again.'
: '弹出窗口被浏览器拦截，请允许本站弹出窗口后重试',
redirectingPrefix: locale === 'en' ? 'Redirecting to ' : '正在跳转到',
redirectingSuffix: locale === 'en' ? '...' : '...',
redirectRetryHint: locale === 'en' ? 'If the payment app does not open automatically, go back and try again.' : '如未自动拉起支付应用，请返回上一页后重新发起支付。',
redirectRetryHint:
locale === 'en'
? 'If the payment app does not open automatically, go back and try again.'
: '如未自动拉起支付应用，请返回上一页后重新发起支付。',
notRedirectedPrefix: locale === 'en' ? 'Not redirected? Open ' : '未跳转？点击前往',
goPaySuffix: locale === 'en' ? '' : '',
gotoPrefix: locale === 'en' ? 'Open ' : '前往',
@@ -327,8 +336,7 @@ export default function PaymentQRCode({
onStatusChange(data);
}
}
} catch {
}
} catch {}
}, [orderId, onStatusChange, statusAccessToken]);
useEffect(() => {
@@ -372,8 +380,7 @@ export default function PaymentQRCode({
} else {
await pollStatus();
}
} catch {
}
} catch {}
};
const meta = getPaymentMeta(paymentType || 'alipay');
@@ -412,7 +419,9 @@ export default function PaymentQRCode({
{amount.toFixed(2)}
</div>
)}
<div className={`mt-1 text-sm ${expired ? 'text-red-500' : !expired && timeLeftSeconds <= 60 ? 'text-red-500 animate-pulse' : dark ? 'text-slate-400' : 'text-gray-500'}`}>
<div
className={`mt-1 text-sm ${expired ? 'text-red-500' : !expired && timeLeftSeconds <= 60 ? 'text-red-500 animate-pulse' : dark ? 'text-slate-400' : 'text-gray-500'}`}
>
{expired ? t.expired : `${t.remaining}: ${timeLeft}`}
</div>
</div>
@@ -428,9 +437,7 @@ export default function PaymentQRCode({
dark ? 'border-slate-700' : 'border-gray-300',
].join(' ')}
>
<p className={['text-sm', dark ? 'text-slate-400' : 'text-gray-500'].join(' ')}>
{t.initFailed}
</p>
<p className={['text-sm', dark ? 'text-slate-400' : 'text-gray-500'].join(' ')}>{t.initFailed}</p>
</div>
) : !stripeLoaded ? (
<div className="flex items-center justify-center py-8">
@@ -440,10 +447,14 @@ export default function PaymentQRCode({
</span>
</div>
) : stripeError && !stripeLib ? (
<div className={[
'rounded-lg border p-3 text-sm',
dark ? 'border-red-700 bg-red-900/30 text-red-400' : 'border-red-200 bg-red-50 text-red-600',
].join(' ')}>{stripeError}</div>
<div
className={[
'rounded-lg border p-3 text-sm',
dark ? 'border-red-700 bg-red-900/30 text-red-400' : 'border-red-200 bg-red-50 text-red-600',
].join(' ')}
>
{stripeError}
</div>
) : (
<>
<div
@@ -472,9 +483,7 @@ export default function PaymentQRCode({
onClick={handleStripeSubmit}
className={[
'w-full rounded-lg py-3 font-medium text-white shadow-md transition-colors',
stripeSubmitting
? 'cursor-not-allowed bg-gray-400'
: meta.buttonClass,
stripeSubmitting ? 'cursor-not-allowed bg-gray-400' : meta.buttonClass,
].join(' ')}
>
{stripeSubmitting ? (
@@ -505,7 +514,10 @@ export default function PaymentQRCode({
) : shouldAutoRedirect ? (
<>
<div className="flex items-center justify-center py-6">
<div className={`h-8 w-8 animate-spin rounded-full border-2 border-t-transparent`} style={{ borderColor: meta.color, borderTopColor: 'transparent' }} />
<div
className={`h-8 w-8 animate-spin rounded-full border-2 border-t-transparent`}
style={{ borderColor: meta.color, borderTopColor: 'transparent' }}
/>
<span className={['ml-3 text-sm', dark ? 'text-slate-400' : 'text-gray-500'].join(' ')}>
{`${t.redirectingPrefix}${channelLabel}${t.redirectingSuffix}`}
</span>
@@ -517,11 +529,11 @@ export default function PaymentQRCode({
className={`flex w-full items-center justify-center gap-2 rounded-lg py-3 font-medium text-white shadow-md ${meta.buttonClass}`}
>
{iconSrc && <img src={iconSrc} alt={channelLabel} className="h-5 w-5 brightness-0 invert" />}
{redirected ? `${t.notRedirectedPrefix}${channelLabel}` : `${t.gotoPrefix}${channelLabel}${t.gotoSuffix}`}
{redirected
? `${t.notRedirectedPrefix}${channelLabel}`
: `${t.gotoPrefix}${channelLabel}${t.gotoSuffix}`}
</a>
<p className={['text-center text-sm', dark ? 'text-slate-400' : 'text-gray-500'].join(' ')}>
{t.h5Hint}
</p>
<p className={['text-center text-sm', dark ? 'text-slate-400' : 'text-gray-500'].join(' ')}>{t.h5Hint}</p>
</>
) : (
<>
@@ -584,9 +596,7 @@ export default function PaymentQRCode({
onClick={handleCancel}
className={[
'flex-1 rounded-lg border py-2 text-sm',
dark
? 'border-red-700 text-red-400 hover:bg-red-900/30'
: 'border-red-300 text-red-600 hover:bg-red-50',
dark ? 'border-red-700 text-red-400 hover:bg-red-900/30' : 'border-red-300 text-red-600 hover:bg-red-50',
].join(' ')}
>
{t.cancelOrder}