登录页UI、主页UI

This commit is contained in:
Rue Ji
2026-02-08 01:02:58 +08:00
parent 580606c267
commit fcf08b8b69
8 changed files with 151 additions and 101 deletions

View File

@ -62,6 +62,28 @@
background-color: RGBA(55,141,204,0.5);
bottom: 10px;
}
.section-header {
width: 100%;
height: 9%;
float: left;
border-bottom: 2px solid #67aad7;
font-weight: bold;
font-size: 13px;
color: #0c4377;
padding-left: 15px;
display: flex;
align-items: center;
background: linear-gradient(to right, rgba(103, 170, 215, 0.1), transparent);
}
.section-header::before {
content: "";
display: block;
width: 4px;
height: 60%;
background-color: #0c4377;
margin-right: 10px;
border-radius: 2px;
}
</style>
<script type="text/javascript">
@ -130,7 +152,7 @@
<div id="mainDiv" style="background:#f1f1f1;">
<div style="float:left;height:100%;width:35%;">
<div style="float:left;height:45%;width:100%;padding:5px 5px 5px 5px;">
<div style="float:left;height:100%;width:100%;padding:5px 5px 5px 5px;">
<div style="height:100%;width:100%;background-color:#ffffff;">
<%--图片--%>
<!-- <img src="" id="mainImg" style="width:100%;height:100%;"> -->
@ -151,47 +173,15 @@
</div>
</div>
</div>
<div style="float:left;height:55%;width:100%;padding:5px 5px 5px 5px;">
<div style="height:100%;width:100%;background-color:#ffffff;">
<div style="width:100%;height:5%;float:left;border-bottom:2px solid #67aad7;font-weight: bold;">
水量及电耗
</div>
<div style="width:100%;height:40%;float:left;">
<div style="width:48%;height:45%;float:left;background-color:#378dcc;margin:1%;">
<div class="fontValue" id="safe_value_1">-</div>
<div class="fontText" id="safe_text_1">-</div>
</div>
<div style="width:48%;height:45%;float:right;background-color:#67aad7;margin:1%;">
<div class="fontValue" id="safe_value_2">-</div>
<div class="fontText" id="safe_text_2">-</div>
</div>
<div style="width:48%;height:45%;float:left;background-color:#FACA00;margin:1%;">
<div class="fontValue" id="safe_value_3">-</div>
<div class="fontText" id="safe_text_3">-</div>
</div>
<div style="width:48%;height:45%;float:right;background-color:#66D97C;margin:1%;">
<div class="fontValue" id="safe_value_4">-</div>
<div class="fontText" id="safe_text_4">-</div>
</div>
</div>
<div style="width:100%;height:55%;float:left;padding: 5px 5px 5px 5px;">
<div style="width:100%;height:100%;float:left;">
<div style="width:100%;height:100%;float:left;" id="myChartProduce8"></div>
</div>
</div>
</div>
</div>
</div>
<div style="float:left;height:100%;width:65%;">
<div style="float:left;height:50%;width:100%;padding:5px 5px 5px 5px;">
<div style="height:100%;width:100%;background-color:#ffffff;">
<div style="width:100%;height:5%;float:left;border-bottom:2px solid #67aad7;font-weight: bold;">
一车间
<div class="section-header">
上海金山卫污水公司
</div>
<div style="width:20%;height:100%;float:left;">
<div style="width:20%;height:95%;float:left;">
<div style="width:100%;height:25%;float:left;background-color:#cbe3f9;margin:6%;">
<div class="fontValue" style="color: #0c4377;" id="valueProduce1_js"></div>
<div class="fontText" style="color: #0c4377;" id="textProduce1_js"></div>
@ -205,7 +195,7 @@
<div class="fontText" style="color: #0c4377;" id="textProduce3_js"></div>
</div>
</div>
<div style="width:80%;height:100%;float:left;padding: 5px 10px 30px 10px;">
<div style="width:80%;height:95%;float:left;padding: 5px 10px 30px 10px;">
<div style="width:100%;height:100%;float:left;">
<div style="width:100%;height:3%;float:left;"></div>
<div style="width:100%;height:40%;float:left;">
@ -288,6 +278,39 @@
</div>
</div>
</div>
<div style="float:left;height:50%;width:100%;padding:5px 5px 5px 5px;">
<div style="height:100%;width:100%;background-color:#ffffff;">
<div class="section-header">
水量及电耗
</div>
<div style="width:100%;height:40%;float:left;">
<div style="width:48%;height:45%;float:left;background-color:#378dcc;margin:1%;">
<div class="fontValue" id="safe_value_1">-</div>
<div class="fontText" id="safe_text_1">-</div>
</div>
<div style="width:48%;height:45%;float:right;background-color:#67aad7;margin:1%;">
<div class="fontValue" id="safe_value_2">-</div>
<div class="fontText" id="safe_text_2">-</div>
</div>
<div style="width:48%;height:45%;float:left;background-color:#FACA00;margin:1%;">
<div class="fontValue" id="safe_value_3">-</div>
<div class="fontText" id="safe_text_3">-</div>
</div>
<div style="width:48%;height:45%;float:right;background-color:#66D97C;margin:1%;">
<div class="fontValue" id="safe_value_4">-</div>
<div class="fontText" id="safe_text_4">-</div>
</div>
</div>
<div style="width:100%;height:55%;float:left;padding: 5px 5px 5px 5px;">
<div style="width:100%;height:100%;float:left;">
<div style="width:100%;height:100%;float:left;" id="myChartProduce8"></div>
</div>
</div>
</div>
</div>
<!--
<div style="float:left;height:50%;width:100%;padding:5px 5px 5px 5px;">
<div style="height:100%;width:100%;background-color:#ffffff;">
<div style="width:100%;height:5%;float:left;border-bottom:2px solid #67aad7;font-weight: bold;">
@ -390,6 +413,7 @@
</div>
</div>
</div>
-->
</div>
</div>