soufiane
dce1559a32
- Replace email verification status with active/inactive status - Add user archiving (soft delete) instead of hard delete - Add search by name/email in user management - Add status filter (active/inactive) in user management - Simplify actions to show only "Détails" button - Add Google Maps with clickable marker on contact page - Update button labels from "Désactiver" to "Supprimer" 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
638 lines
23 KiB
TypeScript
638 lines
23 KiB
TypeScript
'use client';
|
|
|
|
import { useState, useEffect, useCallback } from 'react';
|
|
import { Card } from '@/components/ui/Card';
|
|
import Button from '@/components/Button';
|
|
import toast from 'react-hot-toast';
|
|
import { API_BASE_URL } from '@/utils/constants';
|
|
import {
|
|
Trophy,
|
|
Users,
|
|
CheckCircle,
|
|
AlertCircle,
|
|
Download,
|
|
Mail,
|
|
Gift,
|
|
User,
|
|
RefreshCw,
|
|
Trash2,
|
|
} from 'lucide-react';
|
|
|
|
interface Participant {
|
|
id: string;
|
|
email: string;
|
|
first_name: string;
|
|
last_name: string;
|
|
is_verified: boolean;
|
|
tickets_played: number;
|
|
prizes_won: number;
|
|
}
|
|
|
|
interface DrawResult {
|
|
draw: {
|
|
id: string;
|
|
drawDate: string;
|
|
status: string;
|
|
};
|
|
winner: {
|
|
id: string;
|
|
email: string;
|
|
name: string;
|
|
ticketsPlayed: number;
|
|
};
|
|
statistics: {
|
|
totalParticipants: number;
|
|
eligibleParticipants: number;
|
|
criteria: any;
|
|
};
|
|
prize: {
|
|
name: string;
|
|
value: string;
|
|
};
|
|
}
|
|
|
|
interface ExistingDraw {
|
|
id: string;
|
|
draw_date: string;
|
|
winner_email: string;
|
|
winner_name: string;
|
|
prize_name: string;
|
|
prize_value: string;
|
|
total_participants: number;
|
|
eligible_participants: number;
|
|
status: string;
|
|
notified_at: string | null;
|
|
claimed_at: string | null;
|
|
}
|
|
|
|
export default function TiragesPage() {
|
|
const [participants, setParticipants] = useState<Participant[]>([]);
|
|
const [loading, setLoading] = useState(false);
|
|
const [drawResult, setDrawResult] = useState<DrawResult | null>(null);
|
|
const [existingDraw, setExistingDraw] = useState<ExistingDraw | null>(null);
|
|
const [hasExistingDraw, setHasExistingDraw] = useState(false);
|
|
|
|
// Critères
|
|
const [minTickets, setMinTickets] = useState(1);
|
|
const [verifiedOnly, setVerifiedOnly] = useState(true);
|
|
const [prizeName, setPrizeName] = useState('An de thé');
|
|
const [prizeValue, setPrizeValue] = useState('360');
|
|
const [allowRedraw, setAllowRedraw] = useState(false);
|
|
|
|
const checkExistingDraw = useCallback(async () => {
|
|
try {
|
|
const token = localStorage.getItem('auth_token') || localStorage.getItem('token');
|
|
const response = await fetch(`${API_BASE_URL}/draw/check-existing`, {
|
|
headers: {
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
});
|
|
|
|
if (response.ok) {
|
|
const data = await response.json();
|
|
setHasExistingDraw(data.data.hasExistingDraw);
|
|
setExistingDraw(data.data.lastDraw);
|
|
}
|
|
} catch (error) {
|
|
console.error('Erreur:', error);
|
|
}
|
|
}, []);
|
|
|
|
const loadParticipants = useCallback(async () => {
|
|
setLoading(true);
|
|
try {
|
|
const token = localStorage.getItem('auth_token') || localStorage.getItem('token');
|
|
const response = await fetch(
|
|
`${API_BASE_URL}/draw/eligible-participants?minTickets=${minTickets}&verified=${verifiedOnly}`,
|
|
{
|
|
headers: {
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
}
|
|
);
|
|
|
|
if (!response.ok) throw new Error('Erreur lors du chargement');
|
|
|
|
const data = await response.json();
|
|
setParticipants(data.data.participants);
|
|
toast.success(`${data.data.total} participants éligibles trouvés`);
|
|
} catch (error: any) {
|
|
toast.error(error.message || 'Erreur lors du chargement');
|
|
setParticipants([]);
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
}, [minTickets, verifiedOnly]);
|
|
|
|
useEffect(() => {
|
|
checkExistingDraw();
|
|
// Charger automatiquement les participants au chargement de la page
|
|
loadParticipants();
|
|
}, [checkExistingDraw, loadParticipants]);
|
|
|
|
const conductDraw = async () => {
|
|
if (participants.length === 0) {
|
|
toast.error('Veuillez d\'abord charger les participants éligibles');
|
|
return;
|
|
}
|
|
|
|
const confirmMessage = hasExistingDraw
|
|
? `⚠️ ATTENTION: Un tirage a déjà été effectué!\n\nÊtes-vous ABSOLUMENT SÛR de vouloir effectuer un nouveau tirage parmi ${participants.length} participants éligibles?\n\nCeci remplacera le tirage précédent!`
|
|
: `Êtes-vous sûr de vouloir lancer le tirage au sort parmi ${participants.length} participants éligibles?\n\nCette action est irréversible!`;
|
|
|
|
if (!confirm(confirmMessage)) return;
|
|
|
|
setLoading(true);
|
|
try {
|
|
const token = localStorage.getItem('auth_token') || localStorage.getItem('token');
|
|
const response = await fetch(`${API_BASE_URL}/draw/conduct`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
body: JSON.stringify({
|
|
criteria: {
|
|
minTickets,
|
|
verified: verifiedOnly,
|
|
},
|
|
prizeName,
|
|
prizeValue,
|
|
allowRedraw: hasExistingDraw,
|
|
}),
|
|
});
|
|
|
|
if (!response.ok) {
|
|
const error = await response.json();
|
|
throw new Error(error.message || 'Erreur lors du tirage');
|
|
}
|
|
|
|
const data = await response.json();
|
|
setDrawResult(data.data);
|
|
setHasExistingDraw(true);
|
|
toast.success('🎉 Tirage au sort effectué avec succès!');
|
|
await checkExistingDraw();
|
|
} catch (error: any) {
|
|
toast.error(error.message || 'Erreur lors du tirage');
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
const downloadReport = async () => {
|
|
if (!existingDraw) return;
|
|
|
|
try {
|
|
const token = localStorage.getItem('auth_token') || localStorage.getItem('token');
|
|
const response = await fetch(
|
|
`${API_BASE_URL}/draw/${existingDraw.id}/report`,
|
|
{
|
|
headers: {
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
}
|
|
);
|
|
|
|
if (!response.ok) throw new Error('Erreur lors de la génération du rapport');
|
|
|
|
const data = await response.json();
|
|
const report = data.data;
|
|
|
|
// Créer un rapport texte
|
|
const reportText = `
|
|
=================================================
|
|
RAPPORT DE TIRAGE AU SORT - THÉ TIP TOP
|
|
=================================================
|
|
|
|
📅 Date du tirage: ${new Date(report.draw.date).toLocaleString('fr-FR')}
|
|
👤 Effectué par: ${report.draw.conductedBy.name} (${report.draw.conductedBy.email})
|
|
📊 Statut: ${report.draw.status}
|
|
|
|
-------------------------------------------------
|
|
GAGNANT
|
|
-------------------------------------------------
|
|
🏆 Nom: ${report.winner.firstName} ${report.winner.lastName}
|
|
📧 Email: ${report.winner.email}
|
|
📱 Téléphone: ${report.winner.phone || 'Non renseigné'}
|
|
📍 Ville: ${report.winner.city || 'Non renseignée'}
|
|
🎫 Nombre de tickets joués: ${report.winner.totalTickets}
|
|
|
|
-------------------------------------------------
|
|
PRIX
|
|
-------------------------------------------------
|
|
🎁 Nom: ${report.prize.name}
|
|
💰 Valeur: ${report.prize.value}€
|
|
|
|
-------------------------------------------------
|
|
STATISTIQUES
|
|
-------------------------------------------------
|
|
👥 Total de participants: ${report.statistics.totalParticipants}
|
|
✅ Participants éligibles: ${report.statistics.eligibleParticipants}
|
|
📋 Critères:
|
|
- Tickets minimum: ${report.statistics.criteria.minTickets}
|
|
- Email vérifié: ${report.statistics.criteria.verified ? 'Oui' : 'Non'}
|
|
|
|
-------------------------------------------------
|
|
TICKETS DU GAGNANT
|
|
-------------------------------------------------
|
|
${report.winner.tickets.map((t: any, i: number) =>
|
|
`${i + 1}. Code: ${t.code} | Lot: ${t.prize_name} | Statut: ${t.status} | Joué le: ${new Date(t.played_at).toLocaleDateString('fr-FR')}`
|
|
).join('\n')}
|
|
|
|
-------------------------------------------------
|
|
${report.draw.notifiedAt ? `📧 Gagnant notifié le: ${new Date(report.draw.notifiedAt).toLocaleString('fr-FR')}\n` : ''}${report.draw.claimedAt ? `✅ Lot récupéré le: ${new Date(report.draw.claimedAt).toLocaleString('fr-FR')}\n` : ''}-------------------------------------------------
|
|
|
|
📝 Notes: ${report.draw.notes || 'Aucune note'}
|
|
|
|
=================================================
|
|
Généré le ${new Date().toLocaleString('fr-FR')}
|
|
=================================================
|
|
`.trim();
|
|
|
|
// Télécharger le rapport
|
|
const blob = new Blob([reportText], { type: 'text/plain;charset=utf-8' });
|
|
const link = document.createElement('a');
|
|
link.href = URL.createObjectURL(blob);
|
|
link.download = `rapport-tirage-${existingDraw.id}.txt`;
|
|
link.click();
|
|
|
|
toast.success('Rapport téléchargé!');
|
|
} catch (error: any) {
|
|
toast.error(error.message || 'Erreur lors du téléchargement');
|
|
}
|
|
};
|
|
|
|
const markAsNotified = async () => {
|
|
if (!existingDraw) return;
|
|
|
|
try {
|
|
const token = localStorage.getItem('auth_token') || localStorage.getItem('token');
|
|
const response = await fetch(
|
|
`${API_BASE_URL}/draw/${existingDraw.id}/notify`,
|
|
{
|
|
method: 'PUT',
|
|
headers: {
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
}
|
|
);
|
|
|
|
if (!response.ok) throw new Error('Erreur');
|
|
|
|
toast.success('Gagnant marqué comme notifié');
|
|
await checkExistingDraw();
|
|
} catch (error: any) {
|
|
toast.error(error.message || 'Erreur');
|
|
}
|
|
};
|
|
|
|
const markAsClaimed = async () => {
|
|
if (!existingDraw) return;
|
|
|
|
const notes = prompt('Notes (optionnel):');
|
|
|
|
try {
|
|
const token = localStorage.getItem('auth_token') || localStorage.getItem('token');
|
|
const response = await fetch(
|
|
`${API_BASE_URL}/draw/${existingDraw.id}/claim`,
|
|
{
|
|
method: 'PUT',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
body: JSON.stringify({ notes }),
|
|
}
|
|
);
|
|
|
|
if (!response.ok) throw new Error('Erreur');
|
|
|
|
toast.success('Lot marqué comme récupéré');
|
|
await checkExistingDraw();
|
|
} catch (error: any) {
|
|
toast.error(error.message || 'Erreur');
|
|
}
|
|
};
|
|
|
|
const deleteDraw = async () => {
|
|
if (!existingDraw) return;
|
|
|
|
const confirmMessage = `⚠️ ATTENTION: Cette action est IRRÉVERSIBLE!\n\nVoulez-vous vraiment annuler ce tirage au sort?\n\nGagnant: ${existingDraw.winner_name}\nEmail: ${existingDraw.winner_email}\nPrix: ${existingDraw.prize_name}`;
|
|
|
|
if (!confirm(confirmMessage)) {
|
|
return;
|
|
}
|
|
|
|
setLoading(true);
|
|
try {
|
|
const token = localStorage.getItem('auth_token') || localStorage.getItem('token');
|
|
const response = await fetch(
|
|
`${API_BASE_URL}/draw/${existingDraw.id}`,
|
|
{
|
|
method: 'DELETE',
|
|
headers: {
|
|
Authorization: `Bearer ${token}`,
|
|
},
|
|
}
|
|
);
|
|
|
|
if (!response.ok) {
|
|
let errorMessage = 'Erreur lors de l\'annulation';
|
|
try {
|
|
const error = await response.json();
|
|
errorMessage = error.message || errorMessage;
|
|
} catch (e) {
|
|
// Si le parsing JSON échoue, utiliser le message par défaut
|
|
errorMessage = `Erreur ${response.status}: ${response.statusText}`;
|
|
}
|
|
throw new Error(errorMessage);
|
|
}
|
|
|
|
toast.success('🗑️ Tirage au sort annulé avec succès!');
|
|
setHasExistingDraw(false);
|
|
setExistingDraw(null);
|
|
setDrawResult(null);
|
|
setAllowRedraw(false);
|
|
await checkExistingDraw();
|
|
await loadParticipants();
|
|
} catch (error: any) {
|
|
console.error('Erreur lors de l\'annulation du tirage:', error);
|
|
toast.error(error.message || 'Erreur lors de l\'annulation');
|
|
} finally {
|
|
setLoading(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="p-6 max-w-7xl mx-auto">
|
|
{/* En-tête avec titre du prix */}
|
|
<div className="mb-6">
|
|
<h1 className="text-3xl font-bold mb-2 flex items-center gap-3">
|
|
<Trophy className="w-10 h-10 text-yellow-600" />
|
|
Tirage au Sort - {prizeName}
|
|
</h1>
|
|
<p className="text-gray-600 text-lg">
|
|
Prix à gagner : <span className="font-bold text-purple-600">{prizeValue}€</span> •
|
|
Participants ayant joué au moins {minTickets} ticket{minTickets > 1 ? 's' : ''}
|
|
</p>
|
|
</div>
|
|
|
|
{/* Alerte si un tirage existe déjà */}
|
|
{hasExistingDraw && existingDraw && (
|
|
<Card className="p-6 mb-6 border-yellow-500 bg-yellow-50">
|
|
<div className="flex items-start gap-4">
|
|
<AlertCircle className="w-6 h-6 text-yellow-600 flex-shrink-0 mt-1" />
|
|
<div className="flex-1">
|
|
<h3 className="font-bold text-yellow-900 mb-2">Un tirage a déjà été effectué!</h3>
|
|
<div className="space-y-1 text-sm text-yellow-800">
|
|
<p><strong>Date:</strong> {new Date(existingDraw.draw_date).toLocaleString('fr-FR')}</p>
|
|
<p><strong>Gagnant:</strong> {existingDraw.winner_name} ({existingDraw.winner_email})</p>
|
|
<p><strong>Prix:</strong> {existingDraw.prize_name} - {existingDraw.prize_value}€</p>
|
|
<p><strong>Participants éligibles:</strong> {existingDraw.eligible_participants} / {existingDraw.total_participants}</p>
|
|
<p>
|
|
<strong>Statut:</strong>{' '}
|
|
<span
|
|
className={`px-2 py-1 rounded text-xs ${
|
|
existingDraw.status === 'CLAIMED'
|
|
? 'bg-green-100 text-green-800'
|
|
: existingDraw.status === 'NOTIFIED'
|
|
? 'bg-blue-100 text-blue-800'
|
|
: 'bg-gray-100 text-gray-800'
|
|
}`}
|
|
>
|
|
{existingDraw.status}
|
|
</span>
|
|
</p>
|
|
</div>
|
|
|
|
<div className="flex gap-2 mt-4 flex-wrap">
|
|
<Button onClick={downloadReport} size="sm" variant="outline">
|
|
<Download className="w-4 h-4 mr-1" />
|
|
Télécharger rapport
|
|
</Button>
|
|
|
|
{existingDraw.status === 'COMPLETED' && (
|
|
<Button onClick={markAsNotified} size="sm" variant="outline">
|
|
<Mail className="w-4 h-4 mr-1" />
|
|
Marquer comme notifié
|
|
</Button>
|
|
)}
|
|
|
|
{existingDraw.status === 'NOTIFIED' && (
|
|
<Button onClick={markAsClaimed} size="sm" variant="outline">
|
|
<CheckCircle className="w-4 h-4 mr-1" />
|
|
Marquer comme récupéré
|
|
</Button>
|
|
)}
|
|
|
|
<Button
|
|
onClick={deleteDraw}
|
|
size="sm"
|
|
variant="outline"
|
|
className="border-red-300 text-red-700 hover:bg-red-50 hover:border-red-400"
|
|
>
|
|
<Trash2 className="w-4 h-4 mr-1" />
|
|
Annuler ce tirage
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Card>
|
|
)}
|
|
|
|
{/* Liste des participants éligibles */}
|
|
<Card className="p-6 mb-6">
|
|
<div className="flex items-center justify-between mb-6">
|
|
<div>
|
|
<h2 className="text-2xl font-bold flex items-center gap-2">
|
|
<Users className="w-6 h-6 text-blue-600" />
|
|
Participants Éligibles
|
|
</h2>
|
|
<p className="text-gray-600 text-sm mt-1">
|
|
{loading
|
|
? 'Chargement en cours...'
|
|
: participants.length > 0
|
|
? `${participants.length} participant${participants.length > 1 ? 's' : ''} éligible${participants.length > 1 ? 's' : ''} au tirage`
|
|
: 'Aucun participant chargé'}
|
|
</p>
|
|
</div>
|
|
<Button
|
|
onClick={loadParticipants}
|
|
isLoading={loading}
|
|
disabled={loading}
|
|
size="sm"
|
|
>
|
|
<RefreshCw className="w-4 h-4 mr-2" />
|
|
Actualiser
|
|
</Button>
|
|
</div>
|
|
|
|
{loading && (
|
|
<div className="text-center py-12">
|
|
<RefreshCw className="w-12 h-12 text-blue-600 animate-spin mx-auto mb-4" />
|
|
<p className="text-gray-600">Chargement des participants éligibles...</p>
|
|
</div>
|
|
)}
|
|
|
|
{!loading && participants.length === 0 && (
|
|
<div className="text-center py-12 bg-gray-50 rounded-lg">
|
|
<Users className="w-16 h-16 text-gray-400 mx-auto mb-4" />
|
|
<p className="text-gray-600 text-lg font-medium">Aucun participant éligible</p>
|
|
<p className="text-gray-500 text-sm mt-2">
|
|
Vérifiez que des participants ont joué au moins {minTickets} ticket{minTickets > 1 ? 's' : ''}
|
|
</p>
|
|
</div>
|
|
)}
|
|
|
|
{!loading && participants.length > 0 && (
|
|
<>
|
|
<div className="overflow-x-auto">
|
|
<table className="w-full">
|
|
<thead className="bg-gradient-to-r from-blue-50 to-purple-50">
|
|
<tr>
|
|
<th className="px-6 py-4 text-left text-xs font-bold text-gray-700 uppercase tracking-wider">
|
|
#
|
|
</th>
|
|
<th className="px-6 py-4 text-left text-xs font-bold text-gray-700 uppercase tracking-wider">
|
|
Nom Complet
|
|
</th>
|
|
<th className="px-6 py-4 text-left text-xs font-bold text-gray-700 uppercase tracking-wider">
|
|
Email
|
|
</th>
|
|
<th className="px-6 py-4 text-center text-xs font-bold text-gray-700 uppercase tracking-wider">
|
|
Tickets Joués
|
|
</th>
|
|
<th className="px-6 py-4 text-center text-xs font-bold text-gray-700 uppercase tracking-wider">
|
|
Lots Gagnés
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody className="bg-white divide-y divide-gray-200">
|
|
{participants.map((participant, index) => (
|
|
<tr key={participant.id} className="hover:bg-blue-50 transition-colors">
|
|
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
|
|
{index + 1}
|
|
</td>
|
|
<td className="px-6 py-4 whitespace-nowrap">
|
|
<div className="flex items-center">
|
|
<User className="w-5 h-5 text-blue-500 mr-2" />
|
|
<span className="text-sm font-medium text-gray-900">
|
|
{participant.first_name} {participant.last_name}
|
|
</span>
|
|
</div>
|
|
</td>
|
|
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-600">
|
|
{participant.email}
|
|
</td>
|
|
<td className="px-6 py-4 whitespace-nowrap text-center">
|
|
<span className="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-blue-100 text-blue-800">
|
|
{participant.tickets_played}
|
|
</span>
|
|
</td>
|
|
<td className="px-6 py-4 whitespace-nowrap text-center">
|
|
<span className="inline-flex items-center px-3 py-1 rounded-full text-sm font-medium bg-purple-100 text-purple-800">
|
|
{participant.prizes_won}
|
|
</span>
|
|
</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
{/* Bouton de tirage au sort */}
|
|
<div className="mt-8 p-6 bg-gradient-to-r from-yellow-50 to-orange-50 rounded-lg border-2 border-yellow-200">
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<h3 className="text-lg font-bold text-gray-900 mb-1">
|
|
Prêt à lancer le tirage au sort ?
|
|
</h3>
|
|
<p className="text-sm text-gray-600">
|
|
{participants.length} participant{participants.length > 1 ? 's ont' : ' a'} une chance égale de gagner {prizeName} ({prizeValue}€)
|
|
</p>
|
|
</div>
|
|
<Button
|
|
onClick={conductDraw}
|
|
disabled={loading}
|
|
size="lg"
|
|
className="bg-gradient-to-r from-yellow-500 to-orange-500 hover:from-yellow-600 hover:to-orange-600"
|
|
>
|
|
<Trophy className="w-5 h-5 mr-2" />
|
|
Lancer le Tirage
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</>
|
|
)}
|
|
</Card>
|
|
|
|
{/* Résultat du tirage */}
|
|
{drawResult && (
|
|
<Card className="p-6 bg-gradient-to-br from-yellow-50 to-orange-50 border-yellow-500">
|
|
<div className="text-center">
|
|
<Trophy className="w-16 h-16 text-yellow-600 mx-auto mb-4" />
|
|
<h2 className="text-3xl font-bold text-gray-900 mb-2">
|
|
Félicitations au gagnant!
|
|
</h2>
|
|
|
|
<div className="bg-white rounded-lg p-6 my-6 shadow-lg">
|
|
<User className="w-12 h-12 text-blue-600 mx-auto mb-3" />
|
|
<h3 className="text-2xl font-bold text-gray-900 mb-2">
|
|
{drawResult.winner.name}
|
|
</h3>
|
|
<p className="text-gray-600 mb-1">{drawResult.winner.email}</p>
|
|
<p className="text-sm text-gray-500">
|
|
{drawResult.winner.ticketsPlayed} ticket(s) joué(s)
|
|
</p>
|
|
</div>
|
|
|
|
<div className="bg-white rounded-lg p-6 shadow-lg">
|
|
<Gift className="w-12 h-12 text-purple-600 mx-auto mb-3" />
|
|
<h3 className="text-xl font-bold text-gray-900 mb-1">
|
|
{drawResult.prize.name}
|
|
</h3>
|
|
<p className="text-2xl font-bold text-purple-600">
|
|
{drawResult.prize.value}€
|
|
</p>
|
|
</div>
|
|
|
|
<div className="mt-6 grid grid-cols-3 gap-4 text-center">
|
|
<div>
|
|
<p className="text-2xl font-bold text-gray-900">
|
|
{drawResult.statistics.totalParticipants}
|
|
</p>
|
|
<p className="text-sm text-gray-600">Total participants</p>
|
|
</div>
|
|
<div>
|
|
<p className="text-2xl font-bold text-blue-600">
|
|
{drawResult.statistics.eligibleParticipants}
|
|
</p>
|
|
<p className="text-sm text-gray-600">Éligibles</p>
|
|
</div>
|
|
<div>
|
|
<p className="text-2xl font-bold text-green-600">1</p>
|
|
<p className="text-sm text-gray-600">Gagnant</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="mt-6 flex gap-3 justify-center">
|
|
<Button onClick={downloadReport}>
|
|
<Download className="w-4 h-4 mr-2" />
|
|
Télécharger le rapport
|
|
</Button>
|
|
<Button variant="outline" onClick={() => {
|
|
if (typeof window !== 'undefined') {
|
|
window.location.reload();
|
|
}
|
|
}}>
|
|
<RefreshCw className="w-4 h-4 mr-2" />
|
|
Rafraîchir
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</Card>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|