Commit 11974f4c by zhangzhen

功能完善优化

parent c9688615
import http from "@/common/vmeitime-http/index.js"
// 会员配置列表
export const memberConfigList=(data)=>{
let url=`/memberConfig/query`
return http.get(url,data)
}
...@@ -204,6 +204,20 @@ ...@@ -204,6 +204,20 @@
"navigationBarTitleText": "活动规则", "navigationBarTitleText": "活动规则",
"enablePullDownRefresh" : false "enablePullDownRefresh" : false
} }
},
{
"path" : "equityDetail/index",
"style": {
"navigationBarTitleText": "权益详情",
"enablePullDownRefresh" : false
}
},
{
"path" : "levelDetail/index",
"style": {
"navigationBarTitleText": "会员等级详情",
"enablePullDownRefresh" : false
}
} }
] ]
} }
......
...@@ -14,19 +14,19 @@ ...@@ -14,19 +14,19 @@
<view class="flex-col margin-left user-info-box"> <view class="flex-col margin-left user-info-box">
<text class="text-title text-lg text-bold text-xxl">{{userInfo.nickName||"凑角用户"}}</text> <text class="text-title text-lg text-bold text-xxl">{{userInfo.nickName||"凑角用户"}}</text>
<view class="flex-row" style="margin-top: 10rpx;"> <view class="flex-row" style="margin-top: 10rpx;">
<view v-if="userInfo.consumerMember&&userInfo.consumerMember.isRecharge" class="relative"> <view v-if="userInfo.consumerMember&&userInfo.consumerMember.isRecharge" class="relative" @tap.stop="onNavToVip">
<image class="img-icon" :src="assetsPath+'/tag_icon_1.png'" mode="widthFix"></image> <image class="img-icon" :src="assetsPath+'/tag_icon_1.png'" mode="widthFix"></image>
<view class="absolute"> <view class="absolute">
<text class="text-1">充值会员</text> <text class="text-1">充值会员</text>
</view> </view>
</view> </view>
<view v-if="userInfo.consumerMember&&userInfo.consumerMember.isRights" class="relative" > <view v-if="userInfo.consumerMember&&userInfo.consumerMember.isRights" class="relative" @tap.stop="onNavByPath('equityDetail')">
<image class="img-icon" :src="assetsPath+'/tag_icon_2.png'" mode="widthFix"></image> <image class="img-icon" :src="assetsPath+'/tag_icon_2.png'" mode="widthFix"></image>
<view class="absolute"> <view class="absolute">
<text class="text-2">权益会员</text> <text class="text-2">权益会员</text>
</view> </view>
</view> </view>
<view v-if="!userInfo.consumerMember || !(userInfo.consumerMember.isRights && userInfo.consumerMember.isRecharge) " class="relative" > <view v-if="!userInfo.consumerMember || !(userInfo.consumerMember.isRights && userInfo.consumerMember.isRecharge) " class="relative" @tap.stop="onNavToVip">
<image class="img-icon" :src="assetsPath+'/tag_icon_3.png'" mode="widthFix"></image> <image class="img-icon" :src="assetsPath+'/tag_icon_3.png'" mode="widthFix"></image>
<view class="absolute"> <view class="absolute">
<text class="text-3">普通会员</text> <text class="text-3">普通会员</text>
...@@ -34,7 +34,8 @@ ...@@ -34,7 +34,8 @@
</view> </view>
</view> </view>
<view v-if="userInfo.consumerMember.isRights" class="tip-date"> <view v-if="userInfo.consumerMember.isRights" class="tip-date">
<text>权益{{userInfo.consumerMember.expirationDate}}到期</text> <text>权益 <text class="text-bold">{{userInfo.consumerMember.expirationDate}}</text> 到期</text>
<text class="text-blue" @tap.stop="onGetEquityMembersList">续费</text>
</view> </view>
</view> </view>
<view class="nav-right" @tap.stop="onNavToSetUserInfo"> <view class="nav-right" @tap.stop="onNavToSetUserInfo">
...@@ -44,7 +45,7 @@ ...@@ -44,7 +45,7 @@
</view> </view>
<view class="remeber-info-box"> <view class="remeber-info-box">
<view class="relative flex-7"> <view class="relative flex-7" @tap="onNavByPath('levelDetail')" >
<image v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===1" class="level-bg" :src="assetsPath+'/user/tj_bg_1.png'" mode="scaleToFill"></image> <image v-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===1" class="level-bg" :src="assetsPath+'/user/tj_bg_1.png'" mode="scaleToFill"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="level-bg" :src="assetsPath+'/user/tongj_bg_1.png'" mode="scaleToFill"></image> <image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===2" class="level-bg" :src="assetsPath+'/user/tongj_bg_1.png'" mode="scaleToFill"></image>
<image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="level-bg" :src="assetsPath+'/user/yj_bg_1.png'" mode="scaleToFill"></image> <image v-else-if="userInfo.memberConfig && userInfo.memberConfig.membershipLevel ===3" class="level-bg" :src="assetsPath+'/user/yj_bg_1.png'" mode="scaleToFill"></image>
...@@ -327,6 +328,53 @@ ...@@ -327,6 +328,53 @@
</view> </view>
</view> </view>
</uni-popup> </uni-popup>
<uni-popup ref="popupPay" type="center">
<view class="popup-box-content">
<view class="popup-box popup-box-2">
<view class="close-box" @tap="onClose">
<text class="cuIcon-close text-xl text-icon" ></text>
</view>
<view class="title-header">
<text class="text-title text-black text-lg text-bold">购买详情</text>
</view>
<view class="flex-col popup-content">
<view class="recharge-content">
<text v-if="consumerMemberStatus" class="text-1">权益续期,<text class="text-pink">{{userInfo.consumerMember.expirationDate}}</text> 过期,优惠享不停,待支付:</text>
<text v-else class="text-1">购买权益,优惠享不停,待支付:</text>
<view class="payfee-text">
<text>{{list[0].requiredAmount}}</text>
</view>
<view class="flex-row content-tip">
<text class="text-3">可享权益:</text>
<view class="flex-col">
<view class="flex-row-center">
<view class="gift-box">
<image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix"></image>
</view>
<text class="text-13">房间预定,会员日即可享98折起</text>
</view>
<view class="flex-row-center">
<view class="gift-box">
<image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix"></image>
</view>
<text class="text-13">房间预定,下单即可享会员积分赠送</text>
</view>
<view class="flex-row-center">
<text class="text-13">更多权益请查看多动规则</text>
</view>
</view>
</view>
</view>
</view>
<view class="btn-list-box">
<view class="btn-box">
<button class="cu-btn bg-pink" @tap="onCreateEquityMembers">确认支付</button>
</view>
</view>
</view>
</view>
</uni-popup>
</view> </view>
</template> </template>
...@@ -345,6 +393,10 @@ ...@@ -345,6 +393,10 @@
import { import {
orderList orderList
} from "@/api/order.js" } from "@/api/order.js"
import {
equityMembersList,
createEquityMembers
} from "@/api/userInfo.js";
export default { export default {
components: { components: {
...@@ -400,8 +452,12 @@ ...@@ -400,8 +452,12 @@
deviceManage:"/pages/deviceManage/index", deviceManage:"/pages/deviceManage/index",
cleanManage:"/pages/cleanManage/cleanManage", cleanManage:"/pages/cleanManage/cleanManage",
cleanRecord:"/pages/cleanRecord/index", cleanRecord:"/pages/cleanRecord/index",
couponList:"/pages/couponList/index" couponList:"/pages/couponList/index",
} equityDetail:"/setting/rule/rule?keyData=user_equity_details",
levelDetail:"/setting/levelDetail/index"
},
list:[],
consumerMemberStatus:false
} }
}, },
onShow() { onShow() {
...@@ -444,6 +500,9 @@ ...@@ -444,6 +500,9 @@
getUserInfo().then(res => { getUserInfo().then(res => {
if (res.data.code == 200) { if (res.data.code == 200) {
this.userInfo = res.data.data; this.userInfo = res.data.data;
if (this.userInfo.consumerMember && this.userInfo.consumerMember.isRights) {
this.consumerMemberStatus = true;
}
this.userName = this.userInfo.phone.slice(-4); this.userName = this.userInfo.phone.slice(-4);
uni.setStorageSync('userInfo', this.userInfo) uni.setStorageSync('userInfo', this.userInfo)
this.onGetOrderInfo(); this.onGetOrderInfo();
...@@ -561,6 +620,80 @@ ...@@ -561,6 +620,80 @@
uni.navigateTo({ uni.navigateTo({
url:this.routePathEnum[pathName] url:this.routePathEnum[pathName]
}) })
},
onNavToVip(){
uni.switchTab({
url:"/pages/vipCreate/vipCreate"
})
},
onGetEquityMembersList(){
equityMembersList().then(res => {
console.log(res, 999999)
if (res.data.code == 200 && res.data.rows) {
this.list = res.data.rows;
if(this.list&&this.list.length){
this.$refs.popupPay.open();
}else{
uni.showToast({
icon:"none",
title:"暂时无法续费,请联系客服"
})
}
}
})
},
onCreateEquityMembers(){
let that = this;
uni.showLoading({
title: "提交中..."
})
createEquityMembers({
payType: 1,
equityMembersConfigId: this.list[0].id
}).then(res => {
uni.hideLoading();
if (res.data.data && res.data.data.jsConfig) {
wx.requestPayment({
"timeStamp": res.data.data.jsConfig.timeStamp,
"nonceStr": res.data.data.jsConfig.nonceStr,
"package": res.data.data.jsConfig.packages,
"signType": res.data.data.jsConfig.signType,
"paySign": res.data.data.jsConfig.paySign,
"success": (resp) => {
// 支付成功
uni.showToast({
icon: "success",
title: "下单成功",
success: () => {
that.$refs.popupPay.close();
setTimeout(() => {
this.onGetUserInfo();
}, 1000)
}
})
},
"fail": (resp) => {
// 取消支付或支付失败
uni.showToast({
title: "取消支付"
})
},
"complete": (resp) => {
that.$refs.popupPay.close();
// 接口调用结束的回调函数(调用成功、失败都会执行)
}
});
} else {
uni.showToast({
icon:"none",
title: res.data.msg
})
}
})
},
onClose() {
this.$refs.popupPay.close()
} }
} }
} }
...@@ -884,10 +1017,19 @@ ...@@ -884,10 +1017,19 @@
filter: grayscale(100%); filter: grayscale(100%);
} }
.tip-date{ .tip-date{
display: flex;
flex-direction: row;
align-items: center;
font-weight: normal; font-weight: normal;
font-size: 20rpx; font-size: 20rpx;
color: #A3A3A3; color: #A3A3A3;
margin-top: 10upx; margin-top: 10upx;
.text-bold{
margin: 0 4upx;
}
.text-blue{
margin-left: 6upx;
}
} }
} }
.remeber-info-box{ .remeber-info-box{
...@@ -1114,4 +1256,191 @@ ...@@ -1114,4 +1256,191 @@
} }
} }
.popup-box {
display: flex;
flex-direction: column;
// background: linear-gradient(-45deg,rgba(255, 170, 0, 0.98), rgba(255,255,255,0.98));
background: linear-gradient(-45deg, #ffffff, #f1f1f1);
border-radius: 12upx;
width: 80%;
margin: 0 auto;
.title-header {
display: flex;
justify-content: center;
align-items: center;
padding: 24upx 0;
border-bottom: 1px dashed #fce051;
}
.popup-content {
display: flex;
align-items: center;
padding: 30upx 24upx;
width: 100%;
border-radius: 0 0 0 0;
min-height: 180upx;
}
.btn-list-box {
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
border-top: 1px solid #fce051;
.btn-box {
display: flex;
flex: 1;
justify-content: center;
align-items: center;
padding: 24upx 0;
.cu-btn {
width: 80%;
}
.bg-gray {
// color: #ffffff;
}
.bg-pink {
background-color: rgba(224, 57, 151, 0.74);
}
}
}
}
.popup-box-content{
background-color: #ffffff;
width: 72vw;
border-radius: 36upx;
overflow: hidden;
}
.popup-box-2{
position: relative;
width: 100%;
background: linear-gradient(0deg, rgba(255,255,255,0.65), rgba(255,214,241,0.43));
.close-box{
position: absolute;
top: 16upx;
right: 20upx;
display: flex;
justify-content: center;
align-items: center;
width: 24px;
height: 24px;
font-size: 36upx;
}
.title-header{
display: flex;
justify-content: center;
align-items: center;
padding: 30upx 24upx 8upx;
border-bottom: none;
.text-title{
font-size: 36upx;
color: #333333;
}
}
.popup-content{
padding: 0 24upx;
min-height: 240upx;
.recharge-content{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
.text-1{
font-weight: 400;
font-size: 24upx;
color: #666666;
}
.payfee-text{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
padding: 10upx 0 16upx;
margin-bottom: 16upx;
border-bottom: 1px dashed #C9CACA;
text{
font-size: 52rpx;
color: #E40583;
}
}
.flex-row{
.flex-col{
.text-12{
width: 77upx;
color: #000000;
font-size: 28upx;
font-weight: bold;
text-align: justify-all;
}
.text-13{
color: #999999;
font-size: 26upx;
margin-left: 4upx;
}
.text-14{
color: #000000;
}
}
}
.content-tip{
display: flex;
flex-direction: column;
margin: 20upx 0 12upx;
.text-3{
font-size: 28upx;
color: #333333;
margin-bottom: 20upx;
}
.flex-col{
align-items: flex-start;
.flex-row-center{
margin: 8upx 0;
.gift-box{
display: flex;
justify-content: center;
align-items: center;
width: 22px;
height: 22px;
background: #FCE8F2;
border-radius: 6px;
.gift-icon{
display: block;
width: 70%;
max-height: 40upx;
}
}
}
}
}
}
}
.btn-list-box{
display: flex;
justify-content: center;
align-items: center;
width: 100%;
border-top: none;
.btn-box{
display: flex;
flex: none;
width: 87%;
.cu-btn{
padding: 0;
width: 100%;
height: 88upx;
background: #E40583;
border-radius: 44upx;
font-size: 37upx;
color: #FFFFFF;
}
}
}
}
</style> </style>
\ No newline at end of file
...@@ -68,7 +68,16 @@ ...@@ -68,7 +68,16 @@
</view> </view>
<view v-if="tabIndex ==2" class="flex-col list-box-2"> <view v-if="tabIndex ==2" class="flex-col list-box-2">
<view class="flex-row part-1">
<view v-if="consumerMemberStatus" class="flex-row part-1">
<view class="text-bg-1">
<text>专属</text>
</view>
<text class="text-2">超值回馈!</text>
<text class="text-3">(权益会员独享)</text>
</view>
<view v-else class="flex-row part-1">
<view class="text-bg-1"> <view class="text-bg-1">
<text>特惠</text> <text>特惠</text>
</view> </view>
...@@ -77,7 +86,28 @@ ...@@ -77,7 +86,28 @@
</view> </view>
<view class="part-2"> <view class="part-2">
<image class="img-bg" :src="assetsPath+'/vip/qy_bg_1.png'" mode="widthFix"></image> <image class="img-bg" :src="assetsPath+'/vip/qy_bg_1.png'" mode="widthFix"></image>
<view class="absolute">
<view v-if="consumerMemberStatus" class="absolute">
<view class="flex-5">
<view class="flex-row">
<text class="text-1">次卡</text>
<text class="text-2">充值 畅玩无忧</text>
</view>
<text class="text-3">有效期:领取后1年内有效</text>
</view>
<view class="flex-3">
<view class="flex-col">
<!-- <text class="text-1"></text> -->
<text class="text-2">暂未上线</text>
<text class="text-2">敬请期待</text>
</view>
<!-- <view class="cu-btn-box" @tap="onSubmit">
<button class="cu-btn bg-pink">立即购买</button>
</view> -->
</view>
</view>
<view v-else class="absolute">
<view class="flex-5"> <view class="flex-5">
<view class="flex-row"> <view class="flex-row">
<text class="text-1">权益</text> <text class="text-1">权益</text>
...@@ -88,8 +118,10 @@ ...@@ -88,8 +118,10 @@
<view class="flex-3"> <view class="flex-3">
<view class="flex-row"> <view class="flex-row">
<text class="text-1"></text> <text class="text-1"></text>
<text class="text-2">{{equityAmountList.length? equityAmountList[0]:'99'}}.</text> <text
<text class="text-3">{{equityAmountList.length? equityAmountList[1]:'00'}}</text> class="text-2">{{equityAmountList.length? equityAmountList[0]:'99'}}.</text>
<text
class="text-3">{{equityAmountList.length? equityAmountList[1]:'00'}}</text>
</view> </view>
<view class="cu-btn-box" @tap="onSubmit"> <view class="cu-btn-box" @tap="onSubmit">
<button class="cu-btn bg-pink"> {{consumerMemberStatus? '权益续期':'立即开通'}}</button> <button class="cu-btn bg-pink"> {{consumerMemberStatus? '权益续期':'立即开通'}}</button>
...@@ -102,7 +134,8 @@ ...@@ -102,7 +134,8 @@
<checkbox class='round yellow' :class="checked?'checked':''" :checked="checked" <checkbox class='round yellow' :class="checked?'checked':''" :checked="checked"
value="checked" style="transform: scale(0.6);"></checkbox> value="checked" style="transform: scale(0.6);"></checkbox>
</checkbox-group> </checkbox-group>
<text>我已阅读</text><text class="text-pink" @tap="onNavToRule2">用户充值协议</text><text>,并同意协议内容</text> <text>我已阅读</text><text class="text-pink"
@tap="onNavToRule2">用户充值协议</text><text>,并同意协议内容</text>
</view> </view>
</view> </view>
</view> </view>
...@@ -154,7 +187,7 @@ ...@@ -154,7 +187,7 @@
</view> </view>
</view> </view>
<view class="adorn-1"> <view class="adorn-1">
<image class="img" :src="assetsPath+'/vip/adorn_1.png'" mode="widthFix"></image> <image class="img" :src="assetsPath+'/vip/adorn_1.png'" mode="widthFix"></image>
</view> </view>
...@@ -179,18 +212,19 @@ ...@@ -179,18 +212,19 @@
<button class="cu-btn bg-gray" @tap="onClose">取 消</button> <button class="cu-btn bg-gray" @tap="onClose">取 消</button>
</view> </view>
<view class="btn-box"> <view class="btn-box">
<button class="cu-btn bg-pink" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">授 权</button> <button class="cu-btn bg-pink" open-type="getPhoneNumber" @getphonenumber="onGetPhoneNumber">
</button>
</view> </view>
</view> </view>
</view> </view>
</uni-popup> </uni-popup>
<uni-popup ref="popupPay" type="center"> <uni-popup ref="popupPay" type="center">
<view class="popup-box-content"> <view class="popup-box-content">
<view class="popup-box popup-box-2"> <view class="popup-box popup-box-2">
<view class="close-box" @tap="onClose"> <view class="close-box" @tap="onClose">
<text class="cuIcon-close text-xl text-icon" ></text> <text class="cuIcon-close text-xl text-icon"></text>
</view> </view>
<view class="title-header"> <view class="title-header">
<text class="text-title text-black text-lg text-bold">购买详情</text> <text class="text-title text-black text-lg text-bold">购买详情</text>
...@@ -204,30 +238,38 @@ ...@@ -204,30 +238,38 @@
<view class="flex-row content-tip"> <view class="flex-row content-tip">
<text class="text-3">赠送:</text> <text class="text-3">赠送:</text>
<view class="flex-col"> <view class="flex-col">
<view class="flex-row-center" v-if="rechargeConfList[rechargeIndex].giveType.includes('1')"> <view class="flex-row-center"
<view class="gift-box"> v-if="rechargeConfList[rechargeIndex].giveType.includes('1')">
<image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix"></image> <view class="gift-box">
</view> <image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix">
<text class="text-12">{{rechargeConfList[rechargeIndex].giveAmount}}</text> </image>
<text class="text-13">钱包余额,下单可抵扣</text> </view>
<text class="text-12">{{rechargeConfList[rechargeIndex].giveAmount}}</text>
<text class="text-13">钱包余额,下单可抵扣</text>
</view> </view>
<view class="flex-row-center" v-if="rechargeConfList[rechargeIndex].giveType.includes('2')"> <view class="flex-row-center"
v-if="rechargeConfList[rechargeIndex].giveType.includes('2')">
<view class="gift-box"> <view class="gift-box">
<image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix"></image> <image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix">
</image>
</view> </view>
<text class="text-12">{{rechargeConfList[rechargeIndex].giveDuration}}小时</text> <text class="text-12">{{rechargeConfList[rechargeIndex].giveDuration}}小时</text>
<text class="text-13">时长,下单可抵扣</text> <text class="text-13">时长,下单可抵扣</text>
</view> </view>
<view class="flex-row-center" v-if="rechargeConfList[rechargeIndex].giveType.includes('3')"> <view class="flex-row-center"
v-if="rechargeConfList[rechargeIndex].giveType.includes('3')">
<view class="gift-box"> <view class="gift-box">
<image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix"></image> <image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix">
</image>
</view> </view>
<text class="text-12">{{rechargeConfList[rechargeIndex].giveRatio}}%</text> <text class="text-12">{{rechargeConfList[rechargeIndex].giveRatio}}%</text>
<text class="text-13">充值金额积分比例赠送</text> <text class="text-13">充值金额积分比例赠送</text>
</view> </view>
<view class="flex-row-center" v-if="rechargeConfList[rechargeIndex].giveType.includes('4')"> <view class="flex-row-center"
v-if="rechargeConfList[rechargeIndex].giveType.includes('4')">
<view class="gift-box"> <view class="gift-box">
<image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix"></image> <image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix">
</image>
</view> </view>
<text class="text-14">优惠券</text> <text class="text-14">优惠券</text>
<text class="text-13">1张,下单可抵扣</text> <text class="text-13">1张,下单可抵扣</text>
...@@ -236,7 +278,9 @@ ...@@ -236,7 +278,9 @@
</view> </view>
</view> </view>
<view v-else-if="tabIndex ==2" class="recharge-content"> <view v-else-if="tabIndex ==2" class="recharge-content">
<text v-if="consumerMemberStatus" class="text-1">权益续期,<text class="text-pink">{{userInfo.consumerMember.expirationDate}}</text> 过期,优惠享不停,待支付:</text> <text v-if="consumerMemberStatus" class="text-1">权益续期,<text
class="text-pink">{{userInfo.consumerMember.expirationDate}}</text>
过期,优惠享不停,待支付:</text>
<text v-else class="text-1">购买权益,优惠享不停,待支付:</text> <text v-else class="text-1">购买权益,优惠享不停,待支付:</text>
<view class="payfee-text"> <view class="payfee-text">
<text>{{list[0].requiredAmount}}</text> <text>{{list[0].requiredAmount}}</text>
...@@ -244,19 +288,21 @@ ...@@ -244,19 +288,21 @@
<view class="flex-row content-tip"> <view class="flex-row content-tip">
<text class="text-3">可享权益:</text> <text class="text-3">可享权益:</text>
<view class="flex-col"> <view class="flex-col">
<view class="flex-row-center" v-if="rechargeConfList[rechargeIndex].giveType.includes('1')"> <view class="flex-row-center">
<view class="gift-box"> <view class="gift-box">
<image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix"></image> <image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix">
</image>
</view> </view>
<text class="text-13">房间预定,会员日即可享98折起</text> <text class="text-13">房间预定,会员日即可享98折起</text>
</view> </view>
<view class="flex-row-center" v-if="rechargeConfList[rechargeIndex].giveType.includes('2')"> <view class="flex-row-center">
<view class="gift-box"> <view class="gift-box">
<image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix"></image> <image class="gift-icon" :src="assetsPath+'/gift_icon.png'" mode="widthFix">
</image>
</view> </view>
<text class="text-13">房间预定,下单即可享会员积分赠送</text> <text class="text-13">房间预定,下单即可享会员积分赠送</text>
</view> </view>
<view class="flex-row-center" v-if="rechargeConfList[rechargeIndex].giveType.includes('3')"> <view class="flex-row-center">
<text class="text-13">更多权益请查看多动规则</text> <text class="text-13">更多权益请查看多动规则</text>
</view> </view>
</view> </view>
...@@ -265,13 +311,13 @@ ...@@ -265,13 +311,13 @@
</view> </view>
<view class="btn-list-box"> <view class="btn-list-box">
<view class="btn-box"> <view class="btn-box">
<button class="cu-btn bg-pink" @tap="onConfirmPay">确认支付</button> <button class="cu-btn bg-pink" @tap="onConfirmPay">确认支付</button>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</uni-popup> </uni-popup>
<f-tabbar></f-tabbar> <f-tabbar></f-tabbar>
</view> </view>
</template> </template>
...@@ -304,14 +350,14 @@ ...@@ -304,14 +350,14 @@
checked: false, checked: false,
assetsPath: config.assetsPath, assetsPath: config.assetsPath,
list: [], list: [],
userInfo:{}, userInfo: {},
rechargeConfList: [], rechargeConfList: [],
tabIndex: 1, tabIndex: 1,
rechargeIndex: 0, rechargeIndex: 0,
index: 0, index: 0,
phoneCode:'', phoneCode: '',
consumerMemberStatus: false, consumerMemberStatus: false,
equityAmountList:[], equityAmountList: [],
preferList: [{ preferList: [{
iconUrl: config.assetsPath + "/vip/p_1.png", iconUrl: config.assetsPath + "/vip/p_1.png",
title: "会员价", title: "会员价",
...@@ -371,19 +417,19 @@ ...@@ -371,19 +417,19 @@
this.onLoading(); this.onLoading();
}, },
methods: { methods: {
onConfirmPay(){ onConfirmPay() {
if(this.tabIndex ==1){ if (this.tabIndex == 1) {
this.onCreateRecharge() this.onCreateRecharge()
}else if(this.tabIndex ==2){ } else if (this.tabIndex == 2) {
this.onCreateEquityMembers() this.onCreateEquityMembers()
} }
}, },
onClose(){ onClose() {
this.$refs.popup.close() this.$refs.popup.close()
this.$refs.popupPay.close() this.$refs.popupPay.close()
}, },
onGetPhoneNumber(e){ onGetPhoneNumber(e) {
if(e.detail.errMsg !== "getPhoneNumber:ok") return; if (e.detail.errMsg !== "getPhoneNumber:ok") return;
this.onClose(); this.onClose();
let that = this; let that = this;
this.phoneCode = e.detail.code; this.phoneCode = e.detail.code;
...@@ -393,12 +439,12 @@ ...@@ -393,12 +439,12 @@
title: "授权中" title: "授权中"
}) })
register({ register({
loginCode:res.code, loginCode: res.code,
phoneCode: this.phoneCode, phoneCode: this.phoneCode,
type: "routine", type: "routine",
}).then(res => { }).then(res => {
uni.hideLoading(); uni.hideLoading();
console.log(JSON.stringify(res),"注册后的数据结构") console.log(JSON.stringify(res), "注册后的数据结构")
if (res.data.code == 200) { if (res.data.code == 200) {
uni.setStorageSync('loginStatus', res.data.data.type || 'login') uni.setStorageSync('loginStatus', res.data.data.type || 'login')
uni.setStorageSync('tokenHeaders', "Authori-zation") uni.setStorageSync('tokenHeaders', "Authori-zation")
...@@ -406,12 +452,12 @@ ...@@ -406,12 +452,12 @@
key: uni.getStorageSync('tokenHeaders'), key: uni.getStorageSync('tokenHeaders'),
data: res.data.data.token, data: res.data.data.token,
success: (res) => { success: (res) => {
if(that.tabIndex ==1 ){ if (that.tabIndex == 1) {
that.onNavToRecharge(); that.onNavToRecharge();
}else{ } else {
that.onSubmit(); that.onSubmit();
} }
} }
}) })
} }
...@@ -423,8 +469,8 @@ ...@@ -423,8 +469,8 @@
getUserInfo().then(res => { getUserInfo().then(res => {
if (res.data.code == 200) { if (res.data.code == 200) {
this.userInfo = res.data.data; this.userInfo = res.data.data;
if (this.userInfo.consumerMember && this.userInfo.consumerMember.isRights ) { if (this.userInfo.consumerMember && this.userInfo.consumerMember.isRights) {
this.consumerMemberStatus = true; this.consumerMemberStatus = true;
} }
} }
}) })
...@@ -442,8 +488,9 @@ ...@@ -442,8 +488,9 @@
console.log(res, 999999) console.log(res, 999999)
if (res.data.code == 200 && res.data.rows) { if (res.data.code == 200 && res.data.rows) {
this.list = res.data.rows this.list = res.data.rows
this.equityAmountList = Number(this.list[0].requiredAmount).toFixed(2).toString().split('.'); this.equityAmountList = Number(this.list[0].requiredAmount).toFixed(2).toString().split(
console.log(this.equityAmountList,9999) '.');
console.log(this.equityAmountList, 9999)
} }
this.onGetUserInfo(); this.onGetUserInfo();
}) })
...@@ -466,7 +513,7 @@ ...@@ -466,7 +513,7 @@
this.tabIndex = val; this.tabIndex = val;
this.checked = false; this.checked = false;
}, },
onNavToRule() { onNavToRule() {
uni.navigateTo({ uni.navigateTo({
url: "/setting/rule/rule?keyData=vip_user_rule" url: "/setting/rule/rule?keyData=vip_user_rule"
...@@ -477,7 +524,7 @@ ...@@ -477,7 +524,7 @@
url: "/setting/rule/rule?keyData=user_pay_protocol" url: "/setting/rule/rule?keyData=user_pay_protocol"
}) })
}, },
onNavToRule3(){ onNavToRule3() {
uni.navigateTo({ uni.navigateTo({
url: "/setting/rule/rule?keyData=user_equity_details" url: "/setting/rule/rule?keyData=user_equity_details"
}) })
...@@ -491,7 +538,7 @@ ...@@ -491,7 +538,7 @@
}) })
return; return;
} }
if(uni.getStorageSync('loginStatus') != 'login'){ if (uni.getStorageSync('loginStatus') != 'login') {
this.$refs.popup.open(); this.$refs.popup.open();
return return
} }
...@@ -505,13 +552,13 @@ ...@@ -505,13 +552,13 @@
}) })
return; return;
} }
if(uni.getStorageSync('loginStatus') != 'login'){ if (uni.getStorageSync('loginStatus') != 'login') {
this.$refs.popup.open(); this.$refs.popup.open();
return return
} }
this.$refs.popupPay.open(); this.$refs.popupPay.open();
}, },
onCreateRecharge(){ onCreateRecharge() {
uni.showLoading({ uni.showLoading({
title: "提交中..." title: "提交中..."
}) })
...@@ -534,12 +581,12 @@ ...@@ -534,12 +581,12 @@
icon: "success", icon: "success",
title: "下单成功", title: "下单成功",
success: () => { success: () => {
that.$refs.popupPay.close(); that.$refs.popupPay.close();
setTimeout(()=>{ setTimeout(() => {
uni.switchTab({ uni.switchTab({
url:"/pages/my/myInfo" url: "/pages/my/myInfo"
}) })
},1000) }, 1000)
} }
}) })
}, },
...@@ -555,10 +602,10 @@ ...@@ -555,10 +602,10 @@
} }
}); });
} }
}) })
}, },
onCreateEquityMembers(){ onCreateEquityMembers() {
let that = this; let that = this;
uni.showLoading({ uni.showLoading({
title: "提交中..." title: "提交中..."
...@@ -584,7 +631,7 @@ ...@@ -584,7 +631,7 @@
that.$refs.popupPay.close(); that.$refs.popupPay.close();
setTimeout(() => { setTimeout(() => {
uni.switchTab({ uni.switchTab({
url:"/pages/my/myInfo" url: "/pages/my/myInfo"
}) })
}, 1000) }, 1000)
} }
...@@ -603,7 +650,7 @@ ...@@ -603,7 +650,7 @@
}); });
} else { } else {
uni.showToast({ uni.showToast({
icon:"none", icon: "none",
title: res.data.msg title: res.data.msg
}) })
} }
...@@ -700,20 +747,24 @@ ...@@ -700,20 +747,24 @@
} }
} }
} }
.adorn-1{
.adorn-1 {
position: absolute; position: absolute;
top: -24upx; top: -24upx;
right: 20upx; right: 20upx;
.img{
.img {
width: 74upx; width: 74upx;
max-height: 78upx; max-height: 78upx;
} }
} }
.adorn-2{
.adorn-2 {
position: absolute; position: absolute;
bottom: -40upx; bottom: -40upx;
left: 24upx; left: 24upx;
.img{
.img {
width: 78upx; width: 78upx;
max-height: 90upx; max-height: 90upx;
} }
...@@ -757,7 +808,8 @@ ...@@ -757,7 +808,8 @@
padding: 0 1%; padding: 0 1%;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.absolute-1{
.absolute-1 {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
...@@ -768,11 +820,13 @@ ...@@ -768,11 +820,13 @@
background: linear-gradient(90deg, #FF7800, #FF0000); background: linear-gradient(90deg, #FF7800, #FF0000);
border-radius: 6rpx; border-radius: 6rpx;
z-index: 8; z-index: 8;
text{
text {
font-size: 18rpx; font-size: 18rpx;
color: #FFFFFF; color: #FFFFFF;
} }
} }
.item { .item {
position: relative; position: relative;
display: flex; display: flex;
...@@ -1024,6 +1078,13 @@ ...@@ -1024,6 +1078,13 @@
} }
} }
.flex-col{
.text-2 {
color: #D27E1F;
font-size: 32upx;
font-weight: bold;
}
}
.cu-btn-box { .cu-btn-box {
margin-top: 10upx; margin-top: 10upx;
...@@ -1179,180 +1240,209 @@ ...@@ -1179,180 +1240,209 @@
text-align: center; text-align: center;
} }
} }
.popup-box{
.popup-box {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
// background: linear-gradient(-45deg,rgba(255, 170, 0, 0.98), rgba(255,255,255,0.98)); // background: linear-gradient(-45deg,rgba(255, 170, 0, 0.98), rgba(255,255,255,0.98));
background: linear-gradient(-45deg,#ffffff, #f1f1f1); background: linear-gradient(-45deg, #ffffff, #f1f1f1);
border-radius: 12upx; border-radius: 12upx;
width: 80%; width: 80%;
margin: 0 auto; margin: 0 auto;
.title-header{
.title-header {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 24upx 0; padding: 24upx 0;
border-bottom: 1px dashed #fce051; border-bottom: 1px dashed #fce051;
} }
.popup-content{
.popup-content {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 30upx 24upx; padding: 30upx 24upx;
min-height: 180upx; min-height: 180upx;
} }
.btn-list-box{
.btn-list-box {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
width: 100%; width: 100%;
border-top: 1px solid #fce051; border-top: 1px solid #fce051;
.btn-box{
.btn-box {
display: flex; display: flex;
flex: 1; flex: 1;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
padding: 24upx 0; padding: 24upx 0;
.cu-btn{
.cu-btn {
width: 80%; width: 80%;
} }
.bg-gray{
.bg-gray {
// color: #ffffff; // color: #ffffff;
} }
.bg-pink{
.bg-pink {
background-color: rgba(224, 57, 151, 0.74); background-color: rgba(224, 57, 151, 0.74);
} }
} }
} }
} }
.popup-box-content{
background-color: #ffffff; .popup-box-content {
width: 72vw; background-color: #ffffff;
border-radius: 36upx; width: 72vw;
overflow: hidden; border-radius: 36upx;
} overflow: hidden;
.popup-box-2{
position: relative;
width: 100%;
background: linear-gradient(0deg, rgba(255,255,255,0.65), rgba(255,214,241,0.43));
.close-box{
position: absolute;
top: 16upx;
right: 20upx;
display: flex;
justify-content: center;
align-items: center;
width: 24px;
height: 24px;
font-size: 36upx;
} }
.title-header{
display: flex; .popup-box-2 {
justify-content: center; position: relative;
align-items: center; width: 100%;
padding: 30upx 24upx 8upx; background: linear-gradient(0deg, rgba(255, 255, 255, 0.65), rgba(255, 214, 241, 0.43));
border-bottom: none;
.text-title{ .close-box {
position: absolute;
top: 16upx;
right: 20upx;
display: flex;
justify-content: center;
align-items: center;
width: 24px;
height: 24px;
font-size: 36upx; font-size: 36upx;
color: #333333;
} }
}
.popup-content{ .title-header {
padding: 0 24upx;
min-height: 240upx;
.recharge-content{
display: flex; display: flex;
flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: 100%; padding: 30upx 24upx 8upx;
.text-1{ border-bottom: none;
font-weight: 400;
font-size: 24upx; .text-title {
color: #666666; font-size: 36upx;
color: #333333;
} }
.payfee-text{ }
.popup-content {
padding: 0 24upx;
min-height: 240upx;
.recharge-content {
display: flex; display: flex;
flex-direction: column;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: 100%; width: 100%;
padding: 10upx 0 16upx;
margin-bottom: 16upx; .text-1 {
border-bottom: 1px dashed #C9CACA; font-weight: 400;
text{ font-size: 24upx;
font-size: 52rpx; color: #666666;
color: #E40583;
} }
}
.flex-row{ .payfee-text {
.flex-col{ display: flex;
.text-12{ justify-content: center;
width: 77upx; align-items: center;
color: #000000; width: 100%;
font-size: 28upx; padding: 10upx 0 16upx;
font-weight: bold; margin-bottom: 16upx;
text-align: justify-all; border-bottom: 1px dashed #C9CACA;
}
.text-13{ text {
color: #999999; font-size: 52rpx;
font-size: 26upx; color: #E40583;
margin-left: 4upx;
}
.text-14{
color: #000000;
} }
} }
}
.content-tip{ .flex-row {
display: flex; .flex-col {
flex-direction: column; .text-12 {
margin: 20upx 0 12upx; width: 77upx;
.text-3{ color: #000000;
font-size: 28upx; font-size: 28upx;
color: #333333; font-weight: bold;
margin-bottom: 20upx; text-align: justify-all;
}
.text-13 {
color: #999999;
font-size: 26upx;
margin-left: 4upx;
}
.text-14 {
color: #000000;
}
}
} }
.flex-col{
.flex-row-center{ .content-tip {
margin: 8upx 0; display: flex;
.gift-box{ flex-direction: column;
display: flex; margin: 20upx 0 12upx;
justify-content: center;
align-items: center; .text-3 {
width: 22px; font-size: 28upx;
height: 22px; color: #333333;
background: #FCE8F2; margin-bottom: 20upx;
border-radius: 6px; }
.gift-icon{
display: block; .flex-col {
width: 70%; .flex-row-center {
max-height: 40upx; margin: 8upx 0;
.gift-box {
display: flex;
justify-content: center;
align-items: center;
width: 22px;
height: 22px;
background: #FCE8F2;
border-radius: 6px;
.gift-icon {
display: block;
width: 70%;
max-height: 40upx;
}
} }
} }
} }
} }
} }
} }
}
.btn-list-box{ .btn-list-box {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
border-top: none;
.btn-box{
display: flex; display: flex;
flex: none; justify-content: center;
width: 87%; align-items: center;
.cu-btn{ width: 100%;
padding: 0; border-top: none;
width: 100%;
height: 88upx; .btn-box {
background: #E40583; display: flex;
border-radius: 44upx; flex: none;
font-size: 37upx; width: 87%;
color: #FFFFFF;
.cu-btn {
padding: 0;
width: 100%;
height: 88upx;
background: #E40583;
border-radius: 44upx;
font-size: 37upx;
color: #FFFFFF;
}
} }
} }
} }
}
</style> </style>
\ No newline at end of file
<template>
</template>
<script>
</script>
<style>
page {
background-color: #f1f1f1;
}
</style>
<style lang="scss" scoped>
</style>
\ No newline at end of file
<template>
<view class="level-view">
<view class="flex-col user-info-box">
<view class="flex-row">
<view v-for="(item,k) in memberTypeList" :key="k" class="relative" :class="index ===k ?'active':''" @tap="onTypeChange(k)">
<image class="img-icon" :src="item.imgUrl" mode="widthFix"></image>
<view class="absolute">
<text :class="'text-'+item.value">{{item.label}}</text>
</view>
</view>
</view>
</view>
<view class="remeber-info-box">
<view v-for="(item,k) in list" :key="k" class="relative flex-7">
<image v-if="item.membershipLevel" class="level-bg" :src="levelPath[item.membershipLevel]" mode="scaleToFill"></image>
<view v-else class="level-bg level-bg-0"></view>
<view class="absolute level-content">
<view class="part-left">
<view class="level" :class="'level-'+item.membershipLevel">
<view class="text-label">
<text class="text-1">LV {{item.levelName}}</text>
<view v-if="item.discountRatio < 100" class="discount-ratio">
<text class="text-white"><text class="text-white text-xl text-bold">{{item.discountRatio}}</text></text>
</view>
</view>
<view class="member-config">
<text v-if="item.membershipLevel === userInfo.memberConfig.membershipLevel && index < 2" class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - userInfo.consumerWallet.remainingIntegral}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
</view>
<view class="flex-row">
<text class="text-3">升级所需积分</text>
<text class="text-4">{{item.limitRequirements}}</text>
</view>
</view>
<!-- <view v-else-if="item.membershipLevel ===3" class="level level-3">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view> -->
<!-- <view v-else-if="item.membershipLevel ===2" class="level level-2">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view> -->
<!--
<view v-else-if="item.membershipLevel ===1" class="level level-1">
<text class="text-1">LV {{userInfo.memberConfig.levelName}}</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view> -->
<!-- <view v-else-if="item.membershipLevel === 0" class="level level-0">
<text class="text-1">LV 0</text>
<text class="text-2">您还没有会员等级!</text>
<text class="text-2">还差 {{userInfo.memberConfig.nextLimitRequirements - Number(userInfo.consumerWallet.remainingIntegral)}} 积分可升级为{{userInfo.memberConfig.nextMembershipName}}</text>
<view class="flex-row">
<text class="text-3">当前积分</text>
<text class="text-4">{{userInfo.consumerWallet.remainingIntegral}}</text>
</view>
</view> -->
<!-- <view v-else class="level level-0">
<text class="text-1">LV 0</text>
<text class="text-2">您还不是会员哦,快来加入吧!</text>
</view> -->
</view>
<view class="part-right">
<image v-if="item.membershipLevel ===4" class="tag-icon" :src="assetsPath+'/user/tag_icon_4.png'" mode="widthFix"></image>
<image v-else-if="item.membershipLevel ===3" class="tag-icon" :src="assetsPath+'/user/tag_icon_3.png'" mode="widthFix"></image>
<image v-else-if="item.membershipLevel ===2" class="tag-icon" :src="assetsPath+'/user/tag_icon_2.png'" mode="widthFix"></image>
<image v-else-if="item.membershipLevel ===1" class="tag-icon" :src="assetsPath+'/user/tag_icon_1.png'" mode="widthFix"></image>
<image v-else class="tag-icon" :src="assetsPath+'/user/tag_icon_0.png'" mode="widthFix"></image>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import {memberConfigList} from "@/api/memberConfig.js"
import config from "@/config/index.config"
import {getUserInfo} from "@/api/index.js"
export default {
data(){
return {
userInfo:{},
list:[],
assetsPath:config.assetsPath,
levelPath:{
0: config.assetsPath+'/user/tj_bg_1.png',
1: config.assetsPath+'/user/tj_bg_1.png',
2: config.assetsPath+'/user/tongj_bg_1.png',
3: config.assetsPath+'/user/yj_bg_1.png',
4: config.assetsPath+'/user/jj_bg_1.png',
},
memberTypeList:[
{
value:1,
label:'充值会员',
imgUrl: config.assetsPath+'/tag_icon_1.png'
},
{
value:2,
label:'权益会员',
imgUrl: config.assetsPath+'/tag_icon_2.png'
},
{
value:0,
label:'普通会员',
imgUrl: config.assetsPath+'/tag_icon_3.png'
}
],
index:0
}
},
onLoad() {
this.onGetUserInfo();
},
methods:{
onTypeChange(i){
if(this.index === i) return;
this.index = i;
this.onLoading();
},
onLoading(){
memberConfigList({
memberType: this.memberTypeList[this.index].value
}).then(res => {
console.log(res,9999)
if(res.data.code == 200 && res.data.data){
this.list = res.data.data.map(item =>{
let discountText = item.discountRatio;
if(discountText > 0 && discountText < 100){
discountText = Number(discountText.toString().split('').reverse().join('')).toString();
if(discountText.length ==2){
discountText = item.discountRatio;
}
}
return {
...item,
discountRatio: discountText
}
})
}
})
},
onGetUserInfo() {
getUserInfo().then(res => {
if (res.data.code == 200) {
this.userInfo = res.data.data;
this.onLoading();
}
})
}
}
}
</script>
<style>
page {
background-color: #f1f1f1;
}
</style>
<style lang="scss" scoped>
.level-view{
display: flex;
flex-direction: column;
width: 100%;
}
.user-info-box{
width: 90%;
padding: 36upx 0 24upx;
margin: 0 auto;
.relative{
margin-right: 4upx;
.img-icon{
display: block;
width: 148upx;
max-height: 40upx;
}
}
.active{
transform: scale(1.2);
}
.absolute{
display: flex;
justify-content: center;
align-items: center;
text{
font-weight: normal;
font-size: 20rpx;
margin: 0 0 2upx 30upx;
}
.text-1{
color: #8C1E41;
}
.text-2{
color: #472F1E;
}
.text-3{
color: #3E3A39;
}
}
.grayscale{
filter: grayscale(100%);
}
.tip-date{
display: flex;
flex-direction: row;
align-items: center;
font-weight: normal;
font-size: 20rpx;
color: #A3A3A3;
margin-top: 10upx;
.text-bold{
margin: 0 4upx;
}
.text-blue{
margin-left: 6upx;
}
}
}
.remeber-info-box{
display: flex;
flex-direction: column;
width: 90%;
margin: 10upx auto 10upx;
.flex-7{
display: flex;
flex: 1;
height: 100%;
margin: 12upx 0;
.level-bg{
display: block;
width: 100%;
height: 136rpx;
}
.level-bg-0{
background: #F9F9F9;
border-radius: 14upx;
border: 1px solid #A9ACB4;
}
.level-content{
display: flex;
justify-content: space-between;
.part-left{
height: 100%;
.level{
display: flex;
flex-direction: column;
justify-content: center;
padding-left: 24upx;
height: 100%;
.text-label{
display: flex;
flex-direction: row;
align-items: center;
.discount-ratio{
display: flex;
flex-direction: row;
align-items: center;
margin-left: 24upx;
.text-bold{
margin: 0 4upx;
}
}
}
.member-config{
min-height: 24upx;
}
.text-1{
font-weight: 900;
font-size: 32upx;
color: #A3A3A3;
font-style: italic;
}
.text-2{
font-weight: normal;
font-size: 20upx;
margin-top: 4upx;
}
.flex-row{
display: flex;
align-items: center;
justify-content: center;
height: 32upx;
border-radius: 4upx;
margin-top: 8upx;
padding: 0 12upx;
.text-3{
font-weight: normal;
font-size: 18upx;
}
.text-4{
font-weight: normal;
font-size: 26rpx;
font-style: italic;
margin-left: 10upx;
}
}
}
.level-4{
.text-1{
color: #9D680D;
}
.text-2{
color: #BC8902;
}
.flex-row{
background: #FDF4C4;
border: 1px solid #CB8402;
.text-3{
color: #CB8402;
}
.text-4{
color: #CB8402;
}
}
}
.level-3{
.text-1{
color: #898E9D;
}
.text-2{
color: #898E9D;
}
.flex-row{
background: #DDDEEB;
border: 1px solid #81828A;
.text-3{
color: #7A7B84;
}
.text-4{
color: #81828A;
}
}
}
.level-2{
.text-1{
color: #FEEDE3;
}
.text-2{
color: #FFFFFF;
}
.flex-row{
background: #FFEED9;
border: 1px solid #DE966F;
.text-3{
color: #985E39;
}
.text-4{
color: #6F4133;
}
}
}
.level-1{
.text-1{
background: linear-gradient(47deg, #E9EEEE 0%, #FBFFFC 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-2{
color: #F1F6F4;
}
.flex-row{
display: flex;
flex-direction: row;
align-items: center;
background: #F5E0ED;
border: 1px solid #F46DB9;
.text-3{
color: #E40583;
}
.text-4{
color: #C72380;
}
}
}
.level-0{
.text-1{
color: #969696;
}
.text-2{
color: #969696;
}
.flex-row{
display: flex;
flex-direction: row;
align-items: center;
background: #E3E6E8;
border-radius: 4upx;
border: 1px solid #E3E6E8;
.text-3{
color: #333333;
}
.text-4{
color: #333333;
}
}
}
}
.part-right{
display: flex;
align-items: center;
height: 100%;
padding-right: 20upx;
.tag-icon{
display: block;
width: 120upx;
max-height: 100upx;
}
}
}
}
.flex-3{
display: flex;
flex-direction: column;
justify-content: center;
width: 184rpx;
height: 136rpx;
background: linear-gradient(71deg, #FFFFFF 0%, #FBF5DD 0%, #FCDFC5 0%, #FFCD9C 98%);
border-radius: 14rpx;
border: 1px solid #FDD8B8;
margin-left: 20upx;
padding-left: 20upx;
.text-1{
font-weight: bolder;
font-size: 32rpx;
font-style: italic;
color: #A3A3A3;
background: linear-gradient(47deg, #FD7C01 0%, #FCAB00 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-2{
font-size: 20rpx;
color: #985E39;
margin-top: 4upx;
}
.flex-row{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
width: 102rpx;
height: 32rpx;
background: #FFEED9;
border-radius: 4rpx;
border: 1px solid #E6A37F;
margin-top: 8upx;
.text-3{
font-size: 18rpx;
color: #985E39;
}
.text-4{
font-size: 26rpx;
color: #701700;
margin: 2upx 4upx 0;
}
}
}
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment