55 lines
2.5 KiB
TypeScript
55 lines
2.5 KiB
TypeScript
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion';
|
|
import { StudentExamProps } from '@/types/page';
|
|
import { usePage } from '@inertiajs/react';
|
|
|
|
const ExamModules = () => {
|
|
const { props } = usePage<StudentExamProps>();
|
|
const { modules } = props;
|
|
|
|
return (
|
|
<>
|
|
{modules && modules.length > 0 ? (
|
|
<Accordion type="single" collapsible className="space-y-4" defaultValue={modules[0]?.id?.toString()}>
|
|
{modules.map((module, ind) => (
|
|
<AccordionItem key={module.id} value={module.id?.toString() || ind.toString()} className="overflow-hidden rounded-lg border">
|
|
<AccordionTrigger className="[&[data-state=open]]:!bg-muted px-4 py-3 text-base hover:no-underline">
|
|
{ind + 1}. {module.title}
|
|
</AccordionTrigger>
|
|
<AccordionContent className="space-y-2 p-2">
|
|
{module.questions && module.questions.length > 0 ? (
|
|
<div className="space-y-2">
|
|
{module.questions.map((question, qInd) => (
|
|
<div key={question.id} className="rounded-md border p-3">
|
|
<div className="flex items-start justify-between">
|
|
<div className="flex-1">
|
|
<p className="text-sm font-medium">
|
|
Question {qInd + 1}: {question.title}
|
|
</p>
|
|
<p className="text-muted-foreground mt-1 text-xs">
|
|
Type: {question.question_type} | Marks: {question.marks}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
) : (
|
|
<div className="px-4 py-3 text-center">
|
|
<p>No questions in this module</p>
|
|
</div>
|
|
)}
|
|
</AccordionContent>
|
|
</AccordionItem>
|
|
))}
|
|
</Accordion>
|
|
) : (
|
|
<div className="p-6 text-center">
|
|
<p>No modules available for this exam</p>
|
|
</div>
|
|
)}
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default ExamModules;
|