284 lines
7.6 KiB
Vue
284 lines
7.6 KiB
Vue
<template>
|
|
<view>
|
|
<view class="hm-p-tb-20">
|
|
<u-swiper :list="userInfo.v.grade.vip" keyName="card_cover" @change="change" :autoplay="false" previousMargin="30"
|
|
nextMargin="30" radius="8" indicator circular>
|
|
</u-swiper>
|
|
</view>
|
|
<view class="title">
|
|
<view class="hm-dis-block-inline">
|
|
<u-icon name="level" size="30" color="#333" bold></u-icon>
|
|
</view>
|
|
<text class="lv">{{lv+1}}</text>会员特权<text class="discount">需要{{userInfo.v.grade.vip[lv].score}}成长值</text>
|
|
</view>
|
|
<view class="hm-p-lr-20">
|
|
<view class="menu">
|
|
会员权益
|
|
<view class="navbar-list" v-if="userInfo.v.grade.vip_discount == 1 && userInfo.v.grade.vip[lv].discount < 100">
|
|
<image src="/static/user/discount.png"></image>{{userInfo.v.grade.vip[lv].discount / 10}}折特权
|
|
</view>
|
|
<view class="navbar-list" :class="userInfo.v.grade.vip_discount == 1 && userInfo.v.grade.vip[lv].discount < 100 && userInfo.v.grade.vip[lv].free_delivery == 1?'hm-border-t':''" v-if="userInfo.v.grade.vip[lv].free_delivery == 1">
|
|
<image src="/static/user/delivery.png"></image>免配送费
|
|
</view>
|
|
</view>
|
|
<view class="menu">
|
|
升级礼包
|
|
<view v-for="(item,index) in userInfo.v.grade.vip[lv].gift" :key="index">
|
|
<view class="navbar-list" :class="index > 0 ?'hm-border-t':''">
|
|
<image src="/static/user/coupon.png"></image>{{item.name}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 技术支持 -->
|
|
<view class="hm">
|
|
{{applet.copyright}} <text class="v">V{{applet.version}}</text>
|
|
</view>
|
|
<view v-if="action == 'vip'" class="hm-footer-fixed">
|
|
<view class="hm-p-lr-b25 hm-w-b100">
|
|
<view v-if="userInfo.v.grade.buy_price > 0">
|
|
<!-- #ifndef H5 -->
|
|
<u-button @click="payment" type="success" :text="'支付￥'+userInfo.v.grade.buy_price+'，开通会员'"></u-button>
|
|
<!-- #endif -->
|
|
<!-- #ifdef H5 -->
|
|
<u-button @click="cashier" type="success" :text="'支付￥'+userInfo.v.grade.buy_price+'，开通会员'"></u-button>
|
|
<!-- #endif -->
|
|
</view>
|
|
<view v-else>
|
|
<u-button @click="openVip()" type="success" text="免费开通会员"></u-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<u-popup :show="cashier_show" @close="cashier_show = false" mode="center" round="8" :closeable="true">
|
|
<view class="hm-popup">
|
|
<view class="hm-p-b-20 hm-border-b hm-text-center">支付收银台</view>
|
|
<view class="hm-p-tb-50 hm-text-center">
|
|
<view class="hm-font-b hm-col-0">
|
|
￥<text class="hm-font-100">{{userInfo.v.grade.buy_price}}</text>
|
|
</view>
|
|
<view class="hm-font-28 hm-col-content">购买会员卡</view>
|
|
</view>
|
|
<view class="hm-p-20 hm-border-t" @click="type = 30">
|
|
<view class="hm-m-r-10 hm-dis-block-inline">
|
|
<u-icon name="weixin-circle-fill" size="25" color="#19be6b"></u-icon>
|
|
</view>
|
|
微信
|
|
<view class="hm-fr hm-dis-block-inline">
|
|
<u-icon name="checkbox-mark" v-if="type==30" size="25" color="#fa3534"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="hm-p-20 hm-border-t hm-border-b" @click="type = 40">
|
|
<view class="hm-m-r-10 hm-dis-block-inline">
|
|
<u-icon name="zhifubao-circle-fill" size="25" color="#2979ff"></u-icon>
|
|
</view>
|
|
支付宝
|
|
<view class="hm-fr hm-dis-block-inline">
|
|
<u-icon name="checkbox-mark" v-if="type==40" size="25" color="#fa3534"></u-icon>
|
|
</view>
|
|
</view>
|
|
<view class="hm-p-t-50">
|
|
<view class="hm-p-lr-b25">
|
|
<u-button type="error" @click="payment" text="确定支付"></u-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
const App = getApp();
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
action:'vip',
|
|
userInfo: {},
|
|
applet: {},
|
|
lv: 0,
|
|
type: 30,//默认30微信支付 40支付宝支付
|
|
cashier_show: false,//收银台
|
|
};
|
|
},
|
|
|
|
components: {},
|
|
props: {},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面加载
|
|
*/
|
|
onLoad(options) {
|
|
let _this = this;
|
|
_this.action = options.action;
|
|
if(options.action == 'vip'){
|
|
uni.setNavigationBarTitle({
|
|
title: '开通会员'
|
|
});
|
|
}else{
|
|
uni.setNavigationBarTitle({
|
|
title: '会员权益'
|
|
});
|
|
}
|
|
// #ifdef MP-ALIPAY
|
|
_this.type = 40;
|
|
//#endif
|
|
_this.applet = uni.getStorageSync('applet');
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
onShow() {
|
|
let _this = this;
|
|
_this.getUserDetail();
|
|
},
|
|
|
|
methods: {
|
|
/**
|
|
* 打开收银台
|
|
*/
|
|
cashier:function(){
|
|
let _this = this;
|
|
let money = _this.userInfo.v.grade.buy_price;
|
|
if (money == '') {
|
|
App.showError('付款金额不可为空');
|
|
return false;
|
|
}
|
|
_this.cashier_show = true;
|
|
},
|
|
/**
|
|
* 购买会员
|
|
*/
|
|
payment(){
|
|
let _this = this;
|
|
let money = _this.userInfo.v.grade.buy_price;
|
|
if (money == '') {
|
|
App.showError('付款金额不可为空');
|
|
return false;
|
|
}
|
|
let callback = function(result) {
|
|
_this.cashier_show = false;
|
|
if (result.code === -10) {
|
|
App.showError(result.msg);
|
|
return false;
|
|
}
|
|
// 发起微信支付
|
|
// #ifdef MP-WEIXIN
|
|
uni.requestPayment({
|
|
timeStamp: result.data.timeStamp,
|
|
nonceStr: result.data.nonceStr,
|
|
package: result.data.package,
|
|
signType: result.data.signType,
|
|
paySign: result.data.paySign,
|
|
success: function(res) {
|
|
App.showSuccess('支付成功', function() {
|
|
uni.navigateBack();
|
|
});
|
|
},
|
|
fail: function(res) {
|
|
let msg = '支付失败';
|
|
if(res.errMsg == 'requestPayment:fail cancel'){
|
|
msg = '用户取消支付';
|
|
}
|
|
App.showError(msg);
|
|
}
|
|
});
|
|
//#endif
|
|
//#ifdef H5
|
|
// #ifdef MP-WEIXIN
|
|
window.location.href = result.data.h5_url;
|
|
//#endif
|
|
//#endif
|
|
// #ifdef MP-ALIPAY
|
|
uni.requestPayment({
|
|
orderInfo: result.data.trade_no,
|
|
success: function(res) {
|
|
if(res.resultCode != '9000'){
|
|
App.showError(res.memo);
|
|
return false;
|
|
}
|
|
App.showSuccess('支付成功', function() {
|
|
uni.navigateBack();
|
|
});
|
|
}
|
|
});
|
|
//#endif
|
|
};
|
|
// 显示loading
|
|
uni.showLoading({
|
|
title: '正在处理...'
|
|
});
|
|
App._post_form('user.index/buyVip', {
|
|
money: money,
|
|
type: _this.type
|
|
}, function(result) {
|
|
callback(result);
|
|
});
|
|
},
|
|
/**
|
|
* 开通会员
|
|
*/
|
|
openVip(){
|
|
let _this = this;
|
|
// 显示loading
|
|
uni.showLoading({
|
|
title: '正在处理...'
|
|
});
|
|
App._post_form('user.index/openVip', {}, function(result) {
|
|
uni.hideLoading();
|
|
App.showSuccess(result.msg, function() {
|
|
uni.navigateBack();
|
|
});
|
|
});
|
|
},
|
|
/**
|
|
* 获取当前用户信息
|
|
*/
|
|
getUserDetail() {
|
|
let _this = this;
|
|
App._get('user/detail', {}, result => {
|
|
_this.userInfo = result.data.detail;
|
|
});
|
|
},
|
|
change(e) {
|
|
let _this = this;
|
|
_this.lv = e.current;
|
|
}
|
|
|
|
}
|
|
};
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.title{
|
|
font-weight: bold;
|
|
color: #333;
|
|
text-align: center;
|
|
padding-bottom: 20rpx;
|
|
.lv {
|
|
margin: 0rpx 10rpx 0rpx -15rpx;
|
|
}
|
|
.discount{
|
|
color: #999;
|
|
font-size: 24rpx;
|
|
margin-left: 10rpx;
|
|
font-weight: normal;
|
|
}
|
|
}
|
|
.menu {
|
|
margin-top: 20rpx;
|
|
border-radius: 8rpx;
|
|
padding: 20rpx;
|
|
background-color: #fff;
|
|
.navbar-list {
|
|
padding: 20rpx;
|
|
line-height: 50rpx;
|
|
image {
|
|
float: left;
|
|
margin-right: 20rpx;
|
|
height: 50rpx;
|
|
width: 50rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|