88a385ed07
React 18 + TypeScript + Vite 5 + Tailwind CSS + shadcn/ui frontend: - Multi-role auth: student, teacher, admin, corporate, agent, developer - Student portal: dashboard, courses, adaptive learning, exams, placement - Teacher portal: courses, assignments, grading, attendance, AI workbench - Admin portal: 60+ management pages (LMS, exams, users, entities, AI) - AI-powered features: study coach, generation page, gap analysis, TTS - Exam system: session, auto-save, results, grading queue - Full IELTS workflow: reading/listening/writing/speaking modules Made-with: Cursor
69 lines
3.3 KiB
TypeScript
69 lines
3.3 KiB
TypeScript
import { Card, CardContent } from "@/components/ui/card";
|
|
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
|
|
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table";
|
|
import { Badge } from "@/components/ui/badge";
|
|
import { Button } from "@/components/ui/button";
|
|
import AiTipBanner from "@/components/ai/AiTipBanner";
|
|
import AiReportNarrative from "@/components/ai/AiReportNarrative";
|
|
|
|
const records = [
|
|
{ id: 1, assignment: "IELTS Prep Q1", exam: "EX-001", date: "2025-03-01", score: 7.5, duration: "175 min", status: "Completed" },
|
|
{ id: 2, assignment: "Speaking Workshop", exam: "EX-005", date: "2025-03-05", score: 6.0, duration: "14 min", status: "Completed" },
|
|
{ id: 3, assignment: "Full Mock Exam", exam: "EX-006", date: "2025-03-10", score: null, duration: "120 min", status: "In Progress" },
|
|
{ id: 4, assignment: "Listening Bootcamp", exam: "EX-003", date: "2025-02-20", score: 5.5, duration: "28 min", status: "Completed" },
|
|
];
|
|
|
|
export default function RecordPage() {
|
|
return (
|
|
<div className="space-y-6">
|
|
<div>
|
|
<h1 className="text-2xl font-bold tracking-tight">Record</h1>
|
|
<p className="text-muted-foreground">Browse assignment and exam attempt history.</p>
|
|
</div>
|
|
|
|
<AiTipBanner context="record" variant="insight" />
|
|
|
|
<AiReportNarrative report_type="record" data={{ records }} />
|
|
|
|
<div className="flex flex-wrap gap-3 items-center">
|
|
<Select><SelectTrigger className="w-[160px]"><SelectValue placeholder="Entity" /></SelectTrigger>
|
|
<SelectContent><SelectItem value="acme">Acme Corp</SelectItem><SelectItem value="global">Global Ltd</SelectItem></SelectContent>
|
|
</Select>
|
|
<Select><SelectTrigger className="w-[180px]"><SelectValue placeholder="Select User" /></SelectTrigger>
|
|
<SelectContent><SelectItem value="sarah">Sarah Johnson</SelectItem><SelectItem value="ahmed">Ahmed Hassan</SelectItem></SelectContent>
|
|
</Select>
|
|
<div className="flex gap-1">
|
|
{["Day", "Week", "Month"].map(t => (
|
|
<Button key={t} variant="outline" size="sm">{t}</Button>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
<Card className="border-0 shadow-sm">
|
|
<CardContent className="p-0">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>Assignment</TableHead><TableHead>Exam</TableHead><TableHead>Date</TableHead>
|
|
<TableHead>Score</TableHead><TableHead>Duration</TableHead><TableHead>Status</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{records.map((r) => (
|
|
<TableRow key={r.id}>
|
|
<TableCell className="font-medium">{r.assignment}</TableCell>
|
|
<TableCell className="font-mono text-xs">{r.exam}</TableCell>
|
|
<TableCell>{r.date}</TableCell>
|
|
<TableCell>{r.score ? r.score.toFixed(1) : "—"}</TableCell>
|
|
<TableCell>{r.duration}</TableCell>
|
|
<TableCell><Badge variant={r.status === "Completed" ? "default" : "secondary"}>{r.status}</Badge></TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
);
|
|
}
|