mirror of
https://git.v0id.ovh/n3wt-innov/n3wt-school.git
synced 2026-01-29 07:53:23 +00:00
feat: Gestion du planning [3]
This commit is contained in:
@ -12,8 +12,10 @@ import { HTML5Backend } from 'react-dnd-html5-backend';
|
||||
import logger from '@/utils/logger';
|
||||
import SectionHeader from '@/components/SectionHeader';
|
||||
import { useEstablishment } from '@/context/EstablishmentContext';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { FE_ADMIN_STRUCTURE_SCHOOLCLASS_MANAGEMENT_URL } from '@/utils/Url';
|
||||
import { usePlanning } from '@/context/PlanningContext';
|
||||
import { useClasses } from '@/context/ClassesContext';
|
||||
|
||||
|
||||
const ItemTypes = {
|
||||
TEACHER: 'teacher',
|
||||
@ -117,6 +119,7 @@ const ClassesSection = ({
|
||||
handleCreate,
|
||||
handleEdit,
|
||||
handleDelete,
|
||||
|
||||
}) => {
|
||||
const [formData, setFormData] = useState({});
|
||||
const [editingClass, setEditingClass] = useState(null);
|
||||
@ -129,41 +132,10 @@ const ClassesSection = ({
|
||||
const [removePopupOnConfirm, setRemovePopupOnConfirm] = useState(() => {});
|
||||
const [detailsModalVisible, setDetailsModalVisible] = useState(false);
|
||||
const [selectedClass, setSelectedClass] = useState(null);
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const { selectedEstablishmentId } = useEstablishment();
|
||||
const { addSchedule, reloadPlanning, reloadEvents } = usePlanning();
|
||||
const{ getNiveauxLabels, allNiveaux } = useClasses();
|
||||
|
||||
const niveauxPremierCycle = [
|
||||
{ id: 1, name: 'TPS', age: 2 },
|
||||
{ id: 2, name: 'PS', age: 3 },
|
||||
{ id: 3, name: 'MS', age: 4 },
|
||||
{ id: 4, name: 'GS', age: 5 },
|
||||
];
|
||||
|
||||
const niveauxSecondCycle = [
|
||||
{ id: 5, name: 'CP', age: 6 },
|
||||
{ id: 6, name: 'CE1', age: 7 },
|
||||
{ id: 7, name: 'CE2', age: 8 },
|
||||
];
|
||||
|
||||
const niveauxTroisiemeCycle = [
|
||||
{ id: 8, name: 'CM1', age: 9 },
|
||||
{ id: 9, name: 'CM2', age: 10 },
|
||||
];
|
||||
|
||||
const allNiveaux = [
|
||||
...niveauxPremierCycle,
|
||||
...niveauxSecondCycle,
|
||||
...niveauxTroisiemeCycle,
|
||||
];
|
||||
|
||||
const getNiveauxLabels = (levels) => {
|
||||
return levels.map((niveauId) => {
|
||||
const niveau = allNiveaux.find((n) => n.id === niveauId);
|
||||
return niveau ? niveau.name : niveauId;
|
||||
});
|
||||
};
|
||||
|
||||
// Fonction pour générer les années scolaires
|
||||
const getSchoolYearChoices = () => {
|
||||
@ -241,6 +213,19 @@ const ClassesSection = ({
|
||||
setClasses((prevClasses) => [createdClass, ...classes]);
|
||||
setNewClass(null);
|
||||
setLocalErrors({});
|
||||
// Creation des plannings associé à la classe
|
||||
|
||||
createdClass.levels.forEach((level) => {
|
||||
const levelName = allNiveaux.find((lvl) => lvl.id === level)?.name;
|
||||
const planningName = `${createdClass.atmosphere_name} - ${levelName}`;
|
||||
const newPlanning = {
|
||||
name: planningName,
|
||||
color: '#FF5733', // Couleur par défaut
|
||||
school_class: createdClass.id,
|
||||
}
|
||||
addSchedule(newPlanning)
|
||||
});
|
||||
|
||||
})
|
||||
.catch((error) => {
|
||||
logger.error('Error:', error.message);
|
||||
@ -505,6 +490,8 @@ const ClassesSection = ({
|
||||
);
|
||||
setPopupVisible(true);
|
||||
setRemovePopupVisible(false);
|
||||
reloadPlanning();
|
||||
reloadEvents();
|
||||
})
|
||||
.catch((error) => {
|
||||
logger.error('Error archiving data:', error);
|
||||
|
||||
@ -1,47 +0,0 @@
|
||||
import React from 'react';
|
||||
import { Calendar } from 'lucide-react';
|
||||
|
||||
const DateRange = ({
|
||||
nameStart,
|
||||
nameEnd,
|
||||
valueStart,
|
||||
valueEnd,
|
||||
onChange,
|
||||
label,
|
||||
}) => {
|
||||
return (
|
||||
<div className="space-y-4 mt-4 p-4 border rounded-md shadow-sm bg-white">
|
||||
<label className="block text-lg font-medium text-gray-700 mb-2">
|
||||
{label}
|
||||
</label>
|
||||
<div className="grid grid-cols-1 gap-4 md:grid-cols-2 items-center">
|
||||
<div className="relative flex items-center">
|
||||
<span className="mr-2">Du</span>
|
||||
<Calendar className="w-5 h-5 text-emerald-500 absolute top-3 left-16" />
|
||||
<input
|
||||
type="date"
|
||||
name={nameStart}
|
||||
value={valueStart}
|
||||
onChange={onChange}
|
||||
className="block w-full pl-10 pr-4 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-emerald-500 focus:border-emerald-500 hover:ring-emerald-400 ml-8"
|
||||
placeholder="Date de début"
|
||||
/>
|
||||
</div>
|
||||
<div className="relative flex items-center">
|
||||
<span className="mr-2">Au</span>
|
||||
<Calendar className="w-5 h-5 text-emerald-500 absolute top-3 left-16" />
|
||||
<input
|
||||
type="date"
|
||||
name={nameEnd}
|
||||
value={valueEnd}
|
||||
onChange={onChange}
|
||||
className="block w-full pl-10 pr-4 py-2 border border-gray-300 rounded-md shadow-sm focus:ring-emerald-500 focus:border-emerald-500 hover:ring-emerald-400 ml-8"
|
||||
placeholder="Date de fin"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default DateRange;
|
||||
@ -1,121 +0,0 @@
|
||||
import React from 'react';
|
||||
import RadioList from '@/components/RadioList';
|
||||
import DateRange from '@/components/Structure/Configuration/DateRange';
|
||||
import TimeRange from '@/components/Structure/Configuration/TimeRange';
|
||||
import CheckBoxList from '@/components/CheckBoxList';
|
||||
|
||||
const PlanningConfiguration = ({
|
||||
formData,
|
||||
handleChange,
|
||||
handleTimeChange,
|
||||
handleJoursChange,
|
||||
typeEmploiDuTemps,
|
||||
}) => {
|
||||
const daysOfWeek = [
|
||||
{ id: 1, name: 'lun' },
|
||||
{ id: 2, name: 'mar' },
|
||||
{ id: 3, name: 'mer' },
|
||||
{ id: 4, name: 'jeu' },
|
||||
{ id: 5, name: 'ven' },
|
||||
{ id: 6, name: 'sam' },
|
||||
];
|
||||
|
||||
const isLabelAttenuated = (item) => {
|
||||
return !formData.opening_days.includes(parseInt(item.id));
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<label className="mt-6 block text-2xl font-medium text-gray-700">
|
||||
Emploi du temps
|
||||
</label>
|
||||
|
||||
<div className="flex justify-between space-x-4 items-start">
|
||||
<div className="w-1/2">
|
||||
<RadioList
|
||||
items={typeEmploiDuTemps}
|
||||
formData={formData}
|
||||
handleChange={handleChange}
|
||||
fieldName="type"
|
||||
className="w-full"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Plage horaire */}
|
||||
<div className="w-1/2">
|
||||
<TimeRange
|
||||
startTime={formData.time_range[0]}
|
||||
endTime={formData.time_range[1]}
|
||||
onStartChange={(e) => handleTimeChange(e, 0)}
|
||||
onEndChange={(e) => handleTimeChange(e, 1)}
|
||||
/>
|
||||
|
||||
{/* CheckBoxList */}
|
||||
<CheckBoxList
|
||||
items={daysOfWeek}
|
||||
formData={formData}
|
||||
handleChange={handleJoursChange}
|
||||
fieldName="opening_days"
|
||||
horizontal={true}
|
||||
labelAttenuated={isLabelAttenuated}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* DateRange */}
|
||||
<div className="space-y-4 w-full">
|
||||
{formData.type === 2 && (
|
||||
<>
|
||||
<DateRange
|
||||
nameStart="date_debut_semestre_1"
|
||||
nameEnd="date_fin_semestre_1"
|
||||
valueStart={formData.date_debut_semestre_1}
|
||||
valueEnd={formData.date_fin_semestre_1}
|
||||
onChange={handleChange}
|
||||
label="Semestre 1"
|
||||
/>
|
||||
<DateRange
|
||||
nameStart="date_debut_semestre_2"
|
||||
nameEnd="date_fin_semestre_2"
|
||||
valueStart={formData.date_debut_semestre_2}
|
||||
valueEnd={formData.date_fin_semestre_2}
|
||||
onChange={handleChange}
|
||||
label="Semestre 2"
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
|
||||
{formData.type === 3 && (
|
||||
<>
|
||||
<DateRange
|
||||
nameStart="date_debut_trimestre_1"
|
||||
nameEnd="date_fin_trimestre_1"
|
||||
valueStart={formData.date_debut_trimestre_1}
|
||||
valueEnd={formData.date_fin_trimestre_1}
|
||||
onChange={handleChange}
|
||||
label="Trimestre 1"
|
||||
/>
|
||||
<DateRange
|
||||
nameStart="date_debut_trimestre_2"
|
||||
nameEnd="date_fin_trimestre_2"
|
||||
valueStart={formData.date_debut_trimestre_2}
|
||||
valueEnd={formData.date_fin_trimestre_2}
|
||||
onChange={handleChange}
|
||||
label="Trimestre 2"
|
||||
/>
|
||||
<DateRange
|
||||
nameStart="date_debut_trimestre_3"
|
||||
nameEnd="date_fin_trimestre_3"
|
||||
valueStart={formData.date_debut_trimestre_3}
|
||||
valueEnd={formData.date_fin_trimestre_3}
|
||||
onChange={handleChange}
|
||||
label="Trimestre 3"
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default PlanningConfiguration;
|
||||
@ -22,7 +22,7 @@ const StructureManagement = ({
|
||||
handleDelete,
|
||||
}) => {
|
||||
return (
|
||||
<div className="w-full mx-auto mt-6">
|
||||
<div className="w-full p-4 mx-auto mt-6">
|
||||
<ClassesProvider>
|
||||
<div className="mt-8 w-2/5">
|
||||
<SpecialitiesSection
|
||||
|
||||
Reference in New Issue
Block a user