86 lines
3.1 KiB
TypeScript
86 lines
3.1 KiB
TypeScript
// Este componente maneja la lista de encuestas en el panel de administración
|
|
// Funcionalidades:
|
|
// - Muestra todas las encuestas en una tabla
|
|
// - Permite editar encuestas existentes
|
|
// - Permite eliminar encuestas con confirmación
|
|
// - Muestra el estado (publicada/borrador), fechas y conteo de respuestas
|
|
|
|
|
|
'use client';
|
|
|
|
import { Button } from '@repo/shadcn/button';
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
CardDescription,
|
|
CardFooter,
|
|
CardHeader,
|
|
CardTitle,
|
|
} from '@repo/shadcn/card';
|
|
import { useRouter } from 'next/navigation';
|
|
import { useSurveysForUserQuery } from '@/feactures/surveys/hooks/use-query-surveys';
|
|
import { SurveyAnswerForUser } from '../schemas/survey';
|
|
import { Badge } from '@repo/shadcn/badge';
|
|
import { BadgeCheck } from 'lucide-react';
|
|
|
|
export function SurveyList() {
|
|
|
|
const router = useRouter();
|
|
const {data: surveys} = useSurveysForUserQuery()
|
|
|
|
const handleRespond = (surveyId: number) => {
|
|
router.push(`/dashboard/encuestas/${surveyId}/responder`);
|
|
};
|
|
|
|
// console.log(surveys?.data)
|
|
return (
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
{surveys?.meta.totalPages === 0 ? (
|
|
<div className="col-span-full text-center py-10">
|
|
<p className="text-muted-foreground">No hay encuestas disponibles en este momento.</p>
|
|
</div>
|
|
) : (
|
|
surveys?.data.map((data: SurveyAnswerForUser) => (
|
|
|
|
<Card key={data.surveys.id} className="flex flex-col">
|
|
<CardHeader>
|
|
<CardTitle>{data.surveys.title}</CardTitle>
|
|
<CardDescription>{data.surveys.description}</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="flex-grow">
|
|
<div className="space-y-2 text-sm">
|
|
<div className="flex justify-between">
|
|
<span className="text-muted-foreground">Fecha de creación:</span>
|
|
{/* <span>{data.surveys.created_at.toLocaleDateString()}</span> */}
|
|
<span>{new Date(data.surveys.created_at).toLocaleDateString()}</span>
|
|
</div>
|
|
{data.surveys.closingDate && (
|
|
<div className="flex justify-between">
|
|
<span className="text-muted-foreground">Fecha de cierre:</span>
|
|
{/* <span>{data.surveys.closingDate.toLocaleDateString()}</span> */}
|
|
<span>{new Date(data.surveys.closingDate).toLocaleDateString()}</span>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</CardContent>
|
|
<CardFooter className="flex justify-center">
|
|
{data.answers_surveys === null ? (
|
|
<Button
|
|
className="w-full"
|
|
onClick={() => handleRespond(Number(data.surveys.id))}
|
|
>
|
|
Responder
|
|
</Button>
|
|
) : (
|
|
<Badge className="px-4 py-2 w-full bg-green-600 text-black">
|
|
<BadgeCheck size={28} />
|
|
Realizada
|
|
</Badge>
|
|
)}
|
|
</CardFooter>
|
|
</Card>
|
|
))
|
|
)}
|
|
</div>
|
|
);
|
|
} |