zhangjing/sykl-sm
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[锶源昆仑-寺庙捐赠活动]

Browse Source
This commit is contained in:
张慢慢
2023-05-15 13:53:32 +08:00
parent 1b6eb2668c
commit c9b18c9074
284 changed files with 9505 additions and 3822 deletions
Download Patch File Download Diff File Expand all files Collapse all files

242
pages/member/index.vue Normal file
View File

@@ -0,0 +1,242 @@
<template>
<view class="content">
<image class="member-back" v-if="tabType == 'month'" src="http://api.temple.siyuankunlun.cn/storage/materials/2023/01/04/monthMember_back.png" mode="aspectFill"></image>
<image class="member-back" v-else-if="tabType == 'season'" src="http://api.temple.siyuankunlun.cn/storage/materials/2023/01/04/member_back.png" mode="aspectFill"></image>
<image class="member-back" v-else src="http://api.temple.siyuankunlun.cn/storage/materials/2023/01/04/yearMember_back.png" mode="aspectFill"></image>
<view class="tab">
<view class="tab-item monthColor" :class="{active : tabType == 'month'}" @click="typeClick('month')">月卡会员</view>
<view class="tab-item seasonColor" :class="{active : tabType == 'season'}" @click="typeClick('season')">季卡会员</view>
<view class="tab-item yearColor" :class="{active : tabType == 'year'}" @click="typeClick('year')">年卡会员</view>
</view>
<view class="rights">
<view class="member-cont">
<block v-if="tabType == 'month'">
<image class="member-title" src="http://api.temple.siyuankunlun.cn/storage/materials/2023/01/04/monthMember_title.png" mode="widthFix"></image>
</block>
<block v-else-if="tabType == 'season'">
<image class="member-title" src="http://api.temple.siyuankunlun.cn/storage/materials/2023/01/04/quarterMember_title.png" mode="widthFix"></image>
<!-- <image v-if="couponPrice" class="member-error" src="http://api.siyuankunlun.com/storage/materials/2022/08/30/member_cost.png" mode="widthFix"></image> -->
</block>
<block v-else>
<image class="member-title" src="http://api.temple.siyuankunlun.cn/storage/materials/2023/01/04/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>
<view class="member-btn-text" v-if="can.open" @click="$Router.push({name: 'memberOpen', params:{identity_id: newId}})">点击开通会员</view>
<block v-else>
<view class="member-btn-text" v-if="can.renew" @click="$Router.push({name: 'memberOpen', params:{identity_id: newId}})">
立即续费
</view>
<view class="member-btn-text active" v-else>
{{buttonText}}
</view>
</block>
<!-- <view class="member-btn-tips" v-if="tabType == 'season'">
<block v-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" v-else>
<image src="http://api.siyuankunlun.com/storage/materials/2022/08/30/member_choose.png" mode="aspectFill"></image>
开通年度会员享受5.25折
</view> -->
</view>
</view>
</view>
</template>
<script>
import { identitySee } from '@/apis/interfaces/member'
import { userIndex } from '@/apis/interfaces/user'
export default {
data() {
return {
identities : '', //身份信息
userData : '', //用户信息
tabType : 'month', //会员标签
can : '', //操作按钮
buttonText : '', //按钮名字
notRules : '', //权益
couponPrice : '' ,//抵值券
newId : '' //会员id
}
},
onShow() {
// 获取用户信息
this.userInfo();
// 获取身份前置
this.identityInfo();
},
methods: {
// 用户信息
userInfo() {
userIndex().then(res => {
this.userData = res
}).catch(err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
},
// 身份前置
identityInfo(){
// 3为季卡,4为年卡
let identityId = ''
if(this.tabType == 'month') {
identityId = 2
}else if(this.tabType == 'season') {
identityId = 3
} else {
identityId = 4
}
identitySee(identityId).then(res => {
this.identities = res
this.notRules = res.not_rules
this.can = res.can
this.buttonText = res.buttonText
this.newId = res.identity_id
}).catch(err => {
uni.showToast({
title: err.message,
icon: "none"
})
})
},
// 切换身份
typeClick(e) {
this.tabType = e
// 获取身份前置
this.identityInfo();
}
}
}
</script>
<style lang="scss" scoped>
.tab {
position: fixed;
left: 0;
top: 0;
z-index: 99;
width: 100%;
display: flex;
padding: 0 $padding;
box-sizing: border-box;
height: 90rpx;
font-weight: 600;
// .monthColor {
// background-color: #e27216;
// border-bottom: 2rpx solid #e27216;
// }
// .seasonColor {
// background-color: #a92021;
// border-bottom: 2rpx solid #bd3335;
// }
// .yearColor {
// background-color: #2b0a58;
// border-bottom: 2rpx solid #402663;
// }
.tab-item {
height: 90rpx;
flex: 2;
text-align: center;
line-height: 90rpx;
color: #efb480;
position: relative;
&::after {
position: absolute;
content: '';
left: calc(50% - 40rpx);
bottom: 0;
width: 80rpx;
height: 6rpx;
background-color: #efb480;
border-radius: $radius;
display: none;
}
&.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 $padding $padding;
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: $title-size + 6;
&.active {
color: #000;
}
}
.member-btn-tips {
position: absolute;
text-align: center;
width: 100%;
z-index: 2;
color: #fff;
color: #f1c39a;
font-size: $title-size-sm;
bottom: -40rpx;
line-height: 34rpx;
image {
width: 30rpx;
height: 30rpx;
vertical-align: -4rpx;
display: inline-block;
margin-right: 10rpx;
}
}
}
</style>