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

feat: Configuration et gestion du planning [#2]

Browse Source
This commit is contained in:
N3WT DE COMPET
2025-01-11 19:37:29 +01:00
parent 3c27133cdb
commit 830d9a48c0
26 changed files with 1163 additions and 1071 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
Front-End/src/components/Structure/Planning/DraggableSpeciality.js
View File

@ -1,36 +1,34 @@
import React from 'react';
import { useDrag } from 'react-dnd';
import { UserIcon } from 'lucide-react'; // Assure-toi d'importer l'icône que tu souhaites utiliser
const DraggableSpeciality = ({ specialite }) => {
const DraggableSpeciality = ({ speciality }) => {
const [{ isDragging }, drag] = useDrag(() => ({
type: 'SPECIALITY',
item: { id: specialite.id,
name: specialite.nom,
color: specialite.codeCouleur,
teachers: specialite.teachers,
duree: specialite.duree },
item: {
id: speciality.id,
name: speciality.nom,
color: speciality.codeCouleur,
teachers: speciality.teachers
},
collect: (monitor) => ({
isDragging: monitor.isDragging(),
isDragging: !!monitor.isDragging(),
}),
}));
const isColorDark = (color) => {
const r = parseInt(color.slice(1, 3), 16);
const g = parseInt(color.slice(3, 5), 16);
const b = parseInt(color.slice(5, 7), 16);
return ((r * 0.299 + g * 0.587 + b * 0.114) < 150);
};
return (
<span
ref={drag}
className="speciality-tag p-2 m-1 rounded cursor-pointer"
style={{
backgroundColor: specialite.codeCouleur,
color: isColorDark(specialite.codeCouleur) ? 'white' : 'black',
opacity: isDragging ? 0.5 : 1,
}}
key={speciality.id}
className={`relative flex items-center px-4 py-2 rounded-full font-bold text-white text-center shadow-lg cursor-pointer transition-transform duration-200 ease-in-out transform ${isDragging ? 'opacity-50 scale-95' : 'scale-100 hover:scale-105 hover:shadow-xl'}`}
style={{ backgroundColor: speciality.codeCouleur, minWidth: '200px', maxWidth: '400px' }}
title={speciality.nom}
>
{specialite.nom} ({specialite.teachers.join(', ')})
{speciality.nom}
<span className="absolute top-0 right-0 mt-1 mr-1 flex items-center justify-center text-xs bg-black bg-opacity-50 rounded-full px-2 py-1">
<UserIcon size={16} className="ml-1" />
{speciality.teachers.length}
</span>
</span>
);
};