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

@ -4,6 +4,8 @@ import React, { useState, useEffect } from 'react';
import { useTranslations } from 'next-intl';
import { Users, Clock, CalendarCheck, School, TrendingUp, UserCheck } from 'lucide-react';
import Loader from '@/components/Loader';
import { BK_GESTIONINSCRIPTION_CLASSES_URL } from '@/utils/Url';
import ClasseDetails from '@/components/ClasseDetails';
// Composant StatCard pour afficher une statistique
const StatCard = ({ title, value, icon, change, color = "blue" }) => (
@ -54,7 +56,23 @@ export default function DashboardPage() {
}
});
const [classes, setClasses] = useState([]);
const fetchClasses = () => {
fetch(`${BK_GESTIONINSCRIPTION_CLASSES_URL}`)
.then(response => response.json())
.then(data => {
setClasses(data);
})
.catch(error => {
console.error('Error fetching classes:', error);
});
};
useEffect(() => {
// Fetch data for classes
fetchClasses();
// Simulation de chargement des données
setTimeout(() => {
setStats({
@ -120,7 +138,7 @@ export default function DashboardPage() {
</div>
{/* Événements et KPIs */}
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-6">
{/* Graphique des inscriptions */}
<div className="lg:col-span-2 bg-white p-6 rounded-lg shadow-sm border border-gray-100">
<h2 className="text-lg font-semibold mb-4">{t('inscriptionTrends')}</h2>
@ -138,6 +156,14 @@ export default function DashboardPage() {
))}
</div>
</div>
<div className="flex flex-wrap">
{classes.map((classe) => (
<div className="lg:col-span-2 bg-white p-6 rounded-lg shadow-sm border border-gray-100 mr-4">
<ClasseDetails key={classe.id} classe={classe} />
</div>
))}
</div>
</div>
);
}