vip功能

This commit is contained in:
liuyuan
2025-02-17 15:53:12 +08:00
parent c142228b59
commit 6d86076b90
13 changed files with 1454 additions and 3017 deletions

View File

@@ -13,36 +13,32 @@
<view class="bg_top flex_box flex_between">
<view class="per_mes">
<view class="per_mes_user">
<view class="" style="width: 100rpx; height: 100rpx; display: inline-block;">
<image @click="goUserInfo" :src="userMes.avatar" v-if="userMes.avatar != null"
<view class="per_mes_user" :style="hasVipType2?'width: 170rpx;':''">
<view style="width: 120rpx; height: 120rpx; display: inline-block;">
<image @click="goUserInfo" :src="userMes.avatar" v-if="userMes.avatar"
class="per_mes_img color_shandow"></image>
<image src="@/static/icon/home_icon_logo.png" v-if="userMes.avatar == null"
<image src="@/static/icon/home_icon_logo.png" v-else="userMes.avatar"
class="per_mes_img color_shandow"></image>
</view>
<view class="user_vip_box ">
<view v-if="userMes.vip == 1" class="user_vip super">超级VIP</view>
<view v-if="userMes.vip == 3" class="user_vip">众妙之门VIP</view>
<view v-if="userMes.vip == 2" class="user_vip">吴门医述VIP</view>
<view class="user_vip_box" v-if="hasVipType1 || hasVipType2">
<view class="user_vip super" :style="hasVipType2?'width: 170rpx;':''">
<view class="user_vip_item" v-if="hasVipType1"><text>医学</text><image src="@/static/icon/chao_svip.png"></image></view>
<view class="user_vip_item" v-if="hasVipType2"><text>国学心理学</text><image src="@/static/icon/chao_svip.png"></image></view>
</view>
</view>
</view>
<view class="userInfoBox" style="width: calc(100% - 220rpx)">
<view class="userInfoBox" style="width: calc(100% - 180rpx)" :style="hasVipType2?'margin-left: 30rpx;':''">
<template>
<view class="name">昵称{{ userMes.nickname ? userMes.nickname : "未设置" }}</view>
<view class="name">{{ userMes.nickname ? userMes.nickname : "未设置" }}</view>
</template>
<template v-if="userMes.tel">
<view class="phone">手机号({{ userMes.tel }})</view>
</template>
<template v-if="userMes.email">
<view class="phone email">邮箱({{ userMes.email }})</view>
<template v-if="textList.length>0">
<view class="vip_type">
<view class="vip_type_item" v-for="(item,index) in textList" :key="index">{{item}}<image src="@/static/icon/chao_vip.png"></image></view>
</view>
</template>
<template v-if="userMes.userVip && userMes.vip != 0 && !isAndorid">
<view class="phone email">VIP{{userMes.userVip.endTime.split(" ")[0]}}到期</view>
</template>
<!-- <text class="tong">累计读书5本
<span style="margin: 0 20upx;">|</span> 今日读50分钟
</text> -->
</view>
<br clear="both" />
</view>
@@ -50,57 +46,36 @@
</view>
<view class="mine_box" :style="`top:${(45 + statusBarHeight) * 2}rpx`">
<view style="
padding: 20rpx; overflow: hidden;
">
<!-- vip 只有安卓才显示-->
<view v-if="isAndorid" class="chong_zhi boxShadow box_fillet vip_box"
@click="onPageJump('/pages/mine/vip/index')">
<view v-if="!userMes.userVip" class="noVip">
<view class="noVip">
<view class="zhanghu PM_font" style="text-align: left">
<image class="vip_image" src="@/static/vip.png" mode="aspectFit">
<image class="vip_image" style="margin-left: 10rpx;" src="@/static/vip.png" mode="aspectFit">
</image>
<text style="color: #fff; font-size: 60rpx;">VIP</text>
<text style="color: #fff; font-size: 60rpx;" v-if="vipList.length==0">VIP</text>
</view>
<view class="" style="width:calc(100% - 200rpx);">
<swiper :autoplay="true" :interval="3000" :duration="1000"
style="width:100%; height: 60rpx">
<swiper-item v-for="(item, index) in swiperList" style="width: 100%; height: 100%">
<view style="
background: linear-gradient(
130deg,
rgb(46, 103, 106) 0%,
rgb(114, 173, 146) 100%
)
text;
text-align: center;
" :style="item.style" v-html="item.name"></view>
<!-- <image :src="curriculumData.explainsImg" mode="widthFix" class="headImage"></image> -->
</swiper-item>
</swiper>
<view class="vip_infor" style="width:calc(100% - 200rpx);" v-if="vipList&&vipList.length>0">
<!-- <text class="vip_infor_item" v-if="vipList.includes(1)">医学SVIP</text>
<text class="vip_infor_item" v-if="vipList.includes(2)">国学心理学SVIP</text>
<view class="vip_infor_item" v-for="(item, index) in textList" :key="index">
<text>{{item}}VIP</text>{{vipList[index].endTime.split(' ')[0]}} 到期
</view> -->
<view class="vip_infor_item" v-for="(item, index) in vipList" :key="index">
<text>{{item.text}}VIP</text>{{item.endTime.split(' ')[0]}} 到期
</view>
</view>
</view>
<view v-else class="noVip hasVip">
<view class="zhanghu PM_font" style="text-align: center">
<image class="vip_image" src="@/static/vip.png" mode="aspectFit">
</image>
<text style="color: #fff; font-size: 60rpx;">VIP</text>
</view>
<view class="time">{{ userMes.userVip.endTime.split(" ")[0] }}到期</view>
<view v-else class="vip_null">定制VIP畅享更多专属权益</view>
<view class="vip_btn"><button>定制</button></view>
</view>
</view>
<!-- end -->
<view class="chong_zhi boxShadow box_fillet chongzhi_box">
<!-- <view
class="zhanghu"
@click="onPageJump('/pages/mine/wallet/index/index')"
>
我的账户
<image src="@/static/icon/icon_right.png" class="rightArrow"></image>
</view> -->
<view class="chong_list">
<view class="left">
<view class="chong_list_item" style="
@@ -112,12 +87,6 @@
<view class="pay_item_img">
天医币<u-icon @click.native.stop="openInfo()" name="question-circle"
style="float: right; margin: 0 6rpx"></u-icon>
<!-- <image
style="width: 100%; height: 100%"
src="@/static/icon/pay_3.png"
mode="aspectFil"
>
</image> -->
</view>
<view class="text" style="line-height: 40rpx; display: flex">{{
@@ -133,12 +102,6 @@
" @click="onPageJump('/pages/mine/wallet/jf/index')">
<view class="pay_item_img">
积分
<!-- <image
style="width: 100%; height: 100%"
src="@/static/icon/jifen2.png"
mode="aspectFil"
>
</image> -->
</view>
<view class="text" style="line-height: 40rpx">{{
@@ -160,13 +123,6 @@
}}</view>
</view>
</view>
<!-- v-if="iosHide" -->
<!-- <view v-if="iosHide" class="chong_list_item">
<b>{{ userMes.conponsCount }}</b>
优惠券
</view> -->
<!-- <b class="chong_btn" @click="onPageJump('../sdkDemo/pay')"> </b> -->
<view class="chong_list_item" style="
display: flex;
align-items: center;
@@ -216,14 +172,8 @@
<view class="bottom">
<view class="button_box" style="
align-items: center;
justify-content: center;
">
<!-- <u-button
size="small"
text="不同意"
@click="protocolShow=false"
></u-button> -->
<u-button style="width: 200rpx; float: center" :plain="true" text="知道啦" color="#9b9b9b"
size="small" @click="infoShow = false"></u-button>
</view>
@@ -231,8 +181,6 @@
</view>
</view>
</u-popup>
<!-- <u-modal :show="infoShow" title="提示信息" :content=""></u-modal> -->
<music-play :playData="playData"></music-play>
<z-navigation></z-navigation>
@@ -242,7 +190,6 @@
<script>
import musicPlay from "@/components/music.vue";
import $http from "@/config/requestConfig.js";
// import appShare, { closeShare } from '@/uni_modules/zhouWei-APPshare/js_sdk/appShare';
import {
mapState,
mapMutations
@@ -250,31 +197,6 @@
export default {
data() {
return {
swiperList: [{
name: "开通会员畅享更多活动",
style: "color:#fff;font-size:28rpx"
},
{
name: "众妙之门视频",
style: "color:#fff;font-size:28rpx"
},
{
name: "吴门医述视频",
style: "color:#fff;font-size:28rpx"
},
{
name: "专属视频视听",
style: "color:#fff;font-size:28rpx"
},
{
name: "读书相关权益",
style: "color:#fff;font-size:28rpx"
},
{
name: "活动报名<text style='color:#ffaa7f'>(折扣价)</text>",
style: "color:#fff;font-size:28rpx"
},
],
roleObj: {},
infoShow: false, // 显示电子书相关
showEbook: false, // 显示电子书相关
@@ -290,24 +212,16 @@
pageList: [{
name: "我的订单",
url: "/pages/bookShop/orderList?type=mine",
type: "switchTab",
// type: "pageJump",
type: "switchTab"
},
{
name: "我的证书",
url: "/pages/certificate/certificate",
type: "pageJump",
},
// {
// name: "购物车",
// url: "../peanut/shopping",
// type: "pageJump",
// },
{
name: "个人资料",
url: "/pages/mine/userInfo/persData",
type: "pageJump",
},
{
@@ -315,11 +229,6 @@
url: "/pages/component/commonComponents/address/index?type=mine",
type: "pageJump",
},
// {
// name: "分享APP",
// type: "share",
// },
{
name: "关于我们",
url: "/pages/mine/aboutUs/index",
@@ -329,10 +238,13 @@
name: "问题反馈/申诉",
url: "/pages/user/workOrder",
type: "workOrder"
},
// { name: "退出登录", type: "quitLogin" },
// { name: "注销帐号", type: "loginOut" },
}
],
//vip
vipList: [],
textList: [], //普通vip文字
hasVipType1: false,
hasVipType2: false
};
},
//第一次加载
@@ -342,21 +254,19 @@
// #ifdef APP-PLUS
this.getOS();
this.platform = uni.getSystemInfoSync().platform;
// console.log('操纵系统',this.platform)
// #endif
},
computed: {
...mapState(["userInfo"]),
},
//页面显示
async onShow() {
// console.log(this.userInfo, "11111111111111");
this.getData();
this.getUserRole()
await this.getUserCouponList()
// 隐藏原生的tabbar
// uni.hideTabBar();
//获取vip身份
this.textList = [];
this.getUserVipType();
},
components: {
musicPlay,
@@ -369,7 +279,7 @@
await this.$http
.request({
url: "common/coupon/getCouponHistoryList",
method: "POST", // POST、GET、PUT、DELETE具体说明查看官方文档
method: "POST",
data: {
"page":1,
"limit":10,
@@ -379,7 +289,6 @@
"userId":this.userInfo.id
},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json",
},
})
@@ -388,7 +297,6 @@
this.userCouponNum = res.couponList.total
}).catch(e => {
console.log(e);
this.$commonJS.showToast(e.errMsg);
})
},
@@ -396,14 +304,12 @@
this.infoShow = true;
},
goSetting() {
console.log('点击了');
this.onPageJump("/pages/mine/set/index");
},
goUserInfo() {
this.onPageJump("/pages/mine/userInfo/persData");
},
handleClickTab(v) {
console.log("v at line 259:", v);
switch (v.type) {
case "pageJump":
this.onPageJump(v.url);
@@ -427,7 +333,6 @@
uni.navigateTo({
url: `${v.url}?name=userPage`
})
// this.onPageJump(v.url);
break;
}
},
@@ -435,7 +340,6 @@
getOS() {
let oprateOs = "";
oprateOs = uni.getSystemInfoSync().platform;
// console.log(oprateOs)
if (oprateOs == "android") {
this.isAndorid = true;
} else {
@@ -443,7 +347,6 @@
}
},
haveSelected(data) {
console.log(data, " 选择的是");
if (data.index == 0) {
// 分享到好友
uni.share({
@@ -488,7 +391,6 @@
// 获取用户的角色信息
getUserRole() {
this.$http.post("common/class/getRoleType").then((res) => {
console.log('用户角色信息', res);
this.roleObj = res.result
var zhurenIndex = this.pageList.findIndex(item => {
return item.name == '主任教学'
@@ -512,15 +414,11 @@
var n = this.pageList.find(item => {
return item.name == '主任教学'
})
console.log('主任找到了么', n);
if (!n) {
// this.directorShow = true : this.directorShow = false
var item = {
// { // 主任之外的人显示班级管理
name: "主任教学",
url: "/pages/miniClass/DirectorModalList?type=mine",
type: "pageJump",
// },
type: "pageJump"
}
this.pageList.splice(3, 0, item);
}
@@ -530,14 +428,11 @@
var n = this.pageList.find(item => {
return item.name == '班级管理'
})
console.log('班长n找到了么', n);
if (!n) {
var item = {
name: "班级管理",
url: "/pages/miniClass/MonitorClassList?type=mine",
type: "pageJump",
type: "pageJump"
}
this.pageList.splice(3, 0, item);
}
@@ -547,21 +442,18 @@
var n = this.pageList.find(item => {
return item.name == '我的班级'
})
console.log('我的班级找到了么', n);
if (!n) {
var item = {
name: "我的班级",
url: "/pages/miniClass/myClassList?type=mine",
type: "pageJump",
type: "pageJump"
}
this.pageList.splice(3, 0, item);
}
}
}).catch(e => {
console.log('获取角色信息失败');
})
},
getData() {
@@ -569,7 +461,6 @@
if (this.userInfo.id != undefined) {
this.$http.post("common/user/getUserInfo").then((res) => {
this.userMes = res.result;
});
}
},
@@ -611,7 +502,6 @@
});
},
onPageJump(url) {
console.log(url, "url");
uni.navigateTo({
url: url,
});
@@ -627,6 +517,50 @@
url: "/pages/user/login/login",
});
},
//获取vip身份
getUserVipType() {
this.$http.request({
url: "common/userVip/getUserVipType",
method: "POST",
data: {},
header: {
"Content-Type": "application/json",
},
})
.then((res) => {
if (res.code == 0) {
this.vipList = res.list;
this.hasVipType1 = this.vipList.some(item => item.type === 1);
this.hasVipType2 = this.vipList.some(item => item.type === 2);
//普通 vip 角色展示逻辑
let text = '';
if(this.vipList.length>0){
this.vipList.forEach((item, index) => {
if(item.type=='4'){
item.text = '中医学';
this.textList.push(item.text);
}else if(item.type=='5'){
item.text = '针灸学';
this.textList.push(item.text);
}else if(item.type=='6'){
item.text = '肿瘤学';
this.textList.push(item.text);
}else if(item.type=='7'){
item.text = '国学';
this.textList.push(item.text);
}else if(item.type=='8'){
item.text = '心理学';
this.textList.push(item.text);
}else if(item.type=='1'){
item.text = '医学S';
}else if(item.type=='2'){
item.text = '国学心理学S';
}
});
}
}
});
},
},
};
</script>
@@ -634,52 +568,40 @@
@import "@/style/mixin.scss";
.per_mes_user {
display: block !important;
width: 125rpx;
text-align: center;
}
.per_mes {
width: 100%;
position: relative;
margin: 20rpx 0;
margin-top: 20rpx;
margin-top: 50rpx;
align-items: center;
display: flex;
align-items: center;
justify-content: space-between;
.per_mes_img {
// @include themeBorder(10rpx,10rpx,#4E79A3, #A6D8DC);
width: 100rpx;
height: 100rpx;
// background-color: #fff;
width: 120rpx;
height: 120rpx;
border-radius: 100rpx;
margin: 0 0 0 0;
float: left;
}
view {
// float: left;
// margin-top: 20rpx;
.name {
width: 100%;
// display: inline-block;
font-weight: bold;
font-size: 38upx;
margin-bottom: 10rpx;
font-size: 32rpx;
color: #6990c7 !important;
}
.phone {
font-size: 28rpx;
font-size: 26rpx;
color: #6990c7 !important;
}
.tong {
color: #6990c7 !important;
font-size: 25upx;
}
.per_user_img {
display: inline-block;
width: 40upx;
@@ -735,18 +657,11 @@
.chong_zhi {
box-shadow: none;
// border-bottom-left-radius: 0rpx !important;
// border-bottom-right-radius: 0rpx !important;
// background-color: #d8f8e4;
// margin: 0 0 30upx 0;
padding: 0 30upx;
height: auto;
.zhanghu {
width: 100%;
margin-bottom: 10rpx;
// line-height: 80rpx;
font-weight: bold;
display: flex;
align-items: center;
@@ -760,19 +675,14 @@
height: 100%;
display: flex;
align-items: center;
justify-content: space-around;
// flex-direction: column;
justify-content: space-between;
.zhanghu {
font-size: 40rpx;
width: 200rpx;
// margin-top: 20rpx;
margin-bottom: 0rpx;
text-align: center;
display: flex;
align-items: center;
// justify-content: space-around;
image {
width: 100rpx;
height: 100rpx;
@@ -888,40 +798,27 @@
.box_fillet {
border-radius: 20rpx;
overflow: hidden;
// background: #fff;
}
.chongzhi_box {
position: relative;
width: 100%;
height: 100%;
// float: left;
padding: 30rpx 20rpx 10rpx;
background-color: #f0f9fb;
border-radius: 20rpx;
}
.vip_box {
padding: 22rpx 0 !important;
margin-bottom: 32rpx;
padding: 0;
position: relative;
width: 100%;
height: 100%;
border-radius: 20rx;
background-image: linear-gradient(60deg, #8265f9 30%, #016dea 100%);
// @include themeBorder(6rpx, 20rpx, #258feb, #a6d8dc);
// @include themeBorder(
// 10rpx,
// 20rpx,
// (
// linear-gradient(#DDF2FC, #BFDDF2),
// linear-gradient(to bottom left, #D5EDF8, #a6d8dc)
// )
// );
.zhanghu {
font-size: 80rpx;
text-align: center;
@@ -933,25 +830,16 @@
/deep/.scroll-view-item:nth-child(2n-1) {
background-color: transparent !important;
}
uni-page-body {
// background: #d8f8e4 !important;
}
.bg_top {
padding: 0 30rpx;
padding-top: 80rpx;
margin-bottom: 60rpx;
overflow: hidden;
// position: relative;
}
.setIcon {
position: absolute;
right: 30rpx;
top: 70rpx;
top: 60rpx;
z-index: 2;
}
@@ -962,7 +850,6 @@
}
.list_box {
// background: #d8f8e4 !important;
padding: 20rpx 0;
margin-top: -10rpx;
}
@@ -977,8 +864,6 @@
padding: 8rpx;
box-sizing: border-box;
font-weight: bold;
// float: left;
// margin-right: 20rpx;
margin: 0 auto;
margin-bottom: 10rpx;
//margin-top:-10rpx;
@@ -997,7 +882,6 @@
font-size: 46rpx;
color: $themeColor;
background-color: #f5f5f5;
// line-height: 46rpx;
padding: 20rpx;
// border-leradius: 6px;
border-top-left-radius: 6px;
@@ -1016,13 +900,11 @@
.center {
line-height: 40rpx;
// padding:0 10rpx;
}
.bottom {
width: 100%;
margin-top: 60rpx;
font-size: 24rpx;
line-height: 26rpx;
color: #b0b0b0;
@@ -1044,36 +926,86 @@
}
}
}
.user_vip_box {
display: block;
// min-width: 100rpx;
// position: absolute;
// bottom: -20rpx;
// display: flex;
.user_vip_box{
width: 125rpx;
position: absolute;
margin-top: - 40rpx;
z-index: 99;
}
.user_vip_item{
display: flex;
align-items: center;
justify-content: center;
view {
font-size: 22rpx;
font-weight: normal;
}
}
.user_vip {
z-index: 1;
color: #fff;
font-size: 24rpx;
width: auto;
padding: 4rpx 10rpx;
font-weight: 800;
.user_vip_item {
border-radius: 20rpx;
background: linear-gradient(60deg, #8265f9 30%, #016dea 100%);
background: linear-gradient(90deg, #ff1f00 0%, #fa9f93 100%);
color: #fff;
font-size: 20rpx;
line-height: 40rpx;
height: 40rpx;
font-weight: bold;
margin-bottom: 5rpx;
}
.super {
background: linear-gradient(to right, #5bc9c1 0%, #258feb 100%);
color: #f4f2e4;
.user_vip_item image{
width: 49rpx;
height: 16rpx;
}
.vip_type{
display: flex;
align-items: center;
}
.vip_type_item{
display: flex;
align-items: center;
justify-content: center;
padding: 0 12rpx;
background: linear-gradient(90deg, #258feb 0%, #00e1ec 100%);
border-radius: 20rpx;
font-size: 20rpx;
line-height: 40rpx;
height: 40rpx;
font-weight: bold;
color: #fff;
margin-right: 10rpx;
}
.vip_type_item image{
width: 34rpx;
height: 24rpx;
}
.vip_infor{
padding-left: 22rpx;
}
.vip_infor_item{
display: block;
color: #fff;
font-size: 27rpx;
line-height: 36rpx;
font-family: PangMenZhengDaoBiaoTiTiMianFeiBan;
font-weight: normal;
}
.vip_infor_item text{
color: #fff;
}
.vip_btn{
margin-right: 20rpx;
height: 50rpx;
}
.vip_btn button{
background: none;
border: 2rpx solid #f9ae3d;
border-radius: 40rpx;
font-size: 26rpx;
width: 90rpx;
height: 45rpx;
line-height: 45rpx;
color: #f9ae3d;
font-weight: bold;
}
.vip_null{
color: #fff;
font-size: 26rpx;
line-height: 34rpx;
}
</style>