140 lines
6.7 KiB
TypeScript
140 lines
6.7 KiB
TypeScript
import { Head, Link, useForm } from '@inertiajs/react';
|
|
import {
|
|
FormErrors,
|
|
PageTitle,
|
|
Panel,
|
|
controlClass,
|
|
} from '@/components/procurement';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Input } from '@/components/ui/input';
|
|
import { Label } from '@/components/ui/label';
|
|
import { supplierFields } from '@/types/supplier';
|
|
import type { Supplier } from '@/types/supplier';
|
|
|
|
export default function EditSupplier({ supplier }: { supplier: Supplier }) {
|
|
const form = useForm({
|
|
name: supplier.name,
|
|
nuit: supplier.nuit,
|
|
contact: supplier.contact,
|
|
email: supplier.email,
|
|
phone: supplier.phone,
|
|
address: supplier.address,
|
|
category: supplier.category,
|
|
beneficiaries: supplier.beneficiaries,
|
|
document_references: supplier.document_references,
|
|
diligence_notes: supplier.diligence_notes,
|
|
next_review: supplier.next_review.slice(0, 10),
|
|
blocked: supplier.blocked,
|
|
version: supplier.version,
|
|
});
|
|
return (
|
|
<>
|
|
<Head title={`Editar ${supplier.name}`} />
|
|
<div className="mx-auto flex w-full max-w-4xl flex-col gap-7 p-5 lg:p-8">
|
|
<PageTitle
|
|
eyebrow="Fornecedores"
|
|
title="Editar ficha do fornecedor"
|
|
description={supplier.name}
|
|
/>
|
|
<Panel title="Dados e renovação da diligência">
|
|
<p className="mb-5 rounded-lg 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">
|
|
Alterações à ficha retiram a validação actual. Finanças
|
|
terá de rever o fornecedor antes de este voltar a ser
|
|
elegível para novas cotações.
|
|
</p>
|
|
<form
|
|
className="space-y-5"
|
|
onSubmit={(e) => {
|
|
e.preventDefault();
|
|
form.put(`/fornecedores/${supplier.id}`);
|
|
}}
|
|
>
|
|
<FormErrors errors={form.errors} />
|
|
<div className="grid gap-4 md:grid-cols-2">
|
|
{Object.entries(supplierFields).map(
|
|
([key, label]) => {
|
|
const name =
|
|
key as keyof typeof supplierFields;
|
|
const multiline = [
|
|
'beneficiaries',
|
|
'document_references',
|
|
'diligence_notes',
|
|
'address',
|
|
].includes(key);
|
|
return (
|
|
<div className="space-y-2" key={key}>
|
|
<Label htmlFor={`supplier-${key}`}>
|
|
{label}
|
|
</Label>
|
|
{multiline ? (
|
|
<textarea
|
|
id={`supplier-${key}`}
|
|
required
|
|
className={`${controlClass} h-24 py-2`}
|
|
value={form.data[name]}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
name,
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
) : (
|
|
<Input
|
|
id={`supplier-${key}`}
|
|
required
|
|
type={
|
|
key === 'email'
|
|
? 'email'
|
|
: key ===
|
|
'next_review'
|
|
? 'date'
|
|
: 'text'
|
|
}
|
|
value={form.data[name]}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
name,
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
)}
|
|
</div>
|
|
);
|
|
},
|
|
)}
|
|
</div>
|
|
<label className="flex items-center gap-3 text-sm">
|
|
<input
|
|
type="checkbox"
|
|
checked={form.data.blocked}
|
|
onChange={(e) =>
|
|
form.setData('blocked', e.target.checked)
|
|
}
|
|
/>
|
|
Fornecedor consta da lista de impedidos
|
|
</label>
|
|
<div className="flex justify-end gap-3">
|
|
<Button asChild variant="outline">
|
|
<Link href={`/fornecedores/${supplier.id}`}>
|
|
Cancelar
|
|
</Link>
|
|
</Button>
|
|
<Button disabled={form.processing}>
|
|
Guardar alterações
|
|
</Button>
|
|
</div>
|
|
</form>
|
|
</Panel>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
EditSupplier.layout = {
|
|
breadcrumbs: [
|
|
{ title: 'Fornecedores', href: '/fornecedores' },
|
|
{ title: 'Editar ficha', href: '#' },
|
|
],
|
|
};
|