xiner/NextEdu
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat(classes): optimize teacher dashboard ui and implement grade management

Browse Source
This commit is contained in:
SpecialX
2026-01-14 13:59:11 +08:00
parent ade8d4346c
commit 9bfc621d3f
104 changed files with 12793 additions and 2309 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
src/modules/dashboard/components/student-dashboard/student-upcoming-assignments-card.tsx
View File

@@ -6,7 +6,7 @@ import { Button } from "@/shared/components/ui/button"
import { Card, CardContent, CardHeader, CardTitle } from "@/shared/components/ui/card"
import { EmptyState } from "@/shared/components/ui/empty-state"
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/shared/components/ui/table"
import { formatDate } from "@/shared/lib/utils"
import { formatDate, cn } from "@/shared/lib/utils"
import type { StudentHomeworkAssignmentListItem } from "@/modules/homework/types"
const getStatusVariant = (status: string): "default" | "secondary" | "outline" => {
@@ -23,6 +23,30 @@ const getStatusLabel = (status: string) => {
return "Not started"
}
const getActionLabel = (status: string) => {
if (status === "graded") return "Review"
if (status === "submitted") return "View"
if (status === "in_progress") return "Continue"
return "Start"
}
const getActionVariant = (status: string): "default" | "secondary" | "outline" => {
if (status === "graded" || status === "submitted") return "outline"
return "default"
}
const getDueUrgency = (dueAt: string | null) => {
if (!dueAt) return null
const now = new Date()
const due = new Date(dueAt)
const diffHours = (due.getTime() - now.getTime()) / (1000 * 60 * 60)
if (diffHours < 0) return "overdue"
if (diffHours < 48) return "urgent" // 2 days
if (diffHours < 120) return "warning" // 5 days
return "normal"
}
export function StudentUpcomingAssignmentsCard({ upcomingAssignments }: { upcomingAssignments: StudentHomeworkAssignmentListItem[] }) {
const hasAssignments = upcomingAssignments.length > 0
@@ -54,25 +78,49 @@ export function StudentUpcomingAssignmentsCard({ upcomingAssignments }: { upcomi
<TableHead className="text-xs font-medium uppercase text-muted-foreground">Status</TableHead>
<TableHead className="text-xs font-medium uppercase text-muted-foreground">Due</TableHead>
<TableHead className="text-xs font-medium uppercase text-muted-foreground">Score</TableHead>
<TableHead className="text-xs font-medium uppercase text-muted-foreground text-right">Action</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{upcomingAssignments.map((a) => (
<TableRow key={a.id} className="h-12">
<TableCell className="font-medium">
<Link href={`/student/learning/assignments/${a.id}`} className="truncate hover:underline">
{a.title}
</Link>
</TableCell>
<TableCell>
<Badge variant={getStatusVariant(a.progressStatus)} className="capitalize">
{getStatusLabel(a.progressStatus)}
</Badge>
</TableCell>
<TableCell className="text-muted-foreground">{a.dueAt ? formatDate(a.dueAt) : "-"}</TableCell>
<TableCell className="tabular-nums">{a.latestScore ?? "-"}</TableCell>
</TableRow>
))}
{upcomingAssignments.map((a) => {
const urgency = getDueUrgency(a.dueAt)
const isGraded = a.progressStatus === "graded"
return (
<TableRow key={a.id} className="h-12">
<TableCell className="font-medium">
<div className="flex items-center gap-2">
<Link href={`/student/learning/assignments/${a.id}`} className="truncate hover:underline">
{a.title}
</Link>
{!isGraded && urgency === "overdue" && (
<Badge variant="destructive" className="h-5 px-1.5 text-[10px] uppercase">Late</Badge>
)}
</div>
</TableCell>
<TableCell>
<Badge variant={getStatusVariant(a.progressStatus)} className="capitalize">
{getStatusLabel(a.progressStatus)}
</Badge>
</TableCell>
<TableCell className={cn(
"text-muted-foreground",
!isGraded && urgency === "overdue" && "text-destructive font-medium",
!isGraded && urgency === "urgent" && "text-orange-500 font-medium"
)}>
{a.dueAt ? formatDate(a.dueAt) : "-"}
</TableCell>
<TableCell className="tabular-nums">{a.latestScore ?? "-"}</TableCell>
<TableCell className="text-right">
<Button asChild size="sm" variant={getActionVariant(a.progressStatus)} className="h-7 text-xs">
<Link href={`/student/learning/assignments/${a.id}`}>
{getActionLabel(a.progressStatus)}
</Link>
</Button>
</TableCell>
</TableRow>
)
})}
</TableBody>
</Table>
</div>