开发

components/donutBuy/index.js

@@ -1,3 +1,10 @@
+import {
+    androidbuyVip,
+    buyVip,
+} from '~/api/user'
+import {
+    userEvent
+} from '~/api/global'
 Component({
     /**
      * 组件的属性列表
@@ -6,33 +13,136 @@ Component({
 
     },
     data: {
-
+        state: false,
+        product: {},
+        items: [{
+                value: 'wxpay',
+                name: '微信',
+                checked: true
+            },
+            {
+                value: 'alipay',
+                name: '支付宝',
+                checked: false
+            },
+        ]
     },
     methods: {
-        open(
-            currentTarget
-        ) {
-           /*  if (currentTarget.dataset.isclick) {
+        open(product) {
+            if (!product) {
                 return
-            } */
-            this.getTabBar().setData({
-                mask: true
+            }
+            this.setData({
+                product
             })
             // #if MP
+            this.toBuy()
             // #elif ANDROID
-            // #endif
-        },
-        showTranscript() {
             this.getTabBar().setData({
                 mask: true
             })
-            this.selectComponent("#popUp").showModal()
+            this.setData({
+                state: true,
+            })
+            // #endif
+        },
+        radioChange(e) {
+            const items = this.data.items
+            for (let i = 0, len = items.length; i < len; ++i) {
+                items[i].checked = items[i].value === e.detail.value
+            }
+            this.setData({
+                items
+            })
         },
         closeTranscript() {
             this.getTabBar().setData({
                 mask: false
             })
-            this.selectComponent("#popUp").hideModal()
+            this.setData({
+                state: false
+            })
+        },
+        async toBuy() {
+            wx.showLoading({
+                title: '提交中',
+                mask: true
+            })
+            // #if MP
+            let res = await buyVip({
+                productId: this.data.product.id
+            }).finally(() => {
+                wx.hideLoading()
+            })
+            userEvent({
+                action: 'ANDROID_PAY_ACTIVITY',
+            })
+            let {
+                timeStamp,
+                nonceStr,
+                signType,
+                paySign
+            } = res
+            // package保留字
+            wx.requestPayment({
+                timeStamp,
+                nonceStr,
+                package: res.package,
+                signType,
+                paySign,
+                success: async (res) => {
+                    userEvent({
+                        action: 'ANDROID_PAY_SUCCESS',
+                    })
+                    setTimeout(() => {
+                        this.triggerEvent('reload')
+                        this.closeTranscript()
+                    }, 1500)
+                },
+                fail(res) {
+                    wx.showToast({
+                        title: "支付失败",
+                        icon: "none",
+                        duration: 3000
+                    })
+                }
+            })
+            // #elif ANDROID
+            let res = await androidbuyVip({
+                productId: this.data.product.id
+            }).finally(() => {
+                wx.hideLoading()
+            })
+            wx.miniapp.requestPayment({
+                timeStamp: res.timestamp,
+                mchId: res.partnerid,
+                prepayId: res.prepayid,
+                package: res.package,
+                nonceStr: res.noncestr,
+                sign: res.sign,
+                success: async (res) => {
+                    /*  setTimeout(() => {
+                         this.setUserInfo()
+                         this.setData({
+                             mask: true
+                         })
+                     }, 1500)
+                     userEvent({
+                         action: 'ANDROID_PAY_SUCCESS',
+                     }) */
+                },
+                fail(res) {
+                    wx.showToast({
+                        title: "支付失败",
+                        icon: "none",
+                        duration: 3000
+                    })
+                },
+                complete: (res) => {
+                    console.error('wx.miniapp.requestPayment complete:', res)
+                }
+            })
+            // #endif
         },
     }
 })

components/donutBuy/index.less

@@ -51,12 +51,12 @@
                     display: flex;
                     align-items: center;
 
-                    .wximg {
+                    .wxpay {
                         width: 62rpx;
                         height: 52rpx;
                     }
 
-                    .img {
+                    .alipay {
                         height: 62rpx;
                         width: 62rpx;
                     }

components/donutBuy/index.wxml

@@ -1,10 +1,18 @@
-<view class="gradeContainer" catchtouchmove='true' bindtap="closeTranscript">
+<view class="gradeContainer" catchtouchmove='true' wx:if="{{state}}">
     <view class="popBox zoomIn">
         <view class="title">选择支付方式
-            <image src="/static/bclose.png" class="close" />
+            <image src="/static/bclose.png" class="close" bindtap="closeTranscript" />
         </view>
-        <radio-group bindchange="radioChange" class="group">
-            <label class="weui-cell" style="border-bottom: 2rpx solid white;">
+        <radio-group catch:change="radioChange" class="group">
+            <label class="weui-cell" wx:for="{{items}}" wx:key="value"
+                style="border-bottom: 2rpx solid white;">
+                <view class="pay-row">
+                    <image src="/static/{{item.value}}.png" class="{{item.value}}" />
+                    <view class="name">{{item.name}}支付</view>
+                </view>
+                <radio value="{{item.value}}" checked="{{item.checked}}" color='#FFAC00' />
+            </label>
+            <!-- <label class="weui-cell" style="border-bottom: 2rpx solid white;">
                 <view class="pay-row">
                     <image src="/static/wxpay.png" class="wximg" />
                     <view class="name">微信支付</view>
@@ -17,13 +25,12 @@
                     <view class="name">支付宝支付</view>
                 </view>
                 <radio value="alipay" checked="true" color='#FFAC00' />
-            </label>
+            </label> -->
         </radio-group>
         <view class="paymentBox">
-            <view class="payment">应付款：<view class="num">¥299</view>
+            <view class="payment">应付款：<view class="num">¥{{product.price/100}}</view>
             </view>
             <view class="pay" bindtap="toBuy">立即支付</view>
-
         </view>
     </view>
 </view>

components/donutBuy/index.wxss

@@ -49,11 +49,11 @@
   display: flex;
   align-items: center;
 }
-.gradeContainer .popBox .group .weui-cell .pay-row .wximg {
+.gradeContainer .popBox .group .weui-cell .pay-row .wxpay {
   width: 62rpx;
   height: 52rpx;
 }
-.gradeContainer .popBox .group .weui-cell .pay-row .img {
+.gradeContainer .popBox .group .weui-cell .pay-row .alipay {
   height: 62rpx;
   width: 62rpx;
 }

pages/my/index.js

@@ -1,7 +1,5 @@
 import {
     getMyInfo,
-    androidbuyVip,
-    buyVip,
     getVipInfo,
     getWxQrcode,
     getLearnCard
@@ -45,7 +43,6 @@ Page({
                 qrCode: qrCode.ticketUrl
             })
         }
-        this.openDonutBuy({currentTarget:[]})
     },
     async onShow() {
         if (typeof this.getTabBar === 'function') {
@@ -138,92 +135,9 @@ Page({
     openDonutBuy({
         currentTarget
     }) {
-        this.selectComponent('#donutBuy').open(currentTarget)
-    },
-    async toBuy({
-        currentTarget
-    }) {
-        if (currentTarget.dataset.isclick) {
-            return
-        }
-        wx.showLoading({
-            title: '提交中',
-            mask: true
-        })
-        // #if MP
-        userEvent({
-            action: 'ANDROID_PAY_ACTIVITY',
-        })
-        let res = await buyVip({
-            productId: currentTarget.dataset.id
-        }).finally(() => {
-            wx.hideLoading()
-        })
-        let {
-            timeStamp,
-            nonceStr,
-            signType,
-            paySign
-        } = res
-        // package保留字
-        wx.requestPayment({
-            timeStamp,
-            nonceStr,
-            package: res.package,
-            signType,
-            paySign,
-            success: async (res) => {
-                setTimeout(() => {
-                    this.setUserInfo()
-                    this.selectComponent('#vipModal').open()
-                }, 1500)
-                userEvent({
-                    action: 'ANDROID_PAY_SUCCESS',
-                })
-            },
-            fail(res) {
-                wx.showToast({
-                    title: "支付失败",
-                    icon: "none",
-                    duration: 3000
-                })
-            }
-        })
-        // #elif ANDROID
-        let res = await androidbuyVip({
-            productId: currentTarget.dataset.id
-        }).finally(() => {
-            wx.hideLoading()
-        })
-        wx.miniapp.requestPayment({
-            timeStamp: res.timestamp,
-            mchId: res.partnerid,
-            prepayId: res.prepayid,
-            package: res.package,
-            nonceStr: res.noncestr,
-            sign: res.sign,
-            success: async (res) => {
-                setTimeout(() => {
-                    this.setUserInfo()
-                    this.selectComponent('#vipModal').open()
-                }, 1500)
-                userEvent({
-                    action: 'ANDROID_PAY_SUCCESS',
-                })
-            },
-            fail(res) {
-                console.log(res);
-                wx.showToast({
-                    title: "支付失败",
-                    icon: "none",
-                    duration: 3000
-                })
-            },
-            complete: (res) => {
-                console.error('wx.miniapp.requestPayment complete:', res)
-            }
-        })
-        // #endif
+        let product = currentTarget.dataset.product
+        console.log(product);
+        this.selectComponent('#donutBuy').open(product)
     },
     jump({
         currentTarget

pages/my/index.wxml

@@ -1,5 +1,5 @@
 <wxs src="../../utils/filter.wxs" module="filters" />
-<navigationBar></navigationBar>
+<navigationBar bind:reload='setUserInfo'></navigationBar>
 <view class="container">
     <!-- 用户信息 -->
     <view class="userBox">
@@ -29,8 +29,8 @@
     <view class="scrollViewBox" wx:if="{{vipTime!='1'&&!isIos}}">
         <scroll-view class="goodsList" scroll-x="true" enhanced show-scrollbar="{{false}}">
             <view wx:for="{{products}}" wx:key="id"
-                class="payBox {{item.payType=='LIFELONG'?'pbbg2':item.payType=='YEAR'?'pbbg1':'pbbg3'}}" bindtap="openDonutBuy"
-                data-id="{{item.id}}">
+                class="payBox {{item.payType=='LIFELONG'?'pbbg2':item.payType=='YEAR'?'pbbg1':'pbbg3'}}"
+                bindtap="openDonutBuy" data-product="{{item}}">
                 <view class="pay">
                     {{isPreferential?'立即续费':'立即开通'}}
                 </view>