优化支付逻辑

src/api/order.js

@@ -38,9 +38,9 @@ export function orderH5pay(data) {
   })
 }
 
-export function testPayNotify(orderId) {
+export function searchResult(orderId) {
   return request({
-    url: '/order/testPayNotify/' + orderId,
+    url: '/order/searchResult/' + orderId + '?t=' + new Date().getTime(),
     method: 'get'
   })
 }

src/views/order/confirm/modules/ListItem.vue

@@ -50,13 +50,17 @@
 <script>
 import { getCheckedGoods } from '@/api/cart'
 import { mapGetters } from 'vuex'
-import { submit } from '@/api/order'
+import { submit, searchResult } from '@/api/order'
 export default {
   data() {
     return {
       message: '',
       amount: 0,
-      goodsList: []
+      goodsList: [],
+      orderSn: undefined,
+      actualPrice: 0,
+      retryCount: 3, // 查询订单结果次数
+      retryInterval: 1500 // 查询间隔
     }
   },
   computed: {
@@ -86,20 +90,44 @@ export default {
       })
       const message = this.message
       const userId = this.id
+      this.$toast.loading({
+        duration: 0, // 持续展示 toast
+        forbidClick: true,
+        message: '下单中，请稍后'
+      })
       submit({ cartIdArr, addressId, userId, message }).then((res) => {
         const { orderSn, actualPrice } = res.map
+        this.orderSn = orderSn
+        this.actualPrice = actualPrice
+        this.searchResult()
+      })
+    },
+    async searchResult() {
+      try {
+        await searchResult(this.orderSn)
+        this.$toast.clear()
         this.$router.push({
           name: 'OrderPay',
-          params: { orderSn, actualPrice }
+          params: { orderSn: this.orderSn, actualPrice: this.actualPrice }
         })
-      })
+      } catch (error) {
+        console.log('下单失败', error)
+        setTimeout(async() => {
+          this.retryCount--
+          if (this.retryCount > 0) {
+            await this.searchResult(this.orderSn)
+          } else {
+            this.$toast.fail('抱歉，创建订单失败！')
+          }
+        }, this.retryInterval)
+      }
     }
   }
 }
 </script>
 
 <style lang="scss" scoped>
-@import "@/styles/variables.scss";
+@import '@/styles/variables.scss';
 
 .list-item {
   box-sizing: border-box;

src/views/order/pay/index.vue

@@ -53,11 +53,7 @@
 </template>
 
 <script>
-import {
-  orderPrepay,
-  orderH5pay,
-  testPayNotify
-} from '@/api/order'
+import { orderPrepay, orderH5pay } from '@/api/order'
 import _ from 'lodash'
 import { getLocalStorage, setLocalStorage } from '@/utils/localStorage'
 
@@ -68,9 +64,7 @@ export default {
     return {
       payWay: 'ali',
       orderSn: undefined,
-      actualPrice: 0,
-      retryCount: 3,
-      retryInterval: 1500
+      actualPrice: 0
     }
   },
   created() {
@@ -90,8 +84,9 @@ export default {
           if (this.payWay === 'wx') {
             const ua = navigator.userAgent.toLowerCase()
             const isWeixin = ua.indexOf('micromessenger') !== -1
+            // JSAPI调起支付API
             if (isWeixin) {
-              orderPrepay({ orderSn: this.orderSn })
+              orderPrepay({ orderSn: this.orderSn, payType: 1 })
                 .then((res) => {
                   const data = res.map.result
                   const prepayData = JSON.stringify({
@@ -128,14 +123,15 @@ export default {
                 .catch((err) => {
                   this.$dialog.alert({ message: err.map.msg })
                   this.$router.replace({
-                    name: 'paymentStatus',
+                    name: 'PayStatus',
                     params: {
                       status: 'failed'
                     }
                   })
                 })
             } else {
-              orderH5pay({ orderSn: this.orderSn })
+              // h5支付
+              orderH5pay({ orderSn: this.orderSn, payType: 1 })
                 .then((res) => {
                   const data = res.map.data
                   window.location.replace(
@@ -167,35 +163,27 @@ export default {
               forbidClick: true,
               message: '支付中，请稍后'
             })
-            this.testPayNotify()
-          }
-        })
-    },
-    async testPayNotify() {
-      try {
-        await testPayNotify(this.orderSn)
-        this.$toast.clear()
-        this.$router.replace({
-          name: 'PayStatus',
-          params: {
-            status: 'success'
+            orderH5pay({ orderSn: this.orderSn, payType: 2 })
+              .then((res) => {
+                this.$toast.clear()
+                this.$router.replace({
+                  name: 'PayStatus',
+                  params: {
+                    status: 'success'
+                  }
+                })
+              })
+              .catch((err) => {
+                console.log(err)
+                this.$router.replace({
+                  name: 'PayStatus',
+                  params: {
+                    status: 'failed'
+                  }
+                })
+              })
           }
         })
-      } catch (error) {
-        setTimeout(async() => {
-          this.retryCount--
-          if (this.retryCount > 0) {
-            await this.testPayNotify()
-          } else {
-            this.$router.replace({
-              name: 'PayStatus',
-              params: {
-                status: 'failed'
-              }
-            })
-          }
-        }, this.retryInterval)
-      }
     },
     onBridgeReady() {
       const that = this
@@ -208,21 +196,21 @@ export default {
           console.log(res)
           if (res.err_msg === 'get_brand_wcpay_request:ok') {
             that.$router.replace({
-              name: 'paymentStatus',
+              name: 'PayStatus',
               params: {
                 status: 'success'
               }
             })
           } else if (res.err_msg === 'get_brand_wcpay_request:cancel') {
             that.$router.replace({
-              name: 'paymentStatus',
+              name: 'PayStatus',
               params: {
                 status: 'cancel'
               }
             })
           } else {
             that.$router.replace({
-              name: 'paymentStatus',
+              name: 'PayStatus',
               params: {
                 status: 'failed'
               }