|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div class="studentDetail">
|
|
|
- <van-cell-group inset style="margin: 0.1rem 0.12rem">
|
|
|
+ <van-cell-group inset style="margin: 0.1rem 0.12rem" :border="false">
|
|
|
<van-cell center :border="false">
|
|
|
<template #icon>
|
|
|
<van-image class="studentLogo" :src="avatar || iconStudent" />
|
|
@@ -8,23 +8,30 @@
|
|
|
<template #title>
|
|
|
<div style="display: flex; align-items: center; font-size: 0.16rem">
|
|
|
{{ username }}
|
|
|
- <img v-if="memberRankSettingId > 0" style="width: 16px; height: 16px; margin-left: 3px" src="./images/icon_member.png" alt="" />
|
|
|
- </div>
|
|
|
+ <img v-if="memberList.length > 0" style="width: 44px; height: 17px; margin-left: 4px" src="./images/icon-vip-active.png" alt="" />
|
|
|
+ <img v-if="memberList.length <= 0" style="width: 44px; height: 17px; margin-left: 4px" src="./images/icon-vip.png" alt="" /></div>
|
|
|
</template>
|
|
|
<template #label>
|
|
|
{{ subjectName }}
|
|
|
</template>
|
|
|
</van-cell>
|
|
|
- <van-cell style="padding-top: 3px; padding-bottom: 15px">
|
|
|
+ <!-- <van-cell style="padding-top: 3px; padding-bottom: 15px">
|
|
|
<div class="studentMember">
|
|
|
<img src="./images/icon_tips.png" />
|
|
|
<span>该学员会员有效期剩余: {{ membershipDay }} 天</span>
|
|
|
</div>
|
|
|
- </van-cell>
|
|
|
+ </van-cell> -->
|
|
|
</van-cell-group>
|
|
|
|
|
|
+ <div class="title" v-if="memberList.length > 0"><i></i>会员信息</div>
|
|
|
+ <div class="memberSection" v-if="memberList.length > 0">
|
|
|
+ <div class="memberItem" v-for="(item, index) in memberList" :key="index">
|
|
|
+ <i></i>「{{item.memberRankName}}」剩余有效期<span>{{ item.remainingDays }}</span>天
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
<div class="title"><i></i>基础信息</div>
|
|
|
- <van-cell-group inset style="margin: 0.1rem 0.12rem">
|
|
|
+ <van-cell-group inset style="margin: 0.1rem 0.12rem" :border="false">
|
|
|
<van-cell title="学员编号" :value="id"></van-cell>
|
|
|
<van-cell title="分部" :value="organName"></van-cell>
|
|
|
<van-cell title="手机号" :value="phone" center>
|
|
@@ -37,16 +44,21 @@
|
|
|
</van-cell-group>
|
|
|
|
|
|
<div class="title" v-if="musicGroupList.length > 0"><i></i>乐团信息</div>
|
|
|
- <van-cell-group inset style="margin: 0.1rem 0.12rem">
|
|
|
- <van-cell v-for="(item, index) in musicGroupList" :key="index" :title="item.musicGroupName" :label="item.musicGroupId" center>
|
|
|
- <span :class="item.userMusicGroupStatus">{{ item.userMusicGroupStatus | musicGroupStudentType }}</span>
|
|
|
+ <van-cell-group inset style="margin: 0.1rem 0.12rem" :border="false">
|
|
|
+ <van-cell v-for="(item, index) in musicGroupList" :key="index" :label="item.musicGroupId" center >
|
|
|
+ <template #title>
|
|
|
+ <div class="musicTitle">
|
|
|
+ <span class="musicName">{{ item.musicGroupName }}</span>
|
|
|
+ <span :class="item.userMusicGroupStatus">{{ item.userMusicGroupStatus | musicGroupStudentType }}</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
</van-cell>
|
|
|
</van-cell-group>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { findStudentMusicGroups } from "./api";
|
|
|
+import { findStudentMusicGroups, api_studentQueryUserInfo } from "./api";
|
|
|
export default {
|
|
|
data() {
|
|
|
const query = this.$route.query;
|
|
@@ -63,10 +75,14 @@ export default {
|
|
|
memberRankSettingId: query.memberRankSettingId,
|
|
|
membershipDay: query.membershipDay,
|
|
|
musicGroupList: [],
|
|
|
+ memberList: [],
|
|
|
};
|
|
|
},
|
|
|
async mounted() {
|
|
|
try {
|
|
|
+ const {data} = await api_studentQueryUserInfo({ userId: this.id })
|
|
|
+ this.memberList = data.vipInfo || [];
|
|
|
+
|
|
|
const res = await findStudentMusicGroups({ userId: this.id });
|
|
|
this.musicGroupList = res.data || [];
|
|
|
} catch {
|
|
@@ -166,15 +182,25 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+.musicTitle {
|
|
|
+ // display: flex;
|
|
|
+ // align-items: center;
|
|
|
+ .musicName {
|
|
|
+ font-weight: bold;font-size: .16rem;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+}
|
|
|
.NORMAL,
|
|
|
.QUIT,
|
|
|
.APPLY {
|
|
|
background: #efefef;
|
|
|
border-radius: 0.06rem;
|
|
|
- font-size: 0.13rem;
|
|
|
+ font-size: 0.12rem;
|
|
|
+ margin-left: .08rem;
|
|
|
color: #999999;
|
|
|
line-height: 0.18rem;
|
|
|
- padding: 0.03rem 0.12rem;
|
|
|
+ padding: 0.01rem 0.06rem;
|
|
|
+ vertical-align: baseline
|
|
|
}
|
|
|
|
|
|
.NORMAL {
|
|
@@ -196,4 +222,41 @@ export default {
|
|
|
// color: #333;
|
|
|
// margin-left: 0.08rem;
|
|
|
}
|
|
|
+.van-cell {
|
|
|
+ font-size: .14rem;
|
|
|
+ padding: .16rem .14rem;
|
|
|
+}
|
|
|
+.van-cell__label {
|
|
|
+ font-size: .14rem;
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.memberSection {
|
|
|
+ margin: 0.1rem 0.12rem;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 8px;
|
|
|
+ padding: .16rem .14rem;
|
|
|
+}
|
|
|
+.memberItem {
|
|
|
+ font-size: .14rem;
|
|
|
+ color: #333333;
|
|
|
+ line-height: .2rem;
|
|
|
+ padding-bottom: .16rem;
|
|
|
+ &:last-child {
|
|
|
+ padding-bottom: 0;
|
|
|
+ }
|
|
|
+ i {
|
|
|
+ width: 4px;
|
|
|
+ height: 4px;
|
|
|
+ display: inline-block;
|
|
|
+ background: #02CDBC;
|
|
|
+ border-radius: 50%;
|
|
|
+ vertical-align: middle;
|
|
|
+ }
|
|
|
+ span {
|
|
|
+ color: #F44541;
|
|
|
+ font-weight: bold;
|
|
|
+ padding: 0 4px;
|
|
|
+ }
|
|
|
+}
|
|
|
</style>
|