1.热水监测页面修改水箱水位、温度数据，修改水位单位为米

2.热水控制界面修改水位单位为米，运行状态值异常的问题。传感器设置添加设定上限值、设定下限值、最低设定值、异常复位的操作

.env.development

@@ -7,9 +7,9 @@ ENV = 'development'
 # 开发环境
 # VUE_APP_BASE_API = '/dev-api'
 # 后台
-VUE_APP_BASE_API = 'http://192.168.1.222:8080'
+# VUE_APP_BASE_API = 'http://192.168.1.222:8080'
 # 海湾酒店-云端
-# VUE_APP_BASE_API = 'http://106.55.173.225:8090'
+VUE_APP_BASE_API = 'http://106.55.173.225:8090'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true

src/views/hotWater/waterControl/index.vue

@@ -293,7 +293,7 @@
             <!-- 水箱 -->
             <div class="monitor-flex-left" v-if="activeName.includes('水箱')">
               <div class="control-top">
-                <water-tank :waterLevel="item.waterLevel"></water-tank>
+                <water-tank :waterLevel="getWaterLevelPercentage(item)"></water-tank>
                 <div class="monitor-words">
                   <!-- <div class="words-li">
                     <div class="ash">补水阀启停:</div>
@@ -333,7 +333,7 @@
               <div class="control-bottom">
                 <div class="words-li words-li5">
                   <div class="ash">实际液位:</div>
-                  <div class="white">{{ item.waterLevel }} %</div>
+                  <div class="white">{{ item.waterLevel }} 米</div>
                 </div>
                 <div class="words-li words-li5">
                   <div class="ash">实际温度:</div>
@@ -609,12 +609,12 @@
                       item.engineeringMaxValue,
                       item.engineeringMaxValueId,
                       '上限',
-                      item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? 'm' : ''
+                      item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? '米' : ''
                     )
                     " @input="handleInput(item)" @blur="handleBlur()"></el-input>
                   <div class="white" v-if="item.name.includes('温度')">℃</div>
                   <div class="white" v-else-if="item.name.includes('压力')">bar</div>
-                  <div class="white" v-else-if="item.name.includes('液位')">m</div>
+                  <div class="white" v-else-if="item.name.includes('液位')">米</div>
                 </div>
                 <div class="words-li words-li4">
                   <div class="ash">下限:</div>
@@ -624,12 +624,12 @@
                       item.engineeringMinValue,
                       item.engineeringMinValueId,
                       '下限',
-                      item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? 'm' : ''
+                      item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? '米' : ''
                     )
                     " @input="handleInput(item)" @blur="handleBlur()"></el-input>
                   <div class="white" v-if="item.name.includes('温度')">℃</div>
                   <div class="white" v-else-if="item.name.includes('压力')">bar</div>
-                  <div class="white" v-else-if="item.name.includes('液位')">m</div>
+                  <div class="white" v-else-if="item.name.includes('液位')">米</div>
                 </div>
                 <div class="words-li words-li4">
                   <div class="ash">数字上限:</div>
@@ -655,6 +655,60 @@
                     )
                     " @input="handleInput(item)" @blur="handleBlur()"></el-input>
                 </div>
+                <div class="words-li words-li4">
+                  <div class="ash">设定上限值:</div>
+                  <el-input
+                    v-if="item.maxValueSet !== null"
+                    v-model="item.maxValueSet"
+                    size="mini"
+                    placeholder="请输入"
+                    @keyup.enter.native="
+                      handleEnter(
+                        item,
+                        item.maxValueSet,
+                        item.maxValueSetId,
+                        '设定上限值',
+                        item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? '米' : ''
+                      )
+                    "
+                    @input="handleInput(item)"
+                    @blur="handleBlur()">
+                  </el-input>
+                  <el-input
+                    v-else
+                    value="--"
+                    readonly
+                    size="mini"
+                    class="disabled-input">
+                  </el-input>
+                </div>
+                <div class="words-li words-li4">
+                  <div class="ash">设定下限值:</div>
+                  <el-input
+                    v-if="item.minValueSet !== null"
+                    v-model="item.minValueSet"
+                    size="mini"
+                    placeholder="请输入"
+                    @keyup.enter.native="
+                      handleEnter(
+                        item,
+                        item.minValueSet,
+                        item.minValueSetId,
+                        '设定下限值',
+                        item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? '米' : ''
+                      )
+                    "
+                    @input="handleInput(item)"
+                    @blur="handleBlur()">
+                  </el-input>
+                  <el-input
+                    v-else
+                    value="--"
+                    readonly
+                    size="mini"
+                    class="disabled-input">
+                  </el-input>
+                </div>
                 <div class="words-li words-li4">
                   <div class="ash">校准值:</div>
                   <el-input v-model="item.calibrationValue" size="mini" placeholder="请输入" @keyup.enter.native="
@@ -663,22 +717,57 @@
                       item.calibrationValue,
                       item.calibrationValueId,
                       '校准值',
-                      item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? 'm' : ''
+                      item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? '米' : ''
                     )
                     " @input="handleInput(item)" @blur="handleBlur()"></el-input>
                   <div class="white" v-if="item.name.includes('温度')">℃</div>
                   <div class="white" v-else-if="item.name.includes('压力')">bar</div>
-                  <div class="white" v-else-if="item.name.includes('液位')">m</div>
+                  <div class="white" v-else-if="item.name.includes('液位')">米</div>
                 </div>
                 <div class="words-li words-li4">
                   <div class="ash">当前值:</div>
                   <div class="white">
                     <span v-if="item.name.includes('温度')">{{ item.temp }}℃</span>
                     <span v-else-if="item.name.includes('压力')">{{ item.pressure }}bar</span>
-                    <span v-else-if="item.name.includes('液位')">{{ item.waterLevel }}%</span>
+                    <span v-else-if="item.name.includes('液位')">{{ item.waterLevel }}米</span>
                     <span v-else>{{ item.temp }}</span>
                   </div>
                 </div>
+                <div class="words-li words-li4">
+                  <div class="ash">最低设定值:</div>
+                  <el-input
+                    v-if="item.minSet !== null"
+                    v-model="item.minSet"
+                    size="mini"
+                    placeholder="请输入"
+                    @keyup.enter.native="
+                      handleEnter(
+                        item,
+                        item.minSet,
+                        item.minSetId,
+                        '设定下限值',
+                        item.name.includes('温度') ? '℃' : item.name.includes('压力') ? 'bar' : item.name.includes('液位') ? '米' : ''
+                      )
+                    "
+                    @input="handleInput(item)"
+                    @blur="handleBlur()">
+                  </el-input>
+                  <el-input
+                    v-else
+                    value="--"
+                    readonly
+                    size="mini"
+                    class="disabled-input">
+                  </el-input>
+                </div>
+                <div class="words-li words-li4">
+                  <div class="ash">异常复位:</div>
+                  <div class="white">
+                      <el-switch style="display: block" v-model="item.exceptionReset" active-color="#13ce66"
+                        active-text="开" inactive-text="关" @change="handleReset(item)">
+                      </el-switch>
+                    </div>
+                </div>
               </div>
             </div>
           </div>
@@ -877,7 +966,7 @@ export default {
             let deviceItem = {
               ...item,
               waterLevel: Number(item.waterLevel),
-              runningStatus: Number(item.runningStatus) == 0 ? "停止" : "运行", //运行状态
+              runningStatus: Number(item.runningStatus) === 0 ? "停止" : "运行", //运行状态
               hotPumpStatus:
                 Number(item.switchStatus) === 0
                   ? false
@@ -887,9 +976,10 @@ export default {
               switchStatus: Number(item.switchStatus) == 0 ? false : true, //启停控制
               alarmStatus: Number(item.alarmStatus) == 0 ? "无故障" : "故障", //故障状态
               handAutomaticSwitch:
-                Number(item.handAutomaticSwitch) == 0 ? false : true, //手自动状态
+                Number(item.handAutomaticSwitch) == 1 ? false : true, //手自动状态
               openSwitch: Number(item.openSwitch) == 0 ? false : true, //一键启动
               closeSwitch: Number(item.closeSwitch) == 0 ? false : true, //一键停止
+              exceptionReset: Number(item.exceptionReset) == 0 ? false : true, //异常复位
               // 传感器参数设置相关字段，确保初始化
               engineeringMaxValue: item.engineeringMaxValue || '',
               engineeringMaxValueId: item.engineeringMaxValueId || '',
@@ -955,22 +1045,20 @@ export default {
                     let deviceItem = {
                       ...item,
                       waterLevel: Number(item.waterLevel),
-                      runningStatus:
+                      runningStatus: Number(item.runningStatus) === 0 ? "停止" : "运行", //运行状态
-                        Number(item.runningStatus) == 0 ? "运行" : "停止", //运行状态
                       hotPumpStatus:
                         Number(item.switchStatus) === 0
                           ? false
                           : Number(item.switchStatus) === 4
                             ? true
-                            : "未知状态", // 热泵开关状态
+                            : "", // 热泵开关状态
-                      switchStatus:
+                      switchStatus: Number(item.switchStatus) == 0 ? false : true, //启停控制
-                        Number(item.switchStatus) == 0 ? false : true, //启停控制
+                      alarmStatus: Number(item.alarmStatus) == 0 ? "无故障" : "故障", //故障状态
-                      alarmStatus:
-                        Number(item.alarmStatus) == 0 ? "无故障" : "故障", //故障状态
                       handAutomaticSwitch:
-                        Number(item.handAutomaticSwitch) == 0 ? false : true, //手自动状态
+                        Number(item.handAutomaticSwitch) == 1 ? false : true, //手自动状态
                       openSwitch: Number(item.openSwitch) == 0 ? false : true, //一键启动
                       closeSwitch: Number(item.closeSwitch) == 0 ? false : true, //一键停止
+                      exceptionReset: Number(item.exceptionReset) == 0 ? false : true, //异常复位
                       // 传感器参数设置相关字段，确保初始化
                       engineeringMaxValue: item.engineeringMaxValue || '',
                       engineeringMaxValueId: item.engineeringMaxValueId || '',
@@ -1160,6 +1248,34 @@ export default {
           item.switchStatus = !item.switchStatus;
         });
     },
+    // 异常复位
+    handleReset(item) {
+      this.$confirm(
+        `确定要切换设备"${item.name}"的异常复位为:${item.exceptionReset ? "开" : "关 吗?"
+        }`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          // 这里调用请求函数，示例中只是简单打印信息
+          console.log("请求后台", exceptionReset);
+          let param = null;
+          if (item.exceptionReset) {
+            param = 1;
+          } else {
+            param = 0;
+          }
+          this.hadleOperationConrol(item.exceptionResetId, param);
+        })
+        .catch(() => {
+          // 用户取消操作，恢复开关状态
+          item.exceptionReset = !item.exceptionReset;
+        });
+    },
     // 处理输入事件，过滤非数字字符
     handleInput(item) {
       console.log("校验");
@@ -1212,15 +1328,36 @@ export default {
             // this.$modal.msgError("操作失败");
             console.log("应该更新状态的");
             // 更新所有设备状态;
-            this.getWaterList();
+            this.getWaterList().finally(() => {
+              // 关闭 loading 效果
+              this.loading = false;
+            });
           }
         })
         .catch((error) => {
           console.log("请求发生错误，更新设备状态", error);
           // 更新所有设备状态;
-          this.getWaterList();
+          this.getWaterList().finally(() => {
+            // 关闭 loading 效果
+            this.loading = false;
+          });
         });
     },
+    // 计算水箱百分比
+    getWaterLevelPercentage(item) {
+      let maxValue = 2.5; // 默认最大值
+      // 根据水箱名称判断最大值
+      if (item.name) {
+        if (item.name.includes('水箱1')) {
+          maxValue = 2.5;
+        } else if (item.name.includes('水箱2')) {
+          maxValue = 2.5;
+        }
+      }
+      let percentage = Number((item.waterLevel / maxValue * 100).toFixed(2));
+      // 如果计算的值大于100，则返回100
+      return percentage > 100 ? 100 : percentage;
+    },
   },
 };
 </script>
@@ -1443,6 +1580,7 @@ export default {
 
           .white {
             color: #ffffff;
+            white-space: nowrap;
           }
 
           .words-li {

src/views/hotWater/waterMonitor/waterMonitorDetails.vue

@@ -73,29 +73,21 @@
               " src="../../../assets/flowimg/supply-move.gif" alt="" />
               <img class="supply" v-else src="../../../assets/flowimg/supply-nomove.png" alt="" />
               <!-- 循环泵1定位 -->
-              <img
+              <img class="circulate1"
-                class="circulate1"
                 :src="isCirculateRunning() ? require('../../../assets/flowimg/singlePipeline.gif') : require('../../../assets/flowimg/singlePipeline.png')"
-                alt=""
+                alt="" />
-              />
               <!-- 循环泵2定位 -->
-              <img
+              <img class="circulate2"
-                class="circulate2"
                 :src="isCirculateRunning() ? require('../../../assets/flowimg/singlePipeline.gif') : require('../../../assets/flowimg/singlePipeline.png')"
-                alt=""
-              />
-              <!-- 高区供水泵1定位 -->
-              <img class="coolpum" src="../../../assets/flowimg/startpum.png"
                 alt="" />
+              <!-- 高区供水泵1定位 -->
+              <img class="coolpum" src="../../../assets/flowimg/startpum.png" alt="" />
               <!-- 高区供水泵2定位 -->
-              <img class="waterpum"  src="../../../assets/flowimg/startpum.png"
+              <img class="waterpum" src="../../../assets/flowimg/startpum.png" alt="" />
-                alt="" />
               <!-- 低区供水泵1定位 -->
-              <img class="waterpum2"  src="../../../assets/flowimg/startpum.png"
+              <img class="waterpum2" src="../../../assets/flowimg/startpum.png" alt="" />
-                alt="" />
               <!-- 低区供水泵2定位 -->
-              <img class="waterpum3"  src="../../../assets/flowimg/startpum.png"
+              <img class="waterpum3" src="../../../assets/flowimg/startpum.png" alt="" />
-                alt="" />
 
 
               <!-- 循环加热泵定位-->
@@ -190,13 +182,13 @@
               </div>
               <b class="temdiv1">{{ temdata2 }}℃</b>
               <!-- 水位定位2 -->
-              <div class="progressContainer1" v-if="progress2 > 50">
+              <div class="progressContainer1" v-if="getWaterPercentage(progress2, 2.5) > 50">
-                <div class="progress" :style="{ height: progress2 + '%' }"></div>
+                <div class="progress" :style="{ height: getWaterPercentage(progress2, 2.5) + '%' }"></div>
-                <b class="propo">{{ progress2 }}%</b>
+                <b class="propo">{{ progress2 }}米</b>
               </div>
               <div class="progressContainer2" v-else>
-                <div class="progress" :style="{ height: progress2 + '%' }"></div>
+                <div class="progress" :style="{ height: getWaterPercentage(progress2, 2.5) + '%' }"></div>
-                <b class="propo">{{ progress2 }}%</b>
+                <b class="propo">{{ progress2 }}米</b>
               </div>
 
               <!-- 保温水箱1定位 -->
@@ -208,13 +200,13 @@
               </div>
               <b class="temdiv2">{{ temdata1 }}℃</b>
               <!-- 水位定位1 -->
-              <div class="progressContainer3" v-if="progress1 > 50">
+              <div class="progressContainer3" v-if="getWaterPercentage(progress1, 2.5) > 50">
-                <div class="progress" :style="{ height: progress1 + '%' }"></div>
+                <div class="progress" :style="{ height: getWaterPercentage(progress1, 2.5) + '%' }"></div>
-                <b class="propo">{{ progress1 }}%</b>
+                <b class="propo">{{ progress1 }}米</b>
               </div>
               <div class="progressContainer4" v-else>
-                <div class="progress" :style="{ height: progress1 + '%' }"></div>
+                <div class="progress" :style="{ height: getWaterPercentage(progress1, 2.5) + '%' }"></div>
-                <b class="propo">{{ progress1 }}%</b>
+                <b class="propo">{{ progress1 }}米</b>
               </div>
             </div>
           </div>
@@ -254,9 +246,11 @@
 
               <!-- 热泵定位 -->
 
-              <img class="circulate3"  :src="isHotPumpRunning() ? require('../../../assets/flowimg/singlePipeline.gif') : require('../../../assets/flowimg/singlePipeline.png')"
+              <img class="circulate3"
+                :src="isHotPumpRunning() ? require('../../../assets/flowimg/singlePipeline.gif') : require('../../../assets/flowimg/singlePipeline.png')"
                 alt="" />
-              <img class="circulate4"  :src="isHotPumpRunning() ? require('../../../assets/flowimg/singlePipeline.gif') : require('../../../assets/flowimg/singlePipeline.png')"
+              <img class="circulate4"
+                :src="isHotPumpRunning() ? require('../../../assets/flowimg/singlePipeline.gif') : require('../../../assets/flowimg/singlePipeline.png')"
                 alt="" />
               <div :class="getHotPumPositionClass">
                 <div class="hotPump-li2" v-for="(item, index) in tableData" :key="index">
@@ -297,13 +291,13 @@
               </div>
               <b class="temdiv3">{{ temdata1 }}℃</b>
               <!-- 水位定位1 -->
-              <div class="progressContainer5" v-if="progress1 > 50">
+              <div class="progressContainer5" v-if="getWaterPercentage(progress1, 2.5) > 50">
-                <div class="progress" :style="{ height: progress1 + '%' }"></div>
+                <div class="progress" :style="{ height: getWaterPercentage(progress1, 2.5) + '%' }"></div>
-                <b class="propo">{{ progress1 }}%</b>
+                <b class="propo">{{ progress1 }}米</b>
               </div>
               <div class="progressContainer6" v-else>
-                <div class="progress" :style="{ height: progress1 + '%' }"></div>
+                <div class="progress" :style="{ height: getWaterPercentage(progress1, 2.5) + '%' }"></div>
-                <b class="propo">{{ progress1 }}%</b>
+                <b class="propo">{{ progress1 }}米</b>
               </div>
             </div>
           </div>
@@ -347,7 +341,7 @@
                   <span>{{ row.levelSet1 }}</span>
                 </template>
               </el-table-column> -->
-              <el-table-column prop="waterLevel1" label="实际水位1(%)" min-width="100">
+              <el-table-column prop="waterLevel1" label="实际水位1(米)" min-width="100">
                 <template slot-scope="{ row }">
                   <span>{{ row.waterLevel1 }} </span>
                 </template>
@@ -358,7 +352,7 @@
                   <span>{{ row.levelSet2 }}</span>
                 </template>
               </el-table-column> -->
-              <el-table-column prop="waterLevel2" label="实际水位2(%)" min-width="100" v-if="currentName == '主楼'">
+              <el-table-column prop="waterLevel2" label="实际水位2(米)" min-width="100" v-if="currentName == '主楼'">
                 <template slot-scope="{ row }">
                   <span>{{ row.waterLevel2 }} </span>
                 </template>
@@ -481,17 +475,14 @@ export default {
     this.getAlarnStatus();
     this.getDayData();
     // 设置定时器，每 10 秒执行一次
-    // this.timer = setInterval(() => {
+    this.timer = setInterval(() => {
-    //   if (this.isShowHotWater) {
+      this.baseMessgae();
-    //     this.baseMessgae();
+      this.sysStatus();
-    //     this.sysStatus();
+    }, 10000);
-    //   }
+    // 每秒更新一次时间
-    //   this.sysStatus();
+    this.nowTimer = setInterval(() => {
-    // }, 10000);
+      this.currentDate = new Date();
-    // // 每秒更新一次时间
+    }, 1000);
-    // this.nowTimer = setInterval(() => {
-    //   this.currentDate = new Date();
-    // }, 1000);
   },
   beforeDestroy() {
     // 组件销毁前清除定时器
@@ -796,6 +787,10 @@ export default {
             this.tableData.push(deviceItem);
           });
           console.log("处理后的tableData", this.tableData);
+          this.progress1 = 0;
+          this.progress2 = 0;
+          this.temdata1 = 0;
+          this.temdata2 = 0;
           if (this.tableData.length > 0 && this.isShowHotWater) {
 
             // 获取数据
@@ -813,6 +808,10 @@ export default {
             // this.upWaterState2 = row.upWaterState2;
             // this.upWaterState3 = row.upWaterState3;
             // this.upWaterState4 = row.upWaterState4;
+          } else {
+            //水位 温度 热泵名称
+            this.progress1 = this.tableData[0].waterLevel1;
+            this.temdata1 = this.tableData[0].tankWaterTemp;
           }
         } else {
           this.tableData = [];
@@ -843,6 +842,12 @@ export default {
       if (state === 2) return require('../../../assets/flowimg/badpum.png');
       return require('../../../assets/flowimg/closepum.png');
     },
+    // 计算水位百分比（最高值maxLevel）
+    getWaterPercentage(waterLevel, maxLevel) {
+      let percentage = (waterLevel / maxLevel * 100).toFixed(2);
+      // 如果计算的值大于100，则返回100
+      return Number(percentage) > 100 ? 100 : Number(percentage);
+    },
   },
 };
 </script>
@@ -1270,18 +1275,21 @@ export default {
             left: 10.7rem;
             z-index: 1;
           }
+
           .text19 {
             position: absolute;
             top: 0.25rem;
             left: 3.4rem;
             z-index: 1;
           }
+
           .text20 {
             position: absolute;
             top: 3.4rem;
             left: 5.8rem;
             z-index: 1;
           }
+
           .text21 {
             position: absolute;
             top: 3.4rem;
@@ -1640,6 +1648,7 @@ export default {
               position: absolute;
               top: -0.3rem;
               z-index: 3;
+              white-space: nowrap;
             }
           }
 
@@ -1671,6 +1680,7 @@ export default {
               position: absolute;
               top: -0.3rem;
               z-index: 3;
+              white-space: nowrap;
             }
           }
 
@@ -1702,6 +1712,7 @@ export default {
               position: absolute;
               top: -0.3rem;
               z-index: 3;
+              white-space: nowrap;
             }
           }
 
@@ -1733,6 +1744,7 @@ export default {
               position: absolute;
               top: -0.3rem;
               z-index: 3;
+              white-space: nowrap;
             }
           }
 
@@ -1764,6 +1776,7 @@ export default {
               position: absolute;
               top: -0.3rem;
               z-index: 3;
+              white-space: nowrap;
             }
           }
 
@@ -1795,6 +1808,7 @@ export default {
               position: absolute;
               top: -0.3rem;
               z-index: 3;
+              white-space: nowrap;
             }
           }