Browse Source

fix:空调模块修改

chenzhen2 1 năm trước cách đây
mục cha
commit
4c8820326b

Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 3 - 0
public/images/ipdImages/cold-small.svg


+ 11 - 0
public/images/ipdImages/hot-small.svg

@@ -0,0 +1,11 @@
+<svg width="17" height="17" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+	<path d="M8.26257 1.52036C8.26257 1.27693 8.45991 1.07959 8.70334 1.07959C8.94678 1.07959 9.14412 1.27693 9.14412 1.52036V2.63882C9.14412 2.88225 8.94678 3.07959 8.70334 3.07959C8.45991 3.07959 8.26257 2.88225 8.26257 2.63882V1.52036Z" fill="#C4C9CF" />
+	<path fill-rule="evenodd" clip-rule="evenodd" d="M4.19311 8.31428C4.19311 5.77202 6.25403 3.7111 8.79629 3.7111C11.3386 3.7111 13.3995 5.77202 13.3995 8.31428C13.3995 10.8566 11.3386 12.9175 8.79629 12.9175C6.25403 12.9175 4.19311 10.8566 4.19311 8.31428ZM8.79629 4.64443C6.76949 4.64443 5.12645 6.28748 5.12645 8.31428C5.12645 10.3411 6.76949 11.9841 8.79629 11.9841C10.8231 11.9841 12.4661 10.3411 12.4661 8.31428C12.4661 6.28748 10.8231 4.64443 8.79629 4.64443Z" fill="#C4C9CF" />
+	<path d="M8.70334 13.5225C8.45991 13.5225 8.26257 13.7198 8.26257 13.9632V15.0817C8.26257 15.3251 8.45991 15.5225 8.70334 15.5225C8.94678 15.5225 9.14412 15.3251 9.14412 15.0817V13.9632C9.14412 13.7198 8.94678 13.5225 8.70334 13.5225Z" fill="#C4C9CF" />
+	<path d="M13.1798 3.06595C13.3608 2.90314 13.6395 2.91787 13.8023 3.09885C13.9651 3.27982 13.9504 3.55852 13.7694 3.72132L12.9379 4.46935C12.7569 4.63216 12.4782 4.61743 12.3154 4.43645C12.1526 4.25547 12.1673 3.97678 12.3483 3.81397L13.1798 3.06595Z" fill="#C4C9CF" />
+	<path d="M3.78928 3.09901C3.95208 2.91803 4.23078 2.9033 4.41175 3.06611L5.24326 3.81414C5.42424 3.97694 5.43897 4.25564 5.27616 4.43661C5.11335 4.61759 4.83466 4.63232 4.65368 4.46951L3.82218 3.72149C3.6412 3.55868 3.62647 3.27999 3.78928 3.09901Z" fill="#C4C9CF" />
+	<path d="M13.1798 13.3966C13.3608 13.5594 13.6395 13.5447 13.8023 13.3637C13.9651 13.1827 13.9504 12.904 13.7694 12.7412L12.9379 11.9932C12.7569 11.8304 12.4782 11.8451 12.3154 12.0261C12.1526 12.2071 12.1673 12.4858 12.3483 12.6486L13.1798 13.3966Z" fill="#C4C9CF" />
+	<path d="M4.95458 11.8886C4.79177 11.7076 4.51308 11.6929 4.3321 11.8557L3.50059 12.6037C3.31962 12.7665 3.30489 13.0452 3.4677 13.2262C3.6305 13.4071 3.90919 13.4219 4.09017 13.2591L4.92168 12.511C5.10266 12.3482 5.11738 12.0695 4.95458 11.8886Z" fill="#C4C9CF" />
+	<path d="M15.5052 7.78044C15.7486 7.78044 15.946 7.97778 15.946 8.22121C15.946 8.46464 15.7486 8.66198 15.5052 8.66198L14.3867 8.66198C14.1433 8.66198 13.946 8.46464 13.946 8.22121C13.946 7.97778 14.1433 7.78044 14.3867 7.78044H15.5052Z" fill="#C4C9CF" />
+	<path d="M3.52344 8.22121C3.52344 7.97778 3.3261 7.78044 3.08267 7.78044H1.96421C1.72078 7.78044 1.52344 7.97778 1.52344 8.22121C1.52344 8.46464 1.72078 8.66198 1.96421 8.66198L3.08267 8.66198C3.3261 8.66198 3.52344 8.46464 3.52344 8.22121Z" fill="#C4C9CF" />
+</svg>

Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 5 - 0
public/images/ipdImages/ventilate-small.svg


Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 1428 - 0
src/views/envmonitor/components/Air/ChildAirControl.vue


+ 85 - 196
src/views/envmonitor/components/Air/manualIndex.vue

@@ -173,7 +173,13 @@
         v-for="(childItem, index) in equipList"
         v-for="(childItem, index) in equipList"
       >
       >
         <div class="open-title">
         <div class="open-title">
-          <span>{{ childItem.localName }}</span>
+          <div class="open-temp-box">
+            <span>{{ childItem.tempSet }}<sup>°C</sup></span>
+            <div class="text-box">
+              <img :src="parseImgUrl('ipdImages', 'hot-small.svg')" alt="" />
+              <span>制热模式</span>
+            </div>
+          </div>
           <Switch
           <Switch
             @click="changeChildItemAir('switch', childItem, 'switch')"
             @click="changeChildItemAir('switch', childItem, 'switch')"
             :loading="
             :loading="
@@ -192,126 +198,19 @@
             size="14px"
             size="14px"
           />
           />
         </div>
         </div>
-        <div
-          class="adjust-box"
-          :style="{
-            opacity: childItem.isOpen ? '' : '0.3',
-          }"
-        >
-          <div class="adjust-item">
-            <van-icon
-              name="arrow-up"
-              :class="
-                childItem.tempSet >= airData.maxTempSet ? 'disable-color' : ''
-              "
-              @click="changeChildItemAir('temp', childItem, 'up')"
-              class="adjust-icon"
-            />
-            <div class="adjust-text">
-              <div
-                class="value-wrap"
-                :style="{
-                  transform: valueHeight
-                    ? 'translateY(' + -childItem.sel * valueHeight + 'px)'
-                    : 'translateY(0px)',
-                }"
-              >
-                <div
-                  class="value"
-                  :key="index + 'ct'"
-                  v-for="(titem, index) in childItem.tempArr"
-                >
-                  {{ titem }}
-                </div>
-              </div>
-            </div>
-            <van-icon
-              name="arrow-down"
-              :class="
-                childItem.tempSet <= airData.minTempSet ? 'disable-color' : ''
-              "
-              @click="changeChildItemAir('temp', childItem, 'down')"
-              class="adjust-icon"
-            />
-            <span class="adjust-title">温度</span>
-          </div>
-          <div class="adjust-item">
-            <van-icon
-              name="arrow-up"
-              :class="childItem.isAutoGear ? 'disable-color' : ''"
-              @click="changeChildItemAir('gear', childItem, 'up')"
-              class="adjust-icon"
-            />
-            <div class="adjust-text">
-              <div
-                class="value-wrap"
-                :style="{
-                  transform: valueHeight
-                    ? 'translateY(' + -childItem.gIndex * valueHeight + 'px)'
-                    : 'translateY(0px)',
-                }"
-              >
-                <div
-                  class="value"
-                  v-for="(gItem, index) in childItem.gearArr"
-                  :key="index + 'g'"
-                >
-                  {{ gItem }}
-                </div>
-              </div>
-            </div>
-            <van-icon
-              name="arrow-down"
-              :class="
-                !childItem.isAutoGear && childItem.gear <= 1
-                  ? 'disable-color'
-                  : ''
-              "
-              @click="changeChildItemAir('gear', childItem, 'down')"
-              class="adjust-icon"
-            />
-            <span class="adjust-title">档位</span>
-          </div>
-          <div class="adjust-item">
-            <van-icon
-              name="arrow-up"
-              :class="childItem.workMode >= 3 ? 'disable-color' : ''"
-              @click="changeChildItemAir('model', childItem, 'up')"
-              class="adjust-icon"
-            />
-            <div class="adjust-text">
-              <div
-                class="value-wrap"
-                :style="{
-                  transform: valueHeight
-                    ? 'translateY(' + -childItem.mIndex * valueHeight + 'px)'
-                    : 'translateY(0px)',
-                }"
-              >
-                <div
-                  class="value"
-                  v-for="(mItem, index) in childItem.modelArr"
-                  :key="index + 'm'"
-                >
-                  {{ mItem }}
-                </div>
-              </div>
-            </div>
-            <van-icon
-              name="arrow-down"
-              :class="childItem.workMode <= 1 ? 'disable-color' : ''"
-              @click="changeChildItemAir('model', childItem, 'down')"
-              class="adjust-icon"
-            />
-            <span class="adjust-title">模式</span>
+
+        <div class="control-bottom">
+          <div class="control-title">
+            {{ childItem.localName }}
           </div>
           </div>
+          <img
+            :style="{ opacity: childItem.isOpen ? '1' : '0.3' }"
+            :src="lightColorImg"
+            alt=""
+          />
         </div>
         </div>
       </div>
       </div>
     </div>
     </div>
-    <!-- v-if="cotrolLoading" -->
-    <!-- <div class="loading-box" v-if="cotrolLoading">
-      <van-loading style="padding-top: 20px" />
-    </div> -->
   </div>
   </div>
 </template>
 </template>
   
   
@@ -406,6 +305,7 @@ export default defineComponent({
     let spaceId: any = "";
     let spaceId: any = "";
     const proxyData: any = reactive({
     const proxyData: any = reactive({
       seviceEquipmentList: props.seviceEquipmentList,
       seviceEquipmentList: props.seviceEquipmentList,
+      lightColorImg: parseImgUrl("page-officehome", "lightColorControl.svg"),
       navType: "all",
       navType: "all",
       valueDom: valueDom,
       valueDom: valueDom,
       spaceId: props.spaceId,
       spaceId: props.spaceId,
@@ -1235,9 +1135,7 @@ export default defineComponent({
     height: 0px;
     height: 0px;
     border-top: 1px solid rgba(232, 236, 240, 1);
     border-top: 1px solid rgba(232, 236, 240, 1);
   }
   }
-  .air-switch-box {
-    display: flex;
-  }
+
   .active-color {
   .active-color {
     background: $elActiveColor !important;
     background: $elActiveColor !important;
     span {
     span {
@@ -1246,92 +1144,92 @@ export default defineComponent({
   }
   }
   .air-child {
   .air-child {
     width: 100%;
     width: 100%;
-    // padding: 20px;
-    padding-left: 10px;
-    padding-right: 10px;
-    // padding-top: 10px;
+    padding-left: 12px;
+    padding-right: 12px;
+    padding-top: 16px;
+    padding-bottom: 4px;
     .child-control-box {
     .child-control-box {
       display: inline-block;
       display: inline-block;
-      width: 50%;
+      width: 49%;
+      margin-right: 2%;
+      margin-bottom: 12px;
+      padding: 14px 16px;
       justify-content: space-between;
       justify-content: space-between;
-      padding: 10px 10px 10px 10px;
-      // margin-top: 10px;
-      // padding-right: 10px;
-      border-top: 1px solid rgba(196, 196, 196, 0.4);
-      &:nth-child(2n + 1) {
-        border-right: 1px solid rgba(196, 196, 196, 0.4);
+      border-radius: 16px;
+      background: rgba(247, 249, 250, 1);
+      &:nth-child(2n) {
+        margin-right: 0;
       }
       }
       .open-title {
       .open-title {
         width: 100%;
         width: 100%;
         font-size: 14px;
         font-size: 14px;
-        height: 25px;
-        line-height: 25px;
         display: flex;
         display: flex;
         justify-content: space-between;
         justify-content: space-between;
-        margin-bottom: 10px;
-        span {
-          font-size: 16px;
+        margin-bottom: 26px;
+        .open-temp-box {
+          position: relative;
           display: inline-block;
           display: inline-block;
           width: calc(100% - 50px);
           width: calc(100% - 50px);
           overflow: hidden;
           overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
+          span {
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            font-family: "Persagy";
+            font-size: 22px;
+            font-weight: 400;
+            line-height: 22px;
+            letter-spacing: 0;
+          }
+          sup {
+            position: absolute;
+            top: -3px;
+            font-family: Mulish;
+            font-size: 12px;
+            font-weight: 400;
+            text-align: left;
+            color: rgba(196, 196, 196, 1);
+          }
         }
         }
+        .text-box {
+          margin-left: -2px;
+          padding-top: 4px;
+          img {
+            display: inline-block;
+            vertical-align: middle;
+            width: 16px;
+            height: 16px;
+            margin-right: 2px;
+          }
+          span {
+            display: inline-block;
+            vertical-align: middle;
+            font-family: "PingFang SC";
+            font-size: 12px;
+            font-weight: 400;
+            color: rgba(196, 201, 207, 1);
+          }
+        }
+
         .child-switch {
         .child-switch {
           // height: 20px;
           // height: 20px;
           // width: 50px;
           // width: 50px;
         }
         }
       }
       }
-      .adjust-box {
-        box-sizing: border-box;
-        // padding-right: 10px;
-        padding-top: 10px;
+
+      .control-bottom {
         display: flex;
         display: flex;
         justify-content: space-between;
         justify-content: space-between;
-        font-size: 19px;
-        .adjust-item {
-          // flex: 1;
-          // width: 40px;
-          display: flex;
-          flex-direction: column;
-          justify-content: space-between;
-          text-align: center;
-          &:nth-child(2) {
-            // width: 60px;
-            flex: 1;
-          }
-          .adjust-icon {
-            display: inline-block;
-            flex: 1;
-          }
-          .adjust-text {
-            // flex: 1;
-            // padding: 20px 0;
-            height: 50px;
-            overflow: hidden;
-            color: #1f2429;
-            .value-wrap {
-              transition: transform 1s;
-              .value {
-                width: 100%;
-                height: 50px;
-                display: flex;
-                align-items: center;
-                font-weight: 400;
-                justify-content: center;
-                text-align: center;
-                font-size: 14px;
-              }
-            }
-          }
-          .adjust-title {
-            padding-top: 10px;
-            font-size: 14px;
-            font-weight: 400;
-          }
-          .disable-color {
-            color: $elDisabledColor;
-          }
+        .control-title {
+          font-weight: 500;
+          font-family: "PingFang SC";
+          font-size: 16px;
+          line-height: 20px;
+          color: #4d5262;
+        }
+        img {
+          width: 20px;
+          height: 20px;
+          cursor: pointer;
         }
         }
       }
       }
     }
     }
@@ -1411,16 +1309,7 @@ export default defineComponent({
         }
         }
       }
       }
     }
     }
-    .temp-text {
-      height: 20px;
-      line-height: 20px;
-      font-family: "Montserrat";
-      font-style: normal;
-      font-weight: 500;
-      font-size: 11px;
-      color: #c4c4c4;
-      padding: 0 5px;
-    }
+
     .temp-slider {
     .temp-slider {
       position: relative;
       position: relative;
       display: flex;
       display: flex;

+ 21 - 0
src/views/envmonitor/index.vue

@@ -380,6 +380,23 @@
         ></curtain-opening>
         ></curtain-opening>
       </div>
       </div>
     </van-popup>
     </van-popup>
+
+    <!--空调子设备控制功能-->
+    <van-popup
+      v-model:show="isCurtainOpening"
+      position="right"
+      :close-on-click-overlay="true"
+      @click-overlay="closeCurtainOpening"
+      class="popup-content-small"
+      teleport="#app"
+    >
+      <div v-if="isCurtainOpening">
+        <curtain-opening
+          v-if="isCurtainOpening"
+          :curtainData="curtainData"
+        ></curtain-opening>
+      </div>
+    </van-popup>
   </div>
   </div>
 </template>
 </template>
 
 
@@ -417,6 +434,7 @@ import Detail from "@/views/envmonitor/detail.vue";
 import ComMap from "@/views/envmonitor/components/Map/index.vue";
 import ComMap from "@/views/envmonitor/components/Map/index.vue";
 import LightTemp from "@/views/envmonitor/components/Light/LightTemp.vue";
 import LightTemp from "@/views/envmonitor/components/Light/LightTemp.vue";
 import ChildTempSet from "@/views/envmonitor/components/FloorHeating/ChildTempSet.vue";
 import ChildTempSet from "@/views/envmonitor/components/FloorHeating/ChildTempSet.vue";
+import ChildAirControl from "@/views/envmonitor/components/Air/ChildAirControl.vue";
 import { Icon, Popup, Dialog, Toast } from "vant";
 import { Icon, Popup, Dialog, Toast } from "vant";
 import { useRouter, useRoute } from "vue-router";
 import { useRouter, useRoute } from "vue-router";
 import {
 import {
@@ -468,6 +486,7 @@ export default defineComponent({
     FloorHeating,
     FloorHeating,
     ManualIndex,
     ManualIndex,
     ManualOvertime,
     ManualOvertime,
+    ChildAirControl,
     Light,
     Light,
     Curtain,
     Curtain,
     TimeBox,
     TimeBox,
@@ -902,6 +921,8 @@ export default defineComponent({
         proxyData.curtainData = curtainData;
         proxyData.curtainData = curtainData;
         proxyData.isCurtainOpening = true;
         proxyData.isCurtainOpening = true;
       },
       },
+      // 展开空调弹窗
+      isChildAirControl:false,
       closeCurtainOpening() {
       closeCurtainOpening() {
         console.log("被点击了");
         console.log("被点击了");
         proxyData.curtainRef.updateGroupPeing();
         proxyData.curtainRef.updateGroupPeing();