zangch
/
JDAirPort.Ems.UI
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改看板

Browse Source
boardTest
夜笙歌 3 weeks ago
parent a988a368bc
commit 9256fa50b3
1 changed files with 109 additions and 97 deletions
Show Stats Download Patch File Download Diff File

206
src/components/AlmModal/index.vue
Unescape Escape View File

@ -1,14 +1,14 @@
<template> <template>
<div> <div>
<el-dialog <el-dialog
title="⚠️ 实时告警通知" title="⚠️ 实时告警通知"
:visible.sync="realtimeAlarmDialog" :visible.sync="realtimeAlarmDialog"
width="900px" width="900px"
append-to-body append-to-body
:close-on-click-modal="false" :close-on-click-modal="false"
:close-on-press-escape="false" :close-on-press-escape="false"
class="realtime-alarm-dialog" class="realtime-alarm-dialog"
@close="closeRealtimeAlarmDialog" @close="closeRealtimeAlarmDialog"
> >
<el-tabs v-model="realtimeActiveTab" type="card"> <el-tabs v-model="realtimeActiveTab" type="card">
<!-- 告警详情标签页 --> <!-- 告警详情标签页 -->
@ -39,15 +39,15 @@
<h3 class="section-title">📋 告警内容详情</h3> <h3 class="section-title">📋 告警内容详情</h3>
<div class="alarm-contents"> <div class="alarm-contents">
<div <div
v-for="(content, index) in currentRealtimeAlarm.alarmContents" v-for="(content, index) in currentRealtimeAlarm.alarmContents"
:key="index" :key="index"
class="content-item" class="content-item"
> >
<el-alert <el-alert
:title="content" :title="content"
type="error" type="error"
:closable="false" :closable="false"
show-icon show-icon
/> />
</div> </div>
</div> </div>
@ -58,10 +58,10 @@
<h3 class="section-title">🔎 故障预测内容 </h3> <h3 class="section-title">🔎 故障预测内容 </h3>
<div class="alarm-contents"> <div class="alarm-contents">
<el-alert <el-alert
:title="PredictionContent()" :title="PredictionContent()"
type="warning" type="warning"
:closable="false" :closable="false"
show-icon show-icon
/> />
</div> </div>
</div> </div>
@ -72,10 +72,10 @@
<el-tab-pane label="处置措施" name="realtimeActionSteps"> <el-tab-pane label="处置措施" name="realtimeActionSteps">
<div v-if="currentRealtimeAlarm"> <div v-if="currentRealtimeAlarm">
<el-alert <el-alert
:title="`设备：${currentRealtimeAlarm.monitorId} | 告警时间：${formatAlarmTime(currentRealtimeAlarm.recordTime)}`" :title="`设备：${currentRealtimeAlarm.monitorId} | 告警时间：${formatAlarmTime(currentRealtimeAlarm.recordTime)}`"
type="warning" type="warning"
:closable="false" :closable="false"
style="margin-bottom: 20px;" style="margin-bottom: 20px;"
/> />
<div v-loading="realtimeActionStepsLoading"> <div v-loading="realtimeActionStepsLoading">
@ -86,12 +86,12 @@
<div v-else> <div v-else>
<el-timeline> <el-timeline>
<el-timeline-item <el-timeline-item
v-for="(step, index) in realtimeActionSteps" v-for="(step, index) in realtimeActionSteps"
:key="step.objId" :key="step.objId"
:timestamp="`步骤 ${step.stepSequence}`" :timestamp="`步骤 ${step.stepSequence}`"
placement="top" placement="top"
type="primary" type="primary"
size="large" size="large"
> >
<el-card class="step-card"> <el-card class="step-card">
<div slot="header" class="clearfix"> <div slot="header" class="clearfix">
@ -108,10 +108,10 @@
<div class="images-title">参考图片：</div> <div class="images-title">参考图片：</div>
<div class="image-gallery"> <div class="image-gallery">
<div <div
v-for="image in step.stepImages" v-for="image in step.stepImages"
:key="image.objId" :key="image.objId"
class="image-item" class="image-item"
@click="previewImage(getFullImageUrl(image.imageUrl))" @click="previewImage(getFullImageUrl(image.imageUrl))"
> >
<img :src="getFullImageUrl(image.imageUrl)" :alt="image.description"/> <img :src="getFullImageUrl(image.imageUrl)" :alt="image.description"/>
<div v-if="image.description" class="image-desc">{{ image.description }}</div> <div v-if="image.description" class="image-desc">{{ image.description }}</div>
@ -134,15 +134,20 @@
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button <el-button
@click="closeRealtimeAlarmDialog" @click="toIndex"
:loading="alarmProcessing" >
返回首页
</el-button>
<el-button
@click="closeRealtimeAlarmDialog"
:loading="alarmProcessing"
> >
稍后处理 稍后处理
</el-button> </el-button>
<el-button <el-button
type="primary" type="primary"
@click="processRealtimeAlarm" @click="processRealtimeAlarm"
:loading="alarmProcessing" :loading="alarmProcessing"
> >
我已处理 我已处理
</el-button> </el-button>
@ -189,65 +194,65 @@ export default {
}) })
} }
}) })
// setInterval(() => { setInterval(() => {
// let e = { let e = {
// "monitorId": "T0002_0101", "monitorId": "T0002_0101",
// "isFlag": 1, "isFlag": 1,
// "deviceParam": { "deviceParam": {
// "objid": 1927987087563427800, "objid": 1927987087563427800,
// "monitorId": "T0002_0101", "monitorId": "T0002_0101",
// "temperature": 27.68, "temperature": 27.68,
// "humidity": 0, "humidity": 0,
// "illuminance": 0, "illuminance": 0,
// "noise": 0, "noise": 0,
// "concentration": 0, "concentration": 0,
// "VibrationSpeed": 0, "VibrationSpeed": 0,
// "VibrationDisplacement": 0, "VibrationDisplacement": 0,
// "VibrationAcceleration": 0, "VibrationAcceleration": 0,
// "VibrationTemp": 0, "VibrationTemp": 0,
// "collectTime": "2024-09-03T04:47:06", "collectTime": "2024-09-03T04:47:06",
// "recordTime": "2025-05-29T15:15:16.3016212+08:00" "recordTime": "2025-05-29T15:15:16.3016212+08:00"
// }, },
// "alarmRules": [ "alarmRules": [
// { {
// "objid": 30020, "objid": 30020,
// "monitorId": "T0002_0101 ", "monitorId": "T0002_0101 ",
// "ruleId": null, "ruleId": null,
// "ruleName": "T0002_0101 表的温度大于阈值 20", "ruleName": "T0002_0101 表的温度大于阈值 20",
// "triggerRule": 0, "triggerRule": 0,
// "monitorField": 0, "monitorField": 0,
// "triggerValue": 20, "triggerValue": 20,
// "cause": "温度过高-备注", "cause": "温度过高-备注",
// "alarmId": 202506051636001, "alarmId": 202506051636001,
// }, },
// { {
// "objid": 30021, "objid": 30021,
// "monitorId": "T0002_0101 ", "monitorId": "T0002_0101 ",
// "ruleId": null, "ruleId": null,
// "ruleName": "T0002_0101表的温度小于阈值 30", "ruleName": "T0002_0101表的温度小于阈值 30",
// "triggerRule": 1, "triggerRule": 1,
// "monitorField": 0, "monitorField": 0,
// "triggerValue": 30, "triggerValue": 30,
// "cause": "温度过低-备注", "cause": "温度过低-备注",
// "alarmId": 202506051636001, "alarmId": 202506051636001,
// } }
// ], ],
// "alarmContents": [ "alarmContents": [
// "T0002_0101传感器数据在2025-05-29 15:15:16触发T0002_0101 表的温度大于阈值 20异常告警,告警规则:大于,阈值:20.00,详细信息:温度过高-备注", "T0002_0101传感器数据在2025-05-29 15:15:16触发T0002_0101 表的温度大于阈值 20异常告警,告警规则:大于,阈值:20.00,详细信息:温度过高-备注",
// "T0002_0101传感器数据在2025-05-29 15:15:16触发T0002_0101表的温度小于阈值 30异常告警,告警规则:小于,阈值:30.00,详细信息:温度过低-备注" "T0002_0101传感器数据在2025-05-29 15:15:16触发T0002_0101表的温度小于阈值 30异常告警,告警规则:小于,阈值:30.00,详细信息:温度过低-备注"
// ], ],
// "recordTime": 1748566080572 "recordTime": 1748566080572
// } }
//
// if (e.alarmContents.length > 0) { if (e.alarmContents.length > 0) {
// e.alarmRules.forEach((item, index) => { e.alarmRules.forEach((item, index) => {
// if (!this.almData.find(v => v.monitorId === e.monitorId && v.alarmRules[0].objid === item.objid)) { if (!this.almData.find(v => v.monitorId === e.monitorId && v.alarmRules[0].objid === item.objid)) {
// this.almData.push({...e, alarmRules: [item], alarmContents: [e.alarmContents[index]], isWaiting: false}) this.almData.push({...e, alarmRules: [item], alarmContents: [e.alarmContents[index]], isWaiting: false})
// } }
// }) })
// } }
//
// }, 3000) }, 3000)
}, },
watch: { watch: {
almData: { almData: {
@ -472,6 +477,13 @@ export default {
} else { } else {
return '' return ''
} }
},
toIndex() {
let data = this.currentRealtimeAlarm
let index = this.almData.findIndex(v => v.monitorId === data.monitorId && v.alarmRules[0].objid === data.alarmRules[0].objid)
this.$set(this.almData[index], 'isWaiting', true)
this.$router.push('/')
} }
} }
} }

Write Preview
Loading…
Cancel
Save