acasini/n3wt-school
1
0
Fork 0
mirror of https://git.v0id.ovh/n3wt-innov/n3wt-school.git synced 2026-01-29 16:03:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: Upload du SEPA par les parents / Création d'un composant header

Browse Source 
pour les titres de tableau
This commit is contained in:
N3WT DE COMPET
2025-04-20 19:19:27 +02:00
parent 59aee80c2e
commit 8417d3eb14
28 changed files with 893 additions and 695 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
Front-End/src/app/[locale]/admin/structure/page.js
View File

@ -22,7 +22,7 @@ import {
fetchTuitionPaymentPlans,
fetchRegistrationPaymentModes,
fetchTuitionPaymentModes } from '@/app/actions/schoolAction';
import { fetchProfileRoles, fetchProfiles } from '@/app/actions/authAction';
import { fetchProfiles } from '@/app/actions/authAction';
import SidebarTabs from '@/components/SidebarTabs';
import FilesGroupsManagement from '@/components/Structure/Files/FilesGroupsManagement';
import { fetchRegistrationSchoolFileMasters } from "@/app/actions/registerFileGroupAction";
@ -258,7 +258,7 @@ export default function Page() {
const tabs = [
{
id: 'Configuration',
label: "Configuration de l'école",
label: "Classes",
content: (
<StructureManagement
specialities={specialities}
@ -276,7 +276,7 @@ export default function Page() {
},
{
id: 'Schedule',
label: "Gestion de l'emploi du temps",
label: "Emploi du temps",
content: (
<ClassesProvider>
<ScheduleManagement
@ -288,7 +288,7 @@ export default function Page() {
},
{
id: 'Fees',
label: 'Tarifications',
label: 'Tarifs',
content: (
<FeesManagement
registrationDiscounts={registrationDiscounts}
@ -315,13 +315,13 @@ export default function Page() {
},
{
id: 'Files',
label: 'Documents d\'inscription',
label: 'Documents',
content: <FilesGroupsManagement csrfToken={csrfToken} selectedEstablishmentId={selectedEstablishmentId} />
}
];
return (
<div className='p-8'>
<div className='p-4'>
<DjangoCSRFToken csrfToken={csrfToken} />
<div className="w-full p-4">

77
Front-End/src/app/[locale]/admin/subscriptions/page.js
View File

@ -9,7 +9,7 @@ import Popup from '@/components/Popup';
import Loader from '@/components/Loader';
import AlertWithModal from '@/components/AlertWithModal';
import DropdownMenu from "@/components/DropdownMenu";
import { MoreVertical, Send, Edit, Archive, FileText, CircleCheck, Plus, XCircle } from 'lucide-react';
import { MoreVertical, Send, Edit, Archive, FileText, CheckCircle, Plus, XCircle } from 'lucide-react';
import Modal from '@/components/Modal';
import InscriptionForm from '@/components/Inscription/InscriptionForm'
import AffectationClasseForm from '@/components/AffectationClasseForm'
@ -606,35 +606,62 @@ useEffect(()=>{
const actions = {
1: [
{
icon: <Edit className="w-5 h-5 text-blue-500 hover:text-blue-700" />,
icon: (
<span title="Editer le dossier">
<Edit className="w-5 h-5 text-blue-500 hover:text-blue-700" />
</span>
),
onClick: () => window.location.href = `${FE_ADMIN_SUBSCRIPTIONS_EDIT_URL}?studentId=${row.student.id}&id=1`,
},
{
icon: <Send className="w-5 h-5 text-green-500 hover:text-green-700" />,
icon: (
<span title="Envoyer le dossier">
<Send className="w-5 h-5 text-green-500 hover:text-green-700" />
</span>
),
onClick: () => sendConfirmRegisterForm(row.student.id, row.student.last_name, row.student.first_name),
},
],
2: [
{
icon: <Edit className="w-5 h-5 text-blue-500 hover:text-blue-700" />,
icon: (
<span title="Editer le dossier">
<Edit className="w-5 h-5 text-blue-500 hover:text-blue-700" />
</span>
),
onClick: () => window.location.href = `${FE_ADMIN_SUBSCRIPTIONS_EDIT_URL}?studentId=${row.student.id}&id=1`,
},
],
3: [
{
icon: <CircleCheck className="w-5 h-5 text-green-500 hover:text-green-700" />,
onClick: () => window.location.href = `${FE_ADMIN_SUBSCRIPTIONS_VALIDATE_URL}?studentId=${row.student.id}&firstName=${row.student.first_name}&lastName=${row.student.last_name}&paymentMode=${row.registration_payment}&file=${row.registration_file}`,
icon: (
<span title="Valider le dossier">
<CheckCircle className="w-5 h-5 text-green-500 hover:text-green-700" />
</span>
),
onClick: () => {
const paymentSepa = row.registration_payment === 1 || row.tuition_payment === 1 ? 1 : 0;
window.location.href = `${FE_ADMIN_SUBSCRIPTIONS_VALIDATE_URL}?studentId=${row.student.id}&firstName=${row.student.first_name}&lastName=${row.student.last_name}&paymentSepa=${paymentSepa}&file=${row.registration_file}`
}
},
],
5: [
{
icon: <CircleCheck className="w-5 h-5 text-green-500 hover:text-green-700" />,
icon: (
<span title="Valider le dossier">
<CheckCircle className="w-5 h-5 text-green-500 hover:text-green-700" />
</span>
),
onClick: () => openModalAssociationEleve(row.student),
},
],
default: [
{
icon: <Archive className="w-5 h-5 text-gray-500 hover:text-gray-700" />,
icon: (
<span title="Archiver le dossier">
<Archive className="w-5 h-5 text-gray-500 hover:text-gray-700" />
</span>
),
onClick: () => archiveFicheInscription(row.student.id, row.student.last_name, row.student.first_name),
},
],
@ -674,15 +701,35 @@ const columns = [
</div>
)
},
{ name: t('files'), transform: (row) =>
(row.registration_file != null) &&(
<ul>
<li className="flex justify-center items-center gap-2">
{ name: t('files'), transform: (row) => (
<ul>
{row.registration_file && (
<li className="flex justify-center items-center gap-2">
<FileText size={16} />
<a href={ `${BASE_URL}${row.registration_file}`} target='_blank'>{row.registration_file?.split('/').pop()}</a>
<a
href={`${BASE_URL}${row.registration_file}`}
target="_blank"
rel="noopener noreferrer"
>
{row.registration_file?.split('/').pop()}
</a>
</li>
)}
{row.sepa_file && (
<li className="flex justify-center items-center gap-2">
<FileText size={16} />
<a
href={`${BASE_URL}${row.sepa_file}`}
target="_blank"
rel="noopener noreferrer"
>
{row.sepa_file?.split('/').pop()}
</a>
</li>
)}
</ul>
) },
)
},
{ name: 'Actions',
transform: (row) => (
<div className="flex justify-center space-x-2">
@ -728,7 +775,7 @@ const columnsSubscribed = [
items={[
{ label: (
<>
<CircleCheck size={16} className="mr-2" /> Rattacher
<CheckCircle size={16} className="mr-2" /> Rattacher
</>
),
onClick: () => openModalAssociationEleve(row.student)

4
Front-End/src/app/[locale]/admin/subscriptions/validateSubscription/page.js
View File

@ -15,7 +15,7 @@ export default function Page() {
const studentId = searchParams.get('studentId');
const firstName = searchParams.get('firstName');
const lastName = searchParams.get('lastName');
const paymentMode = searchParams.get('paymentMode');
const paymentSepa = searchParams.get('paymentSepa') === '1';
const file = searchParams.get('file');
const csrfToken = useCsrfToken();
@ -45,7 +45,7 @@ export default function Page() {
studentId={studentId}
firstName={firstName}
lastName={lastName}
paymentMode={paymentMode}
paymentSepa={paymentSepa}
file={file}
onAccept={handleAcceptRF}
/>

118
Front-End/src/app/[locale]/parents/page.js
View File

@ -2,14 +2,16 @@
import React, { useEffect, useState } from 'react';
import { useRouter } from 'next/navigation';
import Table from '@/components/Table';
import { Edit3, Users, Download, Eye } from 'lucide-react';
import { Edit3, Users, Download, Eye, Upload, CheckCircle } from 'lucide-react';
import StatusLabel from '@/components/StatusLabel';
import FileUpload from '@/components/FileUpload';
import { FE_PARENTS_EDIT_INSCRIPTION_URL } from '@/utils/Url';
import { fetchChildren } from '@/app/actions/subscriptionAction';
import { fetchChildren, sendSEPARegisterForm } from '@/app/actions/subscriptionAction';
import logger from '@/utils/logger';
import { useSession } from 'next-auth/react';
import { FE_USERS_LOGIN_URL, BASE_URL } from '@/utils/Url';
import { useEstablishment } from '@/context/EstablishmentContext';
import { useCsrfToken } from '@/context/CsrfContext';
export default function ParentHomePage() {
const [children, setChildren] = useState([]);
@ -18,8 +20,11 @@ export default function ParentHomePage() {
const [currentPage, setCurrentPage] = useState(1);
const [establishments, setEstablishments] = useState([]);
const { selectedEstablishmentId, setSelectedEstablishmentId } = useEstablishment();
const [uploadingStudentId, setUploadingStudentId] = useState(null); // ID de l'étudiant pour l'upload
const [uploadedFile, setUploadedFile] = useState(null); // Fichier uploadé
const [uploadState, setUploadState] = useState("off"); // État "on" ou "off" pour l'affichage du composant
const router = useRouter();
const csrfToken = useCsrfToken();
useEffect(() => {
if (status === 'loading') return;
@ -55,22 +60,57 @@ export default function ParentHomePage() {
};
function handleView(eleveId) {
// Logique pour éditer le dossier de l'élève
logger.debug(`View dossier for student id: ${eleveId}`);
router.push(`${FE_PARENTS_EDIT_INSCRIPTION_URL}?id=${userId}&studentId=${eleveId}&view=true`);
}
function handleEdit(eleveId) {
// Logique pour éditer le dossier de l'élève
logger.debug(`Edit dossier for student id: ${eleveId}`);
router.push(`${FE_PARENTS_EDIT_INSCRIPTION_URL}?id=${userId}&studentId=${eleveId}`);
}
const actionColumns = [
{ name: 'Action', transform: (row) => row.action },
];
const handleFileUpload = (file) => {
if (!file) {
logger.error('Aucun fichier sélectionné pour l\'upload.');
return;
}
setUploadedFile(file); // Conserve le fichier en mémoire
logger.debug('Fichier sélectionné :', file.name);
};
const handleSubmit = () => {
if (!uploadedFile || !uploadingStudentId) {
logger.error('Aucun fichier ou étudiant sélectionné.');
return;
}
const formData = new FormData();
formData.append('sepa_file', uploadedFile); // Ajoute le fichier SEPA
formData.append('status', 3); // Statut à envoyer
sendSEPARegisterForm(uploadingStudentId, formData, csrfToken)
.then((response) => {
logger.debug('RF mis à jour avec succès:', response);
// Logique supplémentaire après la mise à jour (par exemple, redirection ou notification)
})
.catch((error) => {
logger.error('Erreur lors de la mise à jour du RF:', error);
});
};
const toggleUpload = (studentId) => {
if (uploadingStudentId === studentId && uploadState === "on") {
// Si le composant est déjà affiché pour cet étudiant, on le masque
setUploadState("off");
setUploadingStudentId(null);
setUploadedFile(null); // Réinitialise le fichier
} else {
// Sinon, on l'affiche pour cet étudiant
setUploadState("on");
setUploadingStudentId(studentId);
}
};
// Définir les colonnes du tableau
const childrenColumns = [
{ name: 'Nom', transform: (row) => `${row.student.last_name}` },
{ name: 'Prénom', transform: (row) => `${row.student.first_name}` },
@ -86,54 +126,67 @@ export default function ParentHomePage() {
name: 'Actions',
transform: (row) => (
<div className="flex justify-center items-center gap-2">
{/* Actions en fonction du statut */}
{row.status === 2 && (
<button
className="text-blue-500 hover:text-blue-700"
onClick={(e) => {
e.stopPropagation();
handleEdit(row.student.id); // Remplir le dossier
handleEdit(row.student.id);
}}
aria-label="Remplir le dossier"
>
<Edit3 className="h-5 w-5" />
</button>
)}
{row.status === 3 && (
<button
className="text-purple-500 hover:text-purple-700"
onClick={(e) => {
e.stopPropagation();
handleView(row.student.id); // Visualiser le dossier
handleView(row.student.id);
}}
aria-label="Visualiser le dossier"
>
<Eye className="h-5 w-5" />
</button>
)}
{row.status === 7 && (
<>
<button
className="text-purple-500 hover:text-purple-700"
className="flex items-center justify-center w-8 h-8 rounded-full text-purple-500 hover:text-purple-700"
onClick={(e) => {
e.stopPropagation();
handleView(row.student.id); // Visualiser le dossier
handleView(row.student.id);
}}
aria-label="Visualiser le dossier"
>
<Eye className="h-5 w-5" />
</button>
<a
href={`${BASE_URL}${row.sepa_file}`} // Télécharger le mandat SEPA
href={`${BASE_URL}${row.sepa_file}`}
target="_blank"
rel="noopener noreferrer"
className="text-green-500 hover:text-green-700"
className="flex items-center justify-center w-8 h-8 rounded-full text-green-500 hover:text-green-700"
aria-label="Télécharger le mandat SEPA"
>
<Download className="h-5 w-5" />
</a>
{/* Nouvelle action Upload */}
<button
className={`flex items-center justify-center w-8 h-8 rounded-full ${
uploadingStudentId === row.student.id && uploadState === "on" ? 'bg-blue-100 text-blue-600 ring-3 ring-blue-500'
: 'text-blue-500 hover:text-blue-700'
}`}
onClick={(e) => {
e.stopPropagation();
toggleUpload(row.student.id); // Activer ou désactiver l'upload pour cet étudiant
}}
aria-label="Uploader un fichier"
>
<Upload className="h-5 w-5" />
</button>
</>
)}
</div>
@ -141,13 +194,6 @@ export default function ParentHomePage() {
}
];
const itemsPerPage = 5;
const totalPages = Math.ceil(children.length / itemsPerPage) || 1;
const handlePageChange = (newPage) => {
setCurrentPage(newPage);
};
return (
<div className="px-2 py-4 md:px-4 max-w-full">
<div>
@ -175,13 +221,27 @@ export default function ParentHomePage() {
<Table
data={children}
columns={childrenColumns}
itemsPerPage={itemsPerPage}
currentPage={currentPage}
totalPages={totalPages}
onPageChange={handlePageChange}
defaultTheme="bg-gray-50"
/>
</div>
{/* Composant FileUpload et bouton Valider en dessous du tableau */}
{uploadState === "on" && uploadingStudentId && (
<div className="mt-4">
<FileUpload
selectionMessage="Sélectionnez un fichier à uploader"
onFileSelect={handleFileUpload}
/>
<button
className={`mt-4 px-6 py-2 rounded-md ${
uploadedFile ? 'bg-emerald-500 text-white hover:bg-emerald-600' : 'bg-gray-300 text-gray-700 cursor-not-allowed'
}`}
onClick={handleSubmit}
disabled={!uploadedFile}
>
Valider
</button>
</div>
)}
</div>
</div>
);

26
Front-End/src/app/actions/registerFileGroupAction.js
View File

@ -229,6 +229,18 @@ export const editRegistrationSchoolFileTemplates = (fileId, data, csrfToken) =>
.then(requestResponseHandler)
};
export const editRegistrationParentFileTemplates = (fileId, data, csrfToken) => {
return fetch(`${BE_SUBSCRIPTION_REGISTRATION_PARENT_FILE_TEMPLATES_URL}/${fileId}`, {
method: 'PUT',
body: data,
headers: {
'X-CSRFToken': csrfToken,
},
credentials: 'include',
})
.then(requestResponseHandler)
};
// DELETE requests
export async function deleteRegistrationFileGroup(groupId, csrfToken) {
@ -243,7 +255,7 @@ export async function deleteRegistrationFileGroup(groupId, csrfToken) {
return response;
};
export const deleteRegistrationSchoolFileMaster = (fileId,csrfToken) => {
export const deleteRegistrationSchoolFileMaster = (fileId, csrfToken) => {
return fetch(`${BE_SUBSCRIPTION_REGISTRATION_SCHOOL_FILE_MASTERS_URL}/${fileId}`, {
method: 'DELETE',
headers: {
@ -263,7 +275,7 @@ export const deleteRegistrationParentFileMaster = (id, csrfToken) => {
})
};
export const deleteRegistrationSchoolFileTemplates = (fileId,csrfToken) => {
export const deleteRegistrationSchoolFileTemplates = (fileId, csrfToken) => {
return fetch(`${BE_SUBSCRIPTION_REGISTRATION_SCHOOL_FILE_TEMPLATES_URL}/${fileId}`, {
method: 'DELETE',
headers: {
@ -273,6 +285,16 @@ export const deleteRegistrationSchoolFileTemplates = (fileId,csrfToken) => {
})
};
export const deleteRegistrationParentFileTemplate = (id, csrfToken) => {
return fetch(`${BE_SUBSCRIPTION_REGISTRATION_PARENT_FILE_TEMPLATES_URL}/${id}`, {
method: 'DELETE',
headers: {
'X-CSRFToken': csrfToken,
},
credentials: 'include',
})
};
// API requests
export const cloneTemplate = (templateId, email, is_required) => {