This commit is contained in:
asd
2020-10-10 11:33:21 +08:00
parent 598b1f8112
commit 9bd5ceb10f
14 changed files with 728 additions and 6 deletions

View File

@@ -0,0 +1,192 @@
<template>
<div class="cont">
<div class="title">
<div>上课学生</div>
<div class="more">查看详情</div>
</div>
<div class="info">
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
</div>
</div>
</template>
<style lang="scss" scoped>
.cont {
width: 316px;
height: 563px;
background-color: #fff;
border-radius: 17px;
padding: 0 28px;
position: relative;
overflow: auto;
.title {
padding: 23px 0 11px 0;
font-size: 13px;
color: #111;
line-height: 1;
border-bottom: 1px solid #eee;
display: flex;
justify-content: space-between;
.more {
color: #999999;
font-size: 11px;
}
}
.info {
.item {
display: flex;
align-content: center;
justify-content: space-between;
margin-top: 23px;
font-size: 10px;
.stuinfo {
margin: auto 0;
margin-left: 11px;
color: #111111;
.lessonname {
color: #666666;
}
}
.takehour {
color: #08ae98;
font-size: 11px;
margin: auto 0;
text-align: center;
}
> div>img {
width: 57px;
height: 57px;
border-radius: 50%;
background-color: #0f0;
}
}
}
.button {
position: absolute;
width: 260px;
bottom: 28px;
display: flex;
justify-content: space-between;
> div {
width: 114px;
height: 23px;
border-radius: 3px;
font-size: 10px;
color: #fff;
line-height: 23px;
text-align: center;
}
.modify {
background-color: #08ae98;
}
.del {
background-color: #d12c2e;
}
}
}
</style>
<script lang="ts">
import { defineComponent } from "vue";
export default defineComponent({});
</script>

View File

@@ -0,0 +1,27 @@
<template>
<div class="video">
<video src=""></video>
</div>
</template>
<style lang="scss" scoped>
.video{
width: 797px;
height: 449px;
border-radius: 17px;
background-color: #0f0;
overflow: hidden;
>video{
width: 100%;
height: 100%;
}
}
</style>
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
setup(){
console.log(1)
}
})
</script>

View File

@@ -0,0 +1,192 @@
<template>
<div class="cont">
<div class="title">
<div>上课学生</div>
<div class="more">查看详情</div>
</div>
<div class="info">
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
<div class="item">
<div style="display:flex">
<img src="" alt="" />
<div class="stuinfo">
<div>andy</div>
<div class="lessonname">英语 A1</div>
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
</div>
</div>
</div>
</template>
<style lang="scss" scoped>
.cont {
width: 316px;
height: 630px;
background-color: #fff;
border-radius: 17px;
padding: 0 28px;
position: relative;
overflow: auto;
.title {
padding: 23px 0 11px 0;
font-size: 13px;
color: #111;
line-height: 1;
border-bottom: 1px solid #eee;
display: flex;
justify-content: space-between;
.more {
color: #999999;
font-size: 11px;
}
}
.info {
.item {
display: flex;
align-content: center;
justify-content: space-between;
margin-top: 23px;
font-size: 10px;
.stuinfo {
margin: auto 0;
margin-left: 11px;
color: #111111;
.lessonname {
color: #666666;
}
}
.takehour {
color: #08ae98;
font-size: 11px;
margin: auto 0;
text-align: center;
}
> div>img {
width: 57px;
height: 57px;
border-radius: 50%;
background-color: #0f0;
}
}
}
.button {
position: absolute;
width: 260px;
bottom: 28px;
display: flex;
justify-content: space-between;
> div {
width: 114px;
height: 23px;
border-radius: 3px;
font-size: 10px;
color: #fff;
line-height: 23px;
text-align: center;
}
.modify {
background-color: #08ae98;
}
.del {
background-color: #d12c2e;
}
}
}
</style>
<script lang="ts">
import { defineComponent } from "vue";
export default defineComponent({});
</script>

View File

@@ -5,11 +5,11 @@
<div class="name">qweqw</div>
<div class="lv">
<div class="img">
<img src="" alt="">
<img src="" alt="">
<img src="" alt="">
<img src="" alt="">
<img src="" alt="">
<img src="@/static/images/starred.png" alt="">
<img src="@/static/images/starred.png" alt="">
<img src="@/static/images/starred.png" alt="">
<img src="@/static/images/star.png" alt="">
<img src="@/static/images/star.png" alt="">
</div>
<div class="num">8.0</div>
</div>
@@ -52,7 +52,7 @@
>img{
width: 12px;
height: 12px;
background-color: #0f0;
// background-color: #0f0;
margin-left: 3px;
}
}