You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
249 lines
6.4 KiB
249 lines
6.4 KiB
<template> |
|
<view class="member-box"> |
|
<view class="member-info-box acea-row row-middle row-between"> |
|
<view class="info-l acea-row"> |
|
<view><image :src="member.avatar"></image></view> |
|
<view class="name-box"> |
|
<view class="acea-row row-middle mt26"> |
|
<view class="name">{{member.realName}}</view> |
|
<view class="vip-box">{{member.level}}级会员</view> |
|
</view> |
|
<view class="acea-row"> |
|
<!-- <view class="tips-box">湖北 武汉</view> --> |
|
<view class="tips-box">{{member.integral}}积分</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="call-btn" @click="call">拨号</view> |
|
</view> |
|
<view class="tab-box acea-row row-around" :class="isFixedTop?'fixed':''"> |
|
<view class="tab-item" :class="active == '0' ? 'tab-item-active' : ''" @click="handelScroll('0')">课程({{detail.courseDtos.length}})</view> |
|
<view class="tab-item" :class="active == '1' ? 'tab-item-active' : ''" @click="handelScroll('1')">打榜({{detail.studyListDtos.length}})</view> |
|
</view> |
|
<view class="content-box" v-if="active == 0"> |
|
<view class="course-list-box"> |
|
<view class="course-item" v-for="item in detail.courseDtos" :key="item" @click="toCourseDetail(item.id)"> |
|
<view class="top-box acea-row row-between"> |
|
<view class="top-l-box"> |
|
<view class="name line1">{{item.courseName}}</view> |
|
<view class="time-box">时间：{{item.courseStartTime.split(' ')[0]}} 至 {{item.courseEndTime.split(' ')[0]}}</view> |
|
<view class="time-box">地点：{{item.coursePlace}}</view> |
|
</view> |
|
<view class="state-box" v-if="item.signState == 0">未签到</view> |
|
<view class="state-box" v-if="item.signState == 1">已签到</view> |
|
<view class="state-box" v-if="item.signState == 2">签到未开放</view> |
|
<view class="state-box" v-if="item.signState == 3">缺席</view> |
|
<view class="state-box" v-if="item.signState == 4">课程已取消</view> |
|
</view> |
|
<view class="btm-box">座位:{{item.seat || '暂未安排座位'}}</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="dabang-list-box" v-else> |
|
<view class="dabang-item" v-for="(item,index) in detail.studyListDtos" @click="bangdanDetail(item.id)"> |
|
<view class="dabang-info"> |
|
<view class="bangdan-name line1">{{item.listName}}</view> |
|
<view class="time">{{item.listStartTime.split(' ')[0]}}-{{item.listEndTime.split(' ')[0]}}</view> |
|
<view class="time">{{item.integral}}积分</view> |
|
</view> |
|
<view class="dabang-btm colR acea-row row-between-wrapper" v-if="item.listState == 2"> |
|
<view>{{item.signState == 2 ? '+' : '-'}} {{item.integral}}积分</view> |
|
<view v-if="item.signState == 2">打榜成功 {{item.signTimes}}/{{item.clockTimes}}</view> |
|
<view v-if="item.signState == 3">打榜失败 {{item.signTimes}}/{{item.clockTimes}}</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import { getMemberDetail } from "@/api/serverTeacher" |
|
export default{ |
|
data(){ |
|
return { |
|
active: 0, |
|
member:{}, |
|
detail:{} |
|
} |
|
}, |
|
onLoad() { |
|
this.member = JSON.parse(decodeURIComponent(this.$yroute.query.item)); |
|
// this.uid = this.$yroute.query.uid; |
|
this.getDetail() |
|
}, |
|
methods:{ |
|
toCourseDetail(id){ |
|
this.$yrouter.push({ |
|
path: '/pages/serviceTeacher/courseDetail', |
|
query:{ |
|
id: id |
|
} |
|
}) |
|
}, |
|
getDetail(){ |
|
getMemberDetail({uid:this.member.uid}).then((res)=>{ |
|
if(res.success){ |
|
this.detail = res.data |
|
} |
|
}) |
|
}, |
|
bangdanDetail(id){ |
|
this.$yrouter.push({ |
|
path:'/pages/serviceTeacher/memberDabang', |
|
query:{ |
|
studyId: id, |
|
memberId:this.member.uid |
|
} |
|
}) |
|
}, |
|
handelScroll(idx){ |
|
this.active = idx |
|
}, |
|
call(){ |
|
uni.makePhoneCall({ |
|
phoneNumber:this.member.phone |
|
}) |
|
}, |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="less" scoped> |
|
.member-box{ |
|
.member-info-box{ |
|
padding: 36rpx 30rpx 50rpx; |
|
background: #fff; |
|
.info-l{ |
|
image{ |
|
width: 124rpx; |
|
height: 124rpx; |
|
border-radius: 50px; |
|
margin-right: 30rpx; |
|
} |
|
.name-box{ |
|
font-size: 24rpx; |
|
.mt26{ |
|
margin-bottom: 26rpx; |
|
} |
|
.name{ |
|
font-size: 36rpx; |
|
color: #222; |
|
} |
|
.vip-box{ |
|
// width: 100rpx; |
|
height: 36rpx; |
|
line-height: 36rpx; |
|
text-align: center; |
|
padding: 0 10rpx; |
|
color: #fff; |
|
background: linear-gradient(180deg, #FFCF61 0%, #FCA333 100%); |
|
box-shadow: 0px 4rpx 8rpx 0px rgba(253,169,57,0.19); |
|
border-radius: 20rpx 20rpx 20rpx 0px; |
|
margin-left: 10rpx; |
|
} |
|
.tips-box{ |
|
padding: 4rpx 12rpx; |
|
height: 40rpx; |
|
background: #FFF5E6; |
|
border-radius: 23rpx; |
|
color: #FFA726; |
|
font-size: 24rpx; |
|
margin-right: 16rpx; |
|
} |
|
} |
|
} |
|
.call-btn{ |
|
width: 120rpx; |
|
height: 60rpx; |
|
line-height: 60rpx; |
|
font-size: 32rpx; |
|
color: #fff; |
|
text-align: center; |
|
background: #F4C076; |
|
border-radius: 30rpx; |
|
} |
|
} |
|
.tab-box{ |
|
white-space: nowrap; |
|
width: 100%; |
|
background: #fff; |
|
padding: 18rpx 34rpx 0; |
|
.tab-item{ |
|
width: 50%; |
|
text-align: center; |
|
display: inline-block; |
|
padding-bottom: 26rpx; |
|
font-size: 32rpx; |
|
color: #222; |
|
} |
|
.tab-item-active{ |
|
font-weight: bold; |
|
border-bottom: 4rpx solid #EB5744; |
|
} |
|
} |
|
.content-box{ |
|
padding: 30rpx; |
|
.course-list-box{ |
|
.course-item{ |
|
background: #fff; |
|
padding: 30rpx; |
|
color: #333; |
|
font-size: 24rpx; |
|
border-radius: 10px; |
|
margin-bottom: 30rpx; |
|
.name{ |
|
width: 460rpx; |
|
font-size: 32rpx; |
|
margin-bottom: 20rpx; |
|
} |
|
.state-box{ |
|
min-width: 152rpx; |
|
height: 52rpx; |
|
background: #FEF2D9; |
|
border-radius: 4rpx; |
|
border: 1px solid #D89200; |
|
text-align: center; |
|
line-height: 52rpx; |
|
color: #695121; |
|
} |
|
.btm-box{ |
|
padding-top: 20rpx; |
|
border-top: 1px solid #ececec; |
|
margin-top: 20rpx; |
|
} |
|
} |
|
} |
|
} |
|
.dabang-list-box{ |
|
width: 100%; |
|
padding: 0 32rpx; |
|
.dabang-item{ |
|
width: 100%; |
|
background: #fff; |
|
color: #fff; |
|
margin-top: 28rpx; |
|
font-size: 28rpx; |
|
border-radius: 10rpx; |
|
overflow: hidden; |
|
.dabang-info{ |
|
height: 200rpx; |
|
padding-left: 24rpx; |
|
padding-top: 24rpx; |
|
background: linear-gradient(148deg, #B4B6C4 0%, #C5CAD6 100%); |
|
.bangdan-name{ |
|
font-size: 50rpx; |
|
line-height: 80rpx; |
|
} |
|
} |
|
.dabang-btm{ |
|
padding: 0 56rpx 0 24rpx; |
|
height: 80rpx; |
|
color: #8FB85B; |
|
} |
|
.colR{ |
|
color:#EB5744; |
|
} |
|
} |
|
} |
|
} |
|
</style>
|
|
|