refactor: Refactorisation du login et de admin/subscription

This commit is contained in:
Luc SORIGNET
2025-01-12 16:34:32 +01:00
parent 427b6c7588
commit 41aa9d55d3
14 changed files with 254 additions and 250 deletions

View File

@ -25,19 +25,19 @@ export default function InscriptionFormShared({
const [formData, setFormData] = useState(() => ({
id: initialData?.id || '',
nom: initialData?.nom || '',
prenom: initialData?.prenom || '',
adresse: initialData?.adresse || '',
dateNaissance: initialData?.dateNaissance || '',
lieuNaissance: initialData?.lieuNaissance || '',
codePostalNaissance: initialData?.codePostalNaissance || '',
nationalite: initialData?.nationalite || '',
medecinTraitant: initialData?.medecinTraitant || '',
niveau: initialData?.niveau || ''
last_name: initialData?.last_name || '',
first_name: initialData?.first_name || '',
address: initialData?.address || '',
birth_date: initialData?.birth_date || '',
birth_place: initialData?.birth_place || '',
birth_postal_code: initialData?.birth_postal_code || '',
nationality: initialData?.nationality || '',
attending_physician: initialData?.attending_physician || '',
level: initialData?.level || ''
}));
const [responsables, setReponsables] = useState(() =>
initialData?.responsables || []
const [guardians, setGuardians] = useState(() =>
initialData?.guardians || []
);
const [uploadedFiles, setUploadedFiles] = useState([]);
@ -47,17 +47,17 @@ export default function InscriptionFormShared({
if (initialData) {
setFormData({
id: initialData.id || '',
nom: initialData.nom || '',
prenom: initialData.prenom || '',
adresse: initialData.adresse || '',
dateNaissance: initialData.dateNaissance || '',
lieuNaissance: initialData.lieuNaissance || '',
codePostalNaissance: initialData.codePostalNaissance || '',
nationalite: initialData.nationalite || '',
medecinTraitant: initialData.medecinTraitant || '',
niveau: initialData.niveau || ''
last_name: initialData.last_name || '',
first_name: initialData.first_name || '',
address: initialData.address || '',
birth_date: initialData.birth_date || '',
birth_place: initialData.birth_place || '',
birth_postal_code: initialData.birth_postal_code || '',
nationality: initialData.nationality || '',
attending_physician: initialData.attending_physician || '',
level: initialData.level || ''
});
setReponsables(initialData.responsables || []);
setGuardians(initialData.guardians || []);
}
}, [initialData]);
@ -71,16 +71,17 @@ export default function InscriptionFormShared({
const handleSubmit = (e) => {
e.preventDefault();
onSubmit({
eleve: {
const data ={
student: {
...formData,
responsables
guardians
}
});
}
onSubmit(data);
};
const columns = [
{ name: 'Nom du fichier', transform: (row) => row.nom },
{ name: 'Nom du fichier', transform: (row) => row.last_name },
{ name: 'Actions', transform: (row) => (
<a href={URL.createObjectURL(row.fichier)} target='_blank' className="text-blue-500 hover:text-blue-700">
Télécharger
@ -99,64 +100,64 @@ export default function InscriptionFormShared({
<h2 className="text-xl font-bold mb-4 text-gray-800">Informations de l'élève</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
<InputText
name="nom"
name="last_name"
label="Nom"
value={formData.nom}
onChange={(e) => updateFormField('nom', e.target.value)}
value={formData.last_name}
onChange={(e) => updateFormField('last_name', e.target.value)}
required
/>
<InputText
name="prenom"
name="first_name"
label="Prénom"
value={formData.prenom}
onChange={(e) => updateFormField('prenom', e.target.value)}
value={formData.first_name}
onChange={(e) => updateFormField('first_name', e.target.value)}
required
/>
<InputText
name="nationalite"
name="nationality"
label="Nationalité"
value={formData.nationalite}
onChange={(e) => updateFormField('nationalite', e.target.value)}
value={formData.nationality}
onChange={(e) => updateFormField('nationality', e.target.value)}
/>
<InputText
name="dateNaissance"
name="birth_date"
type="date"
label="Date de Naissance"
value={formData.dateNaissance}
onChange={(e) => updateFormField('dateNaissance', e.target.value)}
value={formData.birth_date}
onChange={(e) => updateFormField('birth_date', e.target.value)}
required
/>
<InputText
name="lieuNaissance"
name="birth_place"
label="Lieu de Naissance"
value={formData.lieuNaissance}
onChange={(e) => updateFormField('lieuNaissance', e.target.value)}
value={formData.birth_place}
onChange={(e) => updateFormField('birth_place', e.target.value)}
/>
<InputText
name="codePostalNaissance"
name="birth_postal_code"
label="Code Postal de Naissance"
value={formData.codePostalNaissance}
onChange={(e) => updateFormField('codePostalNaissance', e.target.value)}
value={formData.birth_postal_code}
onChange={(e) => updateFormField('birth_postal_code', e.target.value)}
/>
<div className="md:col-span-2">
<InputText
name="adresse"
name="address"
label="Adresse"
value={formData.adresse}
onChange={(e) => updateFormField('adresse', e.target.value)}
value={formData.address}
onChange={(e) => updateFormField('address', e.target.value)}
/>
</div>
<InputText
name="medecinTraitant"
name="attending_physician"
label="Médecin Traitant"
value={formData.medecinTraitant}
onChange={(e) => updateFormField('medecinTraitant', e.target.value)}
value={formData.attending_physician}
onChange={(e) => updateFormField('attending_physician', e.target.value)}
/>
<SelectChoice
name="niveau"
name="level"
label="Niveau"
selected={formData.niveau}
callback={(e) => updateFormField('niveau', e.target.value)}
selected={formData.level}
callback={(e) => updateFormField('level', e.target.value)}
choices={niveaux}
required
/>
@ -167,21 +168,21 @@ export default function InscriptionFormShared({
<div className="bg-white p-6 rounded-lg shadow-sm border border-gray-200">
<h2 className="text-xl font-bold mb-4 text-gray-800">Responsables</h2>
<ResponsableInputFields
responsables={responsables}
onResponsablesChange={(id, field, value) => {
const updatedResponsables = responsables.map(resp =>
guardians={guardians}
onGuardiansChange={(id, field, value) => {
const updatedGuardians = guardians.map(resp =>
resp.id === id ? { ...resp, [field]: value } : resp
);
setReponsables(updatedResponsables);
setGuardians(updatedGuardians);
}}
addResponsible={(e) => {
addGuardian={(e) => {
e.preventDefault();
setReponsables([...responsables, { id: Date.now() }]);
setGuardians([...guardians, { id: Date.now() }]);
}}
deleteResponsable={(index) => {
const newArray = [...responsables];
deleteGuardian={(index) => {
const newArray = [...guardians];
newArray.splice(index, 1);
setReponsables(newArray);
setGuardians(newArray);
}}
/>
</div>

View File

@ -5,19 +5,19 @@ import React from 'react';
import { useTranslations } from 'next-intl';
import 'react-phone-number-input/style.css'
export default function ResponsableInputFields({responsables, onResponsablesChange, addResponsible, deleteResponsable}) {
export default function ResponsableInputFields({guardians, onGuardiansChange, addGuardian, deleteGuardian}) {
const t = useTranslations('ResponsableInputFields');
return (
<div className="space-y-8">
{responsables.map((item, index) => (
{guardians.map((item, index) => (
<div className="p-6 bg-gray-50 rounded-lg shadow-sm" key={index}>
<div className='flex justify-between items-center mb-4'>
<h3 className='text-xl font-bold'>{t('responsable')} {index+1}</h3>
{responsables.length > 1 && (
{guardians.length > 1 && (
<Button
text={t('delete')}
onClick={() => deleteResponsable(index)}
onClick={() => deleteGuardian(index)}
className="w-32"
/>
)}
@ -31,15 +31,15 @@ export default function ResponsableInputFields({responsables, onResponsablesChan
name="nomResponsable"
type="text"
label={t('lastname')}
value={item.nom}
onChange={(event) => {onResponsablesChange(item.id, "nom", event.target.value)}}
value={item.last_name}
onChange={(event) => {onGuardiansChange(item.id, "last_name", event.target.value)}}
/>
<InputText
name="prenomResponsable"
type="text"
label={t('firstname')}
value={item.prenom}
onChange={(event) => {onResponsablesChange(item.id, "prenom", event.target.value)}}
value={item.first_name}
onChange={(event) => {onGuardiansChange(item.id, "first_name", event.target.value)}}
/>
</div>
@ -48,14 +48,14 @@ export default function ResponsableInputFields({responsables, onResponsablesChan
name="mailResponsable"
type="email"
label={t('email')}
value={item.mail}
onChange={(event) => {onResponsablesChange(item.id, "mail", event.target.value)}}
value={item.email}
onChange={(event) => {onGuardiansChange(item.id, "email", event.target.value)}}
/>
<InputPhone
name="telephoneResponsable"
label={t('phone')}
value={item.telephone}
onChange={(event) => {onResponsablesChange(item.id, "telephone", event)}}
value={item.phone}
onChange={(event) => {onGuardiansChange(item.id, "phone", event)}}
/>
</div>
@ -64,15 +64,15 @@ export default function ResponsableInputFields({responsables, onResponsablesChan
name="dateNaissanceResponsable"
type="date"
label={t('birthdate')}
value={item.dateNaissance}
onChange={(event) => {onResponsablesChange(item.id, "dateNaissance", event.target.value)}}
value={item.birth_date}
onChange={(event) => {onGuardiansChange(item.id, "birth_date", event.target.value)}}
/>
<InputText
name="professionResponsable"
type="text"
label={t('profession')}
value={item.profession}
onChange={(event) => {onResponsablesChange(item.id, "profession", event.target.value)}}
onChange={(event) => {onGuardiansChange(item.id, "profession", event.target.value)}}
/>
</div>
@ -81,8 +81,8 @@ export default function ResponsableInputFields({responsables, onResponsablesChan
name="adresseResponsable"
type="text"
label={t('address')}
value={item.adresse}
onChange={(event) => {onResponsablesChange(item.id, "adresse", event.target.value)}}
value={item.address}
onChange={(event) => {onGuardiansChange(item.id, "address", event.target.value)}}
/>
</div>
</div>
@ -91,7 +91,7 @@ export default function ResponsableInputFields({responsables, onResponsablesChan
<div className="flex justify-center">
<Button
text={t('add_responsible')}
onClick={(e) => addResponsible(e)}
onClick={(e) => addGuardian(e)}
primary
icon={<i className="icon profile-add" />}
type="button"