Explorar el Código

修复在上传高清图之后支付方法重置的问题,支付总额增加失焦更新

Yannay hace 2 semanas
padre
commit
b4a7af59fb
Se han modificado 1 ficheros con 25 adiciones y 11 borrados
  1. 25 11
      pages/orderDetailRefactored/components/PageThree.vue

+ 25 - 11
pages/orderDetailRefactored/components/PageThree.vue

@@ -99,7 +99,8 @@
99 99
         <view class="payment-total-container">
100 100
           <text class="payment-label">支付总额</text>
101 101
           <view class="payment-amount-wrap">
102
-            <u-input v-model="paymentAmount" class="payment-amount" type="number" decimal="2" prefix="¥" />
102
+            <u-input v-model="paymentAmount" class="payment-amount" type="number" decimal="2" prefix="¥"
103
+              @blur="handlePaymentAmountBlur" />
103 104
           </view>
104 105
           <view class="pay-now-btn-wrap">
105 106
           <u-button type="primary" shape="circle" plain text="立即支付" size="small" @click="handlePayNowClick"></u-button>
@@ -280,15 +281,20 @@ export default {
280 281
     currentReceipt: {
281 282
       handler(newVal, oldVal) {
282 283
         if (newVal) {
283
-          this.paymentAmount = newVal.tableFee || '0.00'
284
-          // 从回单表 receiptForm 回填支付信息(与 PC 端一致)
285
-          this.paymentInfo.customName = newVal.customName || ''
286
-          this.paymentInfo.bankName = newVal.bankName || ''
287
-          this.paymentInfo.bankAccount = newVal.bankCardNumber || ''
288
-          this.paymentInfo.idNumber = newVal.idCard || ''
289
-          this.initPaymentMethod(newVal.paymentMethod)
284
+          //是为了修复一个问题,当上传高清图片时,支付方式会被重置,这里是为了避免这个问题
285
+          // 仅当回单 id 变化时(切换了回单)才从 receipt 回填表单,避免上传图片等只更新 fileIds 时触发 watch 导致支付方式被重置
286
+          const receiptIdChanged = !oldVal || oldVal.id !== newVal.id
287
+          if (receiptIdChanged) {
288
+            this.paymentAmount = newVal.tableFee || '0.00'
289
+            // 从回单表 receiptForm 回填支付信息(与 PC 端一致)
290
+            this.paymentInfo.customName = newVal.customName || ''
291
+            this.paymentInfo.bankName = newVal.bankName || ''
292
+            this.paymentInfo.bankAccount = newVal.bankCardNumber || ''
293
+            this.paymentInfo.idNumber = newVal.idCard || ''
294
+            this.initPaymentMethod(newVal.paymentMethod)
295
+          }
290 296
           // 只有当 receipt id 变化时才重新加载图片,避免 fileIds 更新时重新加载
291
-          if (!oldVal || oldVal.id !== newVal.id) {
297
+          if (receiptIdChanged) {
292 298
             this.loadDetailImages()
293 299
           }
294 300
         }
@@ -385,7 +391,7 @@ export default {
385 391
     },
386 392
 
387 393
     /**
388
-     * 失焦后保存支付信息(开户人/银行名称/账号/身份证)
394
+     * 失焦后保存支付信息(开户人/银行名称/账号/身份证/支付总额
389 395
      */
390 396
     async savePaymentInfoOnBlur() {
391 397
       if (!this.currentReceipt || !this.currentReceipt.id) return
@@ -396,7 +402,8 @@ export default {
396 402
           customName: this.paymentInfo.customName || '',
397 403
           bankName: this.paymentInfo.bankName || '',
398 404
           bankCardNumber: this.paymentInfo.bankAccount || '',
399
-          idCard: this.paymentInfo.idNumber || ''
405
+          idCard: this.paymentInfo.idNumber || '',
406
+          tableFee: this.paymentAmount || '0.00'
400 407
         })
401 408
       } catch (e) {
402 409
         console.error('保存支付信息失败:', e)
@@ -446,6 +453,13 @@ export default {
446 453
     },
447 454
 
448 455
     /**
456
+     * 支付总额失焦保存
457
+     */
458
+    async handlePaymentAmountBlur() {
459
+      this.savePaymentInfoOnBlur()
460
+    },
461
+
462
+    /**
449 463
      * 获取图片类型
450 464
      */
451 465
     getImageType(index) {