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

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

@@ -6,8 +6,10 @@ import {CreditCard, 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 MobilePayment(props: PaymentModalProps) {
+  const decoration = getTradeMethodDecoration(props.method)
   const [loading, setLoading] = useState(false) // 加载状态
   const [paymentInitiated, setPaymentInitiated] = useState(false) // 是否已发起支付
 
@@ -54,16 +56,16 @@ export function MobilePayment(props: PaymentModalProps) {
           <div className="flex justify-between">
             <span className="text-gray-600">支付方式</span>
             <div className="flex items-center gap-2">
-              {props.decoration.icon && (
+              {decoration.icon && (
                 <Image
-                  src={props.decoration.icon}
-                  alt={props.decoration.text}
+                  src={decoration.icon}
+                  alt={decoration.text}
                   width={28}
                   height={28}
                   className="rounded-md"
                 />
               )}
-              <span>{props.decoration.text}</span>
+              <span>{decoration.text}</span>
             </div>
           </div>
           <div className="flex justify-between">