支付组件统一使用二维码展示

src/components/composites/payment/desktop-payment.tsx

@@ -5,8 +5,10 @@ import {Loader} from 'lucide-react'
 import {useState} from 'react'
 import Image from 'next/image'
 import {PaymentModalProps} from './payment-modal'
+import {getTradeMethodDecoration} from '@/lib/models/trade'
 
 export function DesktopPayment(props: PaymentModalProps) {
+  const decoration = getTradeMethodDecoration(props.method)
   const [loading, setLoading] = useState(false)
 
   const onSubmit = async () => {
@@ -19,10 +21,10 @@ export function DesktopPayment(props: PaymentModalProps) {
     <DialogContent>
       <DialogHeader>
         <DialogTitle className="flex gap-2 items-center">
-          {props.decoration.icon ? (
+          {decoration.icon ? (
             <Image
-              src={props.decoration.icon}
-              alt={props.decoration.text}
+              src={decoration.icon}
+              alt={decoration.text}
               width={24}
               height={24}
               className="rounded-md"
@@ -30,7 +32,7 @@ export function DesktopPayment(props: PaymentModalProps) {
           ) : (
             <div className="w-6 h-6 bg-gray-200 rounded-full"/>
           )}
-          <span>{props.decoration.text}</span>
+          <span>{decoration.text}</span>
         </DialogTitle>
       </DialogHeader>
 
@@ -43,7 +45,7 @@ export function DesktopPayment(props: PaymentModalProps) {
         />
         <p className="text-sm text-gray-600">
           请使用
-          {props.decoration.text}
+          {decoration.text}
           扫码支付
         </p>