3 changed files with 335 additions and 1 deletions
@ -0,0 +1,316 @@ |
|||||
|
<!--即将到期--> |
||||
|
<template> |
||||
|
<view class="main_box"> |
||||
|
<!--自定义导航栏--> |
||||
|
<!-- <view class="navbar_section">--> |
||||
|
<!-- <view class="title">班级详情</view>--> |
||||
|
<!-- </view>--> |
||||
|
|
||||
|
<view class="main_section"> |
||||
|
<!-- 班级成员列表--> |
||||
|
<view class="section_4"> |
||||
|
<view class="ul"> |
||||
|
<view class="li" @click="openViewStudentInfo({id:1})"> |
||||
|
<view class="left"> |
||||
|
<view class="box_1"> |
||||
|
<image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
||||
|
<view class="tag_box"> |
||||
|
即将到期 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box_2"> |
||||
|
<view class="name">黄明明</view> |
||||
|
<view class="date">课程截止时间:2020.05:25</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="right"> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>已上课时</view> |
||||
|
</view> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>剩余课时</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="li" @click="openViewStudentInfo({id:1})"> |
||||
|
<view class="left"> |
||||
|
<view class="box_1"> |
||||
|
<image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
||||
|
<view class="tag_box"> |
||||
|
即将到期 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box_2"> |
||||
|
<view class="name">黄明明</view> |
||||
|
<view class="date">课程截止时间:2020.05:25</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="right"> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>已上课时</view> |
||||
|
</view> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>剩余课时</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="li" @click="openViewStudentInfo({id:1})"> |
||||
|
<view class="left"> |
||||
|
<view class="box_1"> |
||||
|
<image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
||||
|
<view class="tag_box"> |
||||
|
即将到期 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box_2"> |
||||
|
<view class="name">黄明明</view> |
||||
|
<view class="date">课程截止时间:2020.05:25</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="right"> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>已上课时</view> |
||||
|
</view> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>剩余课时</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="li" @click="openViewStudentInfo({id:1})"> |
||||
|
<view class="left"> |
||||
|
<view class="box_1"> |
||||
|
<image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
||||
|
<view class="tag_box"> |
||||
|
即将到期 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box_2"> |
||||
|
<view class="name">黄明明</view> |
||||
|
<view class="date">课程截止时间:2020.05:25</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="right"> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>已上课时</view> |
||||
|
</view> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>剩余课时</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="li" @click="openViewStudentInfo({id:1})"> |
||||
|
<view class="left"> |
||||
|
<view class="box_1"> |
||||
|
<image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
||||
|
<view class="tag_box"> |
||||
|
即将到期 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="box_2"> |
||||
|
<view class="name">黄明明</view> |
||||
|
<view class="date">课程截止时间:2020.05:25</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="right"> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>已上课时</view> |
||||
|
</view> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>剩余课时</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="li" @click="openViewStudentInfo({id:1})"> |
||||
|
<view class="left"> |
||||
|
<view class="box_1"> |
||||
|
<image class="pic" src="http://www.firstui.cn:4000/vipdoc/img/img_logo.png"></image> |
||||
|
<!-- <view class="tag_box">--> |
||||
|
<!-- 即将到期--> |
||||
|
<!-- </view>--> |
||||
|
</view> |
||||
|
<view class="box_2"> |
||||
|
<view class="name">黄明明</view> |
||||
|
<view class="date">课程截止时间:2020.05:25</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="right"> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>已上课时</view> |
||||
|
</view> |
||||
|
<view class="item"> |
||||
|
<view>24</view> |
||||
|
<view>剩余课时</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 底部导航--> |
||||
|
<!-- <AQTabber/>--> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import user from '@/api/user.js'; |
||||
|
import AQTabber from "@/components/AQ/AQTabber.vue" |
||||
|
|
||||
|
|
||||
|
export default { |
||||
|
components: { |
||||
|
AQTabber, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
formData:{}, |
||||
|
tabType:'1',//1=班级成员,2=作业任务 |
||||
|
} |
||||
|
}, |
||||
|
onLoad() { |
||||
|
}, |
||||
|
methods: { |
||||
|
//切换tab |
||||
|
tabChange(tabType) { |
||||
|
this.tabType = tabType |
||||
|
}, |
||||
|
|
||||
|
//打开课程详情 |
||||
|
openViewCourseInfo(item){ |
||||
|
uni.navigateTo({ |
||||
|
url: '/pages/coach/course/info' |
||||
|
}) |
||||
|
}, |
||||
|
//打开学员详情页 |
||||
|
openViewStudentInfo(item){ |
||||
|
uni.navigateTo({ |
||||
|
url: '/pages/coach/student/info' |
||||
|
}) |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="less" scoped> |
||||
|
|
||||
|
.main_box{ |
||||
|
background: #292929 ; |
||||
|
} |
||||
|
|
||||
|
//自定义导航栏 |
||||
|
.navbar_section{ |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
background: #292929; |
||||
|
.title{ |
||||
|
padding: 20rpx 0; |
||||
|
font-size: 30rpx; |
||||
|
color: #fff; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.main_section{ |
||||
|
min-height: 100vh; |
||||
|
background: #292929 100%; |
||||
|
padding: 0 24rpx; |
||||
|
padding-top: 40rpx; |
||||
|
padding-bottom: 150rpx; |
||||
|
font-size: 24rpx; |
||||
|
color: #FFFFFF; |
||||
|
//班级成员列表 |
||||
|
.section_4{ |
||||
|
.ul{ |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
gap: 10rpx; |
||||
|
.li{ |
||||
|
padding: 20rpx 0; |
||||
|
padding-bottom: 40rpx; |
||||
|
border-bottom: 2px solid #D7D7D7; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
.left{ |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
gap: 30rpx; |
||||
|
.box_1{ |
||||
|
padding-left: 20rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
position: relative; |
||||
|
.pic{ |
||||
|
width: 84rpx; |
||||
|
height: 84rpx; |
||||
|
border-radius: 50%; |
||||
|
} |
||||
|
.tag_box{ |
||||
|
position: absolute; |
||||
|
bottom: -30rpx; |
||||
|
width: 120rpx; |
||||
|
height: 38rpx; |
||||
|
background-color: #F59A23; |
||||
|
border-radius: 4rpx; |
||||
|
line-height: 35rpx; |
||||
|
text-align: center; |
||||
|
font-size: 20rpx; |
||||
|
} |
||||
|
} |
||||
|
.box_2{ |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
gap: 20rpx; |
||||
|
.name{ |
||||
|
font-size: 28rpx; |
||||
|
} |
||||
|
.date{ |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.right{ |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
gap: 14rpx; |
||||
|
.item{ |
||||
|
border: 1px solid #00E5BB; |
||||
|
border-radius: 10rpx; |
||||
|
width: 102rpx; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
view{ |
||||
|
text-align: center; |
||||
|
height: 50rpx; |
||||
|
line-height: 50rpx; |
||||
|
} |
||||
|
view:nth-child(1){ |
||||
|
font-size: 32rpx; |
||||
|
background-color: #fff; |
||||
|
color: #00e5bb; |
||||
|
} |
||||
|
view:nth-child(2){ |
||||
|
font-size: 20rpx; |
||||
|
background-color: #00e5bb; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
|
||||
|
</style> |
||||
Loading…
Reference in new issue