支持微信支付宝独立支付渠道

frontend/src/features/orders/views/OrderDetailView.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
-import { ElMessage } from 'element-plus'
+import { computed } from 'vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
 import { ChatDotRound, CopyDocument, Loading } from '@element-plus/icons-vue'
 
 import {
@@ -14,6 +15,7 @@ import { useOrderPaymentCashier } from '@/features/orders/composables/useOrderPa
 import { formatCent } from '@/shared/utils/money'
 import { handoffStatusLabel, orderStatusLabel } from '@/shared/utils/statusLabels'
 import { formatDateTime } from '@/shared/utils/time'
+import type { PaymentPayWay } from '@/features/orders/api/orders'
 
 // 支付收银台：二维码渲染 + 轮询查询。PC 不做 App 浏览器跳转，直接渲染二维码弹窗。
 const cashier = useOrderPaymentCashier({
@@ -88,6 +90,7 @@ const {
   notifyWarning: message => ElMessage.warning(message),
   confirm: async () => true, // PC 不做二次确认，直接放行。
   actionsNeedingConfirm: [],
+  selectPayWay,
   ordersPath: '/orders',
   chatPathPrefix: '/messages/',
   startCashier: (payment, onPaid) => cashier.openPaymentCashier(payment, onPaid),
@@ -100,6 +103,34 @@ const paymentQRCodeURL = cashier.paymentQRCodeURL
 const qrGenerating = cashier.qrGenerating
 const checkingPayment = cashier.checkingPayment
 const paymentPayURL = cashier.payURL
+const activePayWayLabel = computedPayWayLabel(activePayment)
+
+// selectPayWay 在创建支付单前让用户选择支付宝或微信。
+async function selectPayWay(): Promise<PaymentPayWay | null> {
+  try {
+    await ElMessageBox.confirm('选择后将生成对应渠道的支付二维码。', '选择支付方式', {
+      type: 'info',
+      confirmButtonText: '支付宝支付',
+      cancelButtonText: '微信支付',
+      distinguishCancelAndClose: true,
+      closeOnClickModal: false,
+    })
+    return 'ZFBZF'
+  } catch (action) {
+    return action === 'cancel' ? 'WXZF' : null
+  }
+}
+
+// computedPayWayLabel 根据当前支付单展示支付方式名称。
+function computedPayWayLabel(paymentRef: typeof activePayment) {
+  return computed(() => {
+    const map: Record<string, string> = {
+      ZFBZF: '支付宝',
+      WXZF: '微信',
+    }
+    return map[paymentRef.value?.pay_way || ''] || '当前方式'
+  })
+}
 function handleRefreshPayment() {
   void cashier.refreshPaymentStatus(false)
 }
@@ -594,7 +625,7 @@ async function copyListingCode() {
             <img v-else-if="paymentQRCodeURL" :src="paymentQRCodeURL" alt="支付二维码" />
           </div>
           <div class="pay-instructions">
-            <h3>请使用微信或支付宝扫码支付</h3>
+            <h3>请使用{{ activePayWayLabel }}扫码支付</h3>
             <p>扫码完成后将自动刷新，也可手动点击下方按钮确认。</p>
           </div>
         </div>