完善告警事件列表展示
This commit is contained in:
parent
c5b3fca87c
commit
573fe982ca
@ -14,12 +14,11 @@
|
||||
/>
|
||||
|
||||
<!-- 告警/预警提示框 -->
|
||||
<!-- <AlertNotificationSystem
|
||||
:alert-message="alertMessage"
|
||||
:alert-type="alertType"
|
||||
@show="handleAlertShow"
|
||||
<AlarmNotification
|
||||
ref="alarmNotification"
|
||||
@close="handleAlarmClose"
|
||||
/>
|
||||
-->
|
||||
|
||||
<!-- 车辆动画系统 -->
|
||||
<VehicleAnimationSystem
|
||||
ref="animationSystem"
|
||||
@ -59,7 +58,7 @@ import VehicleAnimationSystem from './VehicleAnimationSystem.vue';
|
||||
import VehicleLabelSystem from './VehicleLabelSystem.vue';
|
||||
import VehicleDetailPopup from './VehicleDetailPopup.vue';
|
||||
import WeatherStationPopup from './WeatherStationPopup.vue';
|
||||
// import AlertNotificationSystem from './AlertNotificationSystem.vue';
|
||||
import AlarmNotification from '../info/AlarmNotification.vue'; // 导入告警通知组件
|
||||
import VehicleStyleManager from './VehicleStyleManager.vue';
|
||||
|
||||
// 导入默认图标
|
||||
@ -94,6 +93,7 @@ const props = defineProps({
|
||||
const animationSystem = ref(null);
|
||||
const labelSystem = ref(null);
|
||||
const styleManager = ref(null);
|
||||
const alarmNotification = ref(null); // 告警通知组件引用
|
||||
|
||||
// 气象监测站数据
|
||||
const weatherStationVisible = ref(true);
|
||||
@ -161,6 +161,118 @@ let alertTimer = null;
|
||||
// 违规状态计时器
|
||||
const violationStatusTimers = ref({});
|
||||
|
||||
// 告警列表管理
|
||||
const alarmList = ref([]); // 存储所有告警信息
|
||||
const maxAlarmCount = 100; // 最大告警数量，防止列表过长
|
||||
const alarmVisible = ref(true); // 控制告警面板显示状态
|
||||
|
||||
// 添加告警到列表
|
||||
function addAlarm(alarm) {
|
||||
// 确保alarm对象包含所有必要字段
|
||||
const completeAlarm = {
|
||||
id: `alarm-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`, // 生成唯一ID
|
||||
carId: alarm.carId || alarm.vehicleId || alarm.objectId || '未知车辆',
|
||||
carType: alarm.carType || alarm.vehicleType || alarm.objectType || '未知类型',
|
||||
time: alarm.time || formatTimeRange(new Date()),
|
||||
description: alarm.description || '未知告警',
|
||||
date: alarm.date || formatDateTime(new Date()),
|
||||
level: alarm.level || 'medium', // high, medium, low
|
||||
type: alarm.type || 'other', // car(冲突), report(越界), speed(超速), other
|
||||
...alarm // 保留原始字段
|
||||
};
|
||||
|
||||
// 添加到列表开头
|
||||
alarmList.value.unshift(completeAlarm);
|
||||
|
||||
// 限制列表长度
|
||||
if (alarmList.value.length > maxAlarmCount) {
|
||||
alarmList.value = alarmList.value.slice(0, maxAlarmCount);
|
||||
}
|
||||
|
||||
// 如果告警面板已打开，更新告警面板
|
||||
updateAlarmNotification();
|
||||
|
||||
return completeAlarm.id; // 返回告警ID，便于后续引用
|
||||
}
|
||||
|
||||
// 更新告警
|
||||
function updateAlarm(alarmId, updates) {
|
||||
const index = alarmList.value.findIndex(alarm => alarm.id === alarmId);
|
||||
if (index !== -1) {
|
||||
alarmList.value[index] = { ...alarmList.value[index], ...updates };
|
||||
updateAlarmNotification();
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
// 删除告警
|
||||
function removeAlarm(alarmId) {
|
||||
const index = alarmList.value.findIndex(alarm => alarm.id === alarmId);
|
||||
if (index !== -1) {
|
||||
alarmList.value.splice(index, 1);
|
||||
updateAlarmNotification();
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
// 清空告警列表
|
||||
function clearAlarms() {
|
||||
alarmList.value = [];
|
||||
updateAlarmNotification();
|
||||
}
|
||||
|
||||
// 更新告警面板
|
||||
function updateAlarmNotification() {
|
||||
if (alarmNotification.value) {
|
||||
alarmNotification.value.updateAlarmList(alarmList.value);
|
||||
}
|
||||
}
|
||||
|
||||
// 切换告警面板显示状态
|
||||
function toggleAlarmNotification() {
|
||||
alarmVisible.value = !alarmVisible.value;
|
||||
if (alarmNotification.value) {
|
||||
if (alarmVisible.value) {
|
||||
alarmNotification.value.show();
|
||||
} else {
|
||||
alarmNotification.value.hide();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 处理告警面板关闭事件
|
||||
function handleAlarmClose() {
|
||||
alarmVisible.value = false;
|
||||
console.log('告警面板已关闭');
|
||||
}
|
||||
|
||||
// 格式化时间范围，例如：T10:20-10:25
|
||||
function formatTimeRange(date, durationMinutes = 5) {
|
||||
const startTime = new Date(date);
|
||||
const endTime = new Date(date);
|
||||
endTime.setMinutes(endTime.getMinutes() + durationMinutes);
|
||||
|
||||
const startHour = startTime.getHours().toString().padStart(2, '0');
|
||||
const startMinute = startTime.getMinutes().toString().padStart(2, '0');
|
||||
const endHour = endTime.getHours().toString().padStart(2, '0');
|
||||
const endMinute = endTime.getMinutes().toString().padStart(2, '0');
|
||||
|
||||
return `T${startHour}:${startMinute}-${endHour}:${endMinute}`;
|
||||
}
|
||||
|
||||
// 格式化日期时间，例如：2025-03-19 10:30
|
||||
function formatDateTime(date) {
|
||||
const year = date.getFullYear();
|
||||
const month = (date.getMonth() + 1).toString().padStart(2, '0');
|
||||
const day = date.getDate().toString().padStart(2, '0');
|
||||
const hour = date.getHours().toString().padStart(2, '0');
|
||||
const minute = date.getMinutes().toString().padStart(2, '0');
|
||||
|
||||
return `${year}-${month}-${day} ${hour}:${minute}`;
|
||||
}
|
||||
|
||||
// 处理告警显示
|
||||
function handleAlertShow({ message, type, duration = 5000 }) {
|
||||
if (alertTimer) {
|
||||
@ -814,6 +926,17 @@ function handlePathConflictAlert(payload) {
|
||||
const warningMessage = `预警：${message}`;
|
||||
showAlert(warningMessage, 'warning', 8000);
|
||||
|
||||
// 添加到告警列表
|
||||
addAlarm({
|
||||
carId: vehicleId,
|
||||
carType: vehicles.value[vehicleId]?.type || '未知类型',
|
||||
time: `${formatTimeRange(new Date())}与${otherVehicleId}发生冲`,
|
||||
description: '突预警',
|
||||
level: 'medium',
|
||||
type: 'car',
|
||||
rawData: payload
|
||||
});
|
||||
|
||||
// 在地图上标记该车辆的预警状态
|
||||
if (vehicles.value[vehicleId]) {
|
||||
vehicles.value[vehicleId].warning = true;
|
||||
@ -834,6 +957,17 @@ function handlePathConflictAlert(payload) {
|
||||
const alertMessage = `⚠️ 告警：${message}`;
|
||||
showAlert(alertMessage, 'alarm', 10000);
|
||||
|
||||
// 添加到告警列表
|
||||
addAlarm({
|
||||
carId: vehicleId,
|
||||
carType: vehicles.value[vehicleId]?.type || '未知类型',
|
||||
time: `${formatTimeRange(new Date())}与${otherVehicleId}发生冲`,
|
||||
description: '突告警',
|
||||
level: 'high',
|
||||
type: 'car',
|
||||
rawData: payload
|
||||
});
|
||||
|
||||
// 在地图上标记该车辆的告警状态
|
||||
if (vehicles.value[vehicleId]) {
|
||||
vehicles.value[vehicleId].alarm = true;
|
||||
@ -906,6 +1040,20 @@ function handleSpeedViolation(vehicleId, payload) {
|
||||
// 显示超速告警提示
|
||||
showAlert(`⚠️ 超速告警：${vehicleId} ${description}`, 'warning', 8000);
|
||||
|
||||
// 添加到告警列表，提供更详细的信息
|
||||
addAlarm({
|
||||
carId: vehicleId,
|
||||
carType: vehicles.value[vehicleId]?.type || '未知类型',
|
||||
time: `${formatTimeRange(new Date())}超速行驶`,
|
||||
description: `，速度达到${actualValue}km/h`,
|
||||
level: actualValue > limitValue * 1.5 ? 'high' : 'medium', // 超速50%以上为高级别告警
|
||||
type: 'speed',
|
||||
limitValue: limitValue,
|
||||
actualValue: actualValue,
|
||||
ruleName: ruleName,
|
||||
rawData: payload
|
||||
});
|
||||
|
||||
// 在地图上标记该车辆的超速状态
|
||||
if (vehicles.value[vehicleId]) {
|
||||
// 避免重复设置超速状态导致闪烁
|
||||
@ -1018,6 +1166,17 @@ function handleUnauthorizedEntry(vehicleId, payload) {
|
||||
// 显示越界告警提示
|
||||
showAlert(`⚠️ 越界告警：${vehicleId} ${description}`, 'critical', 10000);
|
||||
|
||||
// 添加到告警列表
|
||||
addAlarm({
|
||||
carId: vehicleId,
|
||||
carType: vehicles.value[vehicleId]?.type || '未知类型',
|
||||
time: `${formatTimeRange(new Date())}越界`,
|
||||
description: '越界告警',
|
||||
level: 'high',
|
||||
type: 'access',
|
||||
rawData: payload
|
||||
});
|
||||
|
||||
// 在地图上标记该车辆的越界状态
|
||||
if (vehicles.value[vehicleId]) {
|
||||
vehicles.value[vehicleId].critical = true;
|
||||
@ -1496,6 +1655,40 @@ defineExpose({
|
||||
|
||||
removeAircraftRoute(flightNo) {
|
||||
return removeAircraftRoute(flightNo);
|
||||
},
|
||||
|
||||
// 告警通知相关方法
|
||||
showAlarmNotification(message, type, duration) {
|
||||
if (alarmNotification.value) {
|
||||
alarmNotification.value.showNotification(message, type, duration);
|
||||
}
|
||||
},
|
||||
hideAlarmNotification() {
|
||||
if (alarmNotification.value) {
|
||||
alarmNotification.value.hideNotification();
|
||||
}
|
||||
},
|
||||
handleAlarmClose() {
|
||||
// 告警通知组件关闭时，可以在这里执行一些清理或状态重置
|
||||
console.log('告警通知组件已关闭');
|
||||
},
|
||||
addAlarm(alarm) {
|
||||
return addAlarm(alarm);
|
||||
},
|
||||
updateAlarm(alarmId, updates) {
|
||||
return updateAlarm(alarmId, updates);
|
||||
},
|
||||
removeAlarm(alarmId) {
|
||||
return removeAlarm(alarmId);
|
||||
},
|
||||
clearAlarms() {
|
||||
return clearAlarms();
|
||||
},
|
||||
updateAlarmNotification() {
|
||||
return updateAlarmNotification();
|
||||
},
|
||||
toggleAlarmNotification() {
|
||||
return toggleAlarmNotification();
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@ -72,62 +72,7 @@ import { ref, computed } from 'vue';
|
||||
const activeTab = ref('all');
|
||||
|
||||
// 模拟报警数据
|
||||
const alarmList = ref([
|
||||
{
|
||||
carId: 'QN001',
|
||||
carType: '驱鸟车',
|
||||
time: 'T10:20—10: 25与JD5949发生冲',
|
||||
description: '突告警',
|
||||
date: '2025-03-19 10:30',
|
||||
level: 'high',
|
||||
type: 'car'
|
||||
},
|
||||
{
|
||||
carId: 'QN001',
|
||||
carType: '驱鸟车',
|
||||
time: 'T10:20—10: 25与JD5949发生冲',
|
||||
description: '突告警',
|
||||
date: '2025-03-19 10:30',
|
||||
level: 'high',
|
||||
type: 'car'
|
||||
},
|
||||
{
|
||||
carId: 'QN001',
|
||||
carType: '驱鸟车',
|
||||
time: 'T10:20—10: 25闯入电子围',
|
||||
description: '栏监控区域，发生告警',
|
||||
date: '2025-03-19 10:30',
|
||||
level: 'medium',
|
||||
type: 'report'
|
||||
},
|
||||
{
|
||||
carId: 'QN001',
|
||||
carType: '驱鸟车',
|
||||
time: 'T10:20—10: 25闯入电子围',
|
||||
description: '栏监控区域，发生告警',
|
||||
date: '2025-03-19 10:30',
|
||||
level: 'medium',
|
||||
type: 'report'
|
||||
},
|
||||
{
|
||||
carId: 'QN002',
|
||||
carType: '牵引车',
|
||||
time: 'T10:15—10: 18超速行驶',
|
||||
description: '，速度达到85km/h',
|
||||
date: '2025-03-19 10:18',
|
||||
level: 'high',
|
||||
type: 'speed'
|
||||
},
|
||||
{
|
||||
carId: 'QN003',
|
||||
carType: '摆渡车',
|
||||
time: 'T10:22—10: 25超速行驶',
|
||||
description: '，速度达到78km/h',
|
||||
date: '2025-03-19 10:25',
|
||||
level: 'medium',
|
||||
type: 'speed'
|
||||
}
|
||||
]);
|
||||
const alarmList = ref([]);
|
||||
|
||||
// 根据当前选中的标签页过滤告警数据
|
||||
const filteredAlarms = computed(() => {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user