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.
600 lines
14 KiB
600 lines
14 KiB
<!--学员-详情-->
|
|
<template>
|
|
<view class="main_box">
|
|
<!--自定义导航栏-->
|
|
<!-- <view class="navbar_section">-->
|
|
<!-- <view class="title">学员详情</view>-->
|
|
<!-- </view>-->
|
|
|
|
<!--学员信息-->
|
|
<view class="user_section">
|
|
<view class="box">
|
|
<view class="left">
|
|
<image class="pic" :src="$util.img(studentsInfo.header)"></image>
|
|
<view class="btn_box" v-if="checkExpireTime(studentsInfo.expire_time)">
|
|
<view class="btn">即将到期</view>
|
|
</view>
|
|
</view>
|
|
<view class="right">
|
|
<view class="item">
|
|
<view class="name">{{studentsInfo.name}}</view>
|
|
<view class="age">
|
|
{{studentsInfo.age}}岁
|
|
</view>
|
|
</view>
|
|
<!-- <view class="item">-->
|
|
<!-- <view class="title">家长姓名：黄大呢</view>-->
|
|
<!-- </view>-->
|
|
<view class="item">
|
|
<view class="title">电话：{{studentsInfo.phone}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!--课程信息-->
|
|
<!-- <view class="course_section">-->
|
|
<!-- <view class="main">-->
|
|
<!-- <view class="course_box">-->
|
|
<!-- <view class="item">-->
|
|
<!-- <view class="title">篮球少儿课程</view>-->
|
|
<!-- </view>-->
|
|
|
|
<!-- <view class="item">-->
|
|
<!-- <image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image>-->
|
|
<!-- <view class="name">{{studentsInfo.name}}</view>-->
|
|
<!-- </view>-->
|
|
|
|
<!-- <view class="item">-->
|
|
<!-- <view class="content">截止时间：{{studentsInfo.expire_time}}</view>-->
|
|
<!-- </view>-->
|
|
|
|
<!-- <view class="item">-->
|
|
<!-- <view class="content">已上课时：{{studentsInfo.have_study_time}}</view>-->
|
|
<!-- <view class="content">剩余课时：{{studentsInfo.end_study_time}}</view>-->
|
|
<!-- </view>-->
|
|
|
|
<!-- <view class="tag">-->
|
|
<!-- 出勤高-->
|
|
<!-- </view>-->
|
|
|
|
<!-- <view class="btn">-->
|
|
<!-- 延课一周-->
|
|
<!-- </view>-->
|
|
<!-- </view>-->
|
|
<!-- </view>-->
|
|
<!-- <view class="bg_box bg_top"></view>-->
|
|
<!-- <view class="bg_box bg_bottom"></view>-->
|
|
<!-- </view>-->
|
|
|
|
|
|
<view class="main_section">
|
|
<view class="section_box">
|
|
<view class="tag_box">
|
|
<view :class="['item', tabType=='1' ? 'select':'']" @click="tabChange(1)">出勤记录</view>
|
|
<view :class="['item', tabType=='2' ? 'select':'']" @click="tabChange(2)">体侧报告</view>
|
|
</view>
|
|
|
|
<!--作业列表-->
|
|
<view v-if="tabType=='1'" class="section_1">
|
|
<view class="ul">
|
|
<view class="li"
|
|
v-for="(v,k) in assignmentsList"
|
|
:key="k"
|
|
@click="opebViewWorkDetails(v)">
|
|
<view class="left">
|
|
<view class="title">{{v.courses_name}}</view>
|
|
<view class="date">上课时间：{{v.submit_time}}</view>
|
|
</view>
|
|
<view class="right">
|
|
<view v-if="v.status==1" class="btn" style="background-color: #e2e2e2;">作业未提交</view>
|
|
<view v-else-if="v.status==2" class="btn" style="background-color: #a4adb3;">待批改</view>
|
|
<view v-else-if="v.status==3" class="btn" style="background-color: #29d3b4;">作业已完成</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<!--评测报告-->
|
|
<view v-if="tabType=='2'" class="section_2">
|
|
<scroll-view
|
|
class="ul"
|
|
scroll-y="true"
|
|
:lower-threshold="lowerThreshold"
|
|
@scrolltolower="loadMoreData"
|
|
style="height: 65vh;"
|
|
>
|
|
<view
|
|
class="li"
|
|
v-for="(v,k) in surveyList"
|
|
:key="k" @click="openViewPhysicalExamination(v)"
|
|
>
|
|
<view class="top">
|
|
<view class="title">综合评分:{{v.score}}</view>
|
|
<!-- <view class="hint">打败了99%学员</view>-->
|
|
</view>
|
|
<view class="bottom">测试时间：{{v.create_time}}</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
|
|
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<!-- 底部导航-->
|
|
<!-- <AQTabber/>-->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import memberApi from '@/api/member.js';
|
|
import AQTabber from "@/components/AQ/AQTabber.vue"
|
|
|
|
|
|
export default {
|
|
components: {
|
|
AQTabber,
|
|
},
|
|
data() {
|
|
return {
|
|
tabType:'1',//1=班级成员,2=作业任务
|
|
Atype:1,//1=作业完成,2=作业未提交
|
|
|
|
students_id:'',//学生id
|
|
studentsInfo:{},// 学生详情
|
|
assignmentsList:[],// 作业列表
|
|
|
|
loading:false,//加载状态
|
|
lowerThreshold: 100,//距离底部多远触发
|
|
isReachedBottom: false,//防止重复加载|true=不可加载|false=可加载
|
|
|
|
//筛选条件
|
|
filteredData:{
|
|
page:1,//当前页码
|
|
limit:10,//每页返回数据条数
|
|
total:10,//数据总条数
|
|
students_id: '',//学员id
|
|
},
|
|
surveyList:[],//体测报告列表
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.students_id = options.students_id//学生id
|
|
this.filteredData.students_id = options.students_id//学生id
|
|
},
|
|
onShow(){
|
|
this.init()//初始化
|
|
},
|
|
methods: {
|
|
//初始化
|
|
async init(){
|
|
//获取学生详情
|
|
await this.getStudentsInfo()
|
|
this.getSurveyList()
|
|
},
|
|
//获取学生详情
|
|
async getStudentsInfo(){
|
|
let data = {
|
|
students_id:this.students_id
|
|
}
|
|
let res = await memberApi.jlStudentsInfo(data)
|
|
if (res.code != 1){
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
this.studentsInfo = res.data//学生信息
|
|
|
|
this.assignmentsList = res.data.assignments_list//作业列表
|
|
|
|
},
|
|
// 检查 expire_time 是否大于等于当前时间 5 天
|
|
checkExpireTime(expireTime = '') {
|
|
if (!expireTime) {
|
|
return false
|
|
}
|
|
|
|
const expireDate = new Date(expireTime);
|
|
const currentDate = new Date();
|
|
|
|
// 计算天数差
|
|
const timeDifference = expireDate - currentDate;
|
|
const daysDifference = timeDifference / (1000 * 60 * 60 * 24);
|
|
|
|
if (daysDifference >= 5) {
|
|
return true
|
|
} else {
|
|
return false
|
|
}
|
|
},
|
|
|
|
|
|
//加载更多(下一页)
|
|
loadMoreData() {
|
|
//判断是否加载
|
|
if (!this.isReachedBottom) {
|
|
this.isReachedBottom = true;//设置为不可请求状态
|
|
this.getSurveyList();
|
|
}
|
|
},
|
|
//重置为第一页
|
|
async resetFilteredData() {
|
|
this.isReachedBottom = false; // 重置状态，以便下次触发加载更多
|
|
|
|
this.filteredData.page = 1//当前页码
|
|
this.filteredData.limit = 10//每页返回数据条数
|
|
this.filteredData.total = 10//数据总条数
|
|
},
|
|
//获取学生评测报告列表
|
|
async getSurveyList(){
|
|
this.loading = true
|
|
|
|
let data = {...this.filteredData}
|
|
|
|
//判断是否还有数据
|
|
if(this.filteredData.page * this.filteredData.limit > this.filteredData.total){
|
|
this.loading = false
|
|
uni.showToast({
|
|
title: '暂无更多',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
if(data.page == 1){
|
|
this.surveyList = []
|
|
}
|
|
|
|
//学员-体测列表
|
|
let res = await memberApi.surveyList(data)
|
|
this.loading = false
|
|
this.isReachedBottom = false;
|
|
if (res.code != 1){
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
this.surveyList = this.surveyList.concat(res.data.list.data); // 使用 concat 方法 将新数据追加到数组中
|
|
|
|
console.log('列表',this.surveyList)
|
|
this.filteredData.total = res.data.list.total
|
|
this.filteredData.page++
|
|
},
|
|
|
|
|
|
//切换tab
|
|
tabChange(tabType) {
|
|
this.tabType = tabType
|
|
},
|
|
|
|
//打开课程详情
|
|
openViewCourseInfo(item){
|
|
uni.navigateTo({
|
|
url: '/pages/coach/course/info'
|
|
})
|
|
},
|
|
//打开学员详情页
|
|
openViewStudentInfo(item){
|
|
uni.navigateTo({
|
|
url: '/pages/coach/student/info'
|
|
})
|
|
},
|
|
|
|
//打开体测报告
|
|
openViewPhysicalExamination(item){
|
|
let survey_id = item.id
|
|
uni.navigateTo({
|
|
url: `/pages/coach/student/physical_examination?survey_id=${survey_id}`
|
|
})
|
|
},
|
|
|
|
//打开作业任务
|
|
opebViewWorkDetails(item){
|
|
uni.navigateTo({
|
|
url: '/pages/coach/student/work_details'
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
|
|
.main_box{
|
|
background: #292929 ;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
//自定义导航栏
|
|
.navbar_section{
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: #292929;
|
|
.title{
|
|
padding: 40rpx 0rpx;
|
|
|
|
/* 小程序端样式 */
|
|
// #ifdef MP-WEIXIN
|
|
padding: 80rpx 0rpx;
|
|
// #endif
|
|
|
|
font-size: 30rpx;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
//学员信息
|
|
.user_section {
|
|
background-color: #29D3B4;
|
|
padding-top: 58rpx;
|
|
padding-bottom: 42rpx;
|
|
.box{
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 15rpx;
|
|
.left{
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
width: 120rpx;
|
|
.pic{
|
|
width: 92rpx;
|
|
height: 92rpx;
|
|
border-radius: 50%;
|
|
}
|
|
.btn_box{
|
|
position: absolute;
|
|
bottom: -18rpx;
|
|
.btn{
|
|
width: 120rpx;
|
|
height: 38rpx;
|
|
line-height: 40rpx;
|
|
border-radius: 4rpx;
|
|
background-color: rgba(245,154,35,1);
|
|
color: rgba(255,255,255,1);
|
|
font-size: 20rpx;
|
|
text-align: center;
|
|
border: 0rpx solid rgba(121,121,121,1);
|
|
}
|
|
}
|
|
|
|
}
|
|
.right{
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 18rpx;
|
|
.item{
|
|
color: #fff;
|
|
display: flex;
|
|
align-items: center;
|
|
.name{
|
|
font-size: 28rpx;
|
|
}
|
|
.age{
|
|
margin-left: 20rpx;
|
|
width: 128rpx;
|
|
height: 42rpx;
|
|
line-height: 42rpx;
|
|
border-radius: 34rpx;
|
|
background-color: rgba(255,255,255,1);
|
|
color: rgba(51,51,51,1);
|
|
font-size: 28rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
//课程信息
|
|
.course_section{
|
|
position: relative;
|
|
.main{
|
|
position: relative;
|
|
z-index: 2;
|
|
padding: 0 24rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
.course_box{
|
|
padding: 42rpx 28rpx;
|
|
width: 692rpx;
|
|
border-radius: 20rpx;
|
|
background-color: #fff;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 20rpx;
|
|
position: relative;
|
|
.item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 22rpx;
|
|
.title {
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
}
|
|
|
|
.pic {
|
|
width: 58rpx;
|
|
height: 58rpx;
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.name {
|
|
color: #333333;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.content {
|
|
color: #AAAAAA;
|
|
font-size: 24rpx;
|
|
}
|
|
}
|
|
.tag{
|
|
position: absolute;
|
|
right: 0;
|
|
top: 0;
|
|
width: 110rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
border-radius: 0rpx 24rpx 0rpx 24rpx;
|
|
background-color: rgba(236,128,141,1);
|
|
color: rgba(255,255,255,1);
|
|
font-size: 24rpx;
|
|
text-align: center;
|
|
}
|
|
.btn{
|
|
position: absolute;
|
|
right: 30rpx;
|
|
bottom: 50rpx;
|
|
width: 130rpx;
|
|
height: 48rpx;
|
|
line-height: 48rpx;
|
|
border-radius: 10rpx;
|
|
background-color: rgba(41,211,180,0);
|
|
color: rgba(50,219,224,1);
|
|
font-size: 24rpx;
|
|
text-align: center;
|
|
font-family: -regular;
|
|
border: 2rpx solid rgba(50,219,224,1);
|
|
}
|
|
}
|
|
}
|
|
.bg_box{
|
|
z-index: 1;
|
|
width: 100%;
|
|
height: 150rpx;
|
|
}
|
|
|
|
.bg_top{
|
|
position: absolute;
|
|
top: 0;
|
|
background-color: #29D3B4;
|
|
}
|
|
.bg_bottom{
|
|
top: 50%;
|
|
position: absolute;
|
|
background-color: #292929;
|
|
}
|
|
}
|
|
|
|
.main_section{
|
|
background: #292929 100%;
|
|
padding: 0 24rpx;
|
|
padding-top: 40rpx;
|
|
padding-bottom: 150rpx;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
|
|
.section_box {
|
|
background: #fff;
|
|
border-radius: 16rpx;
|
|
padding: 34rpx 24rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
gap: 38rpx;
|
|
.tag_box{
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 112rpx;
|
|
.item{
|
|
width: 112rpx;
|
|
font-size: 28rpx;
|
|
}
|
|
.select{
|
|
color: #29D3B4;
|
|
}
|
|
}
|
|
|
|
//出勤记录
|
|
.section_1{
|
|
width: 100%;
|
|
.ul{
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 12rpx;
|
|
.li{
|
|
padding: 30rpx 20rpx;
|
|
border: 1px solid #29D3B4;
|
|
border-radius: 18rpx;
|
|
background-color: rgba(41,211,180,0.16);
|
|
font-size: 26rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
.left{
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 15rpx;
|
|
}
|
|
.right{
|
|
.btn{
|
|
width: 110rpx;
|
|
height: 44rpx;
|
|
line-height: 44rpx;
|
|
border-radius: 8rpx;
|
|
background-color: rgba(41,211,180,1);
|
|
color: rgba(255,255,255,1);
|
|
font-size: 20rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
//体测报告
|
|
.section_2{
|
|
width: 100%;
|
|
.ul{
|
|
display: flex;
|
|
flex-direction: column;
|
|
.li{
|
|
margin-bottom: 12rpx;
|
|
padding: 30rpx 20rpx;
|
|
border: 1px solid #29D3B4;
|
|
border-radius: 18rpx;
|
|
background-color: rgba(41,211,180,0.16);
|
|
font-size: 26rpx;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 20rpx;
|
|
.top{
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 40rpx;
|
|
.title{
|
|
font-size: 34rpx;
|
|
}
|
|
.hint{
|
|
color: #F59A23;
|
|
font-size: 24rpx;
|
|
}
|
|
}
|
|
.bottom{}
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
</style>
|