fix:调整调试页面传感器数值显示样式

src/views/debug/index.vue

@@ -164,25 +164,64 @@ const printerDoTest = () => {
     <main class="main-content">
       <!-- 上下布局  -->
       <section class="debug-env">
-        <div v-for="(item, index) in h2O2SensorData" :key="index" class="debug-left-lh env-lh">
-          <div class="debug-env-content">
-            <div class="debug-label env-content-p" style="text-align: center;width: 8rem">
-              {{ index === 0 ? '仓内环境' : item.title || `探头${index}` }}
-            </div>
-            <div class="env-content-p">
-              <span>温度</span>
-              <span class="debug-text">{{ roundNumber(item.temp, 2) }}</span>°C
-            </div>
-            <div class="env-content-p">
-              <span>湿度</span>
-              <span class="debug-text">{{ roundNumber(item.rh, 2) }}</span>%RH
-            </div>
-            <div class="env-content-p">
-              <span>H202浓度</span>
-              <span class="debug-text">{{ roundNumber(item.h2o2, 2) }}</span>ppm
+        <!-- 左侧：H₂O₂ 传感器数据 -->
+        <div class="debug-env-left">
+          <div
+            v-for="(item, index) in h2O2SensorData"
+            :key="index"
+            class="debug-left-lh env-lh"
+          >
+            <div class="debug-env-content">
+              <div class="debug-label env-content-p" style="text-align: right; width: 8rem">
+                {{ index === 0 ? '仓内环境' : item.title || `探头${index}` }}
+              </div>
+              <div class="env-content-p">
+                <span>温度</span>
+                <span class="debug-text">{{ roundNumber(item.temp, 2) }}</span>°C
+              </div>
+              <div class="env-content-p">
+                <span>湿度</span>
+                <span class="debug-text">{{ roundNumber(item.rh, 2) }}</span>%RH
+              </div>
+              <div class="env-content-p">
+                <span>H₂O₂浓度</span>
+                <span class="debug-text">{{ roundNumber(item.h2o2, 2) }}</span>ppm
+              </div>
             </div>
           </div>
         </div>
+
+        <!-- 右侧：电机电流 & 加热温度 -->
+        <div class="debug-env-right">
+          <div class="env-content-p">
+            <span class="label">空压机电流</span>
+            <span class="value">
+              <span class="debug-text">{{ debugStore.debugPageState?.airCompressorCurrent ?? 0 }}</span>
+              <span class="unit">A</span>
+            </span>
+          </div>
+          <div class="env-content-p">
+            <span class="label">风机电流</span>
+            <span class="value">
+              <span class="debug-text">{{ debugStore.debugPageState?.blowerCurrent ?? 0 }}</span>
+              <span class="unit">A</span>
+            </span>
+          </div>
+          <div class="env-content-p">
+            <span class="label">加热片电流</span>
+            <span class="value">
+              <span class="debug-text">{{ debugStore.debugPageState?.heaterCurrent ?? 0 }}</span>
+              <span class="unit">A</span>
+            </span>
+          </div>
+          <div class="env-content-p">
+            <span class="label">加热片温度</span>
+            <span class="value">
+              <span class="debug-text">{{ debugStore.debugPageState?.heaterTemperature ?? 0 }}</span>
+              <span class="unit">℃</span>
+            </span>
+          </div>
+        </div>
       </section>
       <hr class="divider">
       <div class="debug-lower">
@@ -217,9 +256,6 @@ const printerDoTest = () => {
               <div class="debug-label">
                 空压机控制：
               </div>
-              <div class="debug-bw">
-                <span class="debug-text">{{ debugStore.debugPageState?.airCompressorCurrent }} A</span>
-              </div>
               <div>
                 <bt-button
                   type="primary"
@@ -238,10 +274,6 @@ const printerDoTest = () => {
               <div class="debug-label">
                 加热片控制：
               </div>
-              <div class="debug-bw">
-                <span class="debug-text">{{ debugStore.debugPageState?.heaterCurrent }} A</span>
-                <span class="debug-text">{{ debugStore.debugPageState?.heaterTemperature }} ℃</span>
-              </div>
               <div>
                 <bt-button
                   type="primary"
@@ -261,7 +293,7 @@ const printerDoTest = () => {
                 气密性阀门模式：
               </div>
               <div class="debug-bw">
-                <el-select v-model="airLeakDetectTestMode" placeholder="请选择模式" style="width: 100%;" >
+                <el-select v-model="airLeakDetectTestMode" placeholder="请选择模式" style="width: 100%;">
                   <el-option label="消毒模式" value="disinfection" />
                   <el-option label="加压模式" value="inflation" />
                   <el-option label="泄露测试模式" value="leakTest" />
@@ -313,9 +345,6 @@ const printerDoTest = () => {
               <div class="debug-label">
                 风机控制：
               </div>
-              <div class="debug-bw">
-                <span class="debug-text">{{ debugStore.debugPageState?.blowerCurrent }} A</span>
-              </div>
               <div>
                 <bt-button
                   type="primary"
@@ -378,8 +407,8 @@ const printerDoTest = () => {
     margin-bottom: 4vh;
   }
   .debug-env {
-    display: grid;
-    grid-template-columns: repeat(2, 1fr);
+    display: flex;
+    align-items: flex-start;
   }
   .debug-left-lh{
     display: flex;
@@ -392,8 +421,50 @@ const printerDoTest = () => {
       }
     }
   }
+
+  .debug-env-right {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    margin-left: 20rem;
+    align-items: flex-start;
+  }
+
+  .env-content-p {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    font-size: 1rem;
+  }
+
+  .debug-env-right .env-content-p {
+    display: flex;
+    align-items: center;
+  }
+
+  .debug-env-right .env-content-p .label {
+    display: inline-block;
+    width: 6.5rem;    /* 根据最长文字“加热片电流”微调 */
+    text-align: right;
+    margin-right: 0.75rem;
+  }
+
+  .debug-env-right .env-content-p .value {
+    display: flex;
+    align-items: baseline;
+    gap: 0.2rem;
+  }
+
+  .debug-env-right .env-content-p .debug-text {
+    font-weight: bold;
+    color: #2892F3;
+  }
+
+  .debug-env-right .env-content-p .unit {
+    font-size: 0.9em;
+  }
   .env-lh{
-    height: 10vh;
+    height: 5vh;
   }
   .debug-bw{
     width: 10vw;