139 lines
5.3 KiB
TypeScript
139 lines
5.3 KiB
TypeScript
import { useForm } from '@inertiajs/react';
|
|
import { createOperationKey } from '@/lib/operation-key';
|
|
import { button, card, input } from '@/pages/investment/shared';
|
|
import type { DeskDocument, DeskPayment } from './desk-internal-operations';
|
|
|
|
export default function DeskPaymentDocumentForm({
|
|
requestId,
|
|
payment,
|
|
documents,
|
|
}: {
|
|
requestId: string;
|
|
payment: DeskPayment;
|
|
documents: DeskDocument[];
|
|
}) {
|
|
const form = useForm({
|
|
version: payment.version,
|
|
document_link_id: '',
|
|
reason: '',
|
|
consent: false,
|
|
client_key: createOperationKey(),
|
|
});
|
|
return (
|
|
<form
|
|
className={card + ' space-y-3'}
|
|
onSubmit={(event) => {
|
|
event.preventDefault();
|
|
if (form.processing || form.data.version !== payment.version)
|
|
return;
|
|
form.put(
|
|
`/balcao-virtual/pedidos/${requestId}/pagamentos/${payment.id}/comprovativo`,
|
|
{
|
|
onSuccess: () => {
|
|
form.reset('document_link_id', 'reason', 'consent');
|
|
form.setData('version', form.data.version + 1);
|
|
form.setData('client_key', createOperationKey());
|
|
},
|
|
},
|
|
);
|
|
}}
|
|
>
|
|
<h4 className="font-bold">
|
|
{payment.document_id
|
|
? 'Corrigir comprovativo deste registo'
|
|
: 'Juntar comprovativo a este registo'}
|
|
</h4>
|
|
<p>
|
|
A referência, o valor e a moeda já registados são conservados. O
|
|
comprovativo ficará por conferir; o histórico da conferência
|
|
anterior é preservado.
|
|
</p>
|
|
{form.data.version !== payment.version && (
|
|
<p role="alert">
|
|
Este registo foi actualizado. Confira a versão actual antes
|
|
de continuar.{' '}
|
|
<button
|
|
type="button"
|
|
disabled={form.processing}
|
|
onClick={() => {
|
|
form.setData('version', payment.version);
|
|
form.setData('client_key', createOperationKey());
|
|
form.setData('consent', false);
|
|
}}
|
|
>
|
|
Usar versão actual, conservando a selecção
|
|
</button>
|
|
</p>
|
|
)}
|
|
<label className="block">
|
|
Comprovativo já associado ao pedido ou dossier
|
|
<select
|
|
className={input}
|
|
required
|
|
disabled={form.processing}
|
|
value={form.data.document_link_id}
|
|
onChange={(event) => {
|
|
form.setData('document_link_id', event.target.value);
|
|
form.setData('client_key', createOperationKey());
|
|
form.setData('consent', false);
|
|
}}
|
|
>
|
|
<option value="">Seleccione o documento de suporte</option>
|
|
{documents.map((doc) => (
|
|
<option key={doc.id} value={doc.id}>
|
|
{doc.file_name} · versão{' '}
|
|
{doc.version_no ?? 'por confirmar'} ·{' '}
|
|
{doc.source_reference}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</label>
|
|
<p>
|
|
Se o original ainda não está associado, utilize os anexos do
|
|
pedido ou os documentos do dossier e regresse a este registo.
|
|
</p>
|
|
<label className="block">
|
|
Motivo da associação ou correcção
|
|
<textarea
|
|
className={input}
|
|
required
|
|
minLength={3}
|
|
maxLength={3000}
|
|
disabled={form.processing}
|
|
value={form.data.reason}
|
|
onChange={(event) => {
|
|
form.setData('reason', event.target.value);
|
|
form.setData('client_key', createOperationKey());
|
|
form.setData('consent', false);
|
|
}}
|
|
/>
|
|
</label>
|
|
<label className="flex gap-2">
|
|
<input
|
|
type="checkbox"
|
|
required
|
|
disabled={form.processing}
|
|
checked={form.data.consent}
|
|
onChange={(event) =>
|
|
form.setData('consent', event.target.checked)
|
|
}
|
|
/>
|
|
Autorizo associar este comprovativo ao registo existente.
|
|
</label>
|
|
<button
|
|
className={button}
|
|
disabled={
|
|
form.processing || form.data.version !== payment.version
|
|
}
|
|
>
|
|
Guardar comprovativo no mesmo registo
|
|
</button>
|
|
{Object.entries(form.errors).map(([key, error]) => (
|
|
<p role="alert" key={key}>
|
|
{error}
|
|
</p>
|
|
))}
|
|
</form>
|
|
);
|
|
}
|