修改

productionboard/src/main/resources/static/css/foamBox/style.css

@@ -32,6 +32,14 @@ body {
     left: 59%;
 }
 
+.foamingLineRunStatus {
+    position: absolute;
+    width: 40%;
+    height: 27%;
+    top: 10.5%;
+    left: 30.1%;
+}
+
 .inventoryStatistics {
     border: 0px solid red;
     position: absolute;
@@ -86,18 +94,22 @@ body {
     color: white;
     font-size: 12px;
 }
+
 .temperatureOne {
     width: 100%;
     height: 100%;
 }
+
 .temperatureTwo {
     width: 100%;
     height: 100%;
 }
+
 .temperatureThree {
     width: 100%;
     height: 100%;
 }
+
 .temperatureFour {
     width: 100%;
     height: 100%;

productionboard/src/main/resources/static/js/tankShell/device.js

@@ -70,7 +70,7 @@ $(() => {
 const dataInformationFunction = (statusArray) => {
     let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
             <tr style="width: 100%; height: 50%;">
-                <td style="border:0px solid red;text-align:center;width: 50%;"><img src="../../img/foamBox/${statusArray[0] == 0 ? "deviceopen.png" : "deviceclose.png"}" width="20%" height="40%"/>${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] == 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%;color: #E6ECBE;">389kW</td>
             </tr>
             <tr style="width: 100%; height: 50%;">

productionboard/src/main/resources/templates/foamBox/index.html

@@ -30,7 +30,7 @@
     <div class="foamingParameters" id="foamingParameters"></div>
 
     <!--设备运行状态-->
-    <!--<div class="foamingLineRunStatus">
+    <div class="foamingLineRunStatus">
         <table style="width: 100%;height:100%;">
             <tr style="width: 100%;">
                 <td style="border:0px solid red;text-align:center;"><img src="../../img/foamBox/deviceopen.png" width="40%" height="50%"/></td>
@@ -41,7 +41,7 @@
                 <td style="border:0px solid red;text-align:right;"><img src="../../img/foamBox/deviceopen.png" width="40%" height="50%"/></td>
             </tr>
         </table>
-    </div>-->
+    </div>
 
     <!-- 轮播 -->
     <div class="swiperModule">

productionboard/src/main/resources/templates/tankShell/device.html

@@ -4,6 +4,8 @@
     <meta charset="UTF-8">
     <title>箱壳成型数据监控平台</title>
     <link rel="stylesheet" href="../../../css/tankShell/device.css">
+    <link rel="stylesheet" href="../../../css/common/fontawesome-all.min.css">
+    <script src="../../../js/common/fontawesome-all.min.js"></script>
     <script src="../../../js/common/jquery.min.js"></script>
     <script src="../../../js/common/echarts.min.js"></script>
     <script src="../../../js/common/update-split-blocks.js"></script>

productionboard/target/classes/static/css/foamBox/style.css

@@ -32,6 +32,14 @@ body {
     left: 59%;
 }
 
+.foamingLineRunStatus {
+    position: absolute;
+    width: 40%;
+    height: 27%;
+    top: 10.5%;
+    left: 30.1%;
+}
+
 .inventoryStatistics {
     border: 0px solid red;
     position: absolute;
@@ -86,18 +94,22 @@ body {
     color: white;
     font-size: 12px;
 }
+
 .temperatureOne {
     width: 100%;
     height: 100%;
 }
+
 .temperatureTwo {
     width: 100%;
     height: 100%;
 }
+
 .temperatureThree {
     width: 100%;
     height: 100%;
 }
+
 .temperatureFour {
     width: 100%;
     height: 100%;

productionboard/target/classes/static/js/tankShell/device.js

@@ -70,7 +70,7 @@ $(() => {
 const dataInformationFunction = (statusArray) => {
     let info = `<table style="position: absolute;top: 8%;width: 100%;height:100%;">
             <tr style="width: 100%; height: 50%;">
-                <td style="border:0px solid red;text-align:center;width: 50%;"><img src="../../img/foamBox/${statusArray[0] == 0 ? "deviceopen.png" : "deviceclose.png"}" width="20%" height="40%"/>${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] == 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%;color: #E6ECBE;">389kW</td>
             </tr>
             <tr style="width: 100%; height: 50%;">

productionboard/target/classes/templates/foamBox/index.html

@@ -30,7 +30,7 @@
     <div class="foamingParameters" id="foamingParameters"></div>
 
     <!--设备运行状态-->
-    <!--<div class="foamingLineRunStatus">
+    <div class="foamingLineRunStatus">
         <table style="width: 100%;height:100%;">
             <tr style="width: 100%;">
                 <td style="border:0px solid red;text-align:center;"><img src="../../img/foamBox/deviceopen.png" width="40%" height="50%"/></td>
@@ -41,7 +41,7 @@
                 <td style="border:0px solid red;text-align:right;"><img src="../../img/foamBox/deviceopen.png" width="40%" height="50%"/></td>
             </tr>
         </table>
-    </div>-->
+    </div>
 
     <!-- 轮播 -->
     <div class="swiperModule">

productionboard/target/classes/templates/tankShell/device.html

@@ -4,6 +4,8 @@
     <meta charset="UTF-8">
     <title>箱壳成型数据监控平台</title>
     <link rel="stylesheet" href="../../../css/tankShell/device.css">
+    <link rel="stylesheet" href="../../../css/common/fontawesome-all.min.css">
+    <script src="../../../js/common/fontawesome-all.min.js"></script>
     <script src="../../../js/common/jquery.min.js"></script>
     <script src="../../../js/common/echarts.min.js"></script>
     <script src="../../../js/common/update-split-blocks.js"></script>