klg-asutk-app/components/dashboard/DashboardStats.tsx

49 lines
2.6 KiB
TypeScript
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

'use client';
import { StatCard } from '@/components/ui';
interface Props {
aircraftStats: { total: number; active: number; maintenance: number; types: Map<string, number> };
risksStats: { total: number; critical: number; high: number; medium: number; low: number };
auditsStats: { current: number; upcoming: number; completed: number };
onNavigate: (path: string) => void;
}
export default function DashboardStats({ aircraftStats, risksStats, auditsStats, onNavigate }: Props) {
return (
<div className="space-y-6">
{/* Aircraft */}
<section>
<h3 className="text-lg font-bold mb-3"> Воздушные суда</h3>
<div className="grid grid-cols-2 lg:grid-cols-4 gap-3">
<StatCard label="Всего ВС" value={aircraftStats.total} border="border-l-primary-500" icon="✈️" onClick={() => onNavigate('/aircraft')} />
<StatCard label="Активных" value={aircraftStats.active} border="border-l-green-500" />
<StatCard label="На ТО" value={aircraftStats.maintenance} border="border-l-orange-500" onClick={() => onNavigate('/maintenance')} />
<StatCard label="Типов ВС" value={aircraftStats.types.size} border="border-l-blue-500" />
</div>
</section>
{/* Risks */}
<section>
<h3 className="text-lg font-bold mb-3"> Предупреждения о рисках</h3>
<div className="grid grid-cols-2 lg:grid-cols-5 gap-3">
<StatCard label="Всего" value={risksStats.total} border="border-l-gray-400" onClick={() => onNavigate('/risks')} />
<StatCard label="Критических" value={risksStats.critical} border="border-l-red-600" />
<StatCard label="Высоких" value={risksStats.high} border="border-l-orange-500" />
<StatCard label="Средних" value={risksStats.medium} border="border-l-yellow-500" />
<StatCard label="Низких" value={risksStats.low} border="border-l-green-500" />
</div>
</section>
{/* Audits */}
<section>
<h3 className="text-lg font-bold mb-3">🔍 Аудиты</h3>
<div className="grid grid-cols-2 lg:grid-cols-3 gap-3">
<StatCard label="В процессе" value={auditsStats.current} border="border-l-blue-500" onClick={() => onNavigate('/audits')} />
<StatCard label="Запланировано" value={auditsStats.upcoming} border="border-l-purple-500" />
<StatCard label="Завершено" value={auditsStats.completed} border="border-l-green-500" />
</div>
</section>
</div>
);
}