zm/medicine_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

vip功能修改

Browse Source
This commit is contained in:
liuyuan
2025-02-19 10:19:18 +08:00
parent 6d86076b90
commit 341321af5f
6 changed files with 267 additions and 1024 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
pages/mine/vip/index.vue
View File

@@ -1,22 +1,39 @@
<template>
<view class="commonPageBox">
<z-nav-bar title="VIP定制" bgColor="rgb(67, 131, 208)" fontColor="#fff"></z-nav-bar>
<z-nav-bar title="VIP"></z-nav-bar>
<view class="vip_block">
<view class="vip_item" :class="item.type==1||item.type==2?'vip_item_special':''" v-for="(item, index) in list" :key="index">
<text class="vip_item_title">{{item.title}}</text>
<text class="vip_item_used" v-if="item.UserVip">已定制</text>
<!-- <text class="vip_item_btn" v-if="item.UserVip" @click="onHandleClickBuy(item)">续费</text>
<text class="vip_item_btn" v-else @click="onHandleClickBuy(item)">定制</text> -->
<view class="vip_price" v-if="!item.UserVip">
<view class="vip_item"
:class="[item.type==1||item.type==2?'vip_item_special':'',
item.state==1?'vip_item_overdue':'',
item.type==1&&item.state==0||item.type==2&&item.state==0?'vip_item_bg_1':'',
item.type!=1&&item.type!=2&&item.state==0?'vip_item_bg_2':'']"
v-for="(item, index) in list" :key="index">
<view>
<text class="vip_item_title">{{item.title}}</text>
<text class="vip_item_tip" v-if="item.tip&&item.tip<100"><uni-icons type="info" size="17" color="#ff1f00"></uni-icons>还有{{item.tip}}天到期</text>
<text class="vip_item_flag" v-if="item.state==1">
<uni-icons type="info" size="17" color="#999"></uni-icons>已过期
</text>
</view>
<view class="vip_price" style=" padding-top: 10rpx;">
<text class="font_bold">课程价格：</text>
<view class="vip_qx_v">一年<text class="vip_fee line">{{item.originalPrice||0}}</text>元</view>
</view>
<text class="vip_item_btn" v-if="item.state==null" @click="openorderModal(item,0)">去办理</text>
<text class="vip_item_btn" v-else @click="openorderModal(item,0)">去续费</text>
<view class="vip_price" v-if="item.vcbList&&item.vcbList.length>0">
<text class="font_bold" v-if="item.type==1||item.type==2">超级VIP价格：</text>
<text class="font_bold" v-else>VIP价格：</text>
<text class="vip_price_v" v-for="(item_price, index_price) in item.vcbList" :key="index_price" @click="openorderModal(item_price)">
{{item_price.year}}年<text>{{item_price.rebateFee}}</text>元
</text>
</view>
<view class="vip_price" v-else>
<view class="vip_price" v-if="item.yanqiList&&item.yanqiList.length>0">
<text class="font_bold">延期价格：</text>
<text class="vip_price_yq" v-for="(item_yq, index_yq) in item.yanqiList" :key="index_yq" @click="openorderModal(item_yq,0)">
<text class="vip_price_v" v-for="(item_yq, index_yq) in item.yanqiList" :key="index_yq" @click="openorderModal(item_yq,1)">
{{item_yq.year}}年<text>{{item_yq.rebateFee}}</text>元
</text>
</view>
@@ -95,13 +112,29 @@ export default{
//点击购买
openorderModal(item,type) {
let text = '';
//如果是右侧按钮点击展示
//判断点击类型是vip价格还是延期价格
if(type==0){
text = '（续费）';
if(item.state==null){ //没有vip
this.selectVipData.list = item.vcbList;
this.selectVipData.id = item.vcbList[0].id;
}else{
this.selectVipData.list = item.yanqiList;
this.selectVipData.id = item.yanqiList[0].id;
}
}else{
this.selectVipData.id = item.id;
}
this.selectVipData.id = item.id;
this.selectVipData.title = item.title + '-' + item.year + '年'+text;
if(type){
this.selectVipData.type = type;
}
this.selectVipData.title = item.title + '-' + item.year + '年';
this.selectVipData.lastFee = item.rebateFee;
this.orderModalShow = true;
console.log('-----selectVipData-----',this.selectVipData)
this.$nextTick(() => {
this.$refs.orderPay.initPrepareOrder();
});
@@ -118,20 +151,16 @@ export default{
<style>
.commonPageBox {
height: 100% !important;
background-color: rgb(57, 110, 191);
}
.vip_block{
padding: 20rpx;
background-repeat: no-repeat;
background-size: 100% 100%;
background-image: url("@/static/icon/vipbg.png");
}
.vip_item{
width: 100%;
padding: 30rpx 20rpx;
background-color: #fff;
border-radius: 10px;
box-shadow: 0px 0px 10px 0px #a7bbe4;
box-shadow: 0px 0px 5px 0px #a7bbe4;
margin-bottom: 20rpx;
position: relative;
}
@@ -153,7 +182,7 @@ export default{
background-image: linear-gradient(90deg, #ff1f00 0%, #fa9f93 100%);
}
.vip_price{
padding-top: 15rpx;
margin-top: 5rpx;
}
.vip_price text,.vip_qx text,.vip_qx_v{
display: inline-block;
@@ -172,14 +201,13 @@ export default{
position: absolute;
right: 20rpx;
top: 30rpx;
font-size: 24rpx;
height: 44rpx;
line-height: 44rpx;
border: 1rpx solid #f29b2b;
color: #f29b2b;
padding: 0 15rpx;
font-size: 23rpx;
line-height: 40rpx;
border: 1rpx solid #ff1f00;
color: #ff1f00;
padding: 0 12rpx;
border-radius: 15rpx;
font-weight: bold;
opacity: 0.8;
}
.font_bold{
font-weight: bold;
@@ -208,4 +236,43 @@ export default{
margin-bottom: 10rpx;
padding: 0 10rpx;
}
.line{
text-decoration: line-through;
color: #258feb;
font-style: italic;
}
.vip_item_flag{
font-size: 26rpx;
color: #666;
padding-left: 20rpx;
}
.vip_item_flag text{
vertical-align: bottom;
}
.vip_item_overdue{
background: rgba(220, 223, 225, 0.9) !important;
opacity: 0.75;
}
.vip_item_overdue .vip_item_title{
background-image: none;
font-size: 32rpx;
color: #000;
padding: 0;
}
.vip_item_bg_1{
background: rgba(227, 120, 125, 0.3) !important;
}
.vip_item_bg_2{
background: rgba(64, 148, 222, 0.3) !important;
}
.vip_item_tip{
color: #ff1f00;
font-size: 26rpx;
padding-left: 20rpx;
}
.vip_item_tip text{
vertical-align: bottom;
}
</style>