feat: Mise en place des paiements en plusieurs fois (partie BACK) [#25]

2026-01-29 07:53:23 +00:00 · 2025-02-11 20:48:11 +01:00
parent ffc6ce8de8
commit 23203c0397
17 changed files with 599 additions and 86 deletions
--- a/Front-End/src/components/Structure/Tarification/DiscountsSection.js
+++ b/Front-End/src/components/Structure/Tarification/DiscountsSection.js
@ -119,15 +119,17 @@ const DiscountsSection = ({ discounts, setDiscounts, handleCreate, handleEdit, h
  };

  const renderInputField = (field, value, onChange, placeholder) => (
-    <div>
-      <InputText
-        name={field}
-        type={field === 'amount' ? 'number' : 'text'}
-        value={value}
-        onChange={onChange}
-        placeholder={placeholder}
-        errorMsg={localErrors && localErrors[field] && Array.isArray(localErrors[field]) ? localErrors[field][0] : ''}
-      />
+    <div className="flex justify-center space-x-2">
+      <div className="w-full max-w-xs">
+        <InputText
+          name={field}
+          type={field === 'amount' ? 'number' : 'text'}
+          value={value}
+          onChange={onChange}
+          placeholder={placeholder}
+          errorMsg={localErrors && localErrors[field] && Array.isArray(localErrors[field]) ? localErrors[field][0] : ''}
+        />
+      </div>
    </div>
  );

@ -142,7 +144,7 @@ const DiscountsSection = ({ discounts, setDiscounts, handleCreate, handleEdit, h
          return renderInputField('name', currentData.name, handleChange, 'Libellé de la réduction');
        case 'REMISE':
          return (
-            <div className="flex items-center space-x-2">
+            <div className="flex justify-center space-x-2">
              {renderInputField('amount', currentData.amount, handleChange,'Montant')}
              
              <button
@ -270,7 +272,7 @@ const DiscountsSection = ({ discounts, setDiscounts, handleCreate, handleEdit, h
        <div className="flex justify-between items-center">
          <div className="flex items-center mb-4">
            <Tag className="w-6 h-6 text-emerald-500 mr-2" />
-            <h2 className="text-xl font-semibold">Réductions {type === 0 ? 'd\'inscription' : 'de scolarité'}</h2>
+            <h2 className="text-xl font-semibold">Liste des réductions</h2>
          </div>
          <button type="button" onClick={handleAddDiscount} className="text-emerald-500 hover:text-emerald-700">
            <Plus className="w-5 h-5" />
--- a/Front-End/src/components/Structure/Tarification/FeesManagement.js
+++ b/Front-End/src/components/Structure/Tarification/FeesManagement.js
@ -1,9 +1,26 @@
-import React from 'react';
+import React, { useState } from 'react';
 import FeesSection from '@/components/Structure/Tarification/FeesSection';
 import DiscountsSection from '@/components/Structure/Tarification/DiscountsSection';
-import { BE_SCHOOL_FEE_URL, BE_SCHOOL_DISCOUNT_URL } from '@/utils/Url';
+import PaymentPlanSelector from '@/components/PaymentPlanSelector';
+import PaymentModeSelector from '@/components/PaymentModeSelector';
+import { BE_SCHOOL_FEE_URL, BE_SCHOOL_DISCOUNT_URL, BE_SCHOOL_PAYMENT_PLAN_URL } from '@/utils/Url';
+import { set } from 'lodash';

-const FeesManagement = ({ registrationDiscounts, setRegistrationDiscounts, tuitionDiscounts, setTuitionDiscounts, registrationFees, setRegistrationFees, tuitionFees, setTuitionFees, handleCreate, handleEdit, handleDelete }) => {
+const FeesManagement = ({ registrationDiscounts, 
+                          setRegistrationDiscounts, 
+                          tuitionDiscounts, 
+                          setTuitionDiscounts, 
+                          registrationFees, 
+                          setRegistrationFees, 
+                          tuitionFees, 
+                          setTuitionFees, 
+                          registrationPaymentPlans,
+                          setRegistrationPaymentPlans,
+                          tuitionPaymentPlans,
+                          setTuitionPaymentPlans,
+                          handleCreate, 
+                          handleEdit, 
+                          handleDelete }) => {

  const handleDiscountDelete = (id, type) => {
    if (type === 0) {
@ -24,53 +41,82 @@ const FeesManagement = ({ registrationDiscounts, setRegistrationDiscounts, tuiti
  };

  return (
-    <div className="max-w-8xl mx-auto p-4 mt-6 space-y-6">
-      <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-        <div className="bg-white p-6 rounded-lg shadow-md">
-          <FeesSection
-            fees={registrationFees}
-            setFees={setRegistrationFees}
-            discounts={registrationDiscounts}
-            handleCreate={(newData) => handleCreate(`${BE_SCHOOL_FEE_URL}`, newData, setRegistrationFees)}
-            handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_FEE_URL}`, id, updatedData, setRegistrationFees)}
-            handleDelete={(id) => handleDelete(`${BE_SCHOOL_FEE_URL}`, id, setRegistrationFees)}
-            type={0}
-          />
-        </div>
-        <div className="bg-white p-6 rounded-lg shadow-md">
-          <DiscountsSection
-            discounts={registrationDiscounts}
-            setDiscounts={setRegistrationDiscounts}
-            handleCreate={(newData) => handleCreate(`${BE_SCHOOL_DISCOUNT_URL}`, newData, setRegistrationDiscounts)}
-            handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_DISCOUNT_URL}`, id, updatedData, setRegistrationDiscounts)}
-            handleDelete={(id) => handleDelete(`${BE_SCHOOL_DISCOUNT_URL}`, id, setRegistrationDiscounts)}
-            onDiscountDelete={(id) => handleDiscountDelete(id, 0)}
-            type={0}
-          />
+    <div className="w-full mx-auto p-2 mt-6 space-y-6">
+      <div className="bg-white p-2 rounded-lg shadow-md">
+        <h2 className="text-2xl font-semibold mb-4">Frais d'inscription</h2>
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+          <div className="col-span-1 p-6 rounded-lg shadow-inner mt-4">
+            <FeesSection
+              fees={registrationFees}
+              setFees={setRegistrationFees}
+              discounts={registrationDiscounts}
+              handleCreate={(newData) => handleCreate(`${BE_SCHOOL_FEE_URL}`, newData, setRegistrationFees)}
+              handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_FEE_URL}`, id, updatedData, setRegistrationFees)}
+              handleDelete={(id) => handleDelete(`${BE_SCHOOL_FEE_URL}`, id, setRegistrationFees)}
+              type={0}
+            />
+          </div>
+          <div className="col-span-1 p-6 rounded-lg shadow-inner mt-4">
+            <DiscountsSection
+              discounts={registrationDiscounts}
+              setDiscounts={setRegistrationDiscounts}
+              handleCreate={(newData) => handleCreate(`${BE_SCHOOL_DISCOUNT_URL}`, newData, setRegistrationDiscounts)}
+              handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_DISCOUNT_URL}`, id, updatedData, setRegistrationDiscounts)}
+              handleDelete={(id) => handleDelete(`${BE_SCHOOL_DISCOUNT_URL}`, id, setRegistrationDiscounts)}
+              onDiscountDelete={(id) => handleDiscountDelete(id, 0)}
+              type={0}
+            />
+          </div>
+          <div className="col-span-1 p-6 rounded-lg shadow-inner mt-4">
+            <PaymentPlanSelector
+              paymentPlans={registrationPaymentPlans}
+              setPaymentPlans={setRegistrationPaymentPlans}
+              handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_PAYMENT_PLAN_URL}`, id, updatedData, setRegistrationPaymentPlans)}
+              type={0}
+            />
+          </div>
+          {/* <div className="col-span-1">
+            <PaymentModeSelector
+              formData={formRegistrationData}
+              setFormData={setFormRegistrationData}
+              fieldName="paymentRegistrationMode"
+            />
+          </div> */}
        </div>
      </div>
-      <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
-        <div className="bg-white p-6 rounded-lg shadow-md">
-          <FeesSection
-            fees={tuitionFees}
-            setFees={setTuitionFees}
-            discounts={tuitionDiscounts}
-            handleCreate={(newData) => handleCreate(`${BE_SCHOOL_FEE_URL}`, newData, setTuitionFees)}
-            handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_FEE_URL}`, id, updatedData, setTuitionFees)}
-            handleDelete={(id) => handleDelete(`${BE_SCHOOL_FEE_URL}`, id, setTuitionFees)}
-            type={1}
-          />
-        </div>
-        <div className="bg-white p-6 rounded-lg shadow-md">
-          <DiscountsSection
-            discounts={tuitionDiscounts}
-            setDiscounts={setTuitionDiscounts}
-            handleCreate={(newData) => handleCreate(`${BE_SCHOOL_DISCOUNT_URL}`, newData, setTuitionDiscounts)}
-            handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_DISCOUNT_URL}`, id, updatedData, setTuitionDiscounts)}
-            handleDelete={(id) => handleDelete(`${BE_SCHOOL_DISCOUNT_URL}`, id, setTuitionDiscounts)}
-            onDiscountDelete={(id) => handleDiscountDelete(id, 1)}
-            type={1}
-          />
+      <div className="bg-white p-2 rounded-lg shadow-md">
+      <h2 className="text-2xl font-semibold mb-4">Frais de scolarité</h2>
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+          <div className="col-span-1 p-6 rounded-lg shadow-inner mt-4">
+            <FeesSection
+              fees={tuitionFees}
+              setFees={setTuitionFees}
+              discounts={tuitionDiscounts}
+              handleCreate={(newData) => handleCreate(`${BE_SCHOOL_FEE_URL}`, newData, setTuitionFees)}
+              handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_FEE_URL}`, id, updatedData, setTuitionFees)}
+              handleDelete={(id) => handleDelete(`${BE_SCHOOL_FEE_URL}`, id, setTuitionFees)}
+              type={1}
+            />
+          </div>
+          <div className="col-span-1 p-6 rounded-lg shadow-inner mt-4">
+            <DiscountsSection
+              discounts={tuitionDiscounts}
+              setDiscounts={setTuitionDiscounts}
+              handleCreate={(newData) => handleCreate(`${BE_SCHOOL_DISCOUNT_URL}`, newData, setTuitionDiscounts)}
+              handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_DISCOUNT_URL}`, id, updatedData, setTuitionDiscounts)}
+              handleDelete={(id) => handleDelete(`${BE_SCHOOL_DISCOUNT_URL}`, id, setTuitionDiscounts)}
+              onDiscountDelete={(id) => handleDiscountDelete(id, 1)}
+              type={1}
+            />
+          </div>
+          <div className="col-span-1 p-6 rounded-lg shadow-inner mt-4">
+            <PaymentPlanSelector
+              paymentPlans={tuitionPaymentPlans}
+              setPaymentPlans={setTuitionPaymentPlans}
+              handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_PAYMENT_PLAN_URL}`, id, updatedData, setRegistrationPaymentPlans)}
+              type={1}
+            />
+          </div>
        </div>
      </div>
    </div>
--- a/Front-End/src/components/Structure/Tarification/FeesSection.js
+++ b/Front-End/src/components/Structure/Tarification/FeesSection.js
@ -120,15 +120,17 @@ const FeesSection = ({ fees, setFees, discounts, handleCreate, handleEdit, handl
  };

  const renderInputField = (field, value, onChange, placeholder) => (
-    <div className="flex justify-center items-center h-full">
-      <InputText
-        name={field}
-        type={field === 'base_amount' ? 'number' : 'text'}
-        value={value}
-        onChange={onChange}
-        placeholder={placeholder}
-        errorMsg={getError(field)}
-      />
+    <div className="flex justify-center space-x-2">
+      <div className="w-full max-w-xs">
+        <InputText
+          name={field}
+          type={field === 'base_amount' ? 'number' : 'text'}
+          value={value}
+          onChange={onChange}
+          placeholder={placeholder}
+          errorMsg={getError(field)}
+        />
+      </div>
    </div>
  );

@ -259,7 +261,7 @@ const FeesSection = ({ fees, setFees, discounts, handleCreate, handleEdit, handl
      <div className="flex justify-between items-center">
        <div className="flex items-center mb-4">
          <CreditCard className="w-6 h-6 text-emerald-500 mr-2" />
-          <h2 className="text-xl font-semibold">{labelTypeFrais}</h2>
+          <h2 className="text-xl font-semibold">Liste des frais</h2>
        </div>
        <button type="button" onClick={handleAddFee} className="text-emerald-500 hover:text-emerald-700">
          <Plus className="w-5 h-5" />