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