web/src/components/composites/payment/payment-modal.tsx

'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'
import {toast} from 'sonner'
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 || '请求失败')
      }
      if (res.data.status === 1) {
        toast.success('已支付成功！')
      }
    }
    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>
  )
}