fix: 收银台金额和二维码修复-提取payment_url用于二维码和支付链接

frontend/src/views/user/Checkout.vue

@@ -21,28 +21,30 @@
 
       <div class="amount-section">
         <div class="amount-label">支付金额</div>
-        <div class="amount-value">{{ paymentInfo.actual_amount }} <small>USDT</small></div>
-        <div class="amount-cny">≈ ¥{{ paymentInfo.amount }}</div>
+        <div class="amount-value">{{ paymentInfo.actual_amount || paymentInfo.amount }} <small>USDT</small></div>
+        <div class="amount-cny">订单金额：¥{{ orderAmount }}</div>
       </div>
 
-      <div class="address-section">
-        <div class="address-label">收款地址</div>
+      <div class="address-section" v-if="paymentInfo.payment_url">
+        <div class="address-label">支付链接</div>
         <div class="address-box">
-          <span class="address-text">{{ paymentInfo.token }}</span>
-          <el-button type="primary" size="small" @click="copyAddress">复制</el-button>
+          <span class="address-text">{{ paymentInfo.payment_url }}</span>
+          <el-button type="primary" size="small" @click="copyText(paymentInfo.payment_url)">复制</el-button>
         </div>
+        <el-button type="success" size="small" class="open-link-btn" @click="openPaymentUrl">打开支付页面</el-button>
       </div>
 
-      <div class="qr-section">
+      <div class="qr-section" v-if="paymentInfo.payment_url">
         <div class="qr-label">扫码支付</div>
         <div class="qr-wrapper">
           <canvas ref="qrCanvas"></canvas>
         </div>
+        <div class="qr-tip">请使用手机浏览器扫码打开支付页面</div>
       </div>
 
       <div class="tips">
         <p>1. 请使用 {{ paymentInfo.trade_type?.toUpperCase() }} 网络转账</p>
-        <p>2. 请准确转账 <strong>{{ paymentInfo.actual_amount }} USDT</strong></p>
+        <p>2. 请准确转账 <strong>{{ paymentInfo.actual_amount || paymentInfo.amount }} USDT</strong></p>
         <p>3. 转账后系统会自动确认，无需手动操作</p>
       </div>
 
@@ -84,6 +86,7 @@ const paymentInfo = ref<any>(null)
 const paymentError = ref('')
 const remaining = ref(0)
 const totalTime = ref(0)
+const orderAmount = ref(0)
 let pollTimer: any = null
 let countdownTimer: any = null
 
@@ -95,11 +98,16 @@ async function createPayment() {
     totalTime.value = res.data.expiration_time || 600
     remaining.value = totalTime.value
 
-    await QRCode.toCanvas(qrCanvas.value, res.data.token, {
-      width: 180,
-      margin: 2,
-      color: { dark: '#000', light: '#fff' }
-    })
+    const orderRes: any = await orderApi.getById(orderId)
+    orderAmount.value = orderRes.data?.total_amount || 0
+
+    if (qrCanvas.value && res.data.payment_url) {
+      await QRCode.toCanvas(qrCanvas.value, res.data.payment_url, {
+        width: 180,
+        margin: 2,
+        color: { dark: '#000', light: '#fff' }
+      })
+    }
 
     startCountdown()
     startPolling()
@@ -133,10 +141,14 @@ function startPolling() {
   }, 5000)
 }
 
-function copyAddress() {
-  if (paymentInfo.value?.token) {
-    navigator.clipboard.writeText(paymentInfo.value.token)
-    ElMessage.success('地址已复制')
+function copyText(text: string) {
+  navigator.clipboard.writeText(text)
+  ElMessage.success('已复制')
+}
+
+function openPaymentUrl() {
+  if (paymentInfo.value?.payment_url) {
+    window.open(paymentInfo.value.payment_url, '_blank')
   }
 }
 
@@ -287,6 +299,17 @@ onUnmounted(() => {
     padding: 12px;
     display: inline-block;
   }
+
+  .qr-tip {
+    font-size: 12px;
+    color: rgba(255, 255, 255, 0.4);
+    margin-top: 8px;
+  }
+}
+
+.open-link-btn {
+  margin-top: 8px;
+  width: 100%;
 }
 
 .tips {