195 lines
8.8 KiB
TypeScript
195 lines
8.8 KiB
TypeScript
import { Head, useForm } from '@inertiajs/react';
|
|
import { FormErrors, PageTitle, Panel } from '@/components/procurement';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Input } from '@/components/ui/input';
|
|
import { Label } from '@/components/ui/label';
|
|
|
|
export default function Setup() {
|
|
const form = useForm({
|
|
name: '',
|
|
department: '',
|
|
second_name: '',
|
|
second_email: '',
|
|
second_password: '',
|
|
second_password_confirmation: '',
|
|
first_limit: '',
|
|
second_limit: '',
|
|
includes_tax: true,
|
|
});
|
|
return (
|
|
<>
|
|
<Head title="Configurar empresa" />
|
|
<div className="mx-auto flex w-full max-w-2xl flex-col gap-7 p-5 lg:p-8">
|
|
<PageTitle
|
|
eyebrow="Primeiros passos"
|
|
title="A sua empresa"
|
|
description="Configure a organização e os dois administradores iniciais. A sua conta será a primeira; indique a segunda pessoa responsável pela administração."
|
|
/>
|
|
<Panel title="Dados da organização">
|
|
<form
|
|
onSubmit={(e) => {
|
|
e.preventDefault();
|
|
form.post('/empresa/iniciar');
|
|
}}
|
|
className="space-y-5"
|
|
>
|
|
<FormErrors errors={form.errors} />
|
|
<div className="space-y-2">
|
|
<Label htmlFor="company-name">
|
|
Nome da empresa
|
|
</Label>
|
|
<Input
|
|
id="company-name"
|
|
required
|
|
maxLength={150}
|
|
value={form.data.name}
|
|
onChange={(e) =>
|
|
form.setData('name', e.target.value)
|
|
}
|
|
/>
|
|
</div>
|
|
<div className="space-y-2">
|
|
<Label htmlFor="department">
|
|
Primeiro departamento
|
|
</Label>
|
|
<Input
|
|
id="department"
|
|
required
|
|
maxLength={100}
|
|
value={form.data.department}
|
|
onChange={(e) =>
|
|
form.setData('department', e.target.value)
|
|
}
|
|
placeholder="Ex.: Administração"
|
|
/>
|
|
</div>
|
|
<fieldset className="space-y-4 rounded border p-4">
|
|
<legend className="px-2 font-medium">
|
|
Segundo administrador da empresa
|
|
</legend>
|
|
<Label>
|
|
Nome
|
|
<Input
|
|
required
|
|
value={form.data.second_name}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'second_name',
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
</Label>
|
|
<Label>
|
|
Email
|
|
<Input
|
|
required
|
|
type="email"
|
|
value={form.data.second_email}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'second_email',
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
</Label>
|
|
<Label>
|
|
Palavra-passe inicial
|
|
<Input
|
|
required
|
|
type="password"
|
|
autoComplete="new-password"
|
|
minLength={12}
|
|
value={form.data.second_password}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'second_password',
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
</Label>
|
|
<Label>
|
|
Confirmar palavra-passe
|
|
<Input
|
|
required
|
|
type="password"
|
|
autoComplete="new-password"
|
|
value={
|
|
form.data.second_password_confirmation
|
|
}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'second_password_confirmation',
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
</Label>
|
|
</fieldset>
|
|
<p className="text-sm text-muted-foreground">
|
|
Será criado um centro de custo geral. Moeda inicial:
|
|
MZN. Defina os limites de aprovação da empresa.
|
|
</p>
|
|
<fieldset className="space-y-4 rounded border p-4">
|
|
<legend className="px-2 font-medium">
|
|
Regras da empresa
|
|
</legend>
|
|
<Label>
|
|
Primeiro limite de aprovação (MZN)
|
|
<Input
|
|
required
|
|
inputMode="decimal"
|
|
pattern="[0-9]+(\.[0-9]{1,2})?"
|
|
value={form.data.first_limit}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'first_limit',
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
</Label>
|
|
<Label>
|
|
Segundo limite de aprovação (MZN)
|
|
<Input
|
|
required
|
|
inputMode="decimal"
|
|
pattern="[0-9]+(\.[0-9]{1,2})?"
|
|
value={form.data.second_limit}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'second_limit',
|
|
e.target.value,
|
|
)
|
|
}
|
|
/>
|
|
</Label>
|
|
<label className="flex items-center gap-2">
|
|
<input
|
|
type="checkbox"
|
|
checked={form.data.includes_tax}
|
|
onChange={(e) =>
|
|
form.setData(
|
|
'includes_tax',
|
|
e.target.checked,
|
|
)
|
|
}
|
|
/>
|
|
Aplicar os limites ao valor com imposto
|
|
</label>
|
|
</fieldset>
|
|
<Button disabled={form.processing}>
|
|
Criar empresa
|
|
</Button>
|
|
</form>
|
|
</Panel>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|
|
Setup.layout = {
|
|
breadcrumbs: [{ title: 'Configurar empresa', href: '/empresa/iniciar' }],
|
|
};
|