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

refactor: Création de composants et uniformisation des modales (#2)

Browse Source
This commit is contained in:
N3WT DE COMPET
2024-11-24 18:42:42 +01:00
parent 5946cbdee6
commit d51778ba54
18 changed files with 362 additions and 299 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
Front-End/src/components/SpecialityForm.js
View File

@ -1,4 +1,8 @@
import { useState } from 'react';
import { BookOpen, Palette } from 'lucide-react';
import InputTextIcon from '@/components/InputTextIcon';
import InputColorIcon from '@/components/InputColorIcon';
import Button from '@/components/Button';
const SpecialityForm = ({ speciality = {}, onSubmit, isNew }) => {
const [nom, setNom] = useState(speciality.nom || '');
@ -13,35 +17,39 @@ const SpecialityForm = ({ speciality = {}, onSubmit, isNew }) => {
};
return (
<div className="p-4">
<div className="space-y-4 mt-8">
<div>
<input
type="text"
placeholder="Nom de la spécialité"
value={nom}
onChange={(e) => setNom(e.target.value)}
className="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-emerald-500 focus:border-emerald-500 italic"
<InputTextIcon
type="text"
IconItem={BookOpen}
placeholder="Nom de la spécialité"
value={nom}
onChange={(e) => setNom(e.target.value)}
className="w-full mt-4"
/>
</div>
<div className="mt-4">
<label className="block text-sm font-medium text-gray-700">
Code couleur de la spécialité
</label>
<input
type="color"
value={codeCouleur}
onChange={(e) => setCodeCouleur(e.target.value)}
className="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-emerald-500 focus:border-emerald-500 h-10 w-10 p-0 cursor-pointer"
style={{ appearance: 'none', borderRadius: '0' }}
<InputColorIcon
type="color"
IconItem={Palette}
placeholder="Nom de la spécialité"
value={codeCouleur}
onChange={(e) => setCodeCouleur(e.target.value)}
className="w-full mt-4"
/>
</div>
<div className="flex justify-end mt-4 space-x-4">
<button
onClick={handleSubmit}
className="px-4 py-2 bg-emerald-500 text-white rounded-md shadow-sm hover:bg-emerald-600 focus:outline-none"
>
Soumettre
</button>
<Button text="Créer"
onClick={handleSubmit}
className={`px-4 py-2 rounded-md shadow-sm focus:outline-none ${
!nom
? "bg-gray-300 text-gray-700 cursor-not-allowed"
: "bg-emerald-500 text-white hover:bg-emerald-600"
}`}
primary
disabled={!nom}
type="submit"
name="Create" />
</div>
</div>
);