From 5818735df2ca9309694febd3a5732675467434c8 Mon Sep 17 00:00:00 2001
From: "1378012178@qq.com" <1378012178@qq.com>
Date: Fri, 24 Apr 2026 10:29:37 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AF=B9=E4=B8=8A=E4=B8=80=E7=89=88=E8=BF=9B?=
 =?UTF-8?q?=E8=A1=8C=E4=BC=98=E5=8C=96=EF=BC=9A=E5=B7=B2=E6=94=B6=E8=B5=B7?=
 =?UTF-8?q?=E5=8D=A1=E7=89=87=EF=BC=8C=E7=82=B9=E5=87=BB=E8=BE=B9=E7=BC=98?=
 =?UTF-8?q?=E4=B9=9F=E5=8F=AF=E4=BB=A5=E5=B1=95=E5=BC=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/preview/AddNuPreviewForm.vue   | 31 ++++++++++++++++---
 1 file changed, 26 insertions(+), 5 deletions(-)

diff --git a/src/views/device/manager/components/preview/AddNuPreviewForm.vue b/src/views/device/manager/components/preview/AddNuPreviewForm.vue
index bed39bd..37c3ab8 100644
--- a/src/views/device/manager/components/preview/AddNuPreviewForm.vue
+++ b/src/views/device/manager/components/preview/AddNuPreviewForm.vue
@@ -3,9 +3,9 @@
     <a-row style="margin-top: -4px;">
       <a-col v-for="(item, index) in nuInfos" style="padding:7px 7px;" :key="index" :span="24">
         <a-card :class="['card-3d', { 'card-collapsed': expandedCard !== item.nuId }]"
-          style="height: auto; min-height: 320px;">
+          style="height: auto; min-height: 320px;" @click="handleCardClick(item.nuId, $event)">
           <!-- 卡片头部：可点击展开 -->
-          <div class="card-header" @click="expandCard(item.nuId)">
+          <div class="card-header">
             <div class="left-area">
               <div class="left-area">
                 <div class="region-name">名称：{{ item.nuName }}</div>
@@ -22,7 +22,7 @@
           </div>
 
           <!-- 卡片内容：只有展开的卡片才显示 -->
-          <div class="card-content" v-if="expandedCard === item.nuId">
+          <div class="card-content" v-if="expandedCard === item.nuId" @click.stop>
             <!-- 上半部分：左右布局 -->
             <div class="top-section">
               <!-- 右侧：其他内容区域 -->
@@ -168,6 +168,25 @@ const disabled = computed(() => {
   return props.formDisabled;
 });
 
+// 处理卡片点击（阻止内部元素的冒泡）
+function handleCardClick(nuId: string, event: Event) {
+  // 检查点击目标是否可能是可交互元素
+  const target = event.target as HTMLElement;
+  const isInputElement = target.tagName === 'INPUT' ||
+    target.tagName === 'BUTTON' ||
+    target.closest('.ant-input-number') ||
+    target.closest('.ant-checkbox-wrapper') ||
+    target.closest('button');
+
+  // 如果点击的是输入框、按钮等交互元素，且当前卡片是展开状态，则不触发展开/收起
+  if (isInputElement && expandedCard.value === nuId) {
+    return;
+  }
+
+  // 否则执行展开/收起逻辑
+  expandCard(nuId);
+}
+
 // 展开/收起卡片
 function expandCard(nuId: string) {
   // 如果点击的是已经展开的卡片，则收起
@@ -413,6 +432,7 @@ defineExpose({
   transition: all 0.3s ease;
   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
   overflow: hidden;
+  cursor: pointer;
 }
 
 /* 鼠标悬停效果 */
@@ -438,12 +458,12 @@ defineExpose({
   transition: padding 0.3s ease;
 }
 
-/* 卡片头部 */
+/* 卡片头部的鼠标样式 */
 .card-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
-  cursor: pointer;
+  cursor: inherit;
   user-select: none;
 }
 
@@ -595,6 +615,7 @@ defineExpose({
 
 /* 强制 checkbox 文字显示为黑色 */
 .right-area {
+
   :deep(.ant-checkbox-wrapper),
   :deep(.ant-checkbox-wrapper-disabled),
   :deep(.ant-checkbox + span),