mirror of
https://git.v0id.ovh/n3wt-innov/n3wt-school.git
synced 2026-01-29 07:53:23 +00:00
feat: Configuration et gestion du planning [#2]
This commit is contained in:
@ -12,7 +12,7 @@ import { useClasses } from '@/context/ClassesContext';
|
||||
const ClassForm = ({ onSubmit, isNew, teachers }) => {
|
||||
|
||||
const { formData, setFormData } = useClasseForm();
|
||||
const { schoolYears, getNiveauxLabels, generateAgeToNiveaux, niveauxPremierCycle, niveauxSecondCycle, niveauxTroisiemeCycle, typeEmploiDuTemps, updatePlanning } = useClasses();
|
||||
const { getNiveauNameById, schoolYears, getNiveauxLabels, getNiveauxTabs, generateAgeToNiveaux, niveauxPremierCycle, niveauxSecondCycle, niveauxTroisiemeCycle, typeEmploiDuTemps, updatePlannings } = useClasses();
|
||||
const [selectedTeachers, setSelectedTeachers] = useState(formData.enseignants_ids);
|
||||
|
||||
const handleTeacherSelection = (teacher) => {
|
||||
@ -40,7 +40,8 @@ const ClassForm = ({ onSubmit, isNew, teachers }) => {
|
||||
plage_horaire: updatedTimes,
|
||||
};
|
||||
|
||||
updatedFormData.planning = updatePlanning(updatedFormData);
|
||||
const existingPlannings = prevState.plannings || [];
|
||||
updatedFormData.plannings = updatePlannings(updatedFormData, existingPlannings);
|
||||
|
||||
return updatedFormData;
|
||||
});
|
||||
@ -60,51 +61,51 @@ const ClassForm = ({ onSubmit, isNew, teachers }) => {
|
||||
jours_ouverture: updatedJoursOuverture,
|
||||
};
|
||||
|
||||
updatedFormData.planning = updatePlanning(updatedFormData);
|
||||
const existingPlannings = prevState.plannings || [];
|
||||
updatedFormData.plannings = updatePlannings(updatedFormData, existingPlannings);
|
||||
|
||||
return updatedFormData;
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
const handleChange = (e) => {
|
||||
e.preventDefault();
|
||||
const { name, value, type, checked } = e.target;
|
||||
|
||||
setFormData(prevState => {
|
||||
let updatedFormData = { ...prevState };
|
||||
|
||||
if (type === 'checkbox') {
|
||||
const newValues = checked
|
||||
? [...(prevState[name] || []), parseInt(value)]
|
||||
: (prevState[name] || []).filter(v => v !== parseInt(value));
|
||||
updatedFormData[name] = newValues;
|
||||
} else if (name === 'tranche_age') {
|
||||
const [minAgeStr, maxAgeStr] = value.split('-');
|
||||
const minAge = minAgeStr ? parseInt(minAgeStr) : null;
|
||||
const maxAge = minAgeStr ? parseInt(maxAgeStr) : null;
|
||||
const selectedNiveaux = generateAgeToNiveaux(minAge, maxAge);
|
||||
const niveauxLabels = getNiveauxLabels(selectedNiveaux);
|
||||
|
||||
updatedFormData = {
|
||||
...prevState,
|
||||
[name]: value,
|
||||
niveaux: selectedNiveaux.length > 0 ? selectedNiveaux : [],
|
||||
niveaux_label: niveauxLabels.length > 0 ? niveauxLabels : []
|
||||
};
|
||||
} else if (type === 'radio') {
|
||||
updatedFormData[name] = parseInt(value, 10);
|
||||
} else {
|
||||
updatedFormData[name] = value;
|
||||
}
|
||||
|
||||
console.log('Updated formData:', updatedFormData);
|
||||
|
||||
updatedFormData.planning = updatePlanning(updatedFormData);
|
||||
|
||||
console.log('Final formData:', updatedFormData);
|
||||
return updatedFormData;
|
||||
setFormData(prevState => {
|
||||
|
||||
// Copier l'état précédent
|
||||
let newState = { ...prevState };
|
||||
|
||||
if (type === 'checkbox') {
|
||||
const newValues = checked
|
||||
? [...(prevState[name] || []), parseInt(value)]
|
||||
: (prevState[name] || []).filter(v => v !== parseInt(value));
|
||||
newState[name] = newValues;
|
||||
} else if (name === 'tranche_age') {
|
||||
const [minAgeStr, maxAgeStr] = value.split('-');
|
||||
const minAge = minAgeStr ? parseInt(minAgeStr) : null;
|
||||
const maxAge = minAgeStr ? parseInt(maxAgeStr) : null;
|
||||
const selectedNiveaux = generateAgeToNiveaux(minAge, maxAge);
|
||||
const niveauxLabels = getNiveauxLabels(selectedNiveaux);
|
||||
|
||||
newState = {
|
||||
...prevState,
|
||||
[name]: value,
|
||||
niveaux: selectedNiveaux.length > 0 ? selectedNiveaux : [],
|
||||
};
|
||||
} else if (type === 'radio') {
|
||||
newState[name] = parseInt(value, 10);
|
||||
} else {
|
||||
newState[name] = value;
|
||||
}
|
||||
|
||||
const existingPlannings = prevState.plannings || [];
|
||||
newState.plannings = updatePlannings(newState, existingPlannings);
|
||||
|
||||
return newState;
|
||||
});
|
||||
};
|
||||
};
|
||||
|
||||
const handleSubmit = () => {
|
||||
onSubmit(formData);
|
||||
|
||||
@ -5,6 +5,8 @@ import DropdownMenu from '@/components/DropdownMenu';
|
||||
import Modal from '@/components/Modal';
|
||||
import ClassForm from '@/components/Structure/Configuration/ClassForm';
|
||||
import ClasseDetails from '@/components/ClasseDetails';
|
||||
import LevelLabel from '@/components/CustomLabels/LevelLabel';
|
||||
import TeacherLabel from '@/components/CustomLabels/TeacherLabel';
|
||||
import { ClasseFormProvider } from '@/context/ClasseFormContext';
|
||||
import { useClasses } from '@/context/ClassesContext';
|
||||
|
||||
@ -86,20 +88,14 @@ const ClassesSection = ({ classes, specialities, teachers, handleCreate, handleE
|
||||
return (
|
||||
<div className="flex flex-wrap justify-center items-center space-x-2">
|
||||
{niveauxLabels.length > 0
|
||||
? niveauxLabels.map((label, index) => (
|
||||
<div
|
||||
key={index}
|
||||
className={`px-3 py-1 rounded-md shadow-sm ${
|
||||
index % 2 === 0 ? 'bg-white' : 'bg-gray-100'
|
||||
} border border-gray-200 text-gray-700`}>
|
||||
{label}
|
||||
</div>
|
||||
))
|
||||
: 'Aucun niveau'}
|
||||
? niveauxLabels.map((label, index) => (
|
||||
<LevelLabel key={index} label={label} index={index} />
|
||||
))
|
||||
: 'Aucun niveau'}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
},
|
||||
},
|
||||
{ name: 'CAPACITÉ MAX', transform: (row) => row.nombre_eleves },
|
||||
{ name: 'ANNÉE SCOLAIRE', transform: (row) => row.annee_scolaire },
|
||||
{
|
||||
@ -107,15 +103,8 @@ const ClassesSection = ({ classes, specialities, teachers, handleCreate, handleE
|
||||
transform: (row) => (
|
||||
<div key={row.id} className="flex flex-wrap justify-center items-center space-x-2">
|
||||
{row.enseignants.map((teacher, index) => (
|
||||
<div
|
||||
key={teacher.id}
|
||||
className={`px-3 py-1 rounded-md shadow-sm ${
|
||||
index % 2 === 0 ? 'bg-white' : 'bg-gray-100'
|
||||
} border border-gray-200 text-gray-700`}
|
||||
>
|
||||
<span className="font-bold">{teacher.nom} {teacher.prenom}</span>
|
||||
</div>
|
||||
))}
|
||||
<TeacherLabel key={teacher.id} nom={teacher.nom} prenom={teacher.prenom} index={index} />
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
},
|
||||
|
||||
@ -28,7 +28,7 @@ const PlanningConfiguration = ({ formData, handleChange, handleTimeChange, handl
|
||||
items={typeEmploiDuTemps}
|
||||
formData={formData}
|
||||
handleChange={handleChange}
|
||||
fieldName="planning_type"
|
||||
fieldName="type"
|
||||
className="w-full"
|
||||
/>
|
||||
</div>
|
||||
@ -56,7 +56,7 @@ const PlanningConfiguration = ({ formData, handleChange, handleTimeChange, handl
|
||||
|
||||
{/* DateRange */}
|
||||
<div className="space-y-4 w-full">
|
||||
{formData.planning_type === 2 && (
|
||||
{formData.type === 2 && (
|
||||
<>
|
||||
<DateRange
|
||||
nameStart="date_debut_semestre_1"
|
||||
@ -77,7 +77,7 @@ const PlanningConfiguration = ({ formData, handleChange, handleTimeChange, handl
|
||||
</>
|
||||
)}
|
||||
|
||||
{formData.planning_type === 3 && (
|
||||
{formData.type === 3 && (
|
||||
<>
|
||||
<DateRange
|
||||
nameStart="date_debut_trimestre_1"
|
||||
|
||||
@ -1,13 +1,12 @@
|
||||
import React from 'react';
|
||||
import { School, Calendar } from 'lucide-react';
|
||||
|
||||
const TabsStructure = ({ activeTab, setActiveTab, tabs }) => {
|
||||
return (
|
||||
<div className="flex justify-center mb-8">
|
||||
<div className="flex justify-center items-center w-full">
|
||||
{tabs.map((tab) => (
|
||||
<button
|
||||
key={tab.id}
|
||||
className={`tab px-4 py-2 mx-2 flex items-center space-x-2 ${activeTab === tab.id ? 'bg-emerald-600 text-white shadow-lg' : 'bg-emerald-200 text-emerald-600'} rounded-full`}
|
||||
className={`tab px-4 py-2 mx-2 flex items-center justify-center space-x-2 ${activeTab === tab.id ? 'bg-emerald-600 text-white shadow-lg' : 'bg-emerald-200 text-emerald-600'} rounded-full`}
|
||||
onClick={() => setActiveTab(tab.id)}
|
||||
>
|
||||
<tab.icon className="w-5 h-5" />
|
||||
@ -19,3 +18,6 @@ const TabsStructure = ({ activeTab, setActiveTab, tabs }) => {
|
||||
};
|
||||
|
||||
export default TabsStructure;
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user