支付

src/action/ArticleAction.js

@@ -12,4 +12,6 @@ export default class ArticleAction {
   getUserInfo (obj) { return articleApi.getUserInfo(obj).then(res => res) }
   getFormDetail () { return articleApi.getFormDetail().then(res => res) }
   getOrder (obj) { return articleApi.getOrder(obj).then(res => res) }
+  checkPay (id) { return articleApi.checkPay(id).then(res => res) }
+  payEnd (obj) { return articleApi.getOrder(obj).then(res => res) }
 }

src/api/article_api.js

@@ -23,4 +23,8 @@ export default class ScoreAPI extends BaseAPI {
   getFormDetail = () => this.get('/api/microservices/api/v3/apply/teacher-form-detail')
   // 下单
   getOrder = (obj = {}) => this.post('/api/microservices/api/v3/apply/unified-order', obj)
+  // 查看订单状态
+  checkPay = (id) => this.get(`/api/pay/v1/order/status/${id}`)
+  // 支付完成通知
+  payEnd = (obj = {}) => this.post('/api/microservices/api/v3/apply/pay-end', obj)
 }

src/pages/train/components/payPop.vue

@@ -13,11 +13,11 @@
       <div class="tips-top">
         <div class="name">支付方式：</div>
         <div class="pay-method">
-          <div :class="payMethod === 2 ? 'li active' : 'li'" @click="tabPayMethod(2)">
+          <div :class="payMethod == 2 ? 'li active' : 'li'" @click="tabPayMethod(2)">
             <div class="icon"></div>
             <div class="pay-text">支付宝支付</div>
           </div>
-          <div :class="payMethod === 1 ? 'li active' : 'li'" @click="tabPayMethod(1)">
+          <div :class="payMethod == 1 ? 'li active' : 'li'" @click="tabPayMethod(1)">
             <div class="icon"></div>
             <div class="pay-text">微信支付</div>
           </div>
@@ -27,13 +27,13 @@
       <div class="tips-text">注：请核对报名表信息，支付后将不能修改报名信息。</div>
     </div>
     <div class="content-box ewm-code" v-if="isCodeShow">
-      <i class="el-icon-close" @click="$emit('closePayPop')"></i>
-      <div class="title">{{ payMethod ? '微信支付' : '支付宝支付' }}</div>
+      <i class="el-icon-close" @click="closeClear"></i>
+      <div class="title">{{ payMethod == 1 ? '微信支付' : '支付宝支付' }}</div>
       <div class="ewm-box">
         <div class="block">
           <qrcode-vue :value="payInfo.url" size="200"></qrcode-vue>
         </div>
-        <div class="text">微信扫一扫支付</div>
+        <div class="text">{{ payMethod == 1 ? '微信' : '支付宝' }}扫一扫支付</div>
       </div>
     </div>
   </div>
@@ -55,7 +55,8 @@ export default {
       payMethod: 2,
       isCodeShow: false,
       product_id: '6734697826573352960',
-      payInfo: {}
+      payInfo: {},
+      time: null
     }
   },
   methods: {
@@ -66,7 +67,7 @@ export default {
       const param = {
         pay_type: this.payMethod,
         product_id: this.product_id,
-        form_id: this.formData.id.toString()
+        form_id: this.formData.id && this.formData.id.toString()
       }
       const loading = this.$loading({
         lock: true,
@@ -74,11 +75,14 @@ export default {
         spinner: 'el-icon-loading',
         background: 'rgba(0, 0, 0, 0.7)'
       })
-      console.log(param)
       action.articleAction.getOrder(param).then(res => {
         if (res.code === 200) {
           this.payInfo = res.data
           this.isCodeShow = true
+          clearInterval(this.time)
+          this.time = setInterval(() => {
+            this.checkPay(res.data.order_no)
+          }, 2000)
           loading.close()
         } else {
           this.$message.error(res.msg)
@@ -86,7 +90,38 @@ export default {
         }
         // isCodeShow = true
       })
+    },
+    checkPay(id) {
+      action.articleAction.checkPay(id).then(res => {
+        if (res.code === 0) {
+          if (res.order.status === 1) {
+            this.$message('支付成功')
+            this.payEnd(res.order.order_no)
+            this.$emit('payStatus')
+            clearInterval(this.time)
+          } else if (res.order.status !== 0) {
+            clearInterval(this.time)
+          }
+        }
+        // isCodeShow = true
+      })
+    },
+    closeClear() {
+      this.isCodeShow = false
+      this.$emit('closePayPop')
+      // clearInterval()
+    },
+    payEnd(orderOn) {
+      const param = {
+        order_no: orderOn,
+        form_id: this.formData.id.toString()
+      }
+      action.articleAction.payEnd(param).then(res => {
+      })
     }
+  },
+  beforeDestroy() {
+    // clearInterval(this.time)
   }
 }
 </script>