座位预定-创建订单：支付方式选择

htmldev/dashboard/src/router/index.js

@@ -20,7 +20,7 @@ const routes = [
   },
   {
     path: '/',
-    name: 'index',
+    name: 'Index',
     component: _import('views/index/index'),
     meta: {
       isUseVanTabbar: true
@@ -28,7 +28,7 @@ const routes = [
   },
   {
     path: '/login',
-    name: 'login',
+    name: 'Login',
     component: _import('login/index'),
     meta: {
       title: '登录',
@@ -67,6 +67,21 @@ const routes = [
       keepAlive: false,
       isUseVanTabbar: false
     }
+  },
+  {
+    path: '/payBridge',
+    name: 'PayBridge',
+    component: _import('views/payBridge/index'),
+    meta: {
+      title: '支付方式',
+      isUseCache: false,
+      keepAlive: false,
+      isUseVanTabbar: false
+    },
+    props: route => ({
+      alipayForm: route.query.alipayForm,
+      wxpayHref: route.query.wxpayHref
+    })
   }
 ]
 

htmldev/dashboard/src/views/payBridge/index.vue

@@ -0,0 +1,54 @@
+<template>
+  <div>
+    <img class="help" src="./image/help.jpeg" alt="" v-show="booHelp">
+  </div>
+</template>
+
+<script>
+import { platform } from '../../utils/platform'
+
+export default {
+  name: 'index',
+  props: {
+    alipayForm: {
+      type: String,
+      default: ''
+    },
+    wxpayHref: {
+      type: String,
+      default: ''
+    }
+  },
+  data () {
+    return {
+      booHelp: true
+    }
+  },
+  async mounted () {
+    await this.$nextTick()
+    if (!platform.isWeixin && this.alipayForm) {
+      const div = document.createElement('div')
+      div.innerHTML = decodeURIComponent(this.alipayForm)
+      document.body.appendChild(div)
+      document.forms[0].submit()
+      this.booHelp = false
+    }
+    if (!(platform.isAlipay && platform.isWeixin) && this.wxpayHref) {
+      location.replace(decodeURIComponent(this.wxpayHref))
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+div {
+  width: 100%;
+  height: 100vh;
+  background: #fff;
+
+  .help {
+    display: block;
+    height: 180px;
+  }
+}
+</style>

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

@@ -127,8 +127,7 @@
                 :key="'b' + index">{{ str }}</span>
             </p>
             <!--支付宝、微信环境不显示-->
-            <div class="payment-type"
-                 v-if="!(platform.isWeixin || platform.isAlipay)">
+            <div class="payment-type">
               <p :class="{'active': order_pay_type === 2}"
                  @click="order_pay_type = 2">
                 <img
@@ -281,7 +280,7 @@ export default {
     },
     handleShowPopup (place, week) {
       if (!(this.phone && this.token)) {
-        this.$router.push({ name: 'login' })
+        this.$router.push({ name: 'Login' })
         return
       }
       // 座位被定完了
@@ -323,14 +322,20 @@ export default {
           const officialOrderNumber = data.official_order_number
           // 支付宝支付
           if (this.order_pay_type === 2) {
-            const div = document.createElement('div')
-            div.innerHTML = officialOrderNumber
-            document.body.appendChild(div)
-            document.forms[0].submit()
+            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) {
+            if (platform.isWeixin) { // 微信内
               this.weixinPay()
+            } else if (platform.isAlipay) { // 支付宝内
+              this.$router.push({ name: 'PayBridge', query: { wxpayHref: '' } })
             } else {
               // window.location.replace()
             }