修改购买产品和购买vip的页面
This commit is contained in:
parent
11fa47302e
commit
e8382f2774
@ -29,7 +29,7 @@
|
|||||||
"list": []
|
"list": []
|
||||||
},
|
},
|
||||||
"miniprogram": {
|
"miniprogram": {
|
||||||
"current": 0,
|
"current": 1,
|
||||||
"list": [
|
"list": [
|
||||||
{
|
{
|
||||||
"id": 0,
|
"id": 0,
|
||||||
@ -39,10 +39,10 @@
|
|||||||
"scene": null
|
"scene": null
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"id": -1,
|
"id": 1,
|
||||||
"name": "vip_page",
|
"name": "vip_page",
|
||||||
"pathName": "pages/buyvip",
|
"pathName": "pages/buyvip",
|
||||||
"query": "",
|
"query": "token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjVjNmUxYjk3NDA5MGY5NTYxM2M3YjgxOSIsImFjY291bnRfaWQiOiI2MDAxXzgwMDNfb0pZYXA1WlZSV0RGRm9Qd09GcGllQmVNRkVocyIsInNlc3Npb25faWQiOiIxNTUwNzU0Njg5XzE1NTA3MTc1OTRfYjA5YTVmOWYxODM0NDFmOWUxMDk1MGJmOTUyZTRjMjFfNTcyOWRkOWYyMzQ5NzdlM2IwMGNjOGFjYWRjMjFiOTQiLCJpYXQiOjE1NTA3NTQ2ODl9.GkUGGb2vwTE1xgZ-UKwl6Tfs3NFawE2V3ZAH91_syY4",
|
||||||
"scene": null
|
"scene": null
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
|
@ -1,69 +1,69 @@
|
|||||||
<style lang="less">
|
<style lang="less">
|
||||||
.msg-box{
|
.one-product{
|
||||||
width: 750rpx;
|
|
||||||
height: 300rpx;
|
|
||||||
border-radius:5px;
|
|
||||||
background-color: #fff;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: column;
|
border: 1rpx solid #e5e5e5;
|
||||||
}
|
border-radius: 5rpx;
|
||||||
.msg-title {
|
margin-left: 40rpx;
|
||||||
height: 200rpx;
|
margin-right: 40rpx;
|
||||||
widht: 600rpx;
|
width: 670rpx;
|
||||||
align-items: center;
|
|
||||||
padding: 10px;
|
|
||||||
font-size:18px;
|
|
||||||
color:#777;
|
|
||||||
|
|
||||||
}
|
|
||||||
.msg-action-bar {
|
|
||||||
height: 80rpx;
|
|
||||||
overflow: hidden;
|
|
||||||
display: flex;
|
|
||||||
border-top: 1rpx solid #e5e5e5;
|
|
||||||
}
|
|
||||||
.msg-action-bar .msg-action-btn {
|
|
||||||
width: 50%;
|
|
||||||
height: 80rpx;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
display: flex;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
.msg-action-bar .msg-action-btn:first-child {
|
|
||||||
border-right: 1rpx solid #e5e5e5 ;
|
|
||||||
}
|
|
||||||
.msg-action-bar .msg-action-btn:last-child {
|
|
||||||
color: #3283fa;
|
|
||||||
}
|
|
||||||
.row{
|
|
||||||
width: 750rpx;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
height: 100rpx;
|
||||||
|
justify-items: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20rpx;
|
||||||
}
|
}
|
||||||
|
.price {
|
||||||
|
width: 70%;
|
||||||
|
border-right: 1rpx solid #e5e5e5;
|
||||||
|
height: 100%;
|
||||||
|
position:relative;
|
||||||
|
}
|
||||||
|
.price-txt {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
}
|
||||||
|
.product-name {
|
||||||
|
width: 30%;
|
||||||
|
}
|
||||||
|
.selected {
|
||||||
|
border: 4rpx solid #f85;
|
||||||
|
}
|
||||||
|
.product_img {
|
||||||
|
width: 750rpx;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<template>
|
<template>
|
||||||
<view class="container">
|
<view class="container">
|
||||||
<view class="msg-box">
|
<image class="product_img" mode="widthFix" src="https://resource.kingsome.cn/voodoo/5c789e6e486f49165aa057b8.jpeg"/>
|
||||||
<view class="msg-title">
|
<view class="one-product {{currentType === 'vip'? 'selected' : ''}}" @tap="selectType('vip')">
|
||||||
<view class="row">5元购买一个月</view>
|
<view class="price"><view class="price-txt">30元</view></view>
|
||||||
<view class="row">30元购买终身卡</view>
|
<view class="product-name">终身</view>
|
||||||
</view>
|
|
||||||
<view class="msg-action-bar">
|
|
||||||
<view class="msg-action-btn" @tap="buyMonth"><text>购买一个月</text></view>
|
|
||||||
<view class="msg-action-btn" @tap="buyAll">购买终身VIP</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
|
<view class="one-product {{currentType === 'vip_month'? 'selected' : ''}}" @tap="selectType('vip_month')">
|
||||||
|
<view class="price"><view class="price-txt">10元</view></view>
|
||||||
|
<view class="product-name">一个月</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
|
<gameBottomBar :config.sync="bottomActionCfg" @bottomMainTap.user="bottomMainTap"
|
||||||
|
@bottomSecondTap.user="bottomSecondTap"/>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import wepy from 'wepy';
|
import wepy from 'wepy';
|
||||||
import http from '../utils/http';
|
import http from '../utils/http';
|
||||||
import jcEvent from '../common/jc-event';
|
import jcEvent from '../common/jc-event';
|
||||||
|
import gameBottomBar from '../components/game-bottom-bar';
|
||||||
|
|
||||||
export default class BuyVipPage extends wepy.page {
|
export default class BuyVipPage extends wepy.page {
|
||||||
config = {
|
config = {
|
||||||
navigationBarTitleText: '购买VIP'
|
navigationBarTitleText: '购买VIP'
|
||||||
};
|
};
|
||||||
|
components = {
|
||||||
|
gameBottomBar: gameBottomBar
|
||||||
|
};
|
||||||
data = {
|
data = {
|
||||||
gid: '',
|
gid: '',
|
||||||
bottomActionCfg: {
|
bottomActionCfg: {
|
||||||
@ -73,14 +73,24 @@
|
|||||||
secondBtnIconClass: 'icon-forbid',
|
secondBtnIconClass: 'icon-forbid',
|
||||||
secondBtnTitle: '取消'
|
secondBtnTitle: '取消'
|
||||||
},
|
},
|
||||||
tid: ''
|
tid: '',
|
||||||
|
currentType: 'vip'
|
||||||
};
|
};
|
||||||
methods = {
|
methods = {
|
||||||
buyMonth(){
|
selectType(type) {
|
||||||
this.buy('vip_month');
|
this.currentType = type;
|
||||||
},
|
},
|
||||||
buyAll() {
|
bottomMainTap(e) {
|
||||||
this.buy('vip');
|
console.log('bottomMainTap');
|
||||||
|
this.buy(this.currentType)
|
||||||
|
},
|
||||||
|
bottomSecondTap(e) {
|
||||||
|
console.log('bottomSecondTap');
|
||||||
|
wepy.navigateBackMiniProgram({
|
||||||
|
extraData: {
|
||||||
|
success: false
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -1,8 +1,11 @@
|
|||||||
<style lang="less">
|
<style lang="less">
|
||||||
|
.product_img {
|
||||||
|
width: 750rpx;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
<template>
|
<template>
|
||||||
<view class="container">
|
<view class="container">
|
||||||
|
<image class="product_img" mode="widthFix" src="https://resource.kingsome.cn/voodoo/5c788d47486f49165aa057b6.jpeg"/>
|
||||||
</view>
|
</view>
|
||||||
<gameBottomBar :config.sync="bottomActionCfg" @bottomMainTap.user="bottomMainTap"
|
<gameBottomBar :config.sync="bottomActionCfg" @bottomMainTap.user="bottomMainTap"
|
||||||
@bottomSecondTap.user="bottomSecondTap"/>
|
@bottomSecondTap.user="bottomSecondTap"/>
|
||||||
@ -82,7 +85,7 @@
|
|||||||
console.log('bottomSecondTap');
|
console.log('bottomSecondTap');
|
||||||
wepy.navigateBackMiniProgram({
|
wepy.navigateBackMiniProgram({
|
||||||
extraData: {
|
extraData: {
|
||||||
foo: 'bar'
|
success: false
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
@ -102,7 +105,11 @@
|
|||||||
icon: 'none',
|
icon: 'none',
|
||||||
duration: 2000
|
duration: 2000
|
||||||
})
|
})
|
||||||
jcEvent.emit(jcEvent.events.BUY_GAME_SUCCESS, {});
|
wepy.navigateBackMiniProgram({
|
||||||
|
extraData: {
|
||||||
|
success: true
|
||||||
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
console.log(err);
|
console.log(err);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user