Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 | 1x 1x 1x 1x 1x 4x | 'use client';
import Link from 'next/link';
import { dashboardSections } from '@/types/dashBoardSections/dashboardSections';
import PageTemplate from '@/components/layout/PageTemplate';
/**
* Page Dashboard principal - Route: /dashboard
*
* Affiche le tableau de bord principal avec navigation vers les différentes sections
* via des liens Next.js vers les routes dédiées
*/
export default function DashboardPage() {
return (
<PageTemplate
title="Administration JO 2024"
intro={{
title: "Tableau de bord d'administration",
description: "Sélectionnez une section pour commencer la gestion"
}}
>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 gap-8">
{dashboardSections.map((section) => (
<Link
key={section.url}
href={section.url}
className={`${section.color} text-white rounded-lg p-8 cursor-pointer transform transition-all duration-200 hover:scale-105 shadow-lg hover:shadow-xl block`}
>
<div className="text-center">
<div className="text-6xl mb-4">
{section.icon}
</div>
<h3 className="text-xl font-bold mb-2">
{section.title}
</h3>
<p className="text-white/90 text-sm">
{section.description}
</p>
</div>
</Link>
))}
</div>
<div className="mt-16 bg-white rounded-lg shadow-md p-8">
<h3 className="text-xl font-bold text-gray-900 mb-6">Statistiques rapides</h3>
<div className="grid grid-cols-1 md:grid-cols-4 gap-6">
<div className="text-center">
<div className="text-3xl font-bold text-blue-600">_</div>
<div className="text-sm text-gray-600">Événements sportifs</div>
</div>
<div className="text-center">
<div className="text-3xl font-bold text-green-600">_</div>
<div className="text-sm text-gray-600">Utilisateurs actifs</div>
</div>
<div className="text-center">
<div className="text-3xl font-bold text-purple-600">_</div>
<div className="text-sm text-gray-600">Offres disponibles</div>
</div>
<div className="text-center">
<div className="text-3xl font-bold text-orange-600">_</div>
<div className="text-sm text-gray-600">Employés</div>
</div>
</div>
</div>
</PageTemplate>
);
}
|