|
@@ -13,20 +13,23 @@
|
|
<div class="curtain-right">
|
|
<div class="curtain-right">
|
|
<img
|
|
<img
|
|
v-if="
|
|
v-if="
|
|
- curtainData[0].equipmentType == 4 ||
|
|
|
|
- curtainData[0].equipmentType == 5
|
|
|
|
|
|
+ curtainData[0].equipmentType !== 4 &&
|
|
|
|
+ curtainData[0].equipmentType !== 5
|
|
"
|
|
"
|
|
- :src="parseImgUrl('page-officehome', 'curtain_roll.svg')"
|
|
|
|
|
|
+ :src="parseImgUrl('page-officehome', 'curtain_new.svg')"
|
|
alt=""
|
|
alt=""
|
|
/>
|
|
/>
|
|
<img
|
|
<img
|
|
v-else
|
|
v-else
|
|
- :src="parseImgUrl('page-officehome', 'curtain_new.svg')"
|
|
|
|
|
|
+ :src="parseImgUrl('page-officehome', 'curtain_roll.svg')"
|
|
alt=""
|
|
alt=""
|
|
/>
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
- <div class="curtain-box">
|
|
|
|
|
|
+ <div
|
|
|
|
+ class="curtain-box"
|
|
|
|
+ v-if="curtainData.length && curtainData.length > 1"
|
|
|
|
+ >
|
|
<div class="top-nav">
|
|
<div class="top-nav">
|
|
<span
|
|
<span
|
|
:class="type == 'all' ? 'nav-active' : ''"
|
|
:class="type == 'all' ? 'nav-active' : ''"
|
|
@@ -43,15 +46,22 @@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<template v-if="type == 'all'">
|
|
<template v-if="type == 'all'">
|
|
- <div class="line"></div>
|
|
|
|
|
|
+ <div
|
|
|
|
+ class="line"
|
|
|
|
+ v-if="curtainData.length && curtainData.length > 1"
|
|
|
|
+ ></div>
|
|
<div class="top-control">
|
|
<div class="top-control">
|
|
- <div class="control-item" @click="openCurtainOpening(curtainData)">
|
|
|
|
|
|
+ <div
|
|
|
|
+ class="control-item"
|
|
|
|
+ v-if="curtainData[0].isOpenSet"
|
|
|
|
+ @click="openCurtainOpening(curtainData)"
|
|
|
|
+ >
|
|
<img
|
|
<img
|
|
:src="parseImgUrl('page-officehome', 'curtain_opening.svg')"
|
|
:src="parseImgUrl('page-officehome', 'curtain_opening.svg')"
|
|
alt=""
|
|
alt=""
|
|
/>
|
|
/>
|
|
</div>
|
|
</div>
|
|
- <!--左边-->
|
|
|
|
|
|
+ <!--左关-下关-->
|
|
<div
|
|
<div
|
|
class="control-item"
|
|
class="control-item"
|
|
:class="allActive == 1 ? 'control-item-active' : ''"
|
|
:class="allActive == 1 ? 'control-item-active' : ''"
|
|
@@ -60,8 +70,8 @@
|
|
<template v-if="allActive !== 1">
|
|
<template v-if="allActive !== 1">
|
|
<img
|
|
<img
|
|
v-if="
|
|
v-if="
|
|
- curtainData[0].equipmentType == 4 ||
|
|
|
|
- curtainData[0].equipmentType == 5
|
|
|
|
|
|
+ curtainData[0].equipmentType !== 4 &&
|
|
|
|
+ curtainData[0].equipmentType !== 5
|
|
"
|
|
"
|
|
:src="parseImgUrl('page-officehome', 'curtain_left.svg')"
|
|
:src="parseImgUrl('page-officehome', 'curtain_left.svg')"
|
|
alt=""
|
|
alt=""
|
|
@@ -75,29 +85,39 @@
|
|
<span v-else>{{ count }}</span>
|
|
<span v-else>{{ count }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
- <div class="control-item">
|
|
|
|
- <!--暂停-->
|
|
|
|
|
|
+ <!--暂停-->
|
|
|
|
+ <div
|
|
|
|
+ class="control-item"
|
|
|
|
+ @click="openCurtainMain(3)"
|
|
|
|
+ v-if="curtainData[0].stopSet"
|
|
|
|
+ >
|
|
<img
|
|
<img
|
|
:src="parseImgUrl('page-officehome', 'curtain_stop.svg')"
|
|
:src="parseImgUrl('page-officehome', 'curtain_stop.svg')"
|
|
alt=""
|
|
alt=""
|
|
/>
|
|
/>
|
|
</div>
|
|
</div>
|
|
- <!--右边-->
|
|
|
|
- <div class="control-item">
|
|
|
|
- <img
|
|
|
|
- v-if="
|
|
|
|
- curtainData[0].equipmentType == 4 ||
|
|
|
|
- curtainData[0].equipmentType == 5
|
|
|
|
- "
|
|
|
|
- @click="openCurtainMain(1)"
|
|
|
|
- :src="parseImgUrl('page-officehome', 'curtain_right.svg')"
|
|
|
|
- alt=""
|
|
|
|
- />
|
|
|
|
- <img
|
|
|
|
- v-else
|
|
|
|
- :src="parseImgUrl('page-officehome', 'curtain_up.svg')"
|
|
|
|
- alt=""
|
|
|
|
- />
|
|
|
|
|
|
+ <!--右开-->
|
|
|
|
+ <div
|
|
|
|
+ class="control-item"
|
|
|
|
+ :class="allActive == 2 ? 'control-item-active' : ''"
|
|
|
|
+ >
|
|
|
|
+ <template v-if="allActive !== 2">
|
|
|
|
+ <img
|
|
|
|
+ v-if="
|
|
|
|
+ curtainData[0].equipmentType !== 4 &&
|
|
|
|
+ curtainData[0].equipmentType !== 5
|
|
|
|
+ "
|
|
|
|
+ @click="openCurtainMain(2)"
|
|
|
|
+ :src="parseImgUrl('page-officehome', 'curtain_right.svg')"
|
|
|
|
+ alt=""
|
|
|
|
+ />
|
|
|
|
+ <img
|
|
|
|
+ v-else
|
|
|
|
+ :src="parseImgUrl('page-officehome', 'curtain_up.svg')"
|
|
|
|
+ alt=""
|
|
|
|
+ />
|
|
|
|
+ </template>
|
|
|
|
+ <span v-else>{{ count }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
@@ -109,10 +129,16 @@
|
|
<span>开度90%</span>
|
|
<span>开度90%</span>
|
|
</div>
|
|
</div>
|
|
<div class="curtain-control top-control">
|
|
<div class="curtain-control top-control">
|
|
|
|
+ <div class="control-item" v-if="item.isOpenSet">
|
|
|
|
+ <img
|
|
|
|
+ :src="parseImgUrl('page-officehome', 'curtain_opening.svg')"
|
|
|
|
+ alt=""
|
|
|
|
+ />
|
|
|
|
+ </div>
|
|
<!--左边-->
|
|
<!--左边-->
|
|
<div class="control-item">
|
|
<div class="control-item">
|
|
<img
|
|
<img
|
|
- v-if="item.equipmentType == 4 || item.equipmentType == 5"
|
|
|
|
|
|
+ v-if="item.equipmentType !== 4 && item.equipmentType !== 5"
|
|
:src="parseImgUrl('page-officehome', 'curtain_left.svg')"
|
|
:src="parseImgUrl('page-officehome', 'curtain_left.svg')"
|
|
alt=""
|
|
alt=""
|
|
/>
|
|
/>
|
|
@@ -124,7 +150,7 @@
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!--暂停-->
|
|
<!--暂停-->
|
|
- <div class="control-item">
|
|
|
|
|
|
+ <div class="control-item" v-if="item.stopSet">
|
|
<img
|
|
<img
|
|
:src="parseImgUrl('page-officehome', 'curtain_stop.svg')"
|
|
:src="parseImgUrl('page-officehome', 'curtain_stop.svg')"
|
|
alt=""
|
|
alt=""
|
|
@@ -135,7 +161,7 @@
|
|
<!--右边-->
|
|
<!--右边-->
|
|
<div class="control-item">
|
|
<div class="control-item">
|
|
<img
|
|
<img
|
|
- v-if="item.equipmentType == 4 || item.equipmentType == 5"
|
|
|
|
|
|
+ v-if="item.equipmentType !== 4 && item.equipmentType !== 5"
|
|
:src="parseImgUrl('page-officehome', 'curtain_right.svg')"
|
|
:src="parseImgUrl('page-officehome', 'curtain_right.svg')"
|
|
alt=""
|
|
alt=""
|
|
/>
|
|
/>
|
|
@@ -160,7 +186,11 @@ import {
|
|
toRefs,
|
|
toRefs,
|
|
watch,
|
|
watch,
|
|
} from "vue";
|
|
} from "vue";
|
|
-import { getObjectDataEqpGroupHttp, setEquipeHttp } from "@/apis/envmonitor";
|
|
|
|
|
|
+import {
|
|
|
|
+ getObjectDataEqpGroupHttp,
|
|
|
|
+ setEquipeHttp,
|
|
|
|
+ setSpaceCondtioners,
|
|
|
|
+} from "@/apis/envmonitor";
|
|
import { parseImgUrl } from "@/utils";
|
|
import { parseImgUrl } from "@/utils";
|
|
import { Toast } from "vant";
|
|
import { Toast } from "vant";
|
|
|
|
|
|
@@ -225,19 +255,6 @@ export default defineComponent({
|
|
getObjectDataEqpGroupHttp(params).then((res) => {
|
|
getObjectDataEqpGroupHttp(params).then((res) => {
|
|
const resData: any = res;
|
|
const resData: any = res;
|
|
proxyData.curtainData = resData.count ? resData.content : [];
|
|
proxyData.curtainData = resData.count ? resData.content : [];
|
|
- for (let i = 0; i < proxyData.curtainData.length; i++) {
|
|
|
|
- let item = proxyData.curtainData[i];
|
|
|
|
- item.childDownFlag = false;
|
|
|
|
- item.childUpFlag = false;
|
|
|
|
- item.childCount = 2;
|
|
|
|
- item.childCountText = "";
|
|
|
|
- curtainData[0].isOpenSet = 1;
|
|
|
|
- curtainData[0].isStop = 1;
|
|
|
|
- curtainData[0].openValue = 20;
|
|
|
|
- curtainData[1].isOpenSet = 0;
|
|
|
|
- curtainData[0].equipmentType = 1;
|
|
|
|
- curtainData[1].equipmentType = 5;
|
|
|
|
- }
|
|
|
|
});
|
|
});
|
|
},
|
|
},
|
|
checkCount() {
|
|
checkCount() {
|
|
@@ -261,8 +278,40 @@ export default defineComponent({
|
|
},
|
|
},
|
|
// 调节总开关
|
|
// 调节总开关
|
|
openCurtainMain(type: any) {
|
|
openCurtainMain(type: any) {
|
|
|
|
+ // type=1(关) type=2(开) type=3(暂停)
|
|
|
|
+ if (proxyData.allActive == type && proxyData.count !== 0) {
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
proxyData.allActive = type;
|
|
proxyData.allActive = type;
|
|
|
|
+ proxyData.count = 2;
|
|
proxyData.countInterval();
|
|
proxyData.countInterval();
|
|
|
|
+ proxyData.formateCurtainData(type);
|
|
|
|
+ },
|
|
|
|
+ // 处理窗帘数据
|
|
|
|
+ formateCurtainData(type: any) {
|
|
|
|
+ let data: any = [];
|
|
|
|
+ let value: any = 0;
|
|
|
|
+ if (type == 1) {
|
|
|
|
+ value = 0;
|
|
|
|
+ } else if (type == 2) {
|
|
|
|
+ value = 1;
|
|
|
|
+ } else {
|
|
|
|
+ value = 2;
|
|
|
|
+ }
|
|
|
|
+ proxyData.curtainData.map((item: any) => {
|
|
|
|
+ let obj: any = {
|
|
|
|
+ id: item.id,
|
|
|
|
+ code: "EquipSwitchSet",
|
|
|
|
+ value: value,
|
|
|
|
+ };
|
|
|
|
+ data.push(obj);
|
|
|
|
+ });
|
|
|
|
+ proxyData.changeCurtainStatus(data);
|
|
|
|
+ },
|
|
|
|
+ // 修改窗帘的状态
|
|
|
|
+ changeCurtainStatus(data: any) {
|
|
|
|
+ console.log("窗帘==", data);
|
|
|
|
+ setSpaceCondtioners(data).then((res) => {});
|
|
},
|
|
},
|
|
});
|
|
});
|
|
|
|
|
|
@@ -274,7 +323,7 @@ export default defineComponent({
|
|
}
|
|
}
|
|
});
|
|
});
|
|
onMounted(() => {
|
|
onMounted(() => {
|
|
- // 获取空调信息
|
|
|
|
|
|
+ // 获取窗帘信息
|
|
proxyData.getEqpGroup();
|
|
proxyData.getEqpGroup();
|
|
});
|
|
});
|
|
return {
|
|
return {
|
|
@@ -362,38 +411,6 @@ export default defineComponent({
|
|
border-top: 1px solid #e8ecf0;
|
|
border-top: 1px solid #e8ecf0;
|
|
}
|
|
}
|
|
|
|
|
|
-.curtain-child {
|
|
|
|
- .child-item {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- padding-top: 16px;
|
|
|
|
- padding-bottom: 16px;
|
|
|
|
- padding-left: 20px;
|
|
|
|
- padding-right: 20px;
|
|
|
|
- border-top: 1px solid #e8ecf0;
|
|
|
|
- .curtain-name {
|
|
|
|
- .name {
|
|
|
|
- font-family: "PingFang SC";
|
|
|
|
- font-style: normal;
|
|
|
|
- font-weight: 600;
|
|
|
|
- font-size: 16px;
|
|
|
|
- line-height: 22px;
|
|
|
|
- color: #4d5262;
|
|
|
|
- }
|
|
|
|
- span {
|
|
|
|
- display: block;
|
|
|
|
- padding-top: 4px;
|
|
|
|
- font-family: "PingFang SC";
|
|
|
|
- font-style: normal;
|
|
|
|
- font-weight: 400;
|
|
|
|
- font-size: 14px;
|
|
|
|
- line-height: 20px;
|
|
|
|
- color: #c4c4c4;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
.top-control {
|
|
.top-control {
|
|
text-align: right;
|
|
text-align: right;
|
|
padding: 16px 20px;
|
|
padding: 16px 20px;
|
|
@@ -406,6 +423,9 @@ export default defineComponent({
|
|
height: 40px;
|
|
height: 40px;
|
|
background: #f1f4f6;
|
|
background: #f1f4f6;
|
|
border-radius: 50%;
|
|
border-radius: 50%;
|
|
|
|
+ &:active {
|
|
|
|
+ background: rgba(206, 159, 39, 0.4);
|
|
|
|
+ }
|
|
img {
|
|
img {
|
|
position: absolute;
|
|
position: absolute;
|
|
width: 16px;
|
|
width: 16px;
|
|
@@ -430,4 +450,39 @@ export default defineComponent({
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+.curtain-child {
|
|
|
|
+ .child-item {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ padding-top: 16px;
|
|
|
|
+ padding-bottom: 16px;
|
|
|
|
+ padding-left: 20px;
|
|
|
|
+ padding-right: 20px;
|
|
|
|
+ border-top: 1px solid #e8ecf0;
|
|
|
|
+ .curtain-name {
|
|
|
|
+ .name {
|
|
|
|
+ font-family: "PingFang SC";
|
|
|
|
+ font-style: normal;
|
|
|
|
+ font-weight: 600;
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ line-height: 22px;
|
|
|
|
+ color: #4d5262;
|
|
|
|
+ }
|
|
|
|
+ span {
|
|
|
|
+ display: block;
|
|
|
|
+ padding-top: 4px;
|
|
|
|
+ font-family: "PingFang SC";
|
|
|
|
+ font-style: normal;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ line-height: 20px;
|
|
|
|
+ color: #c4c4c4;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .top-control {
|
|
|
|
+ padding: 0;
|
|
|
|
+ }
|
|
|
|
+}
|
|
</style>
|
|
</style>
|