Explorar el Código

购买积分功能接口对接

sunlupeng hace 1 año
padre
commit
16382acc57
Se han modificado 3 ficheros con 61 adiciones y 53 borrados
  1. 3 3
      src/api/pay.js
  2. 9 9
      src/views/HomeView/RedeemView.vue
  3. 49 41
      src/views/Ipay.vue

+ 3 - 3
src/api/pay.js

@@ -3,7 +3,7 @@ import request from '@/utils/request'
 //获取支付选项列表
 export function payList(query) {
   return request({
-    url: '/news/mall/getNotice',
+    url: '/mall-integral/pays/page',
     method: 'get',
     params: query
   })
@@ -12,7 +12,7 @@ export function payList(query) {
 //获取微信支付二维码
 export function getWxPayCode(data) {
     return request({
-      url: '/mall-post/add/comment',
+      url: '/wxPay/getPayUrl',
       method: 'post',
       data
     })
@@ -21,7 +21,7 @@ export function getWxPayCode(data) {
   //查询微信支付状态
 export function queryWxPayStatus(data) {
     return request({
-      url: '/mall-post/add/comment',
+      url: '/wxPay/getOrderResult',
       method: 'post',
       data
     })

+ 9 - 9
src/views/HomeView/RedeemView.vue

@@ -558,21 +558,20 @@ export default {
     methods: {
         handlePayWxQRcode(row) {  // 获取微信支付二维码
             getWxPayCode({    // 这里根据不同的后端接口去修改
-                totalFee: row.totalAmount * 100,
-                outTradeNo: row.orderSn,
+                integral: this.money*10,
+                totalFee: this.money,
             }).then(res => {
-                this.qrcode(res.data.url);    // 例如:res.data.url 的值为 "weixin://wxpay/bizpayurl?pr=......",根据这个值生成相对应的微信支付二维码
+                this.qrcode(res.data.payUrl);    // 例如:res.data.url 的值为 "weixin://wxpay/bizpayurl?pr=......",根据这个值生成相对应的微信支付二维码
                 this.timer = setInterval(() => {    // 通过定时器每间隔一会去请求查询微信支付状态(具体参数根据项目需要而定)
-                    this.handleQueryWxPayStatus(row, res.data.outTradeNo);
+                    this.handleQueryWxPayStatus(res.data.orderNo);
                 }, 1000);
             })
         },
-        handleQueryWxPayStatus(row, sn) {  // 查询微信支付状态
+        handleQueryWxPayStatus(orderNo) {  // 查询微信支付状态
             queryWxPayStatus({    // 这里根据不同的后端接口去修改
-                totalFee: row.totalAmount * 100,
-                outTradeNo: sn,
+                orderNo: orderNo,
             }).then(res => {
-                if (res.data.paySuccess) { 
+                if (res.data.tradeState == "SUCCESS") { 
                     // 当查询到支付成功时
                     this.$store.dispatch('GetUserInfo');   
                     this.$message({
@@ -633,7 +632,8 @@ export default {
                     }).then(() => {
                         this.recharge = true;
                         this.$nextTick(function () {
-                            this.qrcode(this.url);
+                            this.handlePayWxQRcode();
+                            // this.qrcode(this.url);
                         })
 
                     }).catch(() => { });

+ 49 - 41
src/views/Ipay.vue

@@ -10,13 +10,13 @@
             <div class="payBox-content">
               <div class="payBox-content-list">
                 <div class="item" :class="{ 'actived': selected == index ? true : false }"
-                  v-for="(item, index) in payList" :key="index" @click="changePay(item.price, index)">
+                  v-for="(item, index) in payList" :key="index" @click="changePay(item.integralMoney, index)">
                   <div class="itemUp">
-                    <div style="font-size: 24px;">{{ item.name }}</div>
+                    <div style="font-size: 24px;">{{ item.integral }}</div>
                     <div style="font-size: 12px;font-weight: 400;margin-left: 2px;">积分</div>
                   </div>
                   <div class="itemDown">
-                    需支付 {{ item.price }}元
+                    需支付 {{ item.integralMoney }}元
                   </div>
                 </div>
                 <el-popover placement="top" width="300" v-model="visible">
@@ -58,7 +58,7 @@
                 <div class="item-right">
                   <div class="up">
                     <div>应付金额</div>
-                    <div style="color: #fe2c55;margin-left: 8px;">¥ {{ price }}</div>
+                    <div style="color: #fe2c55;margin-left: 8px;">¥ {{ integralMoney }}</div>
                   </div>
                   <div class="center">
                     <img style="height: 18px;" src="../assets/icon/weixinPay.png" alt="weixinpay">
@@ -86,44 +86,46 @@ export default {
       timer: null,
       fullscreenLoading: false,
       money: '',
-      price: 1,
+      integralMoney: 1,
       visible: false,
       selected: 0,
+      orderNo: undefined,
+      rate:undefined,
       payList: [
         {
           id: 1,
-          name: "10",
-          price: 1,
+          integral: "10",
+          integralMoney: 1,
         },
         {
           id: 2,
-          name: "50",
-          price: 5,
+          integral: "50",
+          integralMoney: 5,
         },
         {
           id: 3,
-          name: "100",
-          price: 10,
+          integral: "100",
+          integralMoney: 10,
         },
         {
           id: 1,
-          name: "10",
-          price: 1,
+          integral: "10",
+          integralMoney: 1,
         },
         {
           id: 2,
-          name: "50",
-          price: 5,
+          integral: "50",
+          integralMoney: 5,
         },
         {
           id: 3,
-          name: "100",
-          price: 10,
+          integral: "100",
+          integralMoney: 10,
         },
         {
           id: 1,
-          name: "10",
-          price: 1,
+          integral: "10",
+          integralMoney: 1,
         },
       ],
       url:'www.baidu.com'
@@ -132,7 +134,8 @@ export default {
   created() {
     this.getPayList();
     this.$nextTick (function () {
-      this.qrcode(this.url);
+      this.handlePayWxQRcode()
+      // this.qrcode(this.url);
     })
   },
   methods: {
@@ -150,23 +153,23 @@ export default {
         colorLight: '#fff'
       });
     },
-    handlePayWxQRcode(row) {  // 获取微信支付二维码
+    handlePayWxQRcode() {  // 获取微信支付二维码
       getWxPayCode({    // 这里根据不同的后端接口去修改
-        totalFee: row.totalAmount * 100,
-        outTradeNo: row.orderSn,
+        integral: this.integralMoney*this.rate,
+        totalFee: this.integralMoney,
       }).then(res => {
-        this.qrcode(res.data.url);    // 例如:res.data.url 的值为 "weixin://wxpay/bizpayurl?pr=......",根据这个值生成相对应的微信支付二维码
+        this.fullscreenLoading = false;
+        this.qrcode(res.data.payUrl);    // 例如:res.data.url 的值为 "weixin://wxpay/bizpayurl?pr=......",根据这个值生成相对应的微信支付二维码
         this.timer = setInterval(() => {    // 通过定时器每间隔一会去请求查询微信支付状态(具体参数根据项目需要而定)
-          this.handleQueryWxPayStatus(row, res.data.outTradeNo);
+          this.handleQueryWxPayStatus(res.data.orderNo);
         }, 1000);
       })
     },
-    handleQueryWxPayStatus(row, sn) {  // 查询微信支付状态
+    handleQueryWxPayStatus(orderNo) {  // 查询微信支付状态
       queryWxPayStatus({    // 这里根据不同的后端接口去修改
-        totalFee: row.totalAmount * 100,
-        outTradeNo: sn,
+        orderNo: orderNo,
       }).then(res => {
-        if (res.data.paySuccess) {    // 当查询到支付成功时
+        if (res.data.tradeState == "SUCCESS") {    // 当查询到支付成功时
           this.$message({
             type: 'success',
             message: '支付成功!'
@@ -180,26 +183,31 @@ export default {
       this.money = '';
     },
     confirm() {
+      clearInterval(this.timer);
       this.visible = false;
-      this.price = this.money;
+      this.integralMoney = this.money;
       this.fullscreenLoading = true;
-      setTimeout(() => {
-        this.fullscreenLoading = false;
-      }, 2000);
+      this.handlePayWxQRcode()
+      // setTimeout(() => {
+      //   this.fullscreenLoading = false;
+      // }, 2000);
     },
-    changePay(price, index) {
+    changePay(integralMoney, index) {
+      clearInterval(this.timer);
       this.money = '';
       this.selected = index;
-      this.price = price;
+      this.integralMoney = integralMoney;
       this.fullscreenLoading = true;
-      setTimeout(() => {
-        this.fullscreenLoading = false;
-      }, 2000);
+      this.handlePayWxQRcode()
+      // setTimeout(() => {
+      //   this.fullscreenLoading = false;
+      // }, 2000);
     },
     getPayList() {
-      // payList().then(response => {
-      //   this.payList = response.data;
-      // })
+      payList().then(response => {
+        this.rate = response.data.rate;
+        this.payList = response.data.items;
+      })
     },
   },
   beforeDestroy() {