From 1816d21e4085e12ac37455324fd84134876a0f28 Mon Sep 17 00:00:00 2001
From: tianyongbao <tianyongbao@haier.com>
Date: Tue, 20 Jan 2026 00:02:58 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E6=8E=A7=E5=88=B6=E5=99=A8=E5=BC=80?=
 =?UTF-8?q?=E5=85=B3=E7=95=8C=E9=9D=A2=E4=BC=98=E5=8C=96=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/other/index.vue | 168 +++++++++++++++++++++------------
 1 file changed, 108 insertions(+), 60 deletions(-)

diff --git a/src/components/other/index.vue b/src/components/other/index.vue
index de410e8..2be2a77 100644
--- a/src/components/other/index.vue
+++ b/src/components/other/index.vue
@@ -439,36 +439,48 @@
             <nut-col :span="24">
               <view class="controller-header">
                 <view class="controller-name">
-                  {{ item.deviceName }}
+                  <text class="controller-title">{{ item.deviceName }}</text>
                   <view class="error-tag" v-if="item.errorMessage">{{ item.errorMessage }}</view>
                 </view>
-                <!-- <view class="controller-actions">
-                  <view @click.stop="setParamsCtr(item.id)" class="param-setting-link">参数设置</view>
-                </view> -->
               </view>
             </nut-col>
             
             <!-- 开关列表 -->
             <nut-col :span="24">
-              <view 
-                class="switch-item"
-                v-for="switchItem in item.listSwitch" 
-                :key="switchItem.id"
-              >
-                <view class="switch-left">
-                  <img :src="getSwitchIcon(switchItem)" class="switch-icon" />
-                  <text class="switch-name">{{ switchItem.switchName }}</text>
-                </view>
-                <view class="switch-right">
-            
-                  <view @click.stop="setSwitchNameDialog(switchItem.id, switchItem.switchName)" class="switch-setting-link">重命名</view>
-                  <view @click.stop="toTiming(switchItem.id)" class="switch-setting-link">定时</view>
-                  <view @click.stop="setSwitch(switchItem.id, switchItem.switchName)" class="switch-setting-link">设置</view>
-                        <nut-switch
-                    :model-value="switchItem.isOpen === 1"
-                    active-color="#04D98A"
-                    @change="(value, event) => setSwitchOpen({ value, event }, switchItem)"
-                  />
+              <view class="switch-list">
+                <view 
+                  class="switch-item"
+                  v-for="switchItem in item.listSwitch" 
+                  :key="switchItem.id"
+                >
+                  <view class="switch-left">
+                    <view class="switch-icon-wrapper">
+                      <img :src="getSwitchIcon(switchItem)" class="switch-icon" />
+                    </view>
+                    <view class="switch-info">
+                      <text class="switch-name">{{ switchItem.switchName }}</text>
+                      <text class="switch-status" v-if="switchItem.isOpen === 1">运行中</text>
+                      <text class="switch-status off" v-else>已关闭</text>
+                    </view>
+                  </view>
+                  <view class="switch-right">
+                    <view class="switch-actions">
+                      <view @click.stop="setSwitchNameDialog(switchItem.id, switchItem.switchName)" class="action-btn">
+                        <text>重命名</text>
+                      </view>
+                      <view @click.stop="toTiming(switchItem.id)" class="action-btn">
+                        <text>定时</text>
+                      </view>
+                      <view @click.stop="setSwitch(switchItem.id, switchItem.switchName)" class="action-btn">
+                        <text>设置</text>
+                      </view>
+                    </view>
+                    <nut-switch
+                      :model-value="switchItem.isOpen === 1"
+                      active-color="#04D98A"
+                      @change="(value, event) => setSwitchOpen({ value, event }, switchItem)"
+                    />
+                  </view>
                 </view>
               </view>
             </nut-col>
@@ -2416,51 +2428,49 @@ defineExpose({
 
 // 控制器区域样式
 .controller-item {
-  margin-bottom: 10px;
+  margin-bottom: 12px;
   
   .controller-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: 12px 0;
+    padding: 12px 0 10px 0;
+    border-bottom: 1px solid #f0f0f0;
+    margin-bottom: 10px;
     
     .controller-name {
-      font-size: 30px;
-      font-weight: 600;
-      color: #222;
       display: flex;
       align-items: center;
-      gap: 10px;
+      gap: 8px;
+      
+      .controller-title {
+        font-size: 30px;
+        font-weight: 600;
+        color: #222;
+      }
       
       .error-tag {
-        font-size: 24px;
+        font-size: 22px;
         font-weight: 400;
         color: #bf290e;
         background: rgba(191, 41, 14, 0.1);
-        padding: 4px 12px;
+        padding: 4px 10px;
         border-radius: 4px;
       }
     }
-    
-    .controller-actions {
-      .param-setting-link {
-        font-size: 28px;
-        color: #1589E9;
-        cursor: pointer;
-        transition: opacity 0.2s ease;
-        
-        &:active {
-          opacity: 0.7;
-        }
-      }
-    }
+  }
+  
+  .switch-list {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
   }
   
   .switch-item {
     display: flex;
     align-items: center;
     justify-content: space-between;
-    padding: 15px 0;
+    padding: 12px 0;
     border-bottom: 1px solid #f5f5f5;
     
     &:last-child {
@@ -2472,34 +2482,72 @@ defineExpose({
       display: flex;
       align-items: center;
       gap: 12px;
+      min-width: 0;
       
-      .switch-icon {
+      .switch-icon-wrapper {
+        flex-shrink: 0;
         width: 40px;
         height: 40px;
-        flex-shrink: 0;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        
+        .switch-icon {
+          width: 40px;
+          height: 40px;
+        }
       }
       
-      .switch-name {
-        font-size: 28px;
-        color: #333;
-        font-weight: 500;
+      .switch-info {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        gap: 4px;
+        min-width: 0;
+        
+        .switch-name {
+          font-size: 28px;
+          color: #333;
+          font-weight: 500;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+        
+        .switch-status {
+          font-size: 22px;
+          color: #09b8c2;
+          
+          &.off {
+            color: #999;
+          }
+        }
       }
     }
     
     .switch-right {
+      flex-shrink: 0;
       display: flex;
       align-items: center;
-      gap: 20px;
+      gap: 12px;
       
-      .switch-setting-link {
-        font-size: 28px;
-        color: #1589E9;
-        cursor: pointer;
-        white-space: nowrap;
-        transition: opacity 0.2s ease;
+      .switch-actions {
+        display: flex;
+        gap: 8px;
         
-        &:active {
-          opacity: 0.7;
+        .action-btn {
+          padding: 6px 12px;
+          border-radius: 4px;
+          font-size: 24px;
+          background: #fff;
+          border: 1px solid #e5e5e5;
+          color: #666;
+          transition: all 0.2s ease;
+          white-space: nowrap;
+          
+          &:active {
+            background: #f5f5f5;
+          }
         }
       }
     }