现场调试完的

src/components/Flow.vue

@@ -9,11 +9,11 @@
       </div>
     </div>
     <div class="right-div">
-      <div v-for="(item, index) of dataList" :key="index" :class="'div' + index">
+      <div v-for="(item, index) of dataList" :key="index" :class="'div' + index" class="div-box">
         <div>{{ item.title }}</div>
         <div v-for="(it, i) of item.data" :key="i">
           <!-- <Process :itemData="it"></Process> -->
-          <span>{{ it.label }}</span>
+          <!-- <span>{{ it.label }}</span> -->
           <span class="font26" :style="{ 'color': it.color }">{{ it.value }}</span>
         </div>
       </div>
@@ -215,6 +215,18 @@ export default {
   .right-div {
     width: 22%;
     height: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    .div-box {
+      height: 12%;
+      // border: 1px solid #b9ddeb;
+      border-radius: 5px;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-around;
+      padding: 0 15px;
+    }
   }
 
   .date {

src/components/Index.vue

@@ -48,14 +48,14 @@
           <div>
             <p>原水水质</p>
             <p>余氯：<span class="font26">{{ baseData && baseData.vd2600.toFixed(2) }}</span> mg/L</p>
-            <p>浊度：<span class="font26">{{ baseData && baseData.vd2610.toFixed(2) }}</span> mg/L</p>
+            <p>浊度：<span class="font26">{{ baseData && baseData.vd2610.toFixed(2) }}</span> NTU</p>
             <p>氨氮：<span class="font26">{{ baseData && baseData.vd2620.toFixed(2) }}</span> mg/L</p>
             <p>COD：<span class="font26">{{ baseData && baseData.vd2630.toFixed(2) }}</span> mg/L</p>
           </div>
           <div>
             <p>净水水质</p>
             <p>余氯：<span class="font26">{{ baseData && baseData.vd2500.toFixed(2) }}</span> mg/L</p>
-            <p>浊度：<span class="font26">{{ baseData && baseData.vd2510.toFixed(2) }}</span> mg/L</p>
+            <p>浊度：<span class="font26">{{ baseData && baseData.vd2510.toFixed(2) }}</span> NTU</p>
             <p>氨氮：<span class="font26">{{ baseData && baseData.vd2520.toFixed(2) }}</span> mg/L</p>
             <p>COD：<span class="font26">{{ baseData && baseData.vd2530.toFixed(2) }}</span> mg/L</p>
           </div>

src/components/Process.vue

@@ -3,8 +3,8 @@
     <span>{{ itemData.label }}</span>
     <!-- <div :id="'process' + itemData.id" class="process-echart"></div> -->
     <div class="process-echart">
-      <el-progress :text-inside="true" :stroke-width="20" :percentage="itemData.value" :color="itemData.color"
-        show-text format="format"/>
+      <el-progress :text-inside="true" :stroke-width="20" :percentage="itemData.value*50" :color="itemData.color"
+        show-text :format="format"/>
     </div>
   </div>
 </template>
@@ -27,7 +27,7 @@ export default {
 
     // 只显示数字
     const format = (percentage) => {
-      return percentage;
+      return percentage/50;
     }
     // watch(() => props.itemData, val => {
     //   if (val) {

src/components/Quality.vue

@@ -16,7 +16,7 @@
           <div v-for="(it, i) of item.data" :key="i">
             <!-- <Process :itemData="it"></Process> -->
             <span>{{ it.label }}</span>
-            <span class="font26" :style="{'color': it.color}">{{ item.value}}</span>
+            <span class="font26" :style="{'color': it.color}">{{ it.value}}</span>
           </div>
         </div>
       </div>

vite.config.js

@@ -25,10 +25,10 @@ export default ({ mode }) =>  defineConfig({
     proxy: {
       '/api': {
         // target: 'http://whh.shikicc.com:52189',
-        target: '192.168.2.6:6688',
+        target: 'http://192.168.2.6:6688',
         changeOrigin: true,
-        // rewrite: path => path.replace(/^\/api/, '')
-        rewrite: path => path.replace(/^\//, '')
+        rewrite: path => path.replace(/^\/api/, '')
+        // rewrite: path => path.replace(/^\//, '')
       }
     }
   }