فهرست منبع

fix: 环境调节的参数增加

chenzhen2 2 سال پیش
والد
کامیت
4701d1ae00
1فایلهای تغییر یافته به همراه50 افزوده شده و 25 حذف شده
  1. 50 25
      src/views/envmonitor/index.vue

+ 50 - 25
src/views/envmonitor/index.vue

@@ -27,12 +27,15 @@
           <div class="space-temp">
             <img :src="parseImgUrl('ipdImages', 'template-icon.svg')" alt="" />
             <span class="temp-text">温度</span>
-            <span class="temp-num">26<sup>℃</sup></span>
+            <span class="temp-num"
+              >{{ officeData.temperature }}<sup>℃</sup></span
+            >
           </div>
         </div>
         <div class="space-env">
           <div
             class="env-item"
+            :style="[{ background: item.bgColor },{opacity: item.bgColor?0.8:''},{borderRadius:item.bgColor?'25px':''}]"
             :class="index == 1 ? 'env-color' : ''"
             :key="'env' + index"
             v-for="(item, index) in envlist"
@@ -330,6 +333,7 @@ export default defineComponent({
         name: "甲醛",
         num: "",
         level: "",
+        bgColor: "",
         img: "jiaquan.svg",
         funcid: "HCHO",
         code: "jiaquan",
@@ -338,6 +342,7 @@ export default defineComponent({
       {
         id: 0,
         name: "CO₂",
+        bgColor: "",
         num: "",
         level: "",
         img: "co2.svg",
@@ -348,6 +353,7 @@ export default defineComponent({
       {
         id: 1,
         name: "PM2.5",
+        bgColor: "",
         num: "",
         level: "",
         funcid: "PM2d5",
@@ -358,6 +364,7 @@ export default defineComponent({
       {
         id: 3,
         name: "湿度",
+        bgColor: "",
         img: "humidity.svg",
         num: "",
         level: "",
@@ -795,6 +802,26 @@ export default defineComponent({
             proxyData.getSpaceTempTimer();
           });
       },
+      // 设置环境参数的背景颜色
+      setEnvBg(key: any, text: any) {
+        let bgColor: any =`linear-gradient(180deg, rgba(205, 11, 0, 0) 0%, #CD0B00 100%);`;
+        if (key === "humidity") {
+          // 湿度
+          if (text === "干燥" || text === "潮湿") {
+            bgColor = `linear-gradient(180deg, rgba(205, 11, 0, 0) 0%, #CD0B00 100%);`;
+          } else {
+            bgColor = "";
+          }
+        } else if (key === "hcho") {
+          // 甲醛
+          if (text === "超标") {
+            bgColor = `linear-gradient(180deg, rgba(205, 11, 0, 0) 0%, #CD0B00 100%);`;
+          } else {
+            bgColor = "";
+          }
+        }
+        return bgColor;
+      },
       checkLevel(value: string, name: string) {
         let objList = {
           humidity: {
@@ -827,9 +854,11 @@ export default defineComponent({
 
         let level = sortArr.findIndex((item) => item === value);
         let levelTxt = objList[name].text[level];
+        let bgColor: any = proxyData.setEnvBg(name, levelTxt);
         return {
           level,
           levelTxt,
+          bgColor,
         };
       },
       /**
@@ -847,40 +876,36 @@ export default defineComponent({
         for (let i = 0; i < content.length; i++) {
           let item = content[i];
           if (item.co2 || item.co2 == 0) {
-            proxyData.envlist[1].level = proxyData.checkLevel(
-              item.co2,
-              "co2"
-            ).levelTxt;
+            let obj: any = proxyData.checkLevel(item.co2, "co2");
+            proxyData.envlist[1].level = obj.levelTxt;
+            proxyData.envlist[1].bgColor = obj.bgColor;
             proxyData.envlist[1].num = item.co2;
           } else {
             proxyData.envlist[1].level = "";
             proxyData.envlist[1].num = "";
           }
           if (item.pm25 || item.pm25 === 0) {
-            proxyData.envlist[2].level = proxyData.checkLevel(
-              item.pm25,
-              "pm25"
-            ).levelTxt;
+            let obj: any = proxyData.checkLevel(item.pm25, "pm25");
+            proxyData.envlist[2].level = obj.levelTxt;
+            proxyData.envlist[2].bgColor = obj.bgColor;
             proxyData.envlist[2].num = item.pm25;
           } else {
             proxyData.envlist[2].level = "";
             proxyData.envlist[2].num = "";
           }
           if (item.hcho || item.hcho == 0) {
-            proxyData.envlist[0].level = proxyData.checkLevel(
-              item.hcho,
-              "hcho"
-            ).levelTxt;
+            let obj: any = proxyData.checkLevel(item.hcho, "hcho");
+            proxyData.envlist[0].level = obj.levelTxt;
+            proxyData.envlist[0].bgColor = obj.bgColor;
             proxyData.envlist[0].num = item.hcho.toFixed(2);
           } else {
             proxyData.envlist[0].level = "";
             proxyData.envlist[0].num = "";
           }
           if (item.humidity || item.humidity == 0) {
-            proxyData.envlist[3].level = proxyData.checkLevel(
-              item.humidity,
-              "humidity"
-            ).levelTxt;
+            let obj: any = proxyData.checkLevel(item.humidity, "humidity");
+            proxyData.envlist[3].level = obj.levelTxt;
+            proxyData.envlist[3].bgColor = obj.bgColor;
             proxyData.envlist[3].num = item.humidity.toFixed(0);
           } else {
             proxyData.envlist[3].level = "";
@@ -1820,7 +1845,7 @@ export default defineComponent({
           color: #ffffff;
           sup {
             position: absolute;
-            top: -5px;
+            top: 0;
             font-family: "Noto Sans SC";
             font-style: normal;
             font-weight: 500;
@@ -1908,13 +1933,13 @@ export default defineComponent({
         }
       }
       .env-color {
-        background: linear-gradient(
-          180deg,
-          rgba(205, 11, 0, 0) 0%,
-          #cd0b00 100%
-        );
-        opacity: 0.8;
-        border-radius: 25px;
+        // background: linear-gradient(
+        //   180deg,
+        //   rgba(205, 11, 0, 0) 0%,
+        //   #cd0b00 100%
+        // );
+        // opacity: 0.8;
+        // border-radius: 25px;
       }
     }
   }