H5-点单：购买

htmldev/dashboard/src/mixin/orderPay.js

@@ -1,6 +1,76 @@
+import { Toast } from 'vant'
+import { platform } from '../utils/platform'
+
 export default {
   data () {
-    return {}
+    return {
+      order_pay_type: 2 // 支付方式(1微信2支付宝)
+    }
   },
-  methods: {}
+  methods: {
+    AFPayBridge (data) {
+      const officialOrderNumber = data.official_order_number
+      // 支付宝支付
+      if (this.order_pay_type === 2) {
+        if (platform.isWeixin) {
+          this.$router.push({ name: 'PayBridge', query: { alipayForm: decodeURIComponent(officialOrderNumber) } })
+        } else {
+          const div = document.createElement('div')
+          div.innerHTML = officialOrderNumber
+          document.body.appendChild(div)
+          document.forms[0].submit()
+        }
+      } else {
+        // 微信支付
+        if (platform.isWeixin) { // 微信内
+          this.weixinPay({
+            ...officialOrderNumber,
+            callback: data.callback
+          })
+        } else if (platform.isAlipay) { // 支付宝内
+          // this.$router.push({ name: 'PayBridge', query: { wxpayHref: '' } })
+          Toast('请使用微信打开')
+        } else {
+          // window.location.replace()
+          Toast('请使用微信打开')
+        }
+      }
+    },
+    async weixinPay (data) {
+      if (typeof WeixinJSBridge === 'undefined') {
+        if (document.addEventListener) {
+          document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(data), false)
+        } else if (document.attachEvent) {
+          document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(data))
+          document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(data))
+        }
+      } else {
+        this.onBridgeReady(data)
+      }
+    },
+    onBridgeReady (data) {
+      /* eslint-disable-next-line */
+      WeixinJSBridge.invoke(
+        'getBrandWCPayRequest',
+        {
+          appId: data.app_id,
+          timeStamp: data.time_stamp,
+          nonceStr: data.nonce_str,
+          package: data.package,
+          signType: data.sign_type,
+          paySign: data.pay_sign
+        },
+        function (res) {
+          /* eslint-disable-next-line */
+          if (res.err_msg == 'get_brand_wcpay_request:ok') {
+            // 使用以上方式判断前端返回,微信团队郑重提示：
+            // res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
+            data.callback && data.callback()
+          } else {
+            Toast.fail('支付失败！')
+          }
+        }
+      )
+    }
+  }
 }

htmldev/dashboard/src/router/index.js

@@ -106,7 +106,7 @@ const routes = [
       {
         path: '',
         name: 'OrderList',
-        component: _import('views/order/list'),
+        component: _import('views/order/list/index'),
         meta: {
           title: '订单',
           isUseCache: false,

htmldev/dashboard/src/views/place/list/index.vue

@@ -161,6 +161,7 @@
 <script>
 import { Tabs, Tab, Icon, Popup, Field, Toast, Button } from 'vant'
 import payment from '../../common/payment'
+import orderPay from '../../../mixin/orderPay'
 import { apiPlaceList, apiPlacePreOrder } from './api'
 import { getCookieValue } from '../../../utils'
 import { platform } from '../../../utils/platform'
@@ -168,6 +169,7 @@ import { mapGetters } from 'vuex'
 
 export default {
   name: 'index',
+  mixins: [orderPay],
   components: {
     'van-tabs': Tabs,
     'van-tab': Tab,
@@ -190,7 +192,6 @@ export default {
       order_user_phone: '', // 订单联系号码
       order_user_name: '', // 订单联系人姓名
       order_user_sex: '先生', // 订单联系人性别
-      order_pay_type: 2, // 支付方式(1微信2支付宝)
       booLock: false,
       booFetch: false
     }
@@ -284,73 +285,19 @@ export default {
         const { status, data, msg } = await apiPlacePreOrder(postData)
         this.booLock = false
         if (status) {
-          const officialOrderNumber = data.official_order_number
-          // 支付宝支付
-          if (this.order_pay_type === 2) {
-            if (platform.isWeixin) {
-              this.$router.push({ name: 'PayBridge', query: { alipayForm: decodeURIComponent(officialOrderNumber) } })
-            } else {
-              const div = document.createElement('div')
-              div.innerHTML = officialOrderNumber
-              document.body.appendChild(div)
-              document.forms[0].submit()
+          this.AFPayBridge({
+            ...data,
+            callback: () => {
+              this.showPopup = false
+              this.$router.push({ name: 'PlaceReserve' })
             }
-          } else {
-            // 微信支付
-            if (platform.isWeixin) { // 微信内
-              this.weixinPay(officialOrderNumber)
-            } else if (platform.isAlipay) { // 支付宝内
-              // this.$router.push({ name: 'PayBridge', query: { wxpayHref: '' } })
-              Toast('请使用微信打开')
-            } else {
-              // window.location.replace()
-              Toast('请使用微信打开')
-            }
-          }
+          })
         } else {
           Toast(msg)
         }
       } catch (err) {
         this.booLock = false
       }
-    },
-    async weixinPay (data) {
-      if (typeof WeixinJSBridge === 'undefined') {
-        if (document.addEventListener) {
-          document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(data), false)
-        } else if (document.attachEvent) {
-          document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(data))
-          document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(data))
-        }
-      } else {
-        this.onBridgeReady(data)
-      }
-    },
-    onBridgeReady (data) {
-      const vm = this
-      /* eslint-disable-next-line */
-      WeixinJSBridge.invoke(
-        'getBrandWCPayRequest',
-        {
-          appId: data.app_id,
-          timeStamp: data.time_stamp,
-          nonceStr: data.nonce_str,
-          package: data.package,
-          signType: data.sign_type,
-          paySign: data.pay_sign
-        },
-        function (res) {
-          /* eslint-disable-next-line */
-          if (res.err_msg == 'get_brand_wcpay_request:ok') {
-            // 使用以上方式判断前端返回,微信团队郑重提示：
-            // res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
-            vm.showPopup = false
-            vm.$router.push({ name: 'PlaceReserve' })
-          } else {
-            Toast.fail('支付失败！')
-          }
-        }
-      )
     }
   }
 }

htmldev/dashboard/src/views/sell/pay/index.vue

@@ -118,11 +118,13 @@
 <script>
 import payment from '../../common/payment'
 import { Button, Popup, Toast, Dialog } from 'vant'
+import orderPay from '../../../mixin/orderPay'
 import { mapGetters } from 'vuex'
 import { apiAdvanceList, apiCouponList, apiAddOrder } from './api'
 
 export default {
   name: 'index',
+  mixins: [orderPay],
   components: {
     payment,
     'van-button': Button,
@@ -130,7 +132,6 @@ export default {
   },
   data () {
     return {
-      order_pay_type: 2,
       advancePopup: false, // 选择预约款弹窗
       advanceList: [], // 预付款列表
       curAdvance: {}, // 当前选择的预付款
@@ -145,11 +146,21 @@ export default {
     ...mapGetters({
       objCurrentBarInfo: 'common/objCurrentBarInfo'
     }),
-    selectFoods () {
-      return this.$store.getters['shopcart/selectFoods']
+    selectFoods: {
+      get () {
+        return this.$store.getters['shopcart/selectFoods']
+      },
+      set (val) {
+        this.$store.commit('shopcart/UPDATE_SELECTFOODS', val)
+      }
     },
-    placeNum () {
-      return this.$store.getters['shopcart/placeNum']
+    placeNum: {
+      get () {
+        return this.$store.getters['shopcart/placeNum']
+      },
+      set (val) {
+        this.$store.commit('shopcart/UPDATE_PLACENUM', val)
+      }
     },
     totalPrice () {
       let total = 0
@@ -240,10 +251,16 @@ export default {
         order_pay_type: this.order_pay_type // 支付方式(1微信2支付宝3现场支付)
       }
       try {
-        const { status, msg } = await apiAddOrder(postData)
+        const { status, msg, data } = await apiAddOrder(postData)
         if (status) {
-          // todo 清除购物车、座位号数据
-          this.$router.replace({ name: 'Order' })
+          this.selectFoods = []
+          this.placeNum = ''
+          this.AFPayBridge({
+            ...data,
+            callback: () => {
+              this.$router.replace({ name: 'OrderList' })
+            }
+          })
         } else {
           Toast(msg)
         }