直播返修

This commit is contained in:
asd
2020-10-10 15:31:18 +08:00
parent cb940f9973
commit be094d44f4
8 changed files with 227 additions and 84 deletions

View File

@@ -14,10 +14,7 @@
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
<div class="cancel">取消直播</div>
</div>
<div class="item">
@@ -29,10 +26,7 @@
</div>
</div>
<div class="takehour">
参加时长
<div>30min</div>
</div>
<div class="refuse">已拒绝</div>
</div>
<div class="item">
@@ -63,48 +57,6 @@
<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>
@@ -161,6 +113,20 @@
}
}
}
.refuse{
color: #D22C2E;
margin:auto 0;
}
.cancel{
margin:auto 0;
width: 57px;
height: 23px;
border: 1px solid #09AE99;
line-height: 23px;
text-align: center;
color: #09AE99;
border-radius: 3px;
}
.button {
position: absolute;
width: 260px;
@@ -188,5 +154,10 @@
<script lang="ts">
import { defineComponent } from "vue";
export default defineComponent({});
export default defineComponent({
setup(){
return{}
}
});
</script>

View File

@@ -1,27 +1,27 @@
<template>
<div class="video">
<video src=""></video>
</div>
<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%;
}
.video {
width: 976px;
height: 563px;
border-radius: 18px 18px 0px 0px;
background-color: #0f0;
overflow: hidden;
> video {
width: 100%;
height: 100%;
}
}
</style>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent } from "vue";
export default defineComponent({
setup(){
console.log(1)
}
})
setup() {
console.log(1);
},
});
</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,143 @@
<template>
<div class="cont">
<div class="title">
<div>上课人员</div>
</div>
<div class="info">
<div class="item">
<div style="display:flex">
<div class="stuinfo">
<div>andy</div>
</div>
</div>
<div >
<img src="@/static/images/watchermanage.png" alt="" class="icons">
</div>
</div>
<div class="item">
<div style="display:flex">
<div class="stuinfo">
<div>andy</div>
</div>
</div>
<div >
<img src="@/static/images/watchermanage.png" alt="" class="icons">
</div>
</div>
<div class="item">
<div style="display:flex">
<div class="stuinfo">
<div>andy</div>
</div>
</div>
<div >
<img src="@/static/images/watchermanage.png" alt="" class="icons">
</div>
</div>
<div class="item">
<div style="display:flex">
<div class="stuinfo">
<div>andy</div>
</div>
</div>
<div >
<img src="@/static/images/watchermanage.png" alt="" class="icons">
</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;
height: 80px;
line-height: 80px;
font-size: 10px;
border-bottom: 1px solid #EEEEEE;
.icons{
width: 61px;
height: 23px;
}
.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>