184 lines
7.4 KiB
TypeScript
184 lines
7.4 KiB
TypeScript
import { useForm } from '@inertiajs/react';
|
|
import { Management, Field, button, control } from '../management/shared';
|
|
import type { Owner } from './types';
|
|
|
|
export default function Convert({
|
|
interest,
|
|
investors,
|
|
owners,
|
|
journeyInvestorId,
|
|
}: {
|
|
interest: {
|
|
id: number;
|
|
reference: string;
|
|
full_name: string;
|
|
sector_interest: string;
|
|
};
|
|
investors: { id: string; legal_name: string }[];
|
|
owners: Owner[];
|
|
journeyInvestorId?: string | null;
|
|
}) {
|
|
const form = useForm({
|
|
investor_id: journeyInvestorId ?? '',
|
|
legal_name: '',
|
|
investor_type: '',
|
|
owner_user_id: '',
|
|
title: `${interest.reference} — ${interest.sector_interest}`,
|
|
next_action: '',
|
|
due_at: '',
|
|
});
|
|
return (
|
|
<Management title="Converter pedido em lead">
|
|
{journeyInvestorId && (
|
|
<p>
|
|
O investidor da jornada original está seleccionado. A
|
|
conversão preserva essa identidade.
|
|
</p>
|
|
)}
|
|
<p>
|
|
{interest.reference} · Contacto: {interest.full_name}
|
|
</p>
|
|
<p>
|
|
Seleccione um investidor existente ou identifique explicitamente
|
|
o novo investidor. O nome do contacto não é assumido como
|
|
denominação de uma empresa.
|
|
</p>
|
|
<form
|
|
className="max-w-2xl space-y-4"
|
|
onSubmit={(e) => {
|
|
e.preventDefault();
|
|
form.transform((data) => ({
|
|
...data,
|
|
due_at: data.due_at
|
|
? new Date(data.due_at).toISOString()
|
|
: '',
|
|
}));
|
|
form.post(`/management/crm/convert/${interest.id}`);
|
|
}}
|
|
>
|
|
<fieldset disabled={form.processing} className="space-y-4">
|
|
<Field
|
|
label="Investidor existente"
|
|
error={form.errors.investor_id}
|
|
>
|
|
<select
|
|
className={control}
|
|
value={form.data.investor_id}
|
|
onChange={(e) =>
|
|
form.setData('investor_id', e.target.value)
|
|
}
|
|
>
|
|
<option value="">Criar novo investidor</option>
|
|
{investors.map((investor) => (
|
|
<option key={investor.id} value={investor.id}>
|
|
{investor.legal_name}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</Field>
|
|
{!form.data.investor_id && (
|
|
<>
|
|
<Field
|
|
label="Nome legal do investidor"
|
|
error={form.errors.legal_name}
|
|
>
|
|
<input
|
|
className={control}
|
|
value={form.data.legal_name}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'legal_name',
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
</Field>
|
|
<Field
|
|
label="Tipo de investidor"
|
|
error={form.errors.investor_type}
|
|
>
|
|
<select
|
|
className={control}
|
|
value={form.data.investor_type}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'investor_type',
|
|
e.target.value,
|
|
)
|
|
}
|
|
>
|
|
<option value="">Seleccione</option>
|
|
<option value="domestic">Nacional</option>
|
|
<option value="foreign">Estrangeiro</option>
|
|
<option value="institutional">
|
|
Institucional
|
|
</option>
|
|
<option value="individual">
|
|
Individual
|
|
</option>
|
|
</select>
|
|
</Field>
|
|
</>
|
|
)}
|
|
<Field
|
|
label="Responsável"
|
|
error={form.errors.owner_user_id}
|
|
>
|
|
<select
|
|
className={control}
|
|
value={form.data.owner_user_id}
|
|
onChange={(e) =>
|
|
form.setData('owner_user_id', e.target.value)
|
|
}
|
|
>
|
|
<option value="">Seleccione</option>
|
|
{owners.map((owner) => (
|
|
<option key={owner.id} value={owner.id}>
|
|
{owner.name}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</Field>
|
|
<Field label="Título do lead" error={form.errors.title}>
|
|
<input
|
|
className={control}
|
|
value={form.data.title}
|
|
onChange={(e) =>
|
|
form.setData('title', e.target.value)
|
|
}
|
|
/>
|
|
</Field>
|
|
<Field
|
|
label="Próxima acção"
|
|
error={form.errors.next_action}
|
|
>
|
|
<input
|
|
className={control}
|
|
value={form.data.next_action}
|
|
onChange={(e) =>
|
|
form.setData('next_action', e.target.value)
|
|
}
|
|
/>
|
|
</Field>
|
|
<Field
|
|
label="Prazo (hora local)"
|
|
error={form.errors.due_at}
|
|
>
|
|
<input
|
|
type="datetime-local"
|
|
className={control}
|
|
value={form.data.due_at}
|
|
onChange={(e) =>
|
|
form.setData('due_at', e.target.value)
|
|
}
|
|
/>
|
|
</Field>
|
|
<button className={button} disabled={form.processing}>
|
|
{form.processing ? 'A converter…' : 'Converter em lead'}
|
|
</button>
|
|
</fieldset>
|
|
</form>
|
|
</Management>
|
|
);
|
|
}
|