perf：【IoT 物联网】场景联动告警告警恢复需要选择告警配置

src/api/iot/rule/scene/scene.types.ts

@@ -94,20 +94,12 @@ interface ActionDeviceControl {
   data: Record<string, any> // 具体数据
 }
 
-// 告警执行配置
-interface ActionAlert {
-  receiveType: number // 接收方式
-  phoneNumbers?: string[] // 手机号列表
-  emails?: string[] // 邮箱列表
-  content: string // 通知内容
-}
-
 // 执行器配置
 interface ActionConfig {
   key: any // 解决组件索引重用 TODO @puhui999：看看有没更好的解决方案呢。
   type: number // 执行类型
   deviceControl?: ActionDeviceControl // 设备控制
-  alert?: ActionAlert // 告警执行
+  alertConfigId?: number // 告警配置ID（告警恢复时需要）
 }
 
 // 主接口
@@ -127,7 +119,6 @@ export {
   TriggerConditionParameter,
   ActionConfig,
   ActionDeviceControl,
-  ActionAlert,
   IotRuleSceneTriggerTypeEnum,
   IotRuleSceneActionTypeEnum,
   IotDeviceMessageTypeEnum,

src/views/iot/rule/scene/components/action/ActionExecutor.vue

@@ -49,12 +49,42 @@
         @update:model-value="(val) => (actionConfig.deviceControl = val)"
       />
 
-      <!-- 告警执行器 - 无需额外配置 -->
-      <div v-else-if="isAlertAction" class="bg-[#dbe5f6] flex items-center justify-center p-10px">
-        <el-icon class="mr-5px text-blue-500"><Icon icon="ep:info-filled" /></el-icon>
-        <span class="text-gray-600">
-          {{ getAlertActionDescription(actionConfig.type) }}
-        </span>
+      <!-- 告警执行器 -->
+      <div v-else-if="isAlertAction">
+        <!-- 告警触发 - 无需额外配置 -->
+        <div
+          v-if="actionConfig.type === IotRuleSceneActionTypeEnum.ALERT_TRIGGER"
+          class="bg-[#dbe5f6] flex items-center justify-center p-10px"
+        >
+          <el-icon class="mr-5px text-blue-500"><Icon icon="ep:info-filled" /></el-icon>
+          <span class="text-gray-600">触发告警通知，系统将自动发送告警信息</span>
+        </div>
+
+        <!-- 告警恢复 - 需要选择告警配置 -->
+        <div v-else-if="actionConfig.type === IotRuleSceneActionTypeEnum.ALERT_RECOVER">
+          <div class="bg-[#dbe5f6] flex items-center justify-center p-10px mb-10px">
+            <el-icon class="mr-5px text-blue-500"><Icon icon="ep:info-filled" /></el-icon>
+            <span class="text-gray-600">恢复指定的告警配置状态</span>
+          </div>
+          <div class="p-10px">
+            <el-form-item label="选择告警配置" required>
+              <el-select
+                v-model="actionConfig.alertConfigId"
+                class="!w-240px"
+                clearable
+                placeholder="请选择要恢复的告警配置"
+                :loading="alertConfigLoading"
+              >
+                <el-option
+                  v-for="config in alertConfigList"
+                  :key="config.id"
+                  :label="config.name"
+                  :value="config.id"
+                />
+              </el-select>
+            </el-form-item>
+          </div>
+        </div>
       </div>
     </div>
 
@@ -78,6 +108,7 @@ import DeviceTableSelect from '@/views/iot/device/device/components/DeviceTableS
 import DeviceControlAction from './DeviceControlAction.vue'
 import { ProductApi, ProductVO } from '@/api/iot/product/product'
 import { DeviceApi, DeviceVO } from '@/api/iot/device/device'
+import { AlertConfigApi, AlertConfig } from '@/api/iot/alert/config'
 import {
   ActionConfig,
   ActionDeviceControl,
@@ -111,18 +142,6 @@ const isAlertAction = computed(() => {
   ].includes(actionConfig.value.type as any)
 })
 
-/** 获取告警执行器描述文本 */
-const getAlertActionDescription = (actionType: number) => {
-  switch (actionType) {
-    case IotRuleSceneActionTypeEnum.ALERT_TRIGGER:
-      return '触发告警通知，系统将自动发送告警信息'
-    case IotRuleSceneActionTypeEnum.ALERT_RECOVER:
-      return '恢复告警状态，系统将自动发送恢复通知'
-    default:
-      return '告警相关操作，无需额外配置'
-  }
-}
-
 /** 初始化执行器结构 */
 const initActionConfig = () => {
   if (!actionConfig.value) {
@@ -146,9 +165,17 @@ const initActionConfig = () => {
     } as ActionDeviceControl
   }
 
-  // 告警执行器初始化 - 无需额外配置，清空 alert 配置
+  // 告警执行器初始化
   if (isAlertAction.value) {
-    actionConfig.value.alert = undefined
+    if (actionConfig.value.type === IotRuleSceneActionTypeEnum.ALERT_TRIGGER) {
+      // 告警触发 - 无需额外配置
+      actionConfig.value.alertConfigId = undefined
+    } else if (actionConfig.value.type === IotRuleSceneActionTypeEnum.ALERT_RECOVER) {
+      // 告警恢复 - 需要选择告警配置
+      if (!actionConfig.value.alertConfigId) {
+        actionConfig.value.alertConfigId = undefined
+      }
+    }
   }
 }
 
@@ -158,6 +185,10 @@ const deviceTableSelectRef = ref<InstanceType<typeof DeviceTableSelect>>()
 const product = ref<ProductVO>()
 const deviceList = ref<DeviceVO[]>([])
 
+/** 告警配置相关 */
+const alertConfigList = ref<AlertConfig[]>([])
+const alertConfigLoading = ref(false)
+
 /** 处理选择产品 */
 const handleSelectProduct = () => {
   productTableSelectRef.value?.open()
@@ -193,11 +224,27 @@ const handleDeviceSelect = (val: DeviceVO[]) => {
   }
 }
 
+/** 获取告警配置列表 */
+const getAlertConfigList = async () => {
+  try {
+    alertConfigLoading.value = true
+    alertConfigList.value = await AlertConfigApi.getSimpleAlertConfigList()
+  } catch (error) {
+    console.error('获取告警配置列表失败:', error)
+  } finally {
+    alertConfigLoading.value = false
+  }
+}
+
 /** 监听执行类型变化，初始化对应配置 */
 watch(
   () => actionConfig.value.type,
-  () => {
+  (newType) => {
     initActionConfig()
+    // 如果是告警恢复类型，需要加载告警配置列表
+    if (newType === IotRuleSceneActionTypeEnum.ALERT_RECOVER) {
+      getAlertConfigList()
+    }
   },
   { immediate: true }
 )

src/views/iot/rule/scene/components/action/AlertAction.vue

@@ -1,108 +0,0 @@
-<template>
-  <div class="bg-[#dbe5f6] p-10px">
-    <!-- 告警类型说明 -->
-    <div class="flex items-center mb-10px" v-if="actionType">
-      <el-icon class="mr-5px text-orange-500"><Icon icon="ep:warning-filled" /></el-icon>
-      <span class="text-gray-600">
-        {{
-          actionType === IotRuleSceneActionTypeEnum.ALERT_TRIGGER ? '触发告警通知' : '告警恢复通知'
-        }}
-      </span>
-    </div>
-
-    <div class="flex items-center mb-10px">
-      <span class="mr-10px w-80px">接收方式</span>
-      <el-select
-        v-model="alertConfig.receiveType"
-        class="!w-160px"
-        clearable
-        placeholder="选择接收方式"
-      >
-        <!-- TODO @芋艿：后续搞成字典 -->
-        <!-- TODO @puhui999：这里好像是 1、/2、/3 哈 -->
-        <el-option
-          v-for="(value, key) in IotAlertConfigReceiveTypeEnum"
-          :key="value"
-          :label="key === 'SMS' ? '短信' : key === 'MAIL' ? '邮箱' : '通知'"
-          :value="value"
-        />
-      </el-select>
-    </div>
-    <div
-      v-if="alertConfig.receiveType === IotAlertConfigReceiveTypeEnum.SMS"
-      class="flex items-center mb-10px"
-    >
-      <span class="mr-10px w-80px">手机号码</span>
-      <el-select
-        v-model="alertConfig.phoneNumbers"
-        class="!w-360px"
-        multiple
-        filterable
-        allow-create
-        default-first-option
-        placeholder="请输入手机号码"
-      />
-    </div>
-    <div
-      v-if="alertConfig.receiveType === IotAlertConfigReceiveTypeEnum.MAIL"
-      class="flex items-center mb-10px"
-    >
-      <span class="mr-10px w-80px">邮箱地址</span>
-      <el-select
-        v-model="alertConfig.emails"
-        class="!w-360px"
-        multiple
-        filterable
-        allow-create
-        default-first-option
-        placeholder="请输入邮箱地址"
-      />
-    </div>
-    <div class="flex items-center">
-      <span class="mr-10px w-80px align-self-start">通知内容</span>
-      <el-input
-        v-model="alertConfig.content"
-        type="textarea"
-        :rows="4"
-        class="!w-360px"
-        placeholder="请输入通知内容"
-      />
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useVModel } from '@vueuse/core'
-import {
-  ActionAlert,
-  IotAlertConfigReceiveTypeEnum,
-  IotRuleSceneActionTypeEnum
-} from '@/api/iot/rule/scene/scene.types'
-
-/** 告警执行器组件 */
-defineOptions({ name: 'AlertAction' })
-
-const props = defineProps<{
-  modelValue: any
-  actionType?: number
-}>()
-const emits = defineEmits(['update:modelValue'])
-const alertConfig = useVModel(props, 'modelValue', emits) as Ref<ActionAlert>
-
-/** 初始化告警执行器结构 */
-const initAlertConfig = () => {
-  if (!alertConfig.value) {
-    alertConfig.value = {
-      receiveType: IotAlertConfigReceiveTypeEnum.NOTIFY,
-      phoneNumbers: [],
-      emails: [],
-      content: ''
-    } as ActionAlert
-  }
-}
-
-/** 初始化 */
-onMounted(() => {
-  initAlertConfig()
-})
-</script>