修改主机参数页面去掉边框样式

src/views/centerairC/sysMonitor/hostDetails.vue

@@ -163,12 +163,12 @@
               </div>
             </div>
           </div>
-          <line-square
+          <!-- <line-square
             class="line1"
             :horizontalLength="720"
             :verticalLength="440"
             :overlap="15"
-          ></line-square>
+          ></line-square> -->
         </div>
         <div class="detail-data compressor">
           <div class="detail-data-top">
@@ -191,12 +191,12 @@
               </div>
             </div>
           </div>
-          <line-square
+          <!-- <line-square
             class="line1"
             :horizontalLength="720"
             :verticalLength="440"
             :overlap="15"
-          ></line-square>
+          ></line-square> -->
         </div>
       </div>
     </div>
@@ -368,11 +368,17 @@ export default {
               // 主机参数分开两列
               this.leftHostData = [];
               this.rightHostData = [];
+              // 筛选去掉特定 paramType 的数据
+              this.rightHostData = this.hostData.filter((item) => {
+                return !["2", "21", "20", "6", "5", "22", "26"].includes(
+                  Number(item.paramType)
+                );
+              });
+              // // 根据 ordernum 进行排序
+              // this.rightHostData.sort((a, b) => {
+              //   return Number(a.ordernum) - Number(b.ordernum);
+              // });
               this.hostData.forEach((item) => {
-                // 右边主机参数  温度12
-                if (item.paramType === "12") {
-                  this.rightHostData.push(item);
-                }
                 //左边主机参数 根据不同的 paramType 处理 showValue
                 if (item.paramType === "6") {
                   // 运行状态
@@ -402,10 +408,13 @@ export default {
               // 遍历数组
               for (let i = 0; i < this.compressorData.length; i++) {
                 const item = this.compressorData[i];
-                if (item.paramType === '1' && Number(item.curValue) === 0) {
+                if (item.paramType === "1" && Number(item.curValue) === 0) {
                   item.curValue = "停止";
-                  console.log("压缩机停止了啊是0···················")
+                  console.log("压缩机停止了啊是0···················");
-                }else if (item.paramType === '1' && Number(item.curValue) === 1){
+                } else if (
+                  item.paramType === "1" &&
+                  Number(item.curValue) === 1
+                ) {
                   item.curValue = "运行";
                 }
               }
@@ -792,7 +801,7 @@ export default {
       }
     }
     .detail-bottom {
-      height: 5rem;
+      // height: 5rem;
       margin-top: 0.3rem;
       margin-left: 0.25rem;
       display: flex;
@@ -801,9 +810,9 @@ export default {
       .hostStatus {
         display: flex;
         flex-direction: column;
-        justify-content: flex-end;
+        justify-content: flex-start;
-        width: 3rem;
+        width: 3rem !important;
-        margin-bottom: 1.5rem;
+        margin-top: 1.5rem;
         .hostStatus-li {
           background-color: #25455a;
           color: #c0dffc;
@@ -813,7 +822,11 @@ export default {
           letter-spacing: 0.02rem;
           display: flex;
           flex-direction: row;
+          flex-wrap: nowrap;
           align-items: flex-start;
+          span {
+            white-space: nowrap;
+          }
         }
       }
       .detail-data {
@@ -837,17 +850,18 @@ export default {
           }
         }
         .detail-data-bottom {
-          width: 100%;
+          // width: 100%;
-          padding: 0.1rem 0.3rem;
+          // padding: 0.1rem 0.3rem;
           z-index: 0;
           display: flex;
           flex-direction: row;
           flex-wrap: wrap;
-          align-items: flex-start;
+          align-items: stretch;
           justify-content: flex-start;
           .detail-data-li {
             // width: 100%;
             margin-right: 0.1rem;
+            margin-bottom: 0.15rem !important;
             position: relative;
             color: #c0dffc;
             font-family: Arial, sans-serif;
@@ -990,20 +1004,26 @@ export default {
         }
       }
       .hostparams {
-        width: 7.6rem;
+        // width: 7.7rem;
+        width: 7rem;
         .detail-data-bottom {
-          padding-left: 0.5rem;
+          // padding-left: 0.5rem;
           .detail-data-li {
-            width: 3.2rem;
+            // width: 3.2rem;
+            width: calc(50% - 0.2rem) !important;
+            margin: 0 0.1rem;
           }
         }
       }
       .compressor {
         width: 7.6rem;
         .detail-data-bottom {
-          padding-left: 0.75rem;
+          // padding-left: 0.75rem;
+          //  width: 10rem;
           .detail-data-li {
-            width: 3rem;
+            // width: 3.4rem;
+            width: calc(50% - 0.2rem) !important;
+            margin: 0 0.1rem;
           }
         }
       }
@@ -1037,4 +1057,4 @@ export default {
     }
   }
 }
-</style>
+</style>