样式修改

This commit is contained in:
yangjun 2023-10-21 00:42:54 +08:00
parent c126f5141f
commit 737842c9c5
2 changed files with 10140 additions and 8054 deletions

File diff suppressed because it is too large Load Diff

View File

@ -28,25 +28,23 @@
</a-form>
</div>
<div class="" style="padding: 1rem;">
<a-row :gutter="[16,16]">
<a-col :span="6" v-for="(item,index) of cardList" :key="index">
<div class="" style="padding: 0 10px 10px 10px;">
<a-row :gutter="[16,16]" style="margin: 0 !important;">
<a-col :span="6" v-for="(item,index) of cardList" :key="index" style="padding: 0 10px 0 0 !important;">
<a-card bordered hoverable @click="() => currentCardIndex = index" :class="currentCardIndex == index?'active':''">
<div>名称{{ item.jxlName }}</div>
<div>总数{{ item.child.length }}</div>
<div>名称<span style="font-weight: 600;">{{ item.jxlName }}</span></div>
<div>总数<span style="font-weight: 600;">{{ item.child.length }}</span></div>
<!-- {{ item.child }} -->
<div>正在上课的教室{{ item.child.filter(x => x?.nowIsClass).length || 0}}</div>
<div>正常直播的教室{{ item.child.filter(x => x?.child['教师近景']?.isOnLine).length || 0}}</div>
<div>没开启直播的教室{{ item.child.filter(x => !x?.child['教师近景']?.isOnLine).length || 0 }}</div>
<div class="sdeas"><span class="ydian"></span><span class="cdfx" style="letter-spacing: 2px;">正在上课的教室</span><span class="gfd">{{ item.child.filter(x => x?.nowIsClass).length || 0}}</span><span></span></div>
<div class="sdeas"><span class="ydian"></span><span class="cdfx" style="letter-spacing: 2px;">正常直播的教室</span><span class="gfd">{{ item.child.filter(x => x?.child['教师近景']?.isOnLine).length || 0}}</span><span></span></div>
<div class="sdeas"><span class="ydian"></span><span class="cdfx">没开启直播的教室</span><span class="gfd">{{ item.child.filter(x => !x?.child['教师近景']?.isOnLine).length || 0 }}</span><span></span></div>
</a-card>
</a-col>
</a-row>
</div>
<a-table v-show="true" :loading="loading" :data-source="cardList[currentCardIndex]?.child??[]" :pagination="false" bordered size="middle" class="ant-table-striped" :scroll="{ y: 650 }">
<a-table-column title="教室" data-index="jsmc"/>
<a-table-column title="教室" align="center" data-index="jsmc"/>
<a-table-column title="教师近景" align="center" data-index="child_教师近景">
<template #default="{ record }">
<span :class="record?.child['教师近景']?.isOnLine?'green':'red'">
@ -103,14 +101,14 @@
</span>
</template>
</a-table-column>
<a-table-column width="200px" title="操作" data-index="action">
<a-table-column width="250px" title="操作" align="center" data-index="action">
<template #default="{ record }">
<a @click="ylLiveNew(record)" >预览 |</a>
<a @click="ylLive(record)" hidden>预览 |</a>
<a v-if="!record?.child['教师全景']?.isOnLine" @click="changeLive(record,true)">开启推流 |</a>
<a v-else @click="changeLive(record,false)">关闭推流 |</a>
<a v-if="record.sfyx == 1" @click="changeKt(record,true)">课堂上线</a>
<a v-else-if="record.sfyx == 0" @click="changeKt(record,false)">课堂下线</a>
<a @click="ylLiveNew(record)" class="caozuobtn">预览</a>
<a @click="ylLive(record)" hidden class="caozuobtn">预览</a>
<a v-if="!record?.child['教师全景']?.isOnLine" @click="changeLive(record,true)" class="caozuobtn">开启推流</a>
<a v-else @click="changeLive(record,false)" class="caozuobtn">关闭推流</a>
<a v-if="record.sfyx == 1" @click="changeKt(record,true)" class="caozuobtn">课堂上线</a>
<a v-else-if="record.sfyx == 0" @click="changeKt(record,false)" class="caozuobtn">课堂下线</a>
<!-- {{ record.id }} -->
</template>
</a-table-column>
@ -467,5 +465,44 @@ video::-webkit-media-controls-timeline {
}
.active{
background-color: #36b395;
color: #ffffff;
}
.active .ydian{
background-color: #ffffff;
}
.caozuobtn{
display: inline-block;
padding: 4px 10px;
background-color: #36b395;
border-radius: 20px;
color: #ffffff;
margin: 0 4px;
border-radius: 10px;
transition: 0.5s;
}
.caozuobtn:hover{
transform:translateX(1.2);
}
.ydian{
display: inline-block;
width: 6px;
height: 6px;
border-radius: 50%;
background-color: #36b395;
margin-right: 5px;
}
.cdfx{
display: inline-block;
width: 120px;
text-align: right;
margin-right: 10px;
}
.gfd{
display: inline-block;
width: 30px;
text-align: center;
font-size: 16px;
font-weight: 600;
margin-right: 10px;
}
</style>