支付

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>

src/pages/train/form.vue

@@ -3,7 +3,7 @@
     <!-- <breadcrumb class="content-max-width crumb" :data="crumbData"/> -->
     <div class="title-form">师资培训报名信息填写</div>
     <div class="form-box">
-      <el-form ref="form" :model="form" label-width="80px" class="forms">
+      <el-form ref="form" :model="form" label-width="80px" class="forms" :disabled="isPayStatus">
         <el-form-item label="院校名称" label-width="110px">
           <el-input v-model="form.school_name"></el-input>
         </el-form-item>
@@ -101,19 +101,29 @@
           </el-upload>
         </el-form-item> -->
         <el-form-item label-width="110px">
+          <template v-if="isPayStatus">
+            <el-button style="width: 200px; margin-left: 44px" type="primary">已支付</el-button>
+          </template>
+          <template v-else>
             <template v-if="isLogin">
-            <el-button style="width: 100px; margin-left: 10px" type="primary" @click="onSubmit">修 改</el-button>
-            <el-button style="width: 100px; margin-left: 10px" type="primary" @click="isPayPopShow = true">去付款</el-button>
+              <template v-if="isInfoNull">
+                <el-button style="width: 200px; margin-left: 44px" type="primary" @click="formVerification(onSubmit)">提 交</el-button>
+              </template>
+              <template v-else>
+                <el-button style="width: 100px; margin-left: 10px" type="primary" @click="formVerification(onSubmit)">提 交</el-button>
+                <el-button style="width: 100px; margin-left: 10px" type="primary" @click="formVerification(goPay)">去付款</el-button>
+              </template>
             </template>
             <template v-else>
-            <el-button style="width: 200px; margin-left: 44px" type="primary" @click="onSubmit">提 交</el-button>
+              <el-button style="width: 200px; margin-left: 44px" type="primary" @click="formVerification(onSubmit)">提 交</el-button>
+            </template>
           </template>
           <!-- <el-button style="width: 200px; margin-left: 44px" type="primary" @click="onSubmit">去付款</el-button> -->
           <!-- <el-button @click="back">返回</el-button> -->
         </el-form-item>
       </el-form>
     </div>
-    <pay-pop v-if="isPayPopShow" :formData="form" @closePayPop="closePayPop" class="payPop"/>
+    <pay-pop v-show="isPayPopShow" :formData="form" @payStatus="payStatus" @closePayPop="closePayPop" class="payPop"/>
   </div>
 </template>
 <script>
@@ -130,6 +140,8 @@ export default {
   },
   data() {
     return {
+      isInfoNull: false,
+      isPayStatus: false,
       crumbData: [
         {
           path: '/',
@@ -168,18 +180,11 @@ export default {
       if (res && res.code === 0) {
         window.sessionStorage.userInfo = JSON.stringify(res.data)
         this.isLogin = true
+        this.getDetail()
       }
     })
   },
   mounted() {
-    // 登录状态不需要手机号验证码
-    action.articleAction.getFormDetail().then(res => {
-      if (res.code === 200) {
-        this.form = res.data.detail
-        this.form.sex = this.form.sex.toString()
-        this.form.live_status = this.form.live_status.toString()
-      }
-    })
     // $('#name label').html('姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名')
     $('#sex label').html('性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别')
     $('#mz label').html('民&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;族')
@@ -189,6 +194,41 @@ export default {
     // $('#sh label').html('税&nbsp;&nbsp;&nbsp;号')
   },
   methods: {
+    goPay() {
+      this.isPayPopShow = true
+    },
+    getDetail(call) {
+      // 登录状态不需要手机号验证码
+      action.articleAction.getFormDetail().then(res => {
+        if (res.code === 200) {
+          if (!Object.keys(res.data.detail).length) {
+            this.isInfoNull = true
+          } else {
+            this.form = Object.assign(this.form, res.data.detail)
+            this.form.sex = this.form.sex && this.form.sex.toString()
+            this.form.live_status = this.form.live_status && this.form.live_status.toString()
+            this.checkPay(res.data.detail.order_no, call)
+          }
+        }
+      })
+    },
+    // 支付
+    checkPay(id, call) {
+      action.articleAction.checkPay(id).then(res => {
+        if (res.code === 0) {
+          if (res.order.status === 1) {
+            this.isPayStatus = true
+          } else {
+            call()
+          }
+        }
+        // isCodeShow = true
+      })
+    },
+    payStatus() {
+      this.isPayStatus = true
+      this.isPayPopShow = false
+    },
     // 关闭支付弹窗
     closePayPop() {
       this.isPayPopShow = false
@@ -222,8 +262,7 @@ export default {
         })
       }
     }, */
-    onSubmit() {
-      console.log(this.isLogin, this.form)
+    formVerification (call) {
       if (this.isLogin) {
         this.form.mobile = '13111111111'
         this.form.checked_code = '1234'
@@ -232,13 +271,13 @@ export default {
         }
       }
       let flag = true
-      // console.log(this.form)
       Object.keys(this.form).map(item => {
         if (this.form[item] === '') {
           console.log(item)
           flag = false
         }
       })
+      console.log(this.form)
       if (!flag) {
         // this.$message('请完善信息')
         this.message('请完善信息')
@@ -249,6 +288,10 @@ export default {
       } else if (!EMAIL_REG.test(this.form.email)) {
         this.message('邮箱格式错误')
       } else {
+        call()
+      }
+    },
+    onSubmit() {
       /* let arr = [this.defaultRegister(), this.sendEnrollInfo()];
         Promise.all(arr.map((promise)=>promise.catch((e)=>{
           return e
@@ -284,7 +327,9 @@ export default {
       if (this.isLogin) {
         this.sendEnrollInfo()
           .then(res => {
-              this.message('报名信息修改成功！','success', 6000)
+            this.isInfoNull = false
+            this.getDetail()
+            this.message('提交成功！','success', 6000)
             // setTimeout(() => {
             //   this.message('手机号注册成功！','success', 6000)
             // }, 300)
@@ -302,6 +347,7 @@ export default {
           })
       } else {
         this.defaultRegister().then(res => {
+          this.getDetail(
             this.sendEnrollInfo()
               .then(res => {
                 this.message('报名信息提交成功！','success', 6000)
@@ -324,9 +370,9 @@ export default {
                   this.message('报名信息提交失败！' + errorMsg,'error', 6000)
                 }
               })
+          )
         })
       }
-      }
     },
     sendEnrollInfo() {
       let promise = new Promise((resolve, reject) => {
@@ -445,6 +491,7 @@ export default {
               msg: res.msg || '此手机号已经被注册'
             })
           } else {
+            this.$message.error(res.msg)
             reject({
               type: 'register',
               state: 'fail',