sysadminix/aerbim-ht-monitor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

New api and zone management; highligh occlusion and highlighAll functionality; improved search in reports and alerts history + autofill; refactored alert panel

Browse Source
This commit is contained in:
iv_vuytsik
2025-12-25 03:10:21 +03:00
parent 31030f2997
commit ce7e39debf
36 changed files with 1562 additions and 472 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/components/reports/ReportsList.tsx
View File

@@ -43,13 +43,12 @@ interface DetectorsDataType {
interface ReportsListProps {
objectId?: string;
detectorsData: DetectorsDataType;
initialSearchTerm?: string;
}
const ReportsList: React.FC<ReportsListProps> = ({ detectorsData }) => {
const [searchTerm, setSearchTerm] = useState('');
const ReportsList: React.FC<ReportsListProps> = ({ detectorsData, initialSearchTerm = '' }) => {
const [searchTerm, setSearchTerm] = useState(initialSearchTerm);
const [statusFilter, setStatusFilter] = useState('all');
const [priorityFilter] = useState('all');
const [acknowledgedFilter] = useState('all');
const allNotifications = useMemo(() => {
const notifications: NotificationType[] = [];
@@ -70,20 +69,12 @@ const ReportsList: React.FC<ReportsListProps> = ({ detectorsData }) => {
}, [detectorsData]);
const filteredDetectors = useMemo(() => {
return allNotifications.filter(notification => {
const matchesSearch = notification.detector_name.toLowerCase().includes(searchTerm.toLowerCase()) ||
notification.location.toLowerCase().includes(searchTerm.toLowerCase()) ||
notification.message.toLowerCase().includes(searchTerm.toLowerCase());
const matchesStatus = statusFilter === 'all' || notification.type === statusFilter;
const matchesPriority = priorityFilter === 'all' || notification.priority === priorityFilter;
const matchesAcknowledged = acknowledgedFilter === 'all' ||
(acknowledgedFilter === 'acknowledged' && notification.acknowledged) ||
(acknowledgedFilter === 'unacknowledged' && !notification.acknowledged);
return matchesSearch && matchesStatus && matchesPriority && matchesAcknowledged;
return allNotifications.filter(notification => {
const matchesSearch = searchTerm === '' || notification.detector_id.toString() === searchTerm;
return matchesSearch;
});
}, [allNotifications, searchTerm, statusFilter, priorityFilter, acknowledgedFilter]);
}, [allNotifications, searchTerm]);
const getStatusColor = (type: string) => {
switch (type) {
@@ -168,7 +159,7 @@ const ReportsList: React.FC<ReportsListProps> = ({ detectorsData }) => {
<div className="relative">
<input
type="text"
placeholder="Поиск детекторов..."
placeholder="Поиск по ID детектора..."
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
className="bg-[#161824] text-white placeholder-gray-400 px-4 py-2 rounded-lg border border-gray-600 focus:border-blue-500 focus:outline-none w-64"