|
|
@ -2,7 +2,7 @@
|
|
|
|
const dataInformationFunction = (statusArray) => {
|
|
|
|
const dataInformationFunction = (statusArray) => {
|
|
|
|
let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
|
|
|
|
let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
|
|
|
|
<tr style="width: 100%; height: 50%;">
|
|
|
|
<tr style="width: 100%; height: 50%;">
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 50%;"><i ${statusArray[0] == 0 ? 'style="color:green;"' : 'style="color: red;"'} class="fa-regular ${statusArray[0] == 0 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${statusArray[0] == 0 ? `<span style="color:green;margin-left: 10px">运行正常</span>` : `<span style="color:red;margin-left: 10px">运行异常</span>`}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 50%;"><i ${statusArray[0] == 1 ? 'style="color:green;"' : 'style="color: red;"'} class="fa-regular ${statusArray[0] == 1 ? "fa-circle-check" : "fa-circle-xmark"}"></i>${statusArray[0] == 1 ? `<span style="color:green;margin-left: 10px">运行正常</span>` : `<span style="color:red;margin-left: 10px">运行异常</span>`}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 50%;color: #E6ECBE;">${statusArray[1]}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 50%;color: #E6ECBE;">${statusArray[1]}</td>
|
|
|
|
</tr>
|
|
|
|
</tr>
|
|
|
|
<tr style="width: 100%; height: 50%;">
|
|
|
|
<tr style="width: 100%; height: 50%;">
|
|
|
@ -16,28 +16,28 @@ const dataInformationFunction = (statusArray) => {
|
|
|
|
const synthetic = (statusArray) => {
|
|
|
|
const synthetic = (statusArray) => {
|
|
|
|
let info = `<table style="position: absolute;top: 9%;left: 30%;width: 40%;height:7%;">
|
|
|
|
let info = `<table style="position: absolute;top: 9%;left: 30%;width: 40%;height:7%;">
|
|
|
|
<tr style="width: 100%; height: 50%;">
|
|
|
|
<tr style="width: 100%; height: 50%;">
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 23%;color: #99C4EF;">123</td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 23%;color: #99C4EF;">${statusArray.yesterdayEnergy || 0}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 27%;color: #7CED92;">123</td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 27%;color: #7CED92;">${statusArray.thisMonthProuction || 0}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 27%;color: #99C4EF;">123</td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 27%;color: #99C4EF;">${statusArray.yesterdayProuction || 0}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 19%;color: #7CED92;">123</td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 19%;color: #7CED92;">${statusArray.thisMonthEnergy || 0}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 15%;"></td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 15%;"></td>
|
|
|
|
</tr>
|
|
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
</table>
|
|
|
|
<table style="position: absolute;top: 24%;left: 30%;width: 42%;height:10%;">
|
|
|
|
<table style="position: absolute;top: 24%;left: 30%;width: 42%;height:10%;">
|
|
|
|
<tr style="width: 100%; height: 50%;">
|
|
|
|
<tr style="width: 100%; height: 50%;">
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 7%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 7%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 13%;color: #70C0EC;">123</td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 13%;color: #70C0EC;">${statusArray.yesterdayEnergy || 0}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 13%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 13%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 14%;color: #DB718D;">123</td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 14%;color: #DB718D;">${statusArray.yesterdayEnergy || 0}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 12%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 12%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 13%;color: #8CEF92;">123</td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 13%;color: #8CEF92;">${statusArray.yesterdayEnergy || 0}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 13%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 13%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 14%;color: #ECE790;">123</td>
|
|
|
|
<td style="border:0px solid red;font-size:175%;text-align:center;width: 14%;color: #ECE790;">${statusArray.yesterdayEnergy || 0}</td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 0%;"></td>
|
|
|
|
<td style="border:0px solid red;text-align:center;width: 0%;"></td>
|
|
|
|
</tr>
|
|
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
</table>
|
|
|
|
<span style="position: absolute;top: 13%;left: 85%;width: 9%;height:4%;text-align:center;background: linear-gradient(to bottom, #D2E5F7, #8CBAE4);color: transparent;display:inline-block;-webkit-background-clip: text;">123213</span>
|
|
|
|
<span style="position: absolute;font-size:175%;top: 12%;left: 85%;width: 15%;height:10%;text-align:left;background: linear-gradient(to bottom, #D2E5F7, #8CBAE4);color: transparent;display:inline-block;-webkit-background-clip: text;">${statusArray.yesterdayEnergy || 0}</span>
|
|
|
|
<span style="position: absolute;top: 28%;left: 85%;width: 9%;height:4%;text-align:center;background: linear-gradient(to bottom, #F1FFFF, #7FE782);color: transparent;display:inline-block;-webkit-background-clip: text;">123213</span>
|
|
|
|
<span style="position: absolute;font-size:175%;top: 26.7%;left: 85%;width: 15%;height:10%;text-align:left;background: linear-gradient(to bottom, #F1FFFF, #7FE782);color: transparent;display:inline-block;-webkit-background-clip: text;">${statusArray.yesterdayEnergy || 0}</span>
|
|
|
|
`;
|
|
|
|
`;
|
|
|
|
|
|
|
|
|
|
|
|
$("#synthetic").append(info);
|
|
|
|
$("#synthetic").append(info);
|
|
|
|