124 lines
5.7 KiB
TypeScript
124 lines
5.7 KiB
TypeScript
import { Head, Link } from '@inertiajs/react';
|
|
import { InventoryNotice } from '@/components/inventory';
|
|
import { PageTitle, Panel } from '@/components/procurement';
|
|
import { date } from '@/types/procurement';
|
|
import { quantity, qualityStates, receiptStates } from '@/types/inventory';
|
|
import type { Receipt, StockMovement } from '@/types/inventory';
|
|
|
|
export default function ReceiptShow({
|
|
receipt,
|
|
movements,
|
|
}: {
|
|
receipt: Receipt;
|
|
movements: StockMovement[];
|
|
}) {
|
|
return (
|
|
<>
|
|
<Head title={receipt.number} />
|
|
<div className="mx-auto flex w-full max-w-6xl flex-col gap-7 p-5 lg:p-8">
|
|
<PageTitle
|
|
eyebrow={receipt.snapshot.order.number}
|
|
title={receipt.number}
|
|
description={`${receipt.snapshot.supplier.name} · ${receiptStates[receipt.status]}`}
|
|
/>
|
|
<InventoryNotice />
|
|
<Panel title="Confirmação preservada">
|
|
<dl className="grid gap-5 text-sm sm:grid-cols-3">
|
|
<div>
|
|
<dt className="text-muted-foreground">
|
|
Guia de remessa
|
|
</dt>
|
|
<dd>{receipt.delivery_note}</dd>
|
|
</div>
|
|
<div>
|
|
<dt className="text-muted-foreground">
|
|
Recebido em / por
|
|
</dt>
|
|
<dd>
|
|
{date(receipt.received_on)} ·{' '}
|
|
{receipt.snapshot.receiver.name}
|
|
</dd>
|
|
</div>
|
|
<div>
|
|
<dt className="text-muted-foreground">Armazém</dt>
|
|
<dd>
|
|
{receipt.snapshot.warehouse?.name ??
|
|
'Sem entrada física'}
|
|
</dd>
|
|
</div>
|
|
</dl>
|
|
</Panel>
|
|
<Panel title="Quantidade, qualidade e divergências">
|
|
<div className="space-y-5">
|
|
{receipt.items.map((line) => (
|
|
<div
|
|
className="rounded-lg border p-4 text-sm"
|
|
key={line.id}
|
|
>
|
|
<h3 className="font-semibold">
|
|
{line.snapshot.order_item.description} ·{' '}
|
|
{qualityStates[line.quality_status]}
|
|
</h3>
|
|
<p className="mt-2">
|
|
Recebido: {quantity(line.received_milli)} ·
|
|
Aceite: {quantity(line.accepted_milli)} ·
|
|
Rejeitado: {quantity(line.rejected_milli)}{' '}
|
|
{line.snapshot.order_item.unit}
|
|
</p>
|
|
<p className="mt-2 text-muted-foreground">
|
|
{line.snapshot.stock_item
|
|
? `${line.snapshot.stock_item.code} · ${line.snapshot.stock_item.name}`
|
|
: line.snapshot.physical
|
|
? 'Sem quantidade aceite em stock.'
|
|
: 'Serviço, sem movimento físico.'}
|
|
</p>
|
|
{line.notes && (
|
|
<p className="mt-3 whitespace-pre-wrap">
|
|
{line.notes}
|
|
</p>
|
|
)}
|
|
</div>
|
|
))}
|
|
</div>
|
|
</Panel>
|
|
<Panel title="Entradas ligadas a esta recepção">
|
|
<div className="space-y-3">
|
|
{movements.map((movement) => (
|
|
<p className="text-sm" key={movement.id}>
|
|
Movimento #{movement.id} · +
|
|
{quantity(movement.quantity_milli)}{' '}
|
|
{movement.snapshot.stock_item.unit} ·{' '}
|
|
{movement.snapshot.stock_item.code} ·{' '}
|
|
{movement.snapshot.warehouse.name}
|
|
</p>
|
|
))}
|
|
{movements.length === 0 && (
|
|
<p className="text-sm text-muted-foreground">
|
|
Não houve entradas de bens aceites nesta
|
|
confirmação.
|
|
</p>
|
|
)}
|
|
</div>
|
|
<p className="mt-4 text-xs text-muted-foreground">
|
|
A confirmação e os movimentos não podem ser editados ou
|
|
eliminados. Repetir a mesma confirmação não cria novas
|
|
entradas.
|
|
</p>
|
|
</Panel>
|
|
<Link
|
|
href={`/ordens/${receipt.purchase_order_id}/recepcoes`}
|
|
className="text-sm text-teal-700 dark:text-teal-400"
|
|
>
|
|
Consultar a ordem e as quantidades pendentes
|
|
</Link>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
ReceiptShow.layout = {
|
|
breadcrumbs: [
|
|
{ title: 'Recepção', href: '/recepcoes' },
|
|
{ title: 'Confirmação', href: '#' },
|
|
],
|
|
};
|