1.修改1号螺杆机和2号离心机的底图

src/views/centerairC/sysMonitor/components/loadData.vue

@@ -29,7 +29,7 @@ export default {
           let data = newVal;
           if (data.length > 0) {
             data.forEach((item) => {
-              if (item.paramType === "28") {
+              if (item.otherName === "负载") {
                 this.loadPercent = item.curValue;
               }
             });

src/views/centerairC/sysMonitor/hostDetails.vue

@@ -1,24 +1,71 @@
 <template>
   <div class="monitor" v-loading="loading">
     <div class="monitor-top">
-      <img class="title-left" src="../../../assets/images/title-left.png" alt="" />
+      <img
-      <img class="title-center" @click="goSys" src="../../../assets/images/title-center.png" alt="" />
+        class="title-left"
-      <img class="title-right" src="../../../assets/images/title-right.png" alt="" />
+        src="../../../assets/images/title-left.png"
+        alt=""
+      />
+      <img
+        class="title-center"
+        @click="goSys"
+        src="../../../assets/images/title-center.png"
+        alt=""
+      />
+      <img
+        class="title-right"
+        src="../../../assets/images/title-right.png"
+        alt=""
+      />
       <div class="sys-title" @click="goSys">铭汉高效冷源站管理系统</div>
       <!-- logo -->
       <img src="../../../assets/images/logo-3.png" class="sys-logo" alt="" />
       <div class="nowTime">{{ formattedDate }}</div>
       <div class="monitor-time">已监测时长:{{ dayData }}天</div>
-      <img class="icon_warning" src="../../../assets/images/warning.png" title="报警记录" @click="goWarning"
+      <img
-        v-if="isShowWarning" alt="" />
+        class="icon_warning"
-      <img class="icon_home" src="../../../assets/images/icon_home.png" title="首页" @click="goSys" alt="" />
+        src="../../../assets/images/warning.png"
-      <img class="back-icon" src="../../../assets/images/back-icon.png" title="返回" @click="goBack" alt="" />
+        title="报警记录"
+        @click="goWarning"
+        v-if="isShowWarning"
+        alt=""
+      />
+      <img
+        class="icon_home"
+        src="../../../assets/images/icon_home.png"
+        title="首页"
+        @click="goSys"
+        alt=""
+      />
+      <img
+        class="back-icon"
+        src="../../../assets/images/back-icon.png"
+        title="返回"
+        @click="goBack"
+        alt=""
+      />
     </div>
     <div class="host-detail">
       <div class="detail-top">
         <div class="detail-top-left">
-          <img class="host-img1" src="../../../assets/images/host-img3.png" alt="" v-if="isMagnetic === 'true'" />
+          <img
-          <img class="host-img1" src="../../../assets/images/host-img4.png" alt="" v-else />
+            class="host-img1"
+            src="../../../assets/images/host-img3.png"
+            alt=""
+            v-if="isMagnetic === 'true'"
+          />
+          <img
+            class="host-img1"
+            src="../../../assets/images/host-img6.png"
+            alt=""
+            v-if="deviceName === '1号螺杆机'"
+          />
+          <img
+            class="host-img1"
+            src="../../../assets/images/host-img4.png"
+            alt=""
+            v-if="deviceName === '2号离心机'"
+          />
           <div class="host-name">{{ deviceName }}</div>
           <!-- 冷凝器蒸发器压力-->
           <div class="outIn">
@@ -40,11 +87,16 @@
             </div> -->
           </div>
           <!-- 运行状态 -->
-          <img src="../../../assets/images/fan-img.png" :class="{
+          <img
+            src="../../../assets/images/fan-img.png"
+            :class="{
               moveClass: hostListClass('1'),
               fanBlade: isMagnetic === 'true',
-            leftFan: isMagnetic === 'false',
+              rightFan1: deviceName === '1号螺杆机',
-          }" alt="" />
+              rightFan2: deviceName === '2号离心机',
+            }"
+            alt=""
+          />
           <!-- 启停状态 -->
           <div class="startClass" v-if="hostListClass('2')"></div>
           <!-- 冷冻冷却水流信号 -->
@@ -53,13 +105,19 @@
               <span>冷却水流:</span>
               <span v-if="hostListClass('21')">接通</span>
               <span v-else>断开</span>
-              <span class="break" :class="{ connect: hostListClass('21') }"></span>
+              <span
+                class="break"
+                :class="{ connect: hostListClass('21') }"
+              ></span>
             </div>
             <div class="water-flow-li">
               <span>冷冻水流:</span>
               <span v-if="hostListClass('20')">接通</span>
               <span v-else>断开</span>
-              <span class="break" :class="{ connect: hostListClass('20') }"></span>
+              <span
+                class="break"
+                :class="{ connect: hostListClass('20') }"
+              ></span>
             </div>
           </div>
           <div class="hostStatus">
@@ -75,21 +133,29 @@
               <span>实时冷冻水温度设点:</span>
               <span class="dotData">{{ coldWaterSetObj.curValue }}℃</span>
             </div>
-            <div class="hostStatus-li">
+            <div class="hostStatus-li" v-if="isMagnetic === 'true'">
               <span>用户冷冻水控制点:</span>
               <span class="goodData">{{ coldWaterControlObj.curValue }}℃</span>
               <!-- <span class="badData" v-else>{{ coldWaterControlObj.curValue }}</span> -->
             </div>
-            <div class="hostStatus-li">
+            <div class="hostStatus-li" v-if="isMagnetic === 'true'">
               <span>冷水设定值偏移:</span>
               <!-- <span class="goodData">{{ offsetValuerControlObj.curValue }}℃</span> -->
               <span class="goodData">
-                <el-input v-model="offsetValuerControlObj.curValue" size="mini" @keyup.enter.native="
+                <el-input
+                  v-model="offsetValuerControlObj.curValue"
+                  size="mini"
+                  @keyup.enter.native="
                     handleEnter(offsetValuerControlObj, $event)
-                  " @input="handleInput(offsetValuerControlObj.curValue)" @blur="handleBlur()">
+                  "
-                  <template #suffix>℃</template></el-input></span>
+                  @input="handleInput(offsetValuerControlObj.curValue)"
+                  @blur="handleBlur()"
+                >
+                  <template #suffix>℃</template></el-input
+                ></span
+              >
             </div>
-            <div class="hostStatus-li">
+            <div class="hostStatus-li" v-if="isMagnetic === 'true'">
               <span>最终冷冻水温度设定值:</span>
               <span class="goodData">{{ finalColdWaterTemp }}℃</span>
             </div>
@@ -113,15 +179,22 @@
             <title-img></title-img>
           </div>
           <div class="detail-data-bottom">
-            <div class="detail-data-li" v-for="(item, index) in rightHostData" :key="index">
+            <div
+              class="detail-data-li"
+              v-for="(item, index) in rightHostData"
+              :key="index"
+            >
               <div class="rightDot">
                 <div class="leftDot">
                   <span>{{ item.otherName }}:</span>
-                  <span :class="{
+                  <span
+                    :class="{
                       dotData: !isSpecialValue(item.curValue),
                       goodData: isSpecialValue(item.curValue),
                       badData: item.curValue === '故障',
-                  }">{{ item.curValue }}</span>
+                    }"
+                    >{{ item.curValue }}</span
+                  >
                   <span>{{ item.unit }}</span>
                 </div>
               </div>
@@ -137,15 +210,22 @@
             <title-img></title-img>
           </div>
           <div class="detail-data-bottom">
-            <div class="detail-data-li" v-for="(subItem, subIndex) in compressorData1.list" :key="subIndex">
+            <div
+              class="detail-data-li"
+              v-for="(subItem, subIndex) in compressorData1.list"
+              :key="subIndex"
+            >
               <div class="rightDot">
                 <div class="leftDot">
                   <span>{{ subItem.otherName }}:</span>
-                  <span :class="{
+                  <span
+                    :class="{
                       dotData: !isSpecialValue(subItem.curValue),
                       goodData: isSpecialValue(subItem.curValue),
                       badData: subItem.curValue === '故障',
-                  }">{{ subItem.curValue }}</span>
+                    }"
+                    >{{ subItem.curValue }}</span
+                  >
                   <span>{{ subItem.unit }}</span>
                 </div>
               </div>
@@ -161,15 +241,22 @@
             <title-img></title-img>
           </div>
           <div class="detail-data-bottom">
-            <div class="detail-data-li" v-for="(subItem, subIndex) in compressorData2.list" :key="subIndex">
+            <div
+              class="detail-data-li"
+              v-for="(subItem, subIndex) in compressorData2.list"
+              :key="subIndex"
+            >
               <div class="rightDot">
                 <div class="leftDot">
                   <span>{{ subItem.otherName }}:</span>
-                  <span :class="{
+                  <span
+                    :class="{
                       dotData: !isSpecialValue(subItem.curValue),
                       goodData: isSpecialValue(subItem.curValue),
                       badData: subItem.curValue === '故障',
-                  }">{{ subItem.curValue }}</span>
+                    }"
+                    >{{ subItem.curValue }}</span
+                  >
                   <span>{{ subItem.unit }}</span>
                 </div>
               </div>
@@ -185,15 +272,22 @@
             <title-img></title-img>
           </div>
           <div class="detail-data-bottom">
-            <div class="detail-data-li" v-for="(subItem, subIndex) in compressorData3.list" :key="subIndex">
+            <div
+              class="detail-data-li"
+              v-for="(subItem, subIndex) in compressorData3.list"
+              :key="subIndex"
+            >
               <div class="rightDot">
                 <div class="leftDot">
                   <span>{{ subItem.otherName }}:</span>
-                  <span :class="{
+                  <span
+                    :class="{
                       dotData: !isSpecialValue(subItem.curValue),
                       goodData: isSpecialValue(subItem.curValue),
                       badData: subItem.curValue === '故障',
-                  }">{{ subItem.curValue }}</span>
+                    }"
+                    >{{ subItem.curValue }}</span
+                  >
                   <span>{{ subItem.unit }}</span>
                 </div>
               </div>
@@ -203,7 +297,13 @@
       </div>
     </div>
     <!-- 定时开关内容 -->
-    <el-dialog title="偏移值定时设置" :visible.sync="isOpenTimeSwitch" append-to-body width="800px" class="custom-dialog">
+    <el-dialog
+      title="偏移值定时设置"
+      :visible.sync="isOpenTimeSwitch"
+      append-to-body
+      width="800px"
+      class="custom-dialog"
+    >
       <div class="dialog-content">
         <div class="device-container" v-loading="loading">
           <div class="device-li">
@@ -215,52 +315,93 @@
             <div class="device-name">最终设定值</div>
             <div class="device-name">启动状态</div>
           </div>
-          <div class="device-li" v-for="(item, index) in delayList" :key="index"
+          <div
-            :class="{ highlight: item.name.includes(currentWeekday) }">
+            class="device-li"
+            v-for="(item, index) in delayList"
+            :key="index"
+            :class="{ highlight: item.name.includes(currentWeekday) }"
+          >
             <div class="device-name">{{ item.name }}</div>
             <div class="device-name">
               <el-form @submit.native.prevent>
                 <el-form-item>
-                  <el-input size="mini" v-model="item.delayOpenHour" @keyup.enter.native="
+                  <el-input
+                    size="mini"
+                    v-model="item.delayOpenHour"
+                    @keyup.enter.native="
                       handleSwitchEnter(item, 'openHour', $event)
-                    " @input="handleSwitchInput(item, 'delayOpenHour', 'hour')"></el-input> </el-form-item></el-form>
+                    "
+                    @input="handleSwitchInput(item, 'delayOpenHour', 'hour')"
+                  ></el-input> </el-form-item
+              ></el-form>
               <div class="slip">:</div>
               <el-form @submit.native.prevent>
                 <el-form-item>
-                  <el-input size="mini" v-model="item.delayOpenMinute" @keyup.enter.native="
+                  <el-input
+                    size="mini"
+                    v-model="item.delayOpenMinute"
+                    @keyup.enter.native="
                       handleSwitchEnter(item, 'openMinute', $event)
-                    " @input="
+                    "
+                    @input="
                       handleSwitchInput(item, 'delayOpenMinute', 'minute')
-                      "></el-input> </el-form-item></el-form>
+                    "
+                  ></el-input> </el-form-item
+              ></el-form>
             </div>
             <div class="device-name">
               <el-form @submit.native.prevent>
                 <el-form-item>
-                  <el-input size="mini" v-model="item.delayCloseHour" @keyup.enter.native="
+                  <el-input
+                    size="mini"
+                    v-model="item.delayCloseHour"
+                    @keyup.enter.native="
                       handleSwitchEnter(item, 'closeHour', $event)
-                    " @input="handleSwitchInput(item, 'delayCloseHour', 'hour')"></el-input></el-form-item></el-form>
+                    "
+                    @input="handleSwitchInput(item, 'delayCloseHour', 'hour')"
+                  ></el-input></el-form-item
+              ></el-form>
               <div class="slip">:</div>
               <el-form @submit.native.prevent>
                 <el-form-item>
-                  <el-input size="mini" v-model="item.delayCloseMinute" @keyup.enter.native="
+                  <el-input
+                    size="mini"
+                    v-model="item.delayCloseMinute"
+                    @keyup.enter.native="
                       handleSwitchEnter(item, 'closeMinute', $event)
-                    " @input="
+                    "
+                    @input="
                       handleSwitchInput(item, 'delayCloseMinute', 'minute')
-                      "></el-input></el-form-item></el-form>
+                    "
+                  ></el-input></el-form-item
+              ></el-form>
             </div>
             <!-- 三个值，偏移值可输入 -->
             <div class="device-name">
               <el-form @submit.native.prevent>
                 <el-form-item>
-                  <el-input size="mini" v-model="item.offsetValue" @keyup.enter.native="
+                  <el-input
+                    size="mini"
+                    v-model="item.offsetValue"
+                    @keyup.enter.native="
                       handleOffsetValueEnter(item, 'offset', $event)
-                    " @input="handleSwitchInput(item, 'offsetValue', 'offset')"></el-input></el-form-item></el-form>
+                    "
+                    @input="handleSwitchInput(item, 'offsetValue', 'offset')"
+                  ></el-input></el-form-item
+              ></el-form>
             </div>
             <div class="device-name">{{ item.curValue }}</div>
             <div class="device-name">{{ item.finalOutWaterTemp }}</div>
             <div class="device-name">
-              <el-switch style="display: block" active-color="#13ce66" inactive-color="#ff4949" active-text="开启"
+              <el-switch
-                inactive-text="停用" v-model="item.delayStatus" @change="handleSwitchStatus(item)">
+                style="display: block"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+                active-text="开启"
+                inactive-text="停用"
+                v-model="item.delayStatus"
+                @change="handleSwitchStatus(item)"
+              >
               </el-switch>
             </div>
           </div>
@@ -342,10 +483,16 @@ export default {
       return `${year}年${month}月${day}日 ${hours}:${minutes}:${seconds} ${weekDay}`;
     },
     finalColdWaterTemp() {
-      const coldWaterValue = this.coldWaterControlObj.curValue === '' ? 0 : parseFloat(this.coldWaterControlObj.curValue);
+      const coldWaterValue =
-      const offsetValue = this.offsetValuerControlObj.curValue === '' ? 0 : parseFloat(this.offsetValuerControlObj.curValue);
+        this.coldWaterControlObj.curValue === ""
+          ? 0
+          : parseFloat(this.coldWaterControlObj.curValue);
+      const offsetValue =
+        this.offsetValuerControlObj.curValue === ""
+          ? 0
+          : parseFloat(this.offsetValuerControlObj.curValue);
       return coldWaterValue + offsetValue;
-    }
+    },
   },
   created() {},
   mounted() {
@@ -725,22 +872,28 @@ export default {
       // 处理多个小数点的情况，只保留第一个小数点
       let dotCount = (filteredInput.match(/\./g) || []).length;
       if (dotCount > 1) {
-        let firstDotIndex = filteredInput.indexOf('.');
+        let firstDotIndex = filteredInput.indexOf(".");
-        filteredInput = filteredInput.substring(0, firstDotIndex + 1) + filteredInput.substring(firstDotIndex + 1).replace(/\./g, "");
+        filteredInput =
+          filteredInput.substring(0, firstDotIndex + 1) +
+          filteredInput.substring(firstDotIndex + 1).replace(/\./g, "");
       }
 
       // 检查输入是否以 0 开头且后面不是小数点，如果是则去掉开头的 0
-      if (filteredInput.startsWith("0") && filteredInput.length > 1 && filteredInput[1] !== '.') {
+      if (
+        filteredInput.startsWith("0") &&
+        filteredInput.length > 1 &&
+        filteredInput[1] !== "."
+      ) {
         filteredInput = filteredInput.replace(/^0+/, "");
       }
 
       // 如果以小数点开头，在前面添加0
-      if (filteredInput.startsWith('.')) {
+      if (filteredInput.startsWith(".")) {
-        filteredInput = '0' + filteredInput;
+        filteredInput = "0" + filteredInput;
       }
 
       // 限制小数点后只能有一位数字
-      let dotIndex = filteredInput.indexOf('.');
+      let dotIndex = filteredInput.indexOf(".");
       if (dotIndex !== -1) {
         filteredInput = filteredInput.slice(0, dotIndex + 2);
       }
@@ -1132,7 +1285,8 @@ export default {
     // 启用状态
     handleSwitchStatus(item) {
       this.$confirm(
-        `确定要切换"${item.name}"的状态为:${item.delayStatus ? "开启" : "停用 吗?"
+        `确定要切换"${item.name}"的状态为:${
+          item.delayStatus ? "开启" : "停用 吗?"
         }`,
         "提示",
         {
@@ -1501,18 +1655,31 @@ export default {
           width: 0.5rem;
           height: 0.5rem;
           transform-style: preserve-3d;
-          transform: translateX(-50%) rotateX(15deg) rotateZ(20deg) rotateY(40deg);
+          transform: translateX(-50%) rotateX(15deg) rotateZ(20deg)
+            rotateY(40deg);
         }
 
-        .leftFan {
+        .rightFan1 {
           z-index: 10;
           position: absolute;
-          top: 2.29rem;
+          top: 2.7rem;
-          left: 0.53rem;
+          left: 4.2rem;
           width: 0.5rem;
           height: 0.5rem;
           transform-style: preserve-3d;
-          transform: translateX(-50%) rotateX(0deg) rotateZ(0deg) rotateY(-0deg);
+          transform: translateX(-50%) rotateX(15deg) rotateZ(20deg)
+            rotateY(40deg);
+        }
+        .rightFan2 {
+         z-index: 10;
+          position: absolute;
+          top: 2.4rem;
+          left: 4.2rem;
+          width: 0.5rem;
+          height: 0.5rem;
+          transform-style: preserve-3d;
+          transform: translateX(-50%) rotateX(15deg) rotateZ(20deg)
+            rotateY(40deg);
         }
 
         .moveClass {
@@ -1598,18 +1765,26 @@ export default {
             margin-bottom: 0.2rem;
             border-left: 0.01rem solid #217df5;
             border-right: 0.01rem solid #217df5;
-            background-image: radial-gradient(circle at left top,
+            background-image: radial-gradient(
+                circle at left top,
                 #217df5 0.01rem,
-                transparent 0.01rem),
+                transparent 0.01rem
-              radial-gradient(circle at right top,
+              ),
+              radial-gradient(
+                circle at right top,
                 #217df5 0.01rem,
-                transparent 0.01rem),
+                transparent 0.01rem
-              radial-gradient(circle at left bottom,
+              ),
+              radial-gradient(
+                circle at left bottom,
                 #217df5 0.01rem,
-                transparent 0.01rem),
+                transparent 0.01rem
-              radial-gradient(circle at right bottom,
+              ),
+              radial-gradient(
+                circle at right bottom,
                 #217df5 0.01rem,
-                transparent 0.01rem);
+                transparent 0.01rem
+              );
             background-repeat: no-repeat;
             background-position: left top, right top, left bottom, right bottom;
           }
@@ -1621,10 +1796,12 @@ export default {
             left: 0;
             right: 0;
             height: 0.01rem;
-            background-image: linear-gradient(to right,
+            background-image: linear-gradient(
+              to right,
               #217df5 0%,
               rgba(41, 128, 185, 0) 50%,
-                #217df5 100%);
+              #217df5 100%
+            );
           }
 
           .detail-data-li::before {
@@ -1661,9 +1838,11 @@ export default {
             height: 0.06rem;
             background-color: #217df5;
             box-shadow: 0 0 0.1rem 0.02rem rgba(33, 125, 245, 0.9);
-            background-image: radial-gradient(circle at 30% 30%,
+            background-image: radial-gradient(
+              circle at 30% 30%,
               rgba(255, 255, 255, 0.8) 0%,
-                rgba(255, 255, 255, 0) 70%);
+              rgba(255, 255, 255, 0) 70%
+            );
             border-radius: 50%;
             z-index: 10;
           }
@@ -1677,9 +1856,11 @@ export default {
             height: 0.06rem;
             background-color: #217df5;
             box-shadow: 0 0 0.1rem 0.02rem rgba(33, 125, 245, 0.9);
-            background-image: radial-gradient(circle at 30% 30%,
+            background-image: radial-gradient(
+              circle at 30% 30%,
               rgba(255, 255, 255, 0.8) 0%,
-                rgba(255, 255, 255, 0) 70%);
+              rgba(255, 255, 255, 0) 70%
+            );
             border-radius: 50%;
             z-index: 10;
           }
@@ -1695,9 +1876,11 @@ export default {
             border-radius: 50%;
             z-index: 10;
             box-shadow: 0 0 0.1rem 0.02rem rgba(33, 125, 245, 0.9);
-            background-image: radial-gradient(circle at 30% 30%,
+            background-image: radial-gradient(
+              circle at 30% 30%,
               rgba(255, 255, 255, 0.8) 0%,
-                rgba(255, 255, 255, 0) 70%);
+              rgba(255, 255, 255, 0) 70%
+            );
           }
 
           .leftDot::after {
@@ -1710,9 +1893,11 @@ export default {
             background-color: #217df5;
             z-index: 10;
             box-shadow: 0 0 0.1rem 0.02rem rgba(33, 125, 245, 0.9);
-            background-image: radial-gradient(circle at 30% 30%,
+            background-image: radial-gradient(
+              circle at 30% 30%,
               rgba(255, 255, 255, 0.8) 0%,
-                rgba(255, 255, 255, 0) 70%);
+              rgba(255, 255, 255, 0) 70%
+            );
             border-radius: 50%;
           }
         }
@@ -1727,7 +1912,6 @@ export default {
         width: 7rem;
 
         .detail-data-bottom {
-
           // padding-left: 0.5rem;
           .detail-data-li {
             // width: 3.2rem;
@@ -1741,7 +1925,6 @@ export default {
         width: 3.5rem;
 
         .detail-data-bottom {
-
           // padding-left: 0.75rem;
           .detail-data-li {
             // width: 3.4rem;
@@ -1819,7 +2002,6 @@ export default {
   padding-right: 0.3rem !important;
 }
 
-
 .goodData >>> .el-input--mini .el-input__inner {
   height: 0.28rem !important;
   line-height: 20.28rem !important;