3 changed files with 293 additions and 2 deletions
@ -0,0 +1,275 @@ |
|||||
|
<!--授课统计-详情--> |
||||
|
<template> |
||||
|
<view class="main_box"> |
||||
|
|
||||
|
<view class="main_section"> |
||||
|
<view class="section_1"> |
||||
|
<view class="ul"> |
||||
|
<view class="li"> |
||||
|
<view class="title">2021年3月</view> |
||||
|
<view class="box"> |
||||
|
<view class="top"> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">34</view> |
||||
|
<view class="explain">月授课数/节</view> |
||||
|
</view> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">4</view> |
||||
|
<view class="explain">总授班级/个</view> |
||||
|
</view> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">1234</view> |
||||
|
<view class="explain">月负责学员/名</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="bottom"> |
||||
|
月到课率<text>88%</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="li"> |
||||
|
<view class="title">2021年3月</view> |
||||
|
<view class="box"> |
||||
|
<view class="top"> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">34</view> |
||||
|
<view class="explain">月授课数/节</view> |
||||
|
</view> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">4</view> |
||||
|
<view class="explain">总授班级/个</view> |
||||
|
</view> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">1234</view> |
||||
|
<view class="explain">月负责学员/名</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="bottom"> |
||||
|
月到课率<text>88%</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="li"> |
||||
|
<view class="title">2021年3月</view> |
||||
|
<view class="box"> |
||||
|
<view class="top"> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">34</view> |
||||
|
<view class="explain">月授课数/节</view> |
||||
|
</view> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">4</view> |
||||
|
<view class="explain">总授班级/个</view> |
||||
|
</view> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">1234</view> |
||||
|
<view class="explain">月负责学员/名</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="bottom"> |
||||
|
月到课率<text>88%</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="li"> |
||||
|
<view class="title">2021年3月</view> |
||||
|
<view class="box"> |
||||
|
<view class="top"> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">34</view> |
||||
|
<view class="explain">月授课数/节</view> |
||||
|
</view> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">4</view> |
||||
|
<view class="explain">总授班级/个</view> |
||||
|
</view> |
||||
|
<view class="top_item"> |
||||
|
<view class="num">1234</view> |
||||
|
<view class="explain">月负责学员/名</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="bottom"> |
||||
|
月到课率<text>88%</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import user from '@/api/user.js'; |
||||
|
import AQTabber from "@/components/AQ/AQTabber.vue" |
||||
|
|
||||
|
|
||||
|
export default { |
||||
|
components: { |
||||
|
AQTabber, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
formData:{}, |
||||
|
|
||||
|
//课程下拉菜单相关 |
||||
|
show_course:false,//是否显示下拉菜单 |
||||
|
//课程下拉菜单 |
||||
|
course_name:'课程',//选中的下拉菜单名称 |
||||
|
options_course: [ |
||||
|
{ |
||||
|
text: '请选择课程', |
||||
|
value: '', |
||||
|
checked: true |
||||
|
}, { |
||||
|
text: '羽毛球课程1', |
||||
|
value: '1' |
||||
|
}, { |
||||
|
text: '篮球课程2', |
||||
|
value: '2' |
||||
|
} |
||||
|
], |
||||
|
|
||||
|
//课室下拉菜单相关 |
||||
|
show_classroom:false,//是否显示下拉菜单 |
||||
|
//课程下拉菜单 |
||||
|
classroom_name:'课室',//选中的下拉菜单名称 |
||||
|
options_classroom: [ |
||||
|
{ |
||||
|
text: '请选择课室', |
||||
|
value: '', |
||||
|
checked: true |
||||
|
}, { |
||||
|
text: '羽毛球201', |
||||
|
value: '1' |
||||
|
}, { |
||||
|
text: '篮球室101', |
||||
|
value: '2' |
||||
|
} |
||||
|
], |
||||
|
} |
||||
|
}, |
||||
|
onLoad() { |
||||
|
}, |
||||
|
methods: { |
||||
|
//选中课程下拉菜单点击事件 |
||||
|
clickCourse(e){ |
||||
|
console.log(e) |
||||
|
this.course_name = e.text |
||||
|
this.show_course = true |
||||
|
}, |
||||
|
//显示下拉菜单 |
||||
|
filterTapCourse() { |
||||
|
//显示下拉框 |
||||
|
this.$refs.ref_course.show() |
||||
|
this.show_course = true; |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
|
||||
|
//选中课室 |
||||
|
clickClassroom(e){ |
||||
|
console.log(e) |
||||
|
this.classroom_name = e.text |
||||
|
this.show_classroom = true |
||||
|
}, |
||||
|
//显示课室下拉菜单 |
||||
|
filterTapClassroom() { |
||||
|
//显示下拉框 |
||||
|
this.$refs.ref_classroom.show() |
||||
|
this.show_classroom = true; |
||||
|
}, |
||||
|
|
||||
|
//打开课时详情页 |
||||
|
openViewCourseInfo(item){ |
||||
|
uni.navigateTo({ |
||||
|
url: '/pages/coach/course/info' |
||||
|
}) |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="less" scoped> |
||||
|
|
||||
|
.main_box{ |
||||
|
background: #292929 ; |
||||
|
} |
||||
|
|
||||
|
//自定义导航栏 |
||||
|
.navbar_section{ |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
background: #29d3b4; |
||||
|
.title{ |
||||
|
padding: 20rpx 0; |
||||
|
font-size: 30rpx; |
||||
|
color: #315d55; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.main_section{ |
||||
|
min-height: 100vh; |
||||
|
background: #292929 100%; |
||||
|
padding: 0 24rpx; |
||||
|
padding-top: 32rpx; |
||||
|
padding-bottom: 150rpx; |
||||
|
font-size: 28rpx; |
||||
|
.section_1{ |
||||
|
color: #fff; |
||||
|
font-size: 24rpx; |
||||
|
.ul{ |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
gap: 56rpx; |
||||
|
.li{ |
||||
|
.title{ |
||||
|
color: #fff; |
||||
|
font-size: 24rpx; |
||||
|
} |
||||
|
.box{ |
||||
|
margin-top: 24rpx; |
||||
|
padding: 36rpx 32rpx 28rpx 44rpx; |
||||
|
width: 700rpx; |
||||
|
border-radius: 14rpx; |
||||
|
background-color: #fff; |
||||
|
color: #333333FF; |
||||
|
font-size: 26rpx; |
||||
|
.top{ |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
align-items: center; |
||||
|
.top_item{ |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
align-items: center; |
||||
|
gap: 12rpx; |
||||
|
.num{ |
||||
|
font-size: 56rpx; |
||||
|
color: #29D3B4; |
||||
|
} |
||||
|
.explain{ |
||||
|
font-size: 24rpx; |
||||
|
color: #AAAAAA; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.bottom{ |
||||
|
margin-top: 34rpx; |
||||
|
font-size: 24rpx; |
||||
|
text{ |
||||
|
margin-left: 15rpx; |
||||
|
color: #29D3B4; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
</style> |
||||
Loading…
Reference in new issue