From 660ea9bf54715b04834481310a73464f8d9b3aa3 Mon Sep 17 00:00:00 2001
From: guoapeng <GuoAnPeng@163.com>
Date: Fri, 11 Jul 2025 10:04:32 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E6=8B=89=E6=9D=86=E7=AE=B1=E9=A6=96?=
 =?UTF-8?q?=E9=A1=B5=E6=A0=B7=E5=BC=8F=E5=AE=9A=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/home/index.vue | 25 ++++++++++++++++++-------
 1 file changed, 18 insertions(+), 7 deletions(-)

diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 6520354..6fe3e68 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -99,8 +99,13 @@ const deviceType = computed(() => {
 <template>
   <div class="home">
     <div v-if="route.path === '/home'" class="home-grid-container">
-      <div class="home-left">
-        <div class="left-box">
+      <div
+        class="home-left"
+        :style="{
+          'grid-template-rows': deviceType === deviceStore.deviceTypeMap.DrawBarDM ? 'repeat(1, 1fr)' : 'repeat(2, 1fr)',
+        }"
+      >
+        <div class="left-box" :class="{ 'left-box-1': [deviceStore.deviceTypeMap.DrawBarDM].includes(deviceType) }">
           <el-card
             v-for="item in homeStore.h2O2SensorData.filter(item => item.type !== 'WirelessExtSensor')"
             :key="item.sensorId"
@@ -141,7 +146,7 @@ const deviceType = computed(() => {
             </div>
           </el-card>
         </div>
-        <div class="left-box">
+        <div v-if="deviceType !== deviceStore.deviceTypeMap.DrawBarDM" class="left-box">
           <el-card
             v-for="item in homeStore.h2O2SensorData.filter(item => item.type === 'WirelessExtSensor')"
             :key="item.sensorId"
@@ -206,6 +211,13 @@ $input-height: 3rem;
   width: 100%;
   height: 100%;
 }
+.home-grid-container .home-left .left-box-1 {
+  flex-direction: column !important;
+  .card {
+    height: calc(50% - 5px) !important;
+    width: 100% !important;
+  }
+}
 
 .home-grid-container {
   height: 100%;
@@ -219,7 +231,7 @@ $input-height: 3rem;
   height: 100%;
   width: 100%;
   display: grid;
-  grid-template-rows: repeat(2, 1fr);
+  //grid-template-rows: repeat(2, 1fr);
   grid-template-columns: repeat(1, 1fr);
   gap: 20px;
   .left-box {
@@ -233,11 +245,10 @@ $input-height: 3rem;
       width: 100% !important;
     }
     .card-two {
-      width: calc((100% / 3)*2 - 10px)  !important;
+      width: calc((100% / 3) * 2 - 10px) !important;
     }
     .card-three {
-
-      width: calc(100% / 3 - 10px)  !important;
+      width: calc(100% / 3 - 10px) !important;
     }
     .card {
       flex: 0 0 auto;