fix: Correction de l'affichage des numéros de téléphone [#41]

This commit is contained in:
Luc SORIGNET
2025-04-11 16:59:15 +02:00
parent a157d53932
commit 4f774c18e4
11 changed files with 125 additions and 174 deletions

View File

@ -10,6 +10,8 @@ import SectionTitle from '@/components/SectionTitle';
import ProgressStep from '@/components/ProgressStep';
import logger from '@/utils/logger';
import Popup from '@/components/Popup';
import InputPhone from '../InputPhone';
import { PhoneLabel } from '../PhoneLabel';
const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, registrationFees, tuitionFees, profiles, onSubmit, currentStep, groups, showOnlyStep2 = false }) => {
const [formData, setFormData] = useState(() => {
@ -66,7 +68,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
const isStep1Valid = formData.studentLastName && formData.studentFirstName;
const isStep2Valid = (
formData.selectedGuardians.length > 0 ||
formData.selectedGuardians.length > 0 ||
(!formData.emailError && formData.guardianEmail.length > 0 && filteredStudents.length === 0)
);
const isStep3Valid = formData.selectedRegistrationFees?.length > 0;
@ -127,7 +129,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
const validateAndSubmit = async () => {
const existingProfile = profiles.find(profile => profile.email === formData.guardianEmail);
if (existingProfile) {
console.log('existingProfile : ', existingProfile);
await setFormData((prevData) => ({
@ -137,7 +139,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
existingProfileId: existingProfile.id,
}));
}
// Utiliser la dernière version de formData via formDataRef
logger.debug('Submitting form data:', formDataRef.current);
onSubmit(formDataRef.current);
@ -146,7 +148,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
const nextStep = async () => {
if (step === 2) {
const existingProfile = profiles.find(profile => profile.email === formData.guardianEmail);
if (existingProfile) {
console.log('existingProfile : ', existingProfile);
await setFormData((prevData) => ({
@ -157,7 +159,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
}));
}
}
if (!showOnlyStep2 && step < steps.length) {
setStep(step + 1);
}
@ -184,16 +186,16 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
const selectedGuardians = isSelected
? prevData.selectedGuardians.filter(id => id !== guardianId) // Retirer le guardian si déjà sélectionné
: [...prevData.selectedGuardians, guardianId]; // Ajouter le guardian s'il n'est pas sélectionné
// Mettre à jour l'email uniquement si un guardian est sélectionné
const updatedGuardianEmail = isSelected ? '' : guardianEmail;
// Si aucun guardian n'est sélectionné, réinitialiser le tableau des élèves
if (selectedGuardians.length === 0) {
setFilteredStudents(students); // Réafficher tous les élèves
setSelectedEleve(null);
}
return {
...prevData,
selectedGuardians,
@ -361,11 +363,9 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
onChange={handleChange}
className="w-full mt-4"
/>
<InputTextIcon
<InputPhone
name="guardianPhone"
type="tel"
IconItem={Phone}
placeholder="Numéro de téléphone (optionnel)"
label={t('Numéro de téléphone (optionnel)')}
value={formData.guardianPhone}
onChange={handleChange}
className="w-full mt-4"
@ -385,7 +385,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
setFormData((prevData) => ({
...prevData,
guardianEmail: email,
emailError:
emailError:
email.length > 0 && // Le champ de mail est non null
(!emailRegex.test(email) && filteredStudents.length === 0) // Format invalide ou aucun résultat
? "Format d'email invalide ou aucun élève trouvé"
@ -661,7 +661,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
<tbody>
<tr>
<td className="px-4 py-2 border">{formData.guardianEmail}</td>
<td className="px-4 py-2 border">{formData.guardianPhone}</td>
<td className="px-4 py-2 border"><PhoneLabel phoneNumber={formData.guardianPhone} /></td>
</tr>
</tbody>
</table>
@ -781,7 +781,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
</>
)}
</div>
<Popup
visible={popupVisible}
message={popupMessage}

View File

@ -2,8 +2,8 @@ import React from 'react';
import SelectChoice from '@/components/SelectChoice';
export default function PaymentMethodSelector({ formData, title, name, updateFormField, selected, paymentModes, paymentModesOptions, amount, getError }) {
console.log(paymentModes)
console.log(selected)
//console.log(paymentModes)
//console.log(selected)
return (
<div className="bg-white p-6 rounded-lg shadow-sm border border-gray-200">
{/* Titre */}

View File

@ -3,7 +3,6 @@ import InputPhone from '@/components/InputPhone';
import Button from '@/components/Button';
import React from 'react';
import { useTranslations } from 'next-intl';
import 'react-phone-number-input/style.css'
import { Trash2, Plus } from 'lucide-react';
export default function ResponsableInputFields({guardians, onGuardiansChange, addGuardian, deleteGuardian, errors = []}) {