'新增支付页面'

app.json

@@ -28,7 +28,8 @@
     "pages/activity/rule/rule",
     "pages/activity/strategy/strategy",
     "pages/activity/priceList/priceList",
-    "pages/vipActivity/vipActivity"
+    "pages/vipActivity/vipActivity",
+    "pages/product/product"
   ],
   "window": {
     "backgroundTextStyle": "light",

component/my/my.js

@@ -93,7 +93,8 @@ export const myInit = (that) => {
     },
     /**创建支付订单 */
     that.moneyBuy = function() {
-      that.messageAuth();
+      // that.messageAuth();
+      that.goToPruduct();
 
     }
     that.getFollowWorks(1, 3);

pages/index/index.js

@@ -1205,6 +1205,12 @@ Page({
     }
 
   },
+  // 去产品页
+  goToPruduct(){
+    wx.navigateTo({
+      url: `../product/product?price=${this.data.myData.price}`
+    });
+  },
   // 授权
   messageAuth() {
     if (!wx.getStorageSync('message')) {

pages/product/product.js

@@ -0,0 +1,128 @@
+// import APIClient from '../../../utils/APIClient.js'
+import httpRequestApi from '../../utils/APIClient';
+
+Page({
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        name: '小学语文朗读配音',
+        price: 9
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        console.log('产品页', options)
+        if (options.price) {
+            this.setData({
+                price: options.price
+            })
+        }
+    },
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    buy() {
+        this.messageAuth();
+    },
+    // 授权
+    messageAuth() {
+        if (!wx.getStorageSync('message')) {
+            wx.requestSubscribeMessage({
+                tmplIds: ['KJ0YtcAacJNSXDBsE27JXqoaFrcJ1-N6Jcu85yTtQuY',
+                    '-2ZZpWFoyKvAtX1HwEIQLQ92LnN8cryamB94LqLGo98'
+                ],
+                success: (res) => {
+                    console.log(res)
+                    if (res['KJ0YtcAacJNSXDBsE27JXqoaFrcJ1-N6Jcu85yTtQuY'] === 'reject') {
+                        console.log('用户不同意订阅')
+                        wx.setStorageSync('message', false)
+                    } else if (res['KJ0YtcAacJNSXDBsE27JXqoaFrcJ1-N6Jcu85yTtQuY'] === 'accept') {
+                        console.log('订阅成功')
+                        wx.setStorageSync('message', true)
+                    }
+                    this.order();
+                },
+                fail: () => {
+                    this.order();
+                }
+            })
+        } else {
+            this.order();
+        }
+    },
+    // 支付
+    order() {
+        // 渠道id
+        const productId = wx.getStorageSync('productId');
+        httpRequestApi.createOrder(productId).success(res => {
+            console.log(res.data.data.package);
+            const timeStamp = res.data.data.timeStamp;
+            const nonceStr = res.data.data.nonceStr;
+            const packages = res.data.data.package;
+            const paySign = res.data.data.sign;
+            wx.requestPayment({
+                timeStamp,
+                nonceStr,
+                package: packages,
+                signType: 'MD5',
+                paySign,
+                success: (res) => {
+                    if (this.data.iphoneType === 'iphone') {
+                        this.setData({
+                            tipsType: 'tips',
+                            tipsImg: 'http://reader-wx.ai160.com/images/reader/pay/success.png'
+                        })
+                    }
+                    httpRequestApi.getAuthActivity().success(res => {
+                        if (!res.data.data) {
+                            wx.setStorageSync('vip', false)
+                            wx.setStorageSync('date', '')
+                        } else {
+                            wx.setStorageSync('vip', true)
+                            wx.setStorageSync('date', res.data.data)
+                            // this.setData({
+                            //     ['myData.isVIP']: true,
+                            //     ['myData.date']: res.data.data
+                            // })
+                            const pages = getCurrentPages();
+                            const prevPage = pages[pages.length - 2];
+                            prevPage.setData({
+                                ['myData.isVIP']: true,
+                                ['myData.date']: res.data.data
+                            }, () => {
+                                wx.navigateBack({
+                                    delta: 1
+                                })
+                            })
+                            // this.showGift();
+                        }
+                    }).fail(error => {
+                        console.log(error)
+                    })
+                },
+                fail(res) {}
+            })
+        })
+    },
+
+    // // 购买成功告诉首页显示邀请有礼
+    // showGift() {
+    //     console.log('通知')
+    //     this.setData({
+    //         isVip: true
+    //     })
+    // },
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+})

pages/product/product.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/product/product.wxml

@@ -0,0 +1,11 @@
+<view class="product-wrapper">
+    <view class="product-box">
+        <view class="title">
+            <view class="name">{{name}}</view>
+            <!-- <view class="price"></view> -->
+            <view class="price-tag"><text class="price">{{price}}元</text>/月</view>
+        </view>
+        <view class="origin">原价29.9元/月</view>
+        <view class="btn" bindtap="buy">立即购买</view>
+    </view>
+</view>

pages/product/product.wxss

@@ -0,0 +1,77 @@
+.product-wrapper{
+    background: #fff;
+    width: 100%;
+    height: 100%;
+    padding-top: 44rpx;
+}
+
+.product-box{
+    width: 680rpx;
+    height: 658rpx;
+    background-image: url('http://reader-wx.ai160.com/images/reader/pay/product-bg.png');
+    background-size: 100% 100%;
+    margin: 0 auto;
+    position: relative;
+    padding-top: 15rpx;
+    box-sizing: border-box;
+}
+
+.product-box .title{
+    width: 100%;
+    height: 125rpx;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-top: 35rpx;
+    padding: 50rpx;
+    box-sizing: border-box;
+}
+
+.product-box .title .name{
+    color: #fff;
+    font-weight: 500;
+    font-size: 42rpx;
+    /* margin-left: 35rpx; */
+    /* margin-right: 50rpx; */
+}
+
+.product-box .title .price{
+    font-size: 84rpx;
+    font-weight: 600;
+    color: #fff;
+}
+
+.product-box .title .price-tag{
+    font-size: 48rpx;
+    font-weight: 600;
+    color: #fff;
+    display: flex;
+    align-items: center;
+}
+
+.product-box .origin{
+    font-size: 33rpx;
+    font-weight: 500;
+    color: rgba(255,255,255,.7);
+    position: absolute;
+    top: 167rpx;
+    left: 408rpx;
+    text-decoration: line-through;
+}
+
+.product-box .btn{
+    width: 480rpx;
+    height: 80rpx;
+    border-radius: 41rpx;
+    background: #ff9c00;
+    text-align: center;
+    line-height: 80rpx;
+    color: #fff;
+    font-size: 40rpx;
+    font-weight: 500;
+    position: absolute;
+    left: 0;
+    right: 0;
+    margin: 0 auto;
+    bottom: 54rpx;
+}