From c8fce1e2549f55890b8b5afa8b6977fd1196de06 Mon Sep 17 00:00:00 2001
From: puhui999 <puhui999@163.com>
Date: Sat, 29 Mar 2025 14:34:56 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E4=BB=A3=E7=A0=81=E4=BC=98=E5=8C=96?=
 =?UTF-8?q?=E3=80=91IoT:=20=E5=9C=BA=E6=99=AF=E8=81=94=E5=8A=A8=E5=BD=BB?=
 =?UTF-8?q?=E5=BA=95=E4=BF=AE=E5=A4=8D=E7=B4=A2=E5=BC=95=E9=87=8D=E7=94=A8?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/iot/rule/scene/scene.types.ts      |  2 ++
 src/views/iot/rule/scene/RuleSceneForm.vue | 13 ++++++++++---
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/api/iot/rule/scene/scene.types.ts b/src/api/iot/rule/scene/scene.types.ts
index 990822b9..336c1d58 100644
--- a/src/api/iot/rule/scene/scene.types.ts
+++ b/src/api/iot/rule/scene/scene.types.ts
@@ -72,6 +72,7 @@ interface TriggerCondition {
 
 // 触发器配置
 interface TriggerConfig {
+  key: any // 解决组件索引重用
   type: number // 触发类型
   productKey: string // 产品标识
   deviceNames: string[] // 设备名称数组
@@ -98,6 +99,7 @@ interface ActionAlert {
 
 // 执行器配置
 interface ActionConfig {
+  key: any // 解决组件索引重用
   type: number // 执行类型
   deviceControl?: ActionDeviceControl // 设备控制
   alert?: ActionAlert // 告警执行
diff --git a/src/views/iot/rule/scene/RuleSceneForm.vue b/src/views/iot/rule/scene/RuleSceneForm.vue
index c66d422d..c6d13c56 100644
--- a/src/views/iot/rule/scene/RuleSceneForm.vue
+++ b/src/views/iot/rule/scene/RuleSceneForm.vue
@@ -35,7 +35,7 @@
           <el-divider content-position="left">触发器配置</el-divider>
           <device-listener
             v-for="(trigger, index) in formData.triggers"
-            :key="`trigger-${index}-${Date.now()}`"
+            :key="trigger.key"
             :model-value="trigger"
             @update:model-value="(val) => (formData.triggers[index] = val)"
             class="mb-10px"
@@ -52,7 +52,7 @@
           <el-divider content-position="left">执行器配置</el-divider>
           <action-executor
             v-for="(action, index) in formData.actions"
-            :key="`action-${index}-${Date.now()}`"
+            :key="action.key"
             :model-value="action"
             @update:model-value="(val) => (formData.actions[index] = val)"
             class="mb-10px"
@@ -88,6 +88,7 @@ import {
   TriggerConfig
 } from '@/api/iot/rule/scene/scene.types'
 import ActionExecutor from './components/action/ActionExecutor.vue'
+import { generateUUID } from '@/utils'
 
 /** IoT 场景联动表单 */
 defineOptions({ name: 'IotRuleSceneForm' })
@@ -115,6 +116,7 @@ const formRef = ref() // 表单 Ref
 /** 添加触发器 */
 const addTrigger = () => {
   formData.value.triggers.push({
+    key: generateUUID(), // 解决组件索引重用
     type: IotRuleSceneTriggerTypeEnum.DEVICE,
     productKey: '',
     deviceNames: [],
@@ -135,6 +137,7 @@ const removeTrigger = (index: number) => {
 /** 添加执行器 */
 const addAction = () => {
   formData.value.actions.push({
+    key: generateUUID(), // 解决组件索引重用
     type: IotRuleSceneActionTypeEnum.DEVICE_CONTROL
   } as ActionConfig)
 }
@@ -153,7 +156,11 @@ const open = async (type: string, id?: number) => {
   if (id) {
     formLoading.value = true
     try {
-      formData.value = await RuleSceneApi.getRuleScene(id)
+      const data = (await RuleSceneApi.getRuleScene(id)) as IotRuleScene
+      // 解决组件索引重用
+      data.triggers?.forEach((item) => (item.key = generateUUID()))
+      data.actions?.forEach((item) => (item.key = generateUUID()))
+      formData.value = data
     } finally {
       formLoading.value = false
     }