TmOct5/dtx_store
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

充值，共力人生

Browse Source
This commit is contained in:
唐明明
2022-06-08 19:26:51 +08:00
parent bc8ff42533
commit 64ddd2547d
157 changed files with 2441 additions and 2001 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
pages/vip/vip.vue
View File

@@ -1,33 +1,37 @@
<template>
<view class="vip">
<view :class="{'vip': isOpen}">
<view class="vip-card">
<view class="vip-user">
<image class="user-cover" src="" mode="aspectFill"></image>
<view class="user-nickname">唐明阳</view>
<view class="user-date">到期日期：2023-06-07</view>
<view class="vip-renewal">续费</view>
<image class="user-cover" :src="user.avatar" mode="aspectFill"></image>
<view class="user-nickname">{{user.nickname}}</view>
<view class="user-date">到期日期：{{identity.ended_at}}</view>
<view class="vip-renewal" v-if="!isOpen">续费</view>
</view>
<view class="user-cards">
<image class="vip-icon" src="/static/vip/lv_04.png" mode="widthFix"></image>
<image class="vip-icon" :src="identity.cover_url" mode="widthFix"></image>
<view>
<view class="vip-lv">共力践行者</view>
<view class="vip-progress">
<view class="vip-progress-loding" style="width: 50%;"></view>
</view>
<view class="vip-loding">
<view>0/0共分</view>
</view>
<view class="vip-lv">{{identity.identity_text}}</view>
<block>
<view class="vip-progress">
<view class="vip-progress-loding" style="width: 50%;"></view>
</view>
<view class="vip-loding">
<view>0/0共分</view>
</view>
</block>
</view>
<navigator class="vip-more">成长体系<uni-icons size="14" type="forward" color="#9f5529"></uni-icons></navigator>
<navigator class="vip-more" hover-class="none">成长体系<uni-icons size="14" type="forward" color="#9f5529"></uni-icons></navigator>
</view>
</view>
<view class="vip-content">
<view class="vip-content-title">距离 *** 还需条件</view>
<view class="vip-up-conditions">
<view class="vip-up-conditions-item"><text>10/10</text>家庭会员</view>
<view class="vip-up-conditions-item"><text>9/100</text>邀请家族会员员</view>
<view class="vip-up-conditions-item"><text>10/10000</text>伙伴</view>
</view>
<block v-if="secondRule.length > 0">
<view class="vip-content-title">距离<text>{{nextIdentity.identity_text}}</text>还需条件</view>
<view class="vip-up-conditions">
<view class="vip-up-conditions-item"><text>10/10</text>家庭会员</view>
<view class="vip-up-conditions-item"><text>9/100</text>邀请家族会员员</view>
<view class="vip-up-conditions-item"><text>10/10000</text>伙伴</view>
</view>
</block>
<view class="vip-content-title">会员特权</view>
<view class="vip-privilege">
<view class="vip-privilege-item" v-for="(item, index) in 8" :key="index">
@@ -38,12 +42,11 @@
</view>
<view class="vip-content-title">会员折扣说明</view>
<view class="vip-content-rich">
<view>前1000名会员享受会员费5折优惠</view>
<view>前1001-2000名会员享受会员费5折优惠</view>
<view>前2001-5000名会员享受会员费5折优惠</view>
<view v-for="(item,index) in prices" :key="index">前{{item.open_number}} - {{item.open_number + item.stock}}名享开通会员折扣价{{item.price}}元</view>
<view>10000后会员恢复原价199.00元</view>
</view>
</view>
<view class="footer-vip">
<view class="footer-vip" v-if="isOpen">
<button @click="onOpenVip">开通会员</button>
<view class="footer-text">开通即表示同意共力生态<navigator url="./agreement">《会员开通协议》</navigator></view>
</view>
@@ -51,22 +54,79 @@
</template>
<script>
import { vip, vipPay, submitOrder } from '@/apis/interfaces/vip.js'
export default {
data() {
return {
// 用户信息
user: {
username: '-',
nickname: '-',
avatar : '-',
},
// 当前身份
identity: {
identity_text: '',
cover_url: '',
ended_at: ''
},
// 下级身份
nextIdentity:{
identity_text: ''
},
// 升级条件
secondRule: [],
// 会员特权
rights: [],
// 会员折扣说明
prices: [],
// 是否可续费
isOpen: true
};
},
onShow() {
vip().then(res =>{
console.log(res)
this.isOpen = res.is_open
this.prices = res.prices
this.rights = res.rights
this.secondRule = res.second_rule
this.nextIdentity = res.next_identity
this.identity = res.identity
this.user = res.user
}).catch(err => {
console.log(err)
})
},
methods: {
onOpenVip(){
uni.requestPayment({
provider : "wxpay",
success: res => {
console.log(res)
},
fail: err=> {
console.log(err)
}
// 获取订单
vipPay().then(orderNo => {
// 支付参数
submitOrder({
orderNo
}).then(orderInfo => {
uni.requestPayment({
provider : "wxpay",
orderInfo,
success: res => {
console.log(res)
},
fail: err=> {
console.log(err)
}
})
}).catch(err =>{
uni.showToast({
title: err.message,
icon : 'none'
})
})
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
}
}
@@ -187,6 +247,10 @@
width: 10rpx;
height: 30rpx;
}
text{
color: #fcc590;
padding: 0 10rpx;
}
}
.vip-up-conditions{
padding-top: 10rpx;
@@ -203,7 +267,6 @@
}
}
.vip-content-rich{
padding: 30rpx 0 0;
font-size: 28rpx;
line-height: 50rpx;
color: gray;
@@ -238,9 +301,18 @@
}
}
}
// 会员
.vip{
padding-bottom: ($padding*3) + 140;
}
// 会员支付
.footer-vip{
position: fixed;
bottom: 0;
width: 100%;
padding: $padding;
box-sizing: border-box;
background: white;
button{
height: 90rpx;
line-height: 90rpx;
@@ -258,6 +330,7 @@
.footer-text{
font-size: 26rpx;
color: #888;
line-height: 50rpx;
text-align: center;
padding: $padding 0;
navigator{