Изменения в логике получения данных по датчикам из бэкенда, изменение тултипа сенсора для исправления получения данных на реальные

This commit is contained in:
2026-02-04 00:02:37 +03:00
parent 79e4845870
commit f275db88c9
15 changed files with 2644 additions and 83 deletions

View File

@@ -55,13 +55,69 @@ const DetectorMenu: React.FC<DetectorMenuProps> = ({ detector, isOpen, onClose,
? latestTimestamp.toLocaleString('ru-RU', { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit' })
: 'Нет данных'
// Данные для графика за последние 3 дня (мок данные)
const chartData: { timestamp: string; value: number }[] = [
{ timestamp: new Date(Date.now() - 3 * 24 * 60 * 60 * 1000).toISOString(), value: 75 },
{ timestamp: new Date(Date.now() - 2 * 24 * 60 * 60 * 1000).toISOString(), value: 82 },
{ timestamp: new Date(Date.now() - 1 * 24 * 60 * 60 * 1000).toISOString(), value: 78 },
{ timestamp: new Date().toISOString(), value: 85 },
]
// Данные для графика за последний месяц из реальных notifications
const chartData = React.useMemo(() => {
const notifications = detector.notifications ?? []
const DAYS_COUNT = 30 // Последний месяц
if (notifications.length === 0) {
// Если нет уведомлений, возвращаем пустой график
return Array.from({ length: DAYS_COUNT }, (_, i) => ({
timestamp: new Date(Date.now() - (DAYS_COUNT - 1 - i) * 24 * 60 * 60 * 1000).toISOString(),
critical: 0,
warning: 0,
}))
}
// Группируем уведомления по дням за последний месяц
const now = new Date()
const monthAgo = new Date(now.getTime() - DAYS_COUNT * 24 * 60 * 60 * 1000)
// Создаём карту: дата -> { critical: count, warning: count }
const dayMap: Record<string, { critical: number; warning: number }> = {}
// Инициализируем все дни нулями
for (let i = 0; i < DAYS_COUNT; i++) {
const date = new Date(monthAgo.getTime() + i * 24 * 60 * 60 * 1000)
const dateKey = date.toISOString().split('T')[0]
dayMap[dateKey] = { critical: 0, warning: 0 }
}
// Подсчитываем уведомления по дням
notifications.forEach(notification => {
// Детальное логирование для GLE-1
if (detector.serial_number === 'GLE-1') {
console.log('[DetectorMenu] Full notification object for GLE-1:', JSON.stringify(notification, null, 2))
}
const notifDate = new Date(notification.timestamp)
if (notifDate >= monthAgo && notifDate <= now) {
const dateKey = notifDate.toISOString().split('T')[0]
if (dayMap[dateKey]) {
const notifType = String(notification.type || '').toLowerCase()
if (notifType === 'critical') {
dayMap[dateKey].critical++
} else if (notifType === 'warning') {
dayMap[dateKey].warning++
} else {
// Если тип не распознан, логируем
console.warn('[DetectorMenu] Unknown notification type:', notification.type, 'Full notification:', JSON.stringify(notification, null, 2))
}
}
}
})
// Преобразуем в массив для графика
return Object.keys(dayMap)
.sort()
.map(dateKey => ({
timestamp: dateKey,
label: new Date(dateKey).toLocaleDateString('ru-RU', { day: '2-digit', month: '2-digit' }),
critical: dayMap[dateKey].critical,
warning: dayMap[dateKey].warning,
}))
}, [detector.notifications])
// Определение типа детектора и его отображаемого названия
const rawDetectorTypeCode = (detector.detector_type || '').toUpperCase()
@@ -262,9 +318,9 @@ const DetectorMenu: React.FC<DetectorMenuProps> = ({ detector, isOpen, onClose,
</div>
<DetailsSection compact={true} />
{/* График за последние 3 дня */}
{/* График за последний месяц */}
<div className="mt-3">
<div className="text-[rgb(113,113,122)] text-[11px] mb-2">График за 3 дня</div>
<div className="text-[rgb(113,113,122)] text-[11px] mb-2">График за месяц</div>
<div className="min-h-[100px]">
<AreaChart data={chartData} />
</div>
@@ -304,9 +360,9 @@ const DetectorMenu: React.FC<DetectorMenuProps> = ({ detector, isOpen, onClose,
{/* Секция с детальной информацией о детекторе */}
<DetailsSection />
{/* График за последние 3 дня */}
{/* График за последний месяц */}
<div className="mt-6">
<h4 className="text-white text-base font-medium mb-4">График за последние 3 дня</h4>
<h4 className="text-white text-base font-medium mb-4">График за последний месяц</h4>
<div className="min-h-[200px] bg-[rgb(22,24,36)] rounded-lg p-4">
<AreaChart data={chartData} />
</div>