锶源昆仑会员+体验官

This commit is contained in:
2023-07-22 19:04:56 +08:00
commit 5a6b3517e6
439 changed files with 20654 additions and 0 deletions

89
pages/memberOpen/index.js Normal file
View File

@@ -0,0 +1,89 @@
/*
* 手太欠
* 愿这世界都如故事里一样 美好而动人~
*/
Page({
/**
* 页面的初始数据
*/
data: {
userLogin : false,
identities : '', //身份信息
userData : '', //用户信息
tabType : 'season', //会员标签
can : '', //操作按钮
buttonText : '', //按钮名字
notRules : '', //权益
couponPrice : '' ,//抵值券
newId : '' //会员id
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
// 获取登录状态
if(wx.getStorageSync("token")){
this.setData({
userLogin: true
})
// 获取用户信息
this.userInfo();
}
// 获取身份前置
this.identityInfo();
},
/**
* 用户信息
*/
userInfo() {
wx.$api.user.userIndex().then(res => {
this.setData({
userData: res.data.identity.order
})
}).catch(err => {})
},
/**
* 身份前置
*/
identityInfo(){
// 3为季卡,4为年卡
let identityId = ''
if(this.data.tabType == 'season') {
identityId = 3
} else {
identityId = 4
}
wx.$api.member.identitySee(identityId).then(res => {
this.setData({
identities : res.data,
couponPrice : res.data.coupon_price,
notRules : res.data.not_rules,
can : res.data.can,
buttonText : res.data.buttonText,
newId : res.data.identity_id
})
}).catch(err => {})
},
/**
* 切换身份
*/
typeClick(e) {
this.setData({
tabType: e.currentTarget.dataset.type
})
// 获取身份前置
this.identityInfo();
}
})

View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"navigationBarTitleText": "开通会员"
}

View File

@@ -0,0 +1,62 @@
<block wx:if="{{userData >= 3}}">
<image class="memberBack" mode="aspectFill" src="https://api.siyuankunlun.com/storage/materials/2022/10/10/cc75bfc7fc6e06a0527253dd09adc373.png"></image>
<view class="memberTips">
<view class="memberTips-top">
<view class="memberTips-name"><text>你已开通</text></view>
<text>锶源昆仑天然饮用水会员</text>
</view>
<image class="memberTips-icon" mode="widthFix" src="https://api.siyuankunlun.com/storage/materials/2022/10/10/memberIcon.png"></image>
<view class="memberTips-title">
<text>都兰圣地 源水活取,饮水锶源 古海冰泉</text>
<text>高镁高钙 富氢低氘,大地礼物 好水天成</text>
</view>
<navigator hover-class="none" url="/pages/user/index" open-type="switchTab" class="memberTips-brn">会员中心</navigator>
</view>
</block>
<block wx:else>
<image class="member-back" src="{{tabType == 'season' ? 'http://api.siyuankunlun.com/storage/materials/2022/08/30/member_back.png' : 'http://api.siyuankunlun.com/storage/materials/2022/08/30/yearMember_back.png'}}" mode="aspectFill"></image>
<view class="tab {{tabType == 'year' ? 'active' : ''}}">
<view class="tab-item {{tabType == 'season' ? 'active' : ''}}" bindtap="typeClick" data-type="season">季卡会员</view>
<view class="tab-item {{tabType == 'year' ? 'active' : ''}}" bindtap="typeClick" data-type="year">年卡会员</view>
</view>
<view class="rights">
<view class="member-cont">
<block wx:if="{{tabType == 'season'}}">
<image class="member-title" src="{{couponPrice ? 'http://api.siyuankunlun.com/storage/materials/2022/08/30/quarterMember_title.png' : 'http://api.siyuankunlun.com/storage/materials/2022/08/30/quarterMember_price.png'}}" mode="widthFix"></image>
<image wx:if="{{couponPrice}}" class="member-error" src="http://api.siyuankunlun.com/storage/materials/2022/08/30/member_cost.png" mode="widthFix"></image>
</block>
<block wx:else>
<image class="member-title" src="http://api.siyuankunlun.com/storage/materials/2022/08/30/yearMember_title.png" mode="widthFix"></image>
<image class="member-error" src="http://api.siyuankunlun.com/storage/materials/2022/08/30/yearMember_cost.png" mode="widthFix"></image>
</block>
</view>
<view class="member-btn">
<image class="member-btn-img" src="http://api.siyuankunlun.com/storage/materials/2022/08/30/member_Btn.png" mode="widthFix"></image>
<block wx:if="{{userLogin}}">
<navigator hover-class="none" url="/pages/member/open/index?identity_id={{newId}}" class="member-btn-text" wx:if="{{can.open}}" >点击开通会员</navigator>
<block wx:else>
<navigator hover-class="none" url="/pages/member/open/index?identity_id={{newId}}" class="member-btn-text" wx:if="{{can.renew}}">
立即续费
</navigator>
<view class="member-btn-text active" wx:else>
{{buttonText}}
</view>
</block>
<view class="member-btn-tips" wx:if="{{tabType == 'season'}}">
<block wx:if="{{couponPrice}}">
<image src="http://api.siyuankunlun.com/storage/materials/2022/08/30/member_choose.png" mode="aspectFill"></image>
您有一张抵值券可抵¥8640元
</block>
</view>
<view class="member-btn-tips" wx:else>
<image src="http://api.siyuankunlun.com/storage/materials/2022/08/30/member_choose.png" mode="aspectFill"></image>
开通年度会员享受5.25折
</view>
</block>
<block wx:else>
<navigator hover-class="none" url="/pages/login/index" class="member-btn-text">点击开通会员</navigator>
</block>
</view>
</view>
</block>

188
pages/memberOpen/index.wxss Normal file
View File

@@ -0,0 +1,188 @@
.tab {
position: fixed;
left: 0;
top: 0;
z-index: 99;
width: 100%;
display: flex;
padding: 0 30rpx;
box-sizing: border-box;
height: 90rpx;
background-color: #2b0a58;
font-weight: 600;
border-bottom: 2rpx solid #402663;
}
.tab.active {
background-color: #a92021;
border-bottom: 2rpx solid #bd3335;
}
.tab-item {
height: 90rpx;
flex: 2;
text-align: center;
line-height: 90rpx;
color: #efb480;
position: relative;
}
.tab-item::after {
position: absolute;
content: '';
left: calc(50% - 40rpx);
bottom: 0;
width: 80rpx;
height: 6rpx;
background-color: #efb480;
border-radius: 30rpx;
display: none;
}
.tab-item.active::after {
display: block;
}
.member-back {
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
text-align: center;
}
.rights {
position: relative;
width: 100%;
}
.member-cont {
padding: 140rpx 30rpx 30rpx;
box-sizing: border-box;
text-align: center;
width: 100%;
position: absolute;
top: 0;
left: 0;
height: calc(70vh + 120rpx);
}
.member-title {
width: 100%;
margin: 0 auto;
}
.member-error {
width: 40%;
margin-top: -30rpx;
}
.member-btn {
position: absolute;
z-index: 1;
top: calc(30vh + 80rpx);
left: 0;
width: 100%;
text-align: center;
}
.member-btn-img {
width: 100%;
}
.member-btn-text {
position: absolute;
width: 100%;
z-index: 200;
color: #fff;
bottom: 42rpx;
color: #a21a1e;
left: 0;
font-size: 38rpx;
}
.member-btn-text.active {
color: #000;
}
.member-btn-tips {
position: absolute;
text-align: center;
width: 100%;
z-index: 2;
color: #fff;
color: #f1c39a;
font-size: 26rpx;
bottom: -40rpx;
line-height: 34rpx;
}
.member-btn-tips image {
width: 30rpx;
height: 30rpx;
vertical-align: -4rpx;
display: inline-block;
margin-right: 10rpx;
}
/* 已是会员 */
.memberBack {
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 1;
}
.memberTips {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 9;
padding: 120rpx 80rpx;
text-align: center;
box-sizing: border-box;
}
.memberTips-icon {
width: 45%;
margin: 100rpx auto;
}
.memberTips-top text {
background-image:-webkit-linear-gradient(bottom,#826352,#3f404a);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
font-weight: 600;
}
.memberTips-name {
font-size: 50rpx;
line-height: 84rpx;
}
.memberTips-title {
font-size: 28rpx;
color: #4c5264;
font-weight: 600;
box-sizing: border-box;
line-height: 44rpx;
}
.memberTips-title text {
display: block;
}
.memberTips-brn {
background-color: #41424e;
color: #fff;
border-radius: 80rpx;
height: 82rpx;
line-height: 82rpx;
color: #fff0c6;
font-size: 28rpx;
width: 55%;
margin: 100rpx auto 0;
}