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

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>