充值成功后调整到结果通知页。

src/api/remoteApi.js

@@ -60,7 +60,14 @@ var remoteApi = {
                 roomId,pageNum,pageSize
             }
         });
-    }
+    },
+    queryRechargeRecord: function(recordId) {
+        return request.get(basePath + `/mobileApi/queryRechargeRecord`,{
+            params:{
+                recordId
+            }
+        });
+    },
 }
 
 export default remoteApi

src/components/Pay.vue

@@ -74,7 +74,8 @@ export default {
       kwh : 0,
       payType: 'weipay',
       showAlipay: false,
-      qrCodeUrl: ''
+      qrCodeUrl: '',
+      timeoutId : 0
     }
   },
   methods: {
@@ -89,6 +90,23 @@ export default {
         }
       });
     },
+    queryPayResult(recordId) {
+      remoteApi.queryRechargeRecord(recordId).then((resp)=>{
+        if(resp.result && resp.data.paymentStatus=="20"){
+           this.$router.push({
+            path : '/Paystate',
+            query: {
+              payType : resp.data.buyType
+            }
+          });
+        }
+        else{
+          this.timeoutId = setTimeout(()=>{
+            this.queryPayResult(recordId);
+          },3000);
+        }
+      });
+    },
     pay() {
       var self = this
       self.paying = true
@@ -121,9 +139,11 @@ export default {
         });
       }
       else if(self.payType=='alipay') {
+        var recordId = "";
+
         remoteApi.prepareAliPay(self.roomId,self.payType,self.kwh,self.total).then(resp=>{
           if(resp.result){
-            var recordId = resp.data.recordId;
+            recordId = resp.data.recordId;
             return remoteApi.tradePrecreatePay(recordId);
           }
           else{
@@ -153,6 +173,11 @@ export default {
                 correctLevel: QRCode.CorrectLevel.H
               })
             })
+
+            clearTimeout(this.timeoutId);
+
+            //每隔n秒查询充值是否成功
+            this.queryPayResult(recordId);
           }
           else{            
             self.paying = false

src/components/Paylist.vue

@@ -95,7 +95,7 @@ export default {
       var text = "";
 
       if(status=="10"){
-        text = "未充电";
+        text = "待充电";
       }
       else if(status=="20"){
         text = "已充电";

src/components/Paystate.vue

@@ -5,7 +5,7 @@
       <div class="paystate">
         <img src="@/assets/img/payyes.png" />
         <h1>支付成功</h1>
-        <p>支付方式：微信支付</p>
+        <p>支付方式：<span v-html="payTypeText"></span></p>
       </div>
     </div>
     <div class="fyyfooter paybutton">
@@ -21,10 +21,35 @@
 
 <script>
 export default {
+  data(){
+    return {
+      payType: ''
+    }
+  },
+  computed:{
+    payTypeText (){
+      var text = "";
+
+      if(this.payType=='alipay'){
+        text = "支付宝";
+      }
+      else if(this.payType=='weipay'){
+        text ="微信";
+      }
+      else if(this.payType=='cash'){
+        text = "现金";
+      }
+
+      return text;
+    }
+  },
   methods: {
     back() {
       this.$router.push("/Pay");
     }
+  },
+  mounted() {
+    this.payType = this.$route.query.payType;
   }
 };
 </script>

src/components/WXPay.vue

@@ -16,6 +16,25 @@ export default {
             recordId: getQueryString("state")
         }
     },
+    methods: {
+        queryPayResult(recordId) {
+            remoteApi.queryRechargeRecord(recordId).then((resp)=>{
+                if(resp.result && resp.data.paymentStatus=="20"){
+                this.$router.push({
+                    path : '/Paystate',
+                    query: {
+                    payType : resp.data.buyType
+                    }
+                });
+                }
+                else{
+                setTimeout(()=>{
+                    this.queryPayResult(recordId);
+                },3000);
+                }
+            });
+        }
+    },
     mounted (){
         var self = this
         
@@ -95,7 +114,7 @@ export default {
                         "paySign": data.paySign,    // 支付签名
                         success: function (res) {
                             // 支付成功后的回调函数,跳转到订单列表
-
+                            self.queryPayResult(self.recordId);
                         }
                     });
                 }