76 lines
1.9 KiB
TypeScript
76 lines
1.9 KiB
TypeScript
'use client'
|
|
import {MobilePayment} from './mobile-payment'
|
|
import {DesktopPayment} from './desktop-payment'
|
|
import {TradePlatform} from '@/lib/models/trade'
|
|
import {Dialog} from '@/components/ui/dialog'
|
|
import {PaymentProps} from './type'
|
|
import {payClose} from '@/actions/resource'
|
|
import {useEffect} from 'react'
|
|
import {UniversalDesktopPayment} from './universal-desktop-payment'
|
|
import {useAppStore} from '@/components/stores/app'
|
|
|
|
export type PaymentModalProps = {
|
|
onConfirm: (showFail: boolean) => Promise<void>
|
|
onClose: () => void
|
|
} & PaymentProps
|
|
|
|
export function PaymentModal(props: PaymentModalProps) {
|
|
// 手动关闭时的处理
|
|
const handleClose = async () => {
|
|
try {
|
|
const res = await payClose({
|
|
trade_no: props.inner_no,
|
|
method: props.method,
|
|
})
|
|
if (!res.success) {
|
|
throw new Error(res.message)
|
|
}
|
|
}
|
|
catch (error) {
|
|
console.error('关闭订单失败:', error)
|
|
}
|
|
finally {
|
|
props.onClose?.()
|
|
}
|
|
}
|
|
|
|
// SSE处理方式检查支付状态
|
|
const apiUrl = useAppStore('apiUrl')
|
|
useEffect(() => {
|
|
const eventSource = new EventSource(
|
|
`${apiUrl}/api/trade/check?trade_no=${props.inner_no}&method=${props.method}`,
|
|
)
|
|
eventSource.onmessage = async (event) => {
|
|
switch (event.data) {
|
|
case '1':
|
|
props.onConfirm?.(true)
|
|
case '2':
|
|
props.onClose?.()
|
|
}
|
|
}
|
|
eventSource.onerror = (error) => {
|
|
console.error('SSE 连接错误:', error)
|
|
}
|
|
|
|
return () => {
|
|
eventSource.close()
|
|
}
|
|
}, [apiUrl, props])
|
|
|
|
return (
|
|
<Dialog
|
|
defaultOpen={true}
|
|
onOpenChange={(open) => {
|
|
if (!open) handleClose()
|
|
}}>
|
|
|
|
{props.platform === TradePlatform.Mobile
|
|
? <MobilePayment {...props} onClose={handleClose}/>
|
|
: <DesktopPayment {...props} onClose={handleClose}/>
|
|
}
|
|
|
|
{/* <UniversalDesktopPayment {...props} onClose={handleClose}/> */}
|
|
</Dialog>
|
|
)
|
|
}
|