import { Head, router } from '@inertiajs/react'; import { AlertTriangle, CheckCircle2, Clock3, Download, FileText, } from 'lucide-react'; import type { LucideIcon } from 'lucide-react'; import type { FormEvent } from 'react'; import { useState } from 'react'; import { PageHeading } from '@/components/page-heading'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Input } from '@/components/ui/input'; type Summary = { total: number; completed: number; incidents: number; overdue: number; utilizationHours: number; }; export default function ReportsIndex({ filters, summary, byStatus, byCategory, byDepartment, topAssets, }: { filters: { date_from: string; date_to: string }; summary: Summary; byStatus: Record; byCategory: Record; byDepartment: Record; topAssets: Record; }) { const [dateFrom, setDateFrom] = useState(filters.date_from); const [dateTo, setDateTo] = useState(filters.date_to); function filter(event: FormEvent) { event.preventDefault(); router.get('/relatorios', { date_from: dateFrom, date_to: dateTo }); } const exportUrl = `/relatorios/exportar?${new URLSearchParams({ date_from: dateFrom, date_to: dateTo })}`; return ( <>
Exportar CSV } />
); } function Metric({ icon: Icon, label, value, }: { icon: LucideIcon; label: string; value: number; }) { return (

{value}

{label}

); } function Breakdown({ title, values, }: { title: string; values: Record; }) { const max = Math.max(1, ...Object.values(values)); return ( {title} {Object.keys(values).length === 0 && (

Sem dados no período.

)} {Object.entries(values).map(([label, value]) => (
{label} {value}
))} ); } ReportsIndex.layout = { breadcrumbs: [{ title: 'Relatórios', href: '/relatorios' }], };