mirror of
https://git.v0id.ovh/n3wt-innov/n3wt-school.git
synced 2026-01-28 23:43:22 +00:00
feat: Ajout des frais de scolarité dans le dossier d'inscription [#18]
This commit is contained in:
N3WT DE COMPET
@ -17,22 +17,26 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
responsableType: 'new',
|
||||
autoMail: false,
|
||||
selectedRegistrationDiscounts: [],
|
||||
selectedRegistrationFees: registrationFees.map(fee => fee.id)
|
||||
selectedRegistrationFees: registrationFees.map(fee => fee.id),
|
||||
selectedTuitionDiscounts: [],
|
||||
selectedTuitionFees: []
|
||||
});
|
||||
|
||||
const [step, setStep] = useState(0);
|
||||
const [step, setStep] = useState(1);
|
||||
const [selectedStudent, setSelectedEleve] = useState('');
|
||||
const [existingGuardians, setExistingGuardians] = useState([]);
|
||||
const [totalRegistrationAmount, setTotalRegistrationAmount] = useState(0);
|
||||
const maxStep = 4
|
||||
const [totalTuitionAmount, setTotalTuitionAmount] = useState(0);
|
||||
const maxStep = 6
|
||||
|
||||
useEffect(() => {
|
||||
// Calcul du montant total lors de l'initialisation
|
||||
const initialTotalAmount = calculateFinalRegistrationAmount(
|
||||
// Calcul du montant total des frais d'inscription lors de l'initialisation
|
||||
const initialTotalRegistrationAmount = calculateFinalRegistrationAmount(
|
||||
registrationFees.map(fee => fee.id),
|
||||
[]
|
||||
);
|
||||
setTotalRegistrationAmount(initialTotalAmount);
|
||||
setTotalRegistrationAmount(initialTotalRegistrationAmount);
|
||||
|
||||
}, [registrationDiscounts, registrationFees]);
|
||||
|
||||
const handleToggleChange = () => {
|
||||
@ -54,7 +58,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
};
|
||||
|
||||
const prevStep = () => {
|
||||
if (step >= 1) {
|
||||
if (step > 1) {
|
||||
setStep(step - 1);
|
||||
}
|
||||
};
|
||||
@ -81,7 +85,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
onSubmit(formData);
|
||||
}
|
||||
|
||||
const handleFeeSelection = (feeId) => {
|
||||
const handleRegistrationFeeSelection = (feeId) => {
|
||||
setFormData((prevData) => {
|
||||
const selectedRegistrationFees = prevData.selectedRegistrationFees.includes(feeId)
|
||||
? prevData.selectedRegistrationFees.filter(id => id !== feeId)
|
||||
@ -90,9 +94,20 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
setTotalRegistrationAmount(finalAmount);
|
||||
return { ...prevData, selectedRegistrationFees };
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
const handleTuitionFeeSelection = (feeId) => {
|
||||
setFormData((prevData) => {
|
||||
const selectedTuitionFees = prevData.selectedTuitionFees.includes(feeId)
|
||||
? prevData.selectedTuitionFees.filter(id => id !== feeId)
|
||||
: [...prevData.selectedTuitionFees, feeId];
|
||||
const finalAmount = calculateFinalTuitionAmount(selectedTuitionFees, prevData.selectedTuitionDiscounts);
|
||||
setTotalTuitionAmount(finalAmount);
|
||||
return { ...prevData, selectedTuitionFees };
|
||||
});
|
||||
};
|
||||
|
||||
const handleDiscountSelection = (discountId) => {
|
||||
const handleRegistrationDiscountSelection = (discountId) => {
|
||||
setFormData((prevData) => {
|
||||
const selectedRegistrationDiscounts = prevData.selectedRegistrationDiscounts.includes(discountId)
|
||||
? prevData.selectedRegistrationDiscounts.filter(id => id !== discountId)
|
||||
@ -101,9 +116,20 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
setTotalRegistrationAmount(finalAmount);
|
||||
return { ...prevData, selectedRegistrationDiscounts };
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
const handleTuitionDiscountSelection = (discountId) => {
|
||||
setFormData((prevData) => {
|
||||
const selectedTuitionDiscounts = prevData.selectedTuitionDiscounts.includes(discountId)
|
||||
? prevData.selectedTuitionDiscounts.filter(id => id !== discountId)
|
||||
: [...prevData.selectedTuitionDiscounts, discountId];
|
||||
const finalAmount = calculateFinalTuitionAmount(prevData.selectedTuitionFees, selectedTuitionDiscounts);
|
||||
setTotalTuitionAmount(finalAmount);
|
||||
return { ...prevData, selectedTuitionDiscounts };
|
||||
});
|
||||
};
|
||||
|
||||
const calculateFinalRegistrationAmount = (selectedRegistrationFees, selectedRegistrationDiscounts) => {
|
||||
const calculateFinalRegistrationAmount = (selectedRegistrationFees, selectedRegistrationDiscounts) => {
|
||||
const totalFees = selectedRegistrationFees.reduce((sum, feeId) => {
|
||||
const fee = registrationFees.find(f => f.id === feeId);
|
||||
if (fee && !isNaN(parseFloat(fee.base_amount))) {
|
||||
@ -111,8 +137,6 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
}
|
||||
return sum;
|
||||
}, 0);
|
||||
|
||||
console.log(totalFees);
|
||||
|
||||
const totalDiscounts = selectedRegistrationDiscounts.reduce((sum, discountId) => {
|
||||
const discount = registrationDiscounts.find(d => d.id === discountId);
|
||||
@ -129,7 +153,33 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
const finalAmount = totalFees - totalDiscounts;
|
||||
|
||||
return finalAmount.toFixed(2);
|
||||
};
|
||||
};
|
||||
|
||||
const calculateFinalTuitionAmount = (selectedTuitionFees, selectedTuitionDiscounts) => {
|
||||
const totalFees = selectedTuitionFees.reduce((sum, feeId) => {
|
||||
const fee = tuitionFees.find(f => f.id === feeId);
|
||||
if (fee && !isNaN(parseFloat(fee.base_amount))) {
|
||||
return sum + parseFloat(fee.base_amount);
|
||||
}
|
||||
return sum;
|
||||
}, 0);
|
||||
|
||||
const totalDiscounts = selectedTuitionDiscounts.reduce((sum, discountId) => {
|
||||
const discount = tuitionDiscounts.find(d => d.id === discountId);
|
||||
if (discount) {
|
||||
if (discount.discount_type === 0 && !isNaN(parseFloat(discount.amount))) { // Currency
|
||||
return sum + parseFloat(discount.amount);
|
||||
} else if (discount.discount_type === 1 && !isNaN(parseFloat(discount.amount))) { // Percent
|
||||
return sum + (totalFees * parseFloat(discount.amount) / 100);
|
||||
}
|
||||
}
|
||||
return sum;
|
||||
}, 0);
|
||||
|
||||
const finalAmount = totalFees - totalDiscounts;
|
||||
|
||||
return finalAmount.toFixed(2);
|
||||
};
|
||||
|
||||
const isLabelAttenuated = (item) => {
|
||||
return !formData.selectedRegistrationDiscounts.includes(parseInt(item.id));
|
||||
@ -140,63 +190,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-4 mt-8">
|
||||
{step === 0 && (
|
||||
<div>
|
||||
<h2 className="text-l font-bold mb-4">Frais d'inscription</h2>
|
||||
{registrationFees.length > 0 ? (
|
||||
<>
|
||||
<div className="mb-4">
|
||||
<FeesSection
|
||||
fees={registrationFees}
|
||||
type={0}
|
||||
subscriptionMode={true}
|
||||
selectedFees={formData.selectedRegistrationFees}
|
||||
handleFeeSelection={handleFeeSelection}
|
||||
/>
|
||||
</div>
|
||||
<h2 className="text-l font-bold mb-4">Réductions</h2>
|
||||
<div className="mb-4">
|
||||
{registrationDiscounts.length > 0 ? (
|
||||
<DiscountsSection
|
||||
discounts={registrationDiscounts}
|
||||
type={0}
|
||||
subscriptionMode={true}
|
||||
selectedDiscounts={formData.selectedRegistrationDiscounts}
|
||||
handleDiscountSelection={handleDiscountSelection}
|
||||
/>
|
||||
) : (
|
||||
<p className="bg-orange-100 border border-orange-400 text-orange-700 px-4 py-3 rounded relative" role="alert">
|
||||
<strong className="font-bold">Information</strong>
|
||||
<span className="block sm:inline"> Aucune réduction n'a été créée sur les frais d'inscription.</span>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<Table
|
||||
data={[ {id: 1}]}
|
||||
columns={[
|
||||
{
|
||||
name: 'LIBELLE',
|
||||
transform: () => <span>MONTANT TOTAL</span>
|
||||
},
|
||||
{
|
||||
name: 'TOTAL',
|
||||
transform: () => <b>{totalRegistrationAmount} €</b>
|
||||
}
|
||||
]}
|
||||
defaultTheme='bg-cyan-100'
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<p className="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative" role="alert">
|
||||
<strong className="font-bold">Attention!</strong>
|
||||
<span className="block sm:inline"> Aucun frais d'inscription n'a été créé.</span>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
)}
|
||||
|
||||
<div className="space-y-4 mt-8">
|
||||
{step === 1 && (
|
||||
<div>
|
||||
<h2 className="text-l font-bold mb-4">Nouvel élève</h2>
|
||||
@ -324,6 +318,118 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
</div>
|
||||
)}
|
||||
|
||||
{step === 4 && (
|
||||
<div>
|
||||
<h2 className="text-l font-bold mb-4">Frais d'inscription</h2>
|
||||
{registrationFees.length > 0 ? (
|
||||
<>
|
||||
<div className="mb-4">
|
||||
<FeesSection
|
||||
fees={registrationFees}
|
||||
type={0}
|
||||
subscriptionMode={true}
|
||||
selectedFees={formData.selectedRegistrationFees}
|
||||
handleFeeSelection={handleRegistrationFeeSelection}
|
||||
/>
|
||||
</div>
|
||||
<h2 className="text-l font-bold mb-4">Réductions</h2>
|
||||
<div className="mb-4">
|
||||
{registrationDiscounts.length > 0 ? (
|
||||
<DiscountsSection
|
||||
discounts={registrationDiscounts}
|
||||
type={0}
|
||||
subscriptionMode={true}
|
||||
selectedDiscounts={formData.selectedRegistrationDiscounts}
|
||||
handleDiscountSelection={handleRegistrationDiscountSelection}
|
||||
/>
|
||||
) : (
|
||||
<p className="bg-orange-100 border border-orange-400 text-orange-700 px-4 py-3 rounded relative" role="alert">
|
||||
<strong className="font-bold">Information</strong>
|
||||
<span className="block sm:inline"> Aucune réduction n'a été créée sur les frais d'inscription.</span>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<Table
|
||||
data={[ {id: 1}]}
|
||||
columns={[
|
||||
{
|
||||
name: 'LIBELLE',
|
||||
transform: () => <span>MONTANT TOTAL</span>
|
||||
},
|
||||
{
|
||||
name: 'TOTAL',
|
||||
transform: () => <b>{totalRegistrationAmount} €</b>
|
||||
}
|
||||
]}
|
||||
defaultTheme='bg-cyan-100'
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<p className="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative" role="alert">
|
||||
<strong className="font-bold">Attention!</strong>
|
||||
<span className="block sm:inline"> Aucun frais d'inscription n'a été créé.</span>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
)}
|
||||
|
||||
{step === 5 && (
|
||||
<div>
|
||||
<h2 className="text-l font-bold mb-4">Frais de scolarité</h2>
|
||||
{tuitionFees.length > 0 ? (
|
||||
<>
|
||||
<div className="mb-4">
|
||||
<FeesSection
|
||||
fees={tuitionFees}
|
||||
type={1}
|
||||
subscriptionMode={true}
|
||||
selectedFees={formData.selectedTuitionFees}
|
||||
handleFeeSelection={handleTuitionFeeSelection}
|
||||
/>
|
||||
</div>
|
||||
<h2 className="text-l font-bold mb-4">Réductions</h2>
|
||||
<div className="mb-4">
|
||||
{tuitionDiscounts.length > 0 ? (
|
||||
<DiscountsSection
|
||||
discounts={tuitionDiscounts}
|
||||
type={1}
|
||||
subscriptionMode={true}
|
||||
selectedDiscounts={formData.selectedTuitionDiscounts}
|
||||
handleDiscountSelection={handleTuitionDiscountSelection}
|
||||
/>
|
||||
) : (
|
||||
<p className="bg-orange-100 border border-orange-400 text-orange-700 px-4 py-3 rounded relative" role="alert">
|
||||
<strong className="font-bold">Information</strong>
|
||||
<span className="block sm:inline"> Aucune réduction n'a été créée sur les frais de scolarité.</span>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
<Table
|
||||
data={[ {id: 1}]}
|
||||
columns={[
|
||||
{
|
||||
name: 'LIBELLE',
|
||||
transform: () => <span>MONTANT TOTAL</span>
|
||||
},
|
||||
{
|
||||
name: 'TOTAL',
|
||||
transform: () => <b>{totalTuitionAmount} €</b>
|
||||
}
|
||||
]}
|
||||
defaultTheme='bg-cyan-100'
|
||||
/>
|
||||
</>
|
||||
) : (
|
||||
<p className="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative" role="alert">
|
||||
<strong className="font-bold">Attention!</strong>
|
||||
<span className="block sm:inline"> Aucun frais de scolarité n'a été créé.</span>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
)}
|
||||
|
||||
{step === maxStep && (
|
||||
<div>
|
||||
<h2 className="text-l font-bold mb-4">Récapitulatif</h2>
|
||||
@ -399,7 +505,7 @@ const InscriptionForm = ( { students, registrationDiscounts, tuitionDiscounts, r
|
||||
)}
|
||||
|
||||
<div className="flex justify-end mt-4 space-x-4">
|
||||
{step >= 1 && (
|
||||
{step > 1 && (
|
||||
<Button text="Précédent"
|
||||
onClick={prevStep}
|
||||
className="px-4 py-2 bg-gray-300 text-gray-700 rounded-md shadow-sm hover:bg-gray-400 focus:outline-none"
|
||||
|
||||
Reference in New Issue
Block a user