样式修改

This commit is contained in:
yangjun 2023-11-01 22:41:14 +08:00
parent 44ec6a0c85
commit 66f630f85a
1 changed files with 44 additions and 36 deletions

View File

@ -1,7 +1,7 @@
<template> <template>
<div style="width:100%;height: 100%;"> <div style="width:100%;height: 100%;">
<div class="" style="padding: 1rem 1rem 0 1rem;"> <div class="" style="padding: 10px 10px 0 10px;">
<a-row :gutter="[16,16]"> <a-row :gutter="[16,16]">
<a-col :span="12"> <a-col :span="12">
<a-card class="cardDiv"> <a-card class="cardDiv">
@ -31,7 +31,7 @@
</a-col> </a-col>
<a-col :span="6"> <a-col :span="6">
<div class="numberBlob handleCss" @click="openDetail({ sfyx2: '0' })"> <div class="numberBlob handleCss" @click="openDetail({ sfyx2: '0' })">
<div class="numSpan orange" style="font-size: 24px;height: 50px;line-height: 50px;">{{ getSysConfig().flag5 == 0?'否': leftList.filter(x => x.sfyx == 0).length || 0}}</div> <div class="numSpan orange">{{ getSysConfig().flag5 == 0?'否': leftList.filter(x => x.sfyx == 0).length || 0}}</div>
<div class="numberName"> <div class="numberName">
<!-- <RiseOutlined class="orange"/> --> <!-- <RiseOutlined class="orange"/> -->
开放听课 开放听课
@ -40,8 +40,8 @@
</a-col> </a-col>
<a-col :span="6"> <a-col :span="6">
<div class="numberBlob"> <div class="numberBlob">
<div v-if="!statusLogList.length" class="numSpan orange" style="font-size: 24px;height: 50px;line-height: 50px;">未检测</div> <div v-if="!statusLogList.length" class="numSpan orange">未检测</div>
<div v-else class="numSpan orange" style="font-size: 24px;height: 50px;line-height: 50px;">{{ statusLogList.filter(x => x.type != 'green' ).length || 0 }}</div> <div v-else class="numSpan orange">{{ statusLogList.filter(x => x.type != 'green' ).length || 0 }}</div>
<div class="numberName"> <div class="numberName">
<!-- <RiseOutlined class="orange"/> --> <!-- <RiseOutlined class="orange"/> -->
设备异常 设备异常
@ -93,13 +93,13 @@
</a-row> </a-row>
</div> </div>
<div class="" style="padding: 1rem;"> <div class="" style="padding: 10px 10px 0 10px;">
<a-row :gutter="[16,16]"> <a-row :gutter="[16,16]">
<a-col :span="6" v-for="(item,index) of cardList" :key="index"> <a-col :span="6" v-for="(item,index) of cardList" :key="index">
<a-card bordered hoverable @click="() => (currentCardIndex = index,searchReset())" :class="currentCardIndex == index?'active':''"> <a-card bordered hoverable @click="() => (currentCardIndex = index,searchReset())" :class="currentCardIndex == index?'active':''">
<template #title> <template #title>
<div style="float: left;font-size: 15px;font-weight: 600;margin-bottom: 10px;">{{ item.jxlName }}</div> <div class="fjdskf" style="float: left;font-size: 15px;font-weight: 600;margin-top: 5px;">{{ item.jxlName }}</div>
<div style="float: right"><a-button type="primary" @click="refreshLogsFn(item.jxlName)">设备检测</a-button></div> <div class="bgshua" style="float: right"><a-button type="primary" @click="refreshLogsFn(item.jxlName)">设备检测</a-button></div>
</template> </template>
<a-row style="margin-bottom: 10px;text-align: center;border-bottom: 1px #f0f0f0 solid ;padding-bottom: 10px;"> <a-row style="margin-bottom: 10px;text-align: center;border-bottom: 1px #f0f0f0 solid ;padding-bottom: 10px;">
<a-col :span="6" style="font-weight: 600;" @click="openDetail({ jxlName: item.jxlName})">{{ item.jsNum }}</a-col> <a-col :span="6" style="font-weight: 600;" @click="openDetail({ jxlName: item.jxlName})">{{ item.jsNum }}</a-col>
@ -112,7 +112,7 @@
<a-col :span="6" @click="openDetail({ jxlName: item.jxlName })">开放听课</a-col> <a-col :span="6" @click="openDetail({ jxlName: item.jxlName })">开放听课</a-col>
<a-col :span="6" > <a-col :span="6" >
<div>设备异常</div> <div>设备异常</div>
<div v-if="statusLogList.length" style="font-size: .5rem;">{{ statusLogList[0]?.createTime }}</div> <!-- <div v-if="statusLogList.length" style="font-size: .5rem;">{{ statusLogList[0]?.createTime }}</div> -->
</a-col> </a-col>
<!-- <div v-if="!statusLogList.length" class="numSpan orange" style="font-size: 24px;height: 50px;line-height: 50px;">未检测</div> <!-- <div v-if="!statusLogList.length" class="numSpan orange" style="font-size: 24px;height: 50px;line-height: 50px;">未检测</div>
@ -125,14 +125,14 @@
</a-row> </a-row>
<a-row style="text-align: center;"> <a-row style="text-align: center;">
<a-col :span="6" style="font-weight: 600;" @click="openDetail({ jxlName: item.jxlName, nowIsClass: true})">{{ item.child.filter(x => x?.nowIsClass).length || 0}}</a-col> <a-col :span="8" style="font-weight: 600;" @click="openDetail({ jxlName: item.jxlName, nowIsClass: true})">{{ item.child.filter(x => x?.nowIsClass).length || 0}}</a-col>
<a-col :span="6" style="font-weight: 600;" @click="openDetail({ jxlName: item.jxlName, onLineClassType: 'green'})">{{ item.child.filter(x => x?.nowIsClass && x?.child['教师近景']?.isOnLine).length || 0}}</a-col> <a-col :span="8" style="font-weight: 600;" @click="openDetail({ jxlName: item.jxlName, onLineClassType: 'green'})">{{ item.child.filter(x => x?.nowIsClass && x?.child['教师近景']?.isOnLine).length || 0}}</a-col>
<a-col :span="6" style="font-weight: 600;" @click="openDetail({ jxlName: item.jxlName, onLineClassType: 'red'})">{{ item.child.filter(x => x?.nowIsClass && !x?.child['教师近景']?.isOnLine).length || 0 }}</a-col> <a-col :span="8" style="font-weight: 600;" @click="openDetail({ jxlName: item.jxlName, onLineClassType: 'red'})">{{ item.child.filter(x => x?.nowIsClass && !x?.child['教师近景']?.isOnLine).length || 0 }}</a-col>
<a-col :span="6" style="font-weight: 600;" >&nbsp;</a-col> <!-- <a-col :span="8" style="font-weight: 600;" >&nbsp;</a-col> -->
<a-col :span="6" @click="openDetail({ jxlName: item.jxlName, nowIsClass: true})">正在上课</a-col> <a-col :span="8" @click="openDetail({ jxlName: item.jxlName, nowIsClass: true})">正在上课</a-col>
<a-col :span="6" @click="openDetail({ jxlName: item.jxlName, onLineClassType: 'green'})">正在直播</a-col> <a-col :span="8" @click="openDetail({ jxlName: item.jxlName, onLineClassType: 'green'})">正在直播</a-col>
<a-col :span="6" @click="openDetail({ jxlName: item.jxlName, onLineClassType: 'red'})">直播异常</a-col> <a-col :span="8" @click="openDetail({ jxlName: item.jxlName, onLineClassType: 'red'})">直播异常</a-col>
<a-col :span="6" >&nbsp;</a-col> <!-- <a-col :span="8" >&nbsp;</a-col> -->
</a-row> </a-row>
</a-card> </a-card>
</a-col> </a-col>
@ -142,7 +142,7 @@
<div class="jeecg-basic-table-form-container"> <div class="jeecg-basic-table-form-container">
<a-form @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol"> <a-form @keyup.enter.native="searchQuery" :model="queryParam" :label-col="labelCol" :wrapper-col="wrapperCol">
<a-row :gutter="24"> <a-row :gutter="24">
<a-col :lg="4"> <a-col :lg="5" style="padding: 0 10px 0 0;">
<a-form-item label="教学楼"> <a-form-item label="教学楼">
<!-- <j-dict-select-tag placeholder="请选择教室" v-model:value="queryParam.xqxn" dictCode="kc_xqxn_history,title,title"/> --> <!-- <j-dict-select-tag placeholder="请选择教室" v-model:value="queryParam.xqxn" dictCode="kc_xqxn_history,title,title"/> -->
<!-- <a-input placeholder="请输入" v-model:value="queryParam.jxlName"/> --> <!-- <a-input placeholder="请输入" v-model:value="queryParam.jxlName"/> -->
@ -152,12 +152,12 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="4"> <a-col :lg="5" style="padding: 0 10px 0 0;">
<a-form-item label="教室"> <a-form-item label="教室">
<a-input placeholder="请输入" v-model:value="queryParam.jsmc"/> <a-input placeholder="请输入" v-model:value="queryParam.jsmc"/>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="4"> <a-col :lg="5" style="padding: 0 10px 0 0;">
<a-form-item label="直播功能"> <a-form-item label="直播功能">
<a-select placeholder="请选择" v-model:value="queryParam.zbgn"> <a-select placeholder="请选择" v-model:value="queryParam.zbgn">
<a-select-option :value="undefined">请选择</a-select-option> <a-select-option :value="undefined">请选择</a-select-option>
@ -166,7 +166,7 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="4"> <a-col :lg="5" style="padding: 0 10px 0 0;">
<a-form-item label="开放听课"> <a-form-item label="开放听课">
<a-select placeholder="请选择" v-model:value="queryParam.sfyx"> <a-select placeholder="请选择" v-model:value="queryParam.sfyx">
<a-select-option :value="undefined">请选择</a-select-option> <a-select-option :value="undefined">请选择</a-select-option>
@ -175,7 +175,7 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="4"> <a-col :lg="4" style="padding: 0 10px 0 0;">
<a-form-item label="直播状态"> <a-form-item label="直播状态">
<a-select placeholder="请选择" v-model:value="queryParam.onLineClassType"> <a-select placeholder="请选择" v-model:value="queryParam.onLineClassType">
<a-select-option :value="undefined">请选择</a-select-option> <a-select-option :value="undefined">请选择</a-select-option>
@ -185,18 +185,18 @@
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="4"> <a-col :lg="5" style="padding: 0 10px 0 0;">
<a-form-item label="(即将/当前)有课"> <a-form-item label="下节有课">
<a-select placeholder="请选择" v-model:value="queryParam.nowIsClass"> <a-select placeholder="请选择" v-model:value="queryParam.nextIsClass">
<a-select-option :value="undefined">请选择</a-select-option> <a-select-option :value="undefined">请选择</a-select-option>
<a-select-option :value="true"></a-select-option> <a-select-option :value="true"></a-select-option>
<a-select-option :value="false"></a-select-option> <a-select-option :value="false"></a-select-option>
</a-select> </a-select>
</a-form-item> </a-form-item>
</a-col> </a-col>
<a-col :lg="4"> <a-col :lg="5" style="padding: 0 10px 0 0;">
<a-form-item label="下节有课"> <a-form-item label="(即将/当前)有课">
<a-select placeholder="请选择" v-model:value="queryParam.nextIsClass"> <a-select placeholder="请选择" v-model:value="queryParam.nowIsClass">
<a-select-option :value="undefined">请选择</a-select-option> <a-select-option :value="undefined">请选择</a-select-option>
<a-select-option :value="true"></a-select-option> <a-select-option :value="true"></a-select-option>
<a-select-option :value="false"></a-select-option> <a-select-option :value="false"></a-select-option>
@ -208,10 +208,10 @@
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button> <a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button> <a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset" style="margin-left: 8px">重置</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" :loading="loading" @click="batchLiveOpen" style="margin-left: 8px">批量打开直播</a-button> <a-button type="primary" :loading="loading" @click="batchLiveOpen" style="margin-left: 8px">批量打开直播</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" :loading="loading" @click="batchLiveClose" style="margin-left: 8px">批量关闭直播</a-button> <a-button type="primary" :loading="loading" @click="batchLiveClose" style="margin-left: 8px">批量关闭直播</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" :loading="loading" @click="batchTingkeOpen" style="margin-left: 8px">批量打开听课</a-button> <a-button type="primary" :loading="loading" @click="batchTingkeOpen" style="margin-left: 8px">批量打开听课</a-button>
<a-button type="primary" preIcon="ant-design:reload-outlined" :loading="loading" @click="batchTingkeClose" style="margin-left: 8px">批量关闭听课</a-button> <a-button type="primary" :loading="loading" @click="batchTingkeClose" style="margin-left: 8px">批量关闭听课</a-button>
<!-- <a-button type="primary" preIcon="ant-design:check-square-outlined" @click="closeQuartz" v-if="shangXianQuartz.status == 0" style="margin-left: 8px">停止自动调整教室</a-button> --> <!-- <a-button type="primary" preIcon="ant-design:check-square-outlined" @click="closeQuartz" v-if="shangXianQuartz.status == 0" style="margin-left: 8px">停止自动调整教室</a-button> -->
<!-- 永远开启 <a-button type="primary" preIcon="ant-design:border-outlined" @click="openQuartz" v-if="shangXianQuartz.status == -1" style="margin-left: 8px">开启自动调整教室</a-button> --> <!-- 永远开启 <a-button type="primary" preIcon="ant-design:border-outlined" @click="openQuartz" v-if="shangXianQuartz.status == -1" style="margin-left: 8px">开启自动调整教室</a-button> -->
@ -411,11 +411,11 @@ const shangXianQuartz = ref<any>({});
const labelCol = reactive({ const labelCol = reactive({
xs: { span: 24 }, xs: { span: 24 },
sm: { span: 6 }, sm: { span: 10 },
}); });
const wrapperCol = reactive({ const wrapperCol = reactive({
xs: { span: 24 }, xs: { span: 24 },
sm: { span: 19 }, sm: { span: 14 },
}); });
const ipagination = ref( const ipagination = ref(
@ -924,7 +924,7 @@ video::-webkit-media-controls-timeline {
.jeecg-basic-table-form-container { .jeecg-basic-table-form-container {
.ant-form { .ant-form {
padding: 12px 10px 6px 10px; padding: 12px 10px 0 10px;
margin-bottom: 8px; margin-bottom: 8px;
background-color: #fff; background-color: #fff;
border-radius: 2px; border-radius: 2px;
@ -958,19 +958,27 @@ video::-webkit-media-controls-timeline {
background-color: #36b395; background-color: #36b395;
color: #ffffff; color: #ffffff;
} }
.active .fjdskf{
color: #ffffff;
}
.active .bgshua .ant-btn-primary{
background-color: #ffffff;
color: #36b395;
border-color: #fff;
}
.cardDiv { .cardDiv {
:deep(.ant-divider-horizontal) { :deep(.ant-divider-horizontal) {
margin: 12px 0; margin: 12px 0;
} }
:deep(.ant-card-head-title) { :deep(.ant-card-head-title) {
font-weight: 700; font-weight: 700;
line-height: 32px;
} }
} }
.numberBlob { .numberBlob {
text-align: center; text-align: center;
// height: 100px; // height: 100px;
height: 4rem; height: 5rem;
.numSpan { .numSpan {
font-size: 2rem; font-size: 2rem;
} }