首页样式调整

This commit is contained in:
fengrong 2024-11-08 11:31:40 +08:00
parent f7bb99af92
commit 6330e0b447

View File

@ -45,7 +45,7 @@
<!--今日运行状态--> <!--今日运行状态-->
<div class="status panelBg"> <div class="status panelBg">
<el-text class="mx-1 homelabel" style="margin-bottom: 0;">今日运行状态</el-text> <el-text class="mx-1 homelabel" style="margin-bottom: 0;">今日运行状态</el-text>
<el-row :gutter="10" class="statusrow"> <el-row :gutter="10" class="statusrow" style="margin-bottom: 0;">
<el-col :span="12"> <el-col :span="12">
<div class="status-panel"> <div class="status-panel">
<img class="status-panel-pic" src="~assets/dashboard/status1.png" alt=""> <img class="status-panel-pic" src="~assets/dashboard/status1.png" alt="">
@ -186,7 +186,7 @@
</div> </div>
<!--功率趋势--> <!--功率趋势-->
<div class="power panelBg" style="margin-bottom: 0;"> <div class="power panelBg" style="margin-bottom: 0;padding-bottom: 10px;">
<el-text class="mx-1 homelabel">功率趋势</el-text> <el-text class="mx-1 homelabel">功率趋势</el-text>
<el-row :gutter="10"> <el-row :gutter="10">
<el-col class="lg-mb-20" :span="24"> <el-col class="lg-mb-20" :span="24">
@ -286,7 +286,7 @@
</div> </div>
<!--实时告警--> <!--实时告警-->
<div class="trend panelBg" style="margin-bottom: 0;"> <div class="realPart panelBg" style="margin-bottom: 0;">
<el-text class="mx-1 homelabel">实时告警</el-text> <el-text class="mx-1 homelabel">实时告警</el-text>
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :span="24"> <el-col :span="24">
@ -475,7 +475,7 @@ const StatusListData = () => {
propertiesToFormat.forEach(property => { propertiesToFormat.forEach(property => {
if (currentDayStatus.value[property] !== null && currentDayStatus.value[property] !== undefined) { if (currentDayStatus.value[property] !== null && currentDayStatus.value[property] !== undefined) {
currentDayStatus.value[property] = Number(currentDayStatus.value[property].toFixed(2)); currentDayStatus.value[property] = Number(currentDayStatus.value[property].toFixed(1));
} }
}); });
return { return {
@ -1187,7 +1187,7 @@ onUnmounted(() => {
margin: 0; margin: 0;
color: #4E5969; color: #4E5969;
background-color: #F2F3F5; background-color: #F2F3F5;
overflow-x: hidden; overflow: hidden;
.content-number{ .content-number{
color: #333333; color: #333333;
font-size: 20px; font-size: 20px;
@ -1267,11 +1267,11 @@ onUnmounted(() => {
.power{ .power{
.power-chart{ .power-chart{
width: 100%; width: 100%;
height: 265px; height: 286px;
} }
@media screen and (max-width: 1920px) { @media screen and (max-width: 1920px) {
.power-chart{ .power-chart{
height: 250px; height: 230px;
} }
} }
} }
@ -1342,9 +1342,18 @@ onUnmounted(() => {
height: 260px; height: 260px;
} }
} }
.realPart{
height: 370px;
}
@media screen and (max-width: 1920px) { @media screen and (max-width: 1920px) {
.matrix{
height:928px
}
.realPart{
height: 343px;
}
.trend{ .trend{
height: 350px; height: 320px;
} }
} }
} }
@ -1353,7 +1362,7 @@ onUnmounted(() => {
} }
@media screen and (max-width: 1920px) { @media screen and (max-width: 1920px) {
.default-main{ .default-main{
height: auto; height: 928px;
} }
} }