86 lines
3.5 KiB
TypeScript
86 lines
3.5 KiB
TypeScript
import { Link } from '@inertiajs/react';
|
|
import type { Page, ReceiptProgress } from '@/types/inventory';
|
|
import { quantity, receiptStates } from '@/types/inventory';
|
|
|
|
export function InventoryNotice() {
|
|
return (
|
|
<div className="rounded-xl border border-amber-200 bg-amber-50 p-4 text-sm text-amber-900 dark:border-amber-900 dark:bg-amber-950 dark:text-amber-100">
|
|
Ambiente de desenvolvimento. Não autoriza compras reais.{' '}
|
|
<strong>O orçamento ainda não é validado.</strong>
|
|
</div>
|
|
);
|
|
}
|
|
export function ReceiptProgressTable({
|
|
progress,
|
|
}: {
|
|
progress: ReceiptProgress;
|
|
}) {
|
|
return (
|
|
<>
|
|
<p className="mb-4 text-sm font-semibold">
|
|
{receiptStates[progress.state]}
|
|
{progress.has_divergences
|
|
? ' · Existem divergências de qualidade'
|
|
: ''}
|
|
</p>
|
|
<div className="overflow-x-auto">
|
|
<table className="w-full text-left text-sm">
|
|
<thead className="border-b text-muted-foreground">
|
|
<tr>
|
|
<th className="pr-4 pb-3">Artigo</th>
|
|
<th className="pr-4">Autorizado</th>
|
|
<th className="pr-4">Recebido</th>
|
|
<th className="pr-4">Aceite</th>
|
|
<th className="pr-4">Rejeitado</th>
|
|
<th className="pr-4">Por entregar</th>
|
|
<th>Por aceitar</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{progress.lines.map((line) => (
|
|
<tr
|
|
key={line.id}
|
|
className="border-b last:border-0"
|
|
>
|
|
<td className="py-4 pr-4">
|
|
<strong>{line.description}</strong>
|
|
<p className="mt-1 text-xs text-muted-foreground">
|
|
{line.unit}
|
|
</p>
|
|
</td>
|
|
{[
|
|
line.ordered_milli,
|
|
line.received_milli,
|
|
line.accepted_milli,
|
|
line.rejected_milli,
|
|
line.delivery_pending_milli,
|
|
line.acceptance_pending_milli,
|
|
].map((value, index) => (
|
|
<td
|
|
key={index}
|
|
className="pr-4 whitespace-nowrap"
|
|
>
|
|
{quantity(value)}
|
|
</td>
|
|
))}
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
export function InventoryPagination<T>({ page }: { page: Page<T> }) {
|
|
return (
|
|
<div className="mt-4 flex gap-4 text-sm text-teal-700 dark:text-teal-400">
|
|
{page.prev_page_url && (
|
|
<Link href={page.prev_page_url}>Anterior</Link>
|
|
)}
|
|
{page.next_page_url && (
|
|
<Link href={page.next_page_url}>Seguinte</Link>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|