feat: Gestion des profils des enseignants / Visualisation d'une classe [#4]

This commit is contained in:
N3WT DE COMPET
2024-11-23 20:02:51 +01:00
parent af0cd1c840
commit 81d1dfa9a7
26 changed files with 792 additions and 178 deletions

View File

@ -1,13 +1,15 @@
import { School, Trash2, MoreVertical, Edit3, Plus, ZoomIn } from 'lucide-react';
import { Users, Trash2, MoreVertical, Edit3, Plus, ZoomIn } from 'lucide-react';
import { useState } from 'react';
import Table from '@/components/Table';
import DropdownMenu from '@/components/DropdownMenu';
import Modal from '@/components/Modal';
import ClassForm from '@/components/ClassForm';
import ClasseDetails from '@/components/ClasseDetails';
const ClassesSection = ({ classes, specialities, teachers, handleCreate, handleEdit, handleDelete }) => {
const [isOpen, setIsOpen] = useState(false);
const [isOpenDetails, setIsOpenDetails] = useState(false);
const [editingClass, setEditingClass] = useState(null);
const openEditModal = (classe) => {
@ -15,11 +17,21 @@ const ClassesSection = ({ classes, specialities, teachers, handleCreate, handleE
setEditingClass(classe);
}
const openEditModalDetails = (classe) => {
setIsOpenDetails(true);
setEditingClass(classe);
}
const closeEditModal = () => {
setIsOpen(false);
setEditingClass(null);
};
const closeEditModalDetails = () => {
setIsOpenDetails(false);
setEditingClass(null);
};
const handleModalSubmit = (updatedData) => {
if (editingClass) {
handleEdit(editingClass.id, updatedData);
@ -29,15 +41,11 @@ const ClassesSection = ({ classes, specialities, teachers, handleCreate, handleE
closeEditModal();
};
const handleInspect = (data) => {
console.log('inspect classe : ', data)
}
return (
<div className="mb-8">
<div className="flex justify-between items-center mb-4 max-w-8xl ml-0">
<h2 className="text-3xl text-gray-800 flex items-center">
<School className="w-8 h-8 mr-2" />
<Users className="w-8 h-8 mr-2" />
Classes
</h2>
<button
@ -82,7 +90,7 @@ const ClassesSection = ({ classes, specialities, teachers, handleCreate, handleE
<DropdownMenu
buttonContent={<MoreVertical size={20} className="text-gray-400 hover:text-gray-600" />}
items={[
{ label: 'Inspecter', icon: ZoomIn, onClick: () => handleInspect(row) },
{ label: 'Inspecter', icon: ZoomIn, onClick: () => openEditModalDetails(row) },
{ label: 'Modifier', icon:Edit3, onClick: () => openEditModal(row) },
{ label: 'Supprimer', icon: Trash2, onClick: () => handleDelete(row.id) }
]
@ -104,6 +112,25 @@ const ClassesSection = ({ classes, specialities, teachers, handleCreate, handleE
)}
/>
)}
{isOpenDetails && (
<Modal
isOpen={isOpenDetails}
setIsOpen={setIsOpenDetails}
title={(
<div className="flex items-center">
<Users className="w-8 h-8 mr-2" />
{editingClass ? (
<>
{editingClass.nom_ambiance} - {editingClass.tranche_age[0]} à {editingClass.tranche_age[1]} ans
</>
) : ''}
</div>
)}
ContentComponent={() => (
<ClasseDetails classe={editingClass} />
)}
/>
)}
</div>
);
};