feat: Ajout des modes de paiements + création d'une commande dans le

back permettant d'initialiser des données de test (pour les tarifs)
This commit is contained in:
N3WT DE COMPET
2025-02-12 15:13:15 +01:00
parent 23203c0397
commit 0c5e3aa098
12 changed files with 299 additions and 44 deletions

View File

@ -17,8 +17,10 @@ import { createDatas,
fetchTuitionDiscounts,
fetchRegistrationFees,
fetchTuitionFees,
fetchRregistrationPaymentPlans,
fetchTuitionPaymentPlans } from '@/app/lib/schoolAction';
fetchRegistrationPaymentPlans,
fetchTuitionPaymentPlans,
fetchRegistrationPaymentModes,
fetchTuitionPaymentModes } from '@/app/lib/schoolAction';
import SidebarTabs from '@/components/SidebarTabs';
import FilesManagement from '@/components/Structure/Files/FilesManagement';
@ -38,6 +40,8 @@ export default function Page() {
const [fichiers, setFichiers] = useState([]);
const [registrationPaymentPlans, setRegistrationPaymentPlans] = useState([]);
const [tuitionPaymentPlans, setTuitionPaymentPlans] = useState([]);
const [registrationPaymentModes, setRegistrationPaymentModes] = useState([]);
const [tuitionPaymentModes, setTuitionPaymentModes] = useState([]);
const csrfToken = useCsrfToken();
@ -78,6 +82,12 @@ export default function Page() {
// Fetch data for tuition payment plans
handleTuitionPaymentPlans();
// Fetch data for registration payment modes
handleRegistrationPaymentModes();
// Fetch data for tuition payment modes
handleTuitionPaymentModes();
}, []);
const handleSpecialities = () => {
@ -145,7 +155,7 @@ export default function Page() {
};
const handleRegistrationPaymentPlans = () => {
fetchRregistrationPaymentPlans()
fetchRegistrationPaymentPlans()
.then(data => {
setRegistrationPaymentPlans(data);
})
@ -160,6 +170,22 @@ export default function Page() {
.catch(error => console.error('Error fetching tuition payment plans:', error));
};
const handleRegistrationPaymentModes = () => {
fetchRegistrationPaymentModes()
.then(data => {
setRegistrationPaymentModes(data);
})
.catch(error => console.error('Error fetching registration payment modes:', error));
};
const handleTuitionPaymentModes = () => {
fetchTuitionPaymentModes()
.then(data => {
setTuitionPaymentModes(data);
})
.catch(error => console.error('Error fetching tuition payment modes:', error));
};
const handleCreate = (url, newData, setDatas) => {
return createDatas(url, newData, csrfToken)
.then(data => {
@ -263,7 +289,10 @@ export default function Page() {
setRegistrationPaymentPlans={setRegistrationPaymentPlans}
tuitionPaymentPlans={tuitionPaymentPlans}
setTuitionPaymentPlans={setTuitionPaymentPlans}
setRegist
registrationPaymentModes={registrationPaymentModes}
setRegistrationPaymentModes={setRegistrationPaymentModes}
tuitionPaymentModes={tuitionPaymentModes}
setTuitionPaymentModes={setTuitionPaymentModes}
handleCreate={handleCreate}
handleEdit={handleEdit}
handleDelete={handleDelete}

View File

@ -6,6 +6,7 @@ import {
BE_SCHOOL_FEES_URL,
BE_SCHOOL_DISCOUNTS_URL,
BE_SCHOOL_PAYMENT_PLANS_URL,
BE_SCHOOL_PAYMENT_MODES_URL
} from '@/utils/Url';
const requestResponseHandler = async (response) => {
@ -61,7 +62,7 @@ export const fetchTuitionFees = () => {
.then(requestResponseHandler)
};
export const fetchRregistrationPaymentPlans = () => {
export const fetchRegistrationPaymentPlans = () => {
return fetch(`${BE_SCHOOL_PAYMENT_PLANS_URL}/registration`)
.then(requestResponseHandler)
}
@ -71,6 +72,16 @@ export const fetchTuitionPaymentPlans = () => {
.then(requestResponseHandler)
}
export const fetchRegistrationPaymentModes = () => {
return fetch(`${BE_SCHOOL_PAYMENT_MODES_URL}/registration`)
.then(requestResponseHandler)
}
export const fetchTuitionPaymentModes = () => {
return fetch(`${BE_SCHOOL_PAYMENT_MODES_URL}/tuition`)
.then(requestResponseHandler)
}
export const createDatas = (url, newData, csrfToken) => {
return fetch(url, {
method: 'POST',

View File

@ -1,41 +1,59 @@
import React from 'react';
import CheckBoxList from '@/components/CheckBoxList';
import { CreditCard } from 'lucide-react';
import React, { useEffect, useState } from 'react';
import { DollarSign } from 'lucide-react';
const paymentModes = [
const paymentModesOptions = [
{ id: 1, name: 'Prélèvement SEPA' },
{ id: 2, name: 'Virement' },
{ id: 3, name: 'Chèque' },
{ id: 4, name: 'Espèce' },
];
const PaymentModeSelector = ({ formData, setFormData, fieldName }) => {
const handleCheckboxChange = (event) => {
const value = parseInt(event.target.value, 10);
setFormData((prevFormData) => {
const selectedModes = prevFormData[fieldName] || [];
const newSelectedModes = selectedModes.includes(value)
? selectedModes.filter((mode) => mode !== value)
: [...selectedModes, value];
return { ...prevFormData, [fieldName]: newSelectedModes };
const PaymentModeSelector = ({ paymentModes, setPaymentModes, handleEdit, type }) => {
const [activePaymentModes, setActivePaymentModes] = useState([]);
useEffect(() => {
// Initialiser activePaymentModes avec les modes dont is_active est à true
const activeModes = paymentModes.filter(mode => mode.is_active).map(mode => mode.mode);
setActivePaymentModes(activeModes);
}, [paymentModes]);
const handleModeToggle = (modeId) => {
setActivePaymentModes((prevActiveModes) => {
const newActiveModes = prevActiveModes.includes(modeId)
? prevActiveModes.filter((mode) => mode !== modeId)
: [...prevActiveModes, modeId];
// Mettre à jour le mode de paiement dans le backend
const updatedMode = paymentModes.find(mode => mode.mode === modeId);
if (updatedMode) {
handleEdit(updatedMode.id, { ...updatedMode, is_active: !updatedMode.is_active });
}
return newActiveModes;
});
};
return (
<div className="mb-4 w-full">
<div className="flex justify-center bg-gray p-4 rounded-lg shadow-md w-full">
<CreditCard className="w-6 h-6 text-emerald-500 mr-2" />
<h2 className="text-xl font-semibold">Mode de paiement</h2>
<CheckBoxList
items={paymentModes}
formData={formData}
handleChange={handleCheckboxChange}
fieldName={fieldName}
itemLabelFunc={(item) => (
<span className="text-sm font-medium">{item.name}</span>
)}
horizontal={true}
/>
<div className="space-y-4">
<div className="flex items-center mb-4">
<DollarSign className="w-6 h-6 text-emerald-500 mr-2" />
<h2 className="text-xl font-semibold">Modes de paiement</h2>
</div>
<div className="grid grid-cols-2 gap-4 mt-4">
{paymentModesOptions.map((mode) => (
<button
key={mode.id}
type="button"
onClick={() => handleModeToggle(mode.id)}
className={`p-4 rounded-lg shadow-md text-center text-gray-700' ${
activePaymentModes.includes(mode.id)
? 'bg-emerald-300'
: 'bg-white'
} hover:bg-emerald-200`}
>
{mode.name}
</button>
))}
</div>
</div>
);

View File

@ -3,7 +3,7 @@ import FeesSection from '@/components/Structure/Tarification/FeesSection';
import DiscountsSection from '@/components/Structure/Tarification/DiscountsSection';
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 { BE_SCHOOL_FEE_URL, BE_SCHOOL_DISCOUNT_URL, BE_SCHOOL_PAYMENT_PLAN_URL, BE_SCHOOL_PAYMENT_MODE_URL } from '@/utils/Url';
import { set } from 'lodash';
const FeesManagement = ({ registrationDiscounts,
@ -18,6 +18,10 @@ const FeesManagement = ({ registrationDiscounts,
setRegistrationPaymentPlans,
tuitionPaymentPlans,
setTuitionPaymentPlans,
registrationPaymentModes,
setRegistrationPaymentModes,
tuitionPaymentModes,
setTuitionPaymentModes,
handleCreate,
handleEdit,
handleDelete }) => {
@ -75,13 +79,14 @@ const FeesManagement = ({ registrationDiscounts,
type={0}
/>
</div>
{/* <div className="col-span-1">
<div className="col-span-1 p-6 rounded-lg shadow-inner mt-4">
<PaymentModeSelector
formData={formRegistrationData}
setFormData={setFormRegistrationData}
fieldName="paymentRegistrationMode"
paymentModes={registrationPaymentModes}
setPaymentModes={setRegistrationPaymentModes}
handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_PAYMENT_MODE_URL}`, id, updatedData, setRegistrationPaymentModes)}
type={0}
/>
</div> */}
</div>
</div>
</div>
<div className="bg-white p-2 rounded-lg shadow-md">
@ -117,6 +122,14 @@ const FeesManagement = ({ registrationDiscounts,
type={1}
/>
</div>
<div className="col-span-1 p-6 rounded-lg shadow-inner mt-4">
<PaymentModeSelector
paymentModes={tuitionPaymentModes}
setPaymentModes={setTuitionPaymentModes}
handleEdit={(id, updatedData) => handleEdit(`${BE_SCHOOL_PAYMENT_MODE_URL}`, id, updatedData, setTuitionPaymentModes)}
type={1}
/>
</div>
</div>
</div>
</div>

View File

@ -39,6 +39,8 @@ export const BE_SCHOOL_DISCOUNT_URL = `${BASE_URL}/School/discount`;
export const BE_SCHOOL_DISCOUNTS_URL = `${BASE_URL}/School/discounts`;
export const BE_SCHOOL_PAYMENT_PLAN_URL = `${BASE_URL}/School/paymentPlan`;
export const BE_SCHOOL_PAYMENT_PLANS_URL = `${BASE_URL}/School/paymentPlans`;
export const BE_SCHOOL_PAYMENT_MODE_URL = `${BASE_URL}/School/paymentMode`;
export const BE_SCHOOL_PAYMENT_MODES_URL = `${BASE_URL}/School/paymentModes`;
// GESTION MESSAGERIE
export const BE_GESTIONMESSAGERIE_MESSAGES_URL = `${BASE_URL}/GestionMessagerie/messagerie`