界面修改

src/components/Operator.vue

@@ -124,7 +124,7 @@
         <p>SET</p>
       </div>
       <div class="set_form">
-        <p class="textP">{{ settingStore.sprinklerPumpGPM }}</p>
+        <!-- <p class="textP">{{ settingStore.sprinklerPumpGPM }}</p> -->
         <div class="log" @click="showLogPicker">{{ logVal }}</div>
       </div>
       <svg
@@ -695,7 +695,7 @@ onUnmounted(() => {
       }
       .log {
         position: absolute;
-        bottom: 0;
+        bottom: 44px;
         left: 0px;
         width: 240px;
         height: 44px;

src/components/Progress.vue

@@ -85,6 +85,10 @@
           </g>
         </g>
       </svg>
+      <div class="left_log_wrap">
+        <p class="text">当前剩余</p>
+        <p class="val">12log</p>
+      </div>
       <div
         class="btn"
         v-if="[1, 2, 3, 4].includes(operatorStore.disinfectStatus)"
@@ -783,6 +787,27 @@ const continueDisinfect = () => {
         text-align: center;
       }
     }
+    .left_log_wrap {
+      display: flex;
+      align-items: center;
+      .text {
+        font-family: Source Han Sans CN;
+        font-size: 30px;
+        font-weight: bold;
+        line-height: normal;
+        letter-spacing: 0.1em;
+        color: #06518b;
+      }
+      .val {
+        margin-left: 10px;
+        font-family: Poppins;
+        font-size: 32px;
+        font-weight: bold;
+        line-height: normal;
+        letter-spacing: 0.1em;
+        color: #17f179;
+      }
+    }
     .btn {
       padding: 12px 28px;
       white-space: nowrap;