perf:【IoT 物联网】场景联动告警告警恢复需要选择告警配置
parent
d0c8efdff8
commit
52827ca78a
|
|
@ -94,20 +94,12 @@ interface ActionDeviceControl {
|
||||||
data: Record<string, any> // 具体数据
|
data: Record<string, any> // 具体数据
|
||||||
}
|
}
|
||||||
|
|
||||||
// 告警执行配置
|
|
||||||
interface ActionAlert {
|
|
||||||
receiveType: number // 接收方式
|
|
||||||
phoneNumbers?: string[] // 手机号列表
|
|
||||||
emails?: string[] // 邮箱列表
|
|
||||||
content: string // 通知内容
|
|
||||||
}
|
|
||||||
|
|
||||||
// 执行器配置
|
// 执行器配置
|
||||||
interface ActionConfig {
|
interface ActionConfig {
|
||||||
key: any // 解决组件索引重用 TODO @puhui999:看看有没更好的解决方案呢。
|
key: any // 解决组件索引重用 TODO @puhui999:看看有没更好的解决方案呢。
|
||||||
type: number // 执行类型
|
type: number // 执行类型
|
||||||
deviceControl?: ActionDeviceControl // 设备控制
|
deviceControl?: ActionDeviceControl // 设备控制
|
||||||
alert?: ActionAlert // 告警执行
|
alertConfigId?: number // 告警配置ID(告警恢复时需要)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 主接口
|
// 主接口
|
||||||
|
|
@ -127,7 +119,6 @@ export {
|
||||||
TriggerConditionParameter,
|
TriggerConditionParameter,
|
||||||
ActionConfig,
|
ActionConfig,
|
||||||
ActionDeviceControl,
|
ActionDeviceControl,
|
||||||
ActionAlert,
|
|
||||||
IotRuleSceneTriggerTypeEnum,
|
IotRuleSceneTriggerTypeEnum,
|
||||||
IotRuleSceneActionTypeEnum,
|
IotRuleSceneActionTypeEnum,
|
||||||
IotDeviceMessageTypeEnum,
|
IotDeviceMessageTypeEnum,
|
||||||
|
|
|
||||||
|
|
@ -49,12 +49,42 @@
|
||||||
@update:model-value="(val) => (actionConfig.deviceControl = val)"
|
@update:model-value="(val) => (actionConfig.deviceControl = val)"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<!-- 告警执行器 - 无需额外配置 -->
|
<!-- 告警执行器 -->
|
||||||
<div v-else-if="isAlertAction" class="bg-[#dbe5f6] flex items-center justify-center p-10px">
|
<div v-else-if="isAlertAction">
|
||||||
<el-icon class="mr-5px text-blue-500"><Icon icon="ep:info-filled" /></el-icon>
|
<!-- 告警触发 - 无需额外配置 -->
|
||||||
<span class="text-gray-600">
|
<div
|
||||||
{{ getAlertActionDescription(actionConfig.type) }}
|
v-if="actionConfig.type === IotRuleSceneActionTypeEnum.ALERT_TRIGGER"
|
||||||
</span>
|
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>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -78,6 +108,7 @@ import DeviceTableSelect from '@/views/iot/device/device/components/DeviceTableS
|
||||||
import DeviceControlAction from './DeviceControlAction.vue'
|
import DeviceControlAction from './DeviceControlAction.vue'
|
||||||
import { ProductApi, ProductVO } from '@/api/iot/product/product'
|
import { ProductApi, ProductVO } from '@/api/iot/product/product'
|
||||||
import { DeviceApi, DeviceVO } from '@/api/iot/device/device'
|
import { DeviceApi, DeviceVO } from '@/api/iot/device/device'
|
||||||
|
import { AlertConfigApi, AlertConfig } from '@/api/iot/alert/config'
|
||||||
import {
|
import {
|
||||||
ActionConfig,
|
ActionConfig,
|
||||||
ActionDeviceControl,
|
ActionDeviceControl,
|
||||||
|
|
@ -111,18 +142,6 @@ const isAlertAction = computed(() => {
|
||||||
].includes(actionConfig.value.type as any)
|
].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 = () => {
|
const initActionConfig = () => {
|
||||||
if (!actionConfig.value) {
|
if (!actionConfig.value) {
|
||||||
|
|
@ -146,9 +165,17 @@ const initActionConfig = () => {
|
||||||
} as ActionDeviceControl
|
} as ActionDeviceControl
|
||||||
}
|
}
|
||||||
|
|
||||||
// 告警执行器初始化 - 无需额外配置,清空 alert 配置
|
// 告警执行器初始化
|
||||||
if (isAlertAction.value) {
|
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 product = ref<ProductVO>()
|
||||||
const deviceList = ref<DeviceVO[]>([])
|
const deviceList = ref<DeviceVO[]>([])
|
||||||
|
|
||||||
|
/** 告警配置相关 */
|
||||||
|
const alertConfigList = ref<AlertConfig[]>([])
|
||||||
|
const alertConfigLoading = ref(false)
|
||||||
|
|
||||||
/** 处理选择产品 */
|
/** 处理选择产品 */
|
||||||
const handleSelectProduct = () => {
|
const handleSelectProduct = () => {
|
||||||
productTableSelectRef.value?.open()
|
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(
|
watch(
|
||||||
() => actionConfig.value.type,
|
() => actionConfig.value.type,
|
||||||
() => {
|
(newType) => {
|
||||||
initActionConfig()
|
initActionConfig()
|
||||||
|
// 如果是告警恢复类型,需要加载告警配置列表
|
||||||
|
if (newType === IotRuleSceneActionTypeEnum.ALERT_RECOVER) {
|
||||||
|
getAlertConfigList()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{ immediate: true }
|
{ immediate: true }
|
||||||
)
|
)
|
||||||
|
|
|
||||||
|
|
@ -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>
|
|
||||||
Loading…
Reference in New Issue