新风换气、空气盒子

src/router.ts

@@ -114,6 +114,18 @@ const projectRoutes = [
     path: "/messageDetail",
     component: () => import("@/view/message/messageDetail.vue")
   },
+  {
+    //空气盒子页面
+    name: "airBox",
+    path: "/airBox",
+    component: () => import("@/view/device-detail/ait-box.vue")
+  },
+  {
+    //新风换气机展示页面
+    name: "freshAir",
+    path: "/freshAir",
+    component: () => import("@/view/device-detail/fresh-air.vue")
+  },
   // 非哈希路由暂不启用
   {
     name: "notFound",

src/styles/framework/base/flexbox.scss

@@ -271,6 +271,8 @@ Flex, Grow, & Shrink 待确定
   flex-direction: column;
   position: relative;
   background-image: url("@/assets/imgs/show/bg_timing.png");
+  background-repeat: no-repeat;
+  background-size: contain;
   height: 100vh;
   width: 100vw;
   //智慧右侧图片
@@ -415,7 +417,9 @@ Flex, Grow, & Shrink 待确定
     display: flex;
     align-items: center;
   }
-
+  .show-img {
+    width: 100vw;
+  }
   .margin-left-2 {
     margin-left: 2px;
   }

src/view/data-center/data-center-show.vue

@@ -48,8 +48,4 @@ onActivated(() => {
   align-items: center;
   display: flex;
 }
-
-.show-img {
-  width: 100vw;
-}
 </style>

src/view/device-detail/ait-box.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="air-bg">
+    <div class="zhp-title">
+      <img class="leftImg" src="@/assets/imgs/show/back.png" @click="router.back()">
+      <div class="zhp-title-text">空气盒子</div>
+    </div>
+    <img class="show-img" src="@/assets/imgs/show/icon_kqhz.png">
+  </div>
+</template>
+
+<script lang="ts" setup>
+
+import router from "@/router";
+</script>
+
+<style lang="scss" scoped>
+//智慧屏背景
+.air-bg {
+  flex-direction: column;
+  position: relative;
+  background-image: url("@/assets/imgs/show/bg_kqhz.png");
+  background-repeat: no-repeat;
+  background-size: contain;
+  height: 100vh;
+  width: 100vw;
+  //智慧屏返回键
+  .leftImg {
+    width: 48px;
+    height: 48px;
+    position: absolute;
+    left: 24px;
+  }
+  .show-img {
+    width: 100vw;
+  }
+}
+</style>

src/view/device-detail/fresh-air.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="fresh-air-bg">
+    <div class="zhp-title">
+      <img class="leftImg" src="@/assets/imgs/show/back.png" @click="router.back()">
+      <div class="zhp-title-text">新风换气机</div>
+    </div>
+    <img class="show-img" src="@/assets/imgs/show/icon_xfhqj.png">
+  </div>
+</template>
+
+<script lang="ts" setup>
+
+import router from "@/router";
+</script>
+
+<style lang="scss" scoped>
+//智慧屏背景
+.fresh-air-bg {
+  flex-direction: column;
+  position: relative;
+  background-image: url("@/assets/imgs/show/bg_xfhqj.png");
+  background-repeat: no-repeat;
+  background-size: contain;
+  height: 100vh;
+  width: 100vw;
+  //智慧屏返回键
+  .leftImg {
+    width: 48px;
+    height: 48px;
+    position: absolute;
+    left: 24px;
+  }
+  .show-img {
+    width: 100vw;
+  }
+}
+</style>

src/view/tabs/device-control.vue

@@ -147,16 +147,26 @@ const allShutDown = () => {
  * @param item 点击的设备信息
  */
 const goToDetail = (item: any) => {
-    router.push({
+  switch (item.deviceType) {
+    case "02"://空气盒子
+      router.push("/airBox");
+      break;
+    case "4D"://新风换气
+      router.push("/freshAir");
+      break;
+    default:
+      router.push({
         path: '/device-detail',
         query: {
-            setMode: item.setMode, // 模式 0：常规 1：智慧
-            name: item.name,
-            openFlg: item.openFlg,
-            deviceType: item.deviceType,
-            smartMode: item.smartMode,
+          setMode: item.setMode, // 模式 0：常规 1：智慧
+          name: item.name,
+          openFlg: item.openFlg,
+          deviceType: item.deviceType,
+          smartMode: item.smartMode,
         }
-    })
+      })
+      break;
+  }
 }
 </script>
 
@@ -292,7 +302,7 @@ const goToDetail = (item: any) => {
                 .close-btn {
                     width: 60px;
                     height: 60px;
-                    
+
                     img {
                         width: 100%;
                     }
@@ -306,7 +316,7 @@ const goToDetail = (item: any) => {
                 align-items: flex-end;
             }
         }
-        
+
         .air-quality-you {
             background: url('@/assets/imgs/device-control/air_quality_you@2x.png') no-repeat;
             background-size: cover;
@@ -323,4 +333,4 @@ const goToDetail = (item: any) => {
         }
     }
 }
-</style>
+</style>