refactor(dashboard): V2 审计重构 — i18n 补齐 + 共享抽象 + 单测 + a11y

V2 审计报告(docs/architecture/audit/dashboard-audit-report-v2.md)发现并修复:

- P0 i18n:10 个子组件硬编码字符串全部接入 next-intl(teacher-quick-actions /
  teacher-classes-card / teacher-homework-card / teacher-schedule /
  recent-submissions / teacher-grade-trends / student-grades-card /
  student-today-schedule-card / student-upcoming-assignments-card /
  admin-dashboard),新增 ~50 个翻译键
- P1 共享抽象:新增 DashboardGreetingHeader 组件,消除 teacher/student
  头部 90% 重复代码,两个 Header 改为薄包装
- P2 单测:为 6 个纯函数添加 31 个单元测试
  (tests/integration/dashboard/dashboard-utils.test.ts)
- P2 a11y:admin 表格 caption、teacher/student 视图语义化标签
  (header / section aria-label / aside aria-label)
- 同步架构图 004/005
This commit is contained in:
SpecialX
2026-06-22 17:01:00 +08:00
parent 10c668f36a
commit e997abaf5e
41 changed files with 1811 additions and 516 deletions

View File

@@ -1,5 +1,6 @@
import Link from "next/link"
import { PenTool } from "lucide-react"
import { getTranslations } from "next-intl/server"
import { Badge } from "@/shared/components/ui/badge"
import { Button } from "@/shared/components/ui/button"
@@ -14,11 +15,11 @@ import {
STUDENT_HOMEWORK_PROGRESS_LABEL,
} from "@/modules/homework/types"
const getActionLabel = (status: string) => {
if (status === "graded") return "Review"
if (status === "submitted") return "View"
if (status === "in_progress") return "Continue"
return "Start"
const getActionLabelKey = (status: string): "action.review" | "action.view" | "action.continue" | "action.start" => {
if (status === "graded") return "action.review"
if (status === "submitted") return "action.view"
if (status === "in_progress") return "action.continue"
return "action.start"
}
const getActionVariant = (status: string): "default" | "secondary" | "outline" => {
@@ -33,12 +34,13 @@ const getDueUrgency = (dueAt: string | null) => {
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
if (diffHours < 48) return "urgent"
if (diffHours < 120) return "warning"
return "normal"
}
export function StudentUpcomingAssignmentsCard({ upcomingAssignments }: { upcomingAssignments: StudentHomeworkAssignmentListItem[] }) {
export async function StudentUpcomingAssignmentsCard({ upcomingAssignments }: { upcomingAssignments: StudentHomeworkAssignmentListItem[] }) {
const t = await getTranslations("dashboard")
const hasAssignments = upcomingAssignments.length > 0
return (
@@ -46,18 +48,18 @@ export function StudentUpcomingAssignmentsCard({ upcomingAssignments }: { upcomi
<CardHeader className="flex flex-row items-center justify-between">
<CardTitle className="text-base flex items-center gap-2">
<PenTool className="h-4 w-4 text-muted-foreground" />
Upcoming Assignments
{t("sections.upcomingAssignments")}
</CardTitle>
<Button asChild variant="outline" size="sm">
<Link href="/student/learning/assignments">View all</Link>
<Link href="/student/learning/assignments">{t("quickActions.viewAll")}</Link>
</Button>
</CardHeader>
<CardContent>
{!hasAssignments ? (
<EmptyState
icon={PenTool}
title="No assignments"
description="You have no assigned homework right now."
title={t("empty.noAssignmentsStudent")}
description={t("empty.noAssignmentsStudentDesc")}
className="border-none h-72"
/>
) : (
@@ -65,18 +67,18 @@ export function StudentUpcomingAssignmentsCard({ upcomingAssignments }: { upcomi
<Table>
<TableHeader>
<TableRow className="bg-muted/50">
<TableHead className="text-xs font-medium uppercase text-muted-foreground">Title</TableHead>
<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>
<TableHead className="text-xs font-medium uppercase text-muted-foreground">{t("table.title")}</TableHead>
<TableHead className="text-xs font-medium uppercase text-muted-foreground">{t("table.status")}</TableHead>
<TableHead className="text-xs font-medium uppercase text-muted-foreground">{t("table.due")}</TableHead>
<TableHead className="text-xs font-medium uppercase text-muted-foreground">{t("table.score")}</TableHead>
<TableHead className="text-xs font-medium uppercase text-muted-foreground text-right">{t("table.action")}</TableHead>
</TableRow>
</TableHeader>
<TableBody>
{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">
@@ -85,7 +87,7 @@ export function StudentUpcomingAssignmentsCard({ upcomingAssignments }: { upcomi
{a.title}
</Link>
{!isGraded && urgency === "overdue" && (
<Badge variant="destructive" className="h-5 px-1.5 text-[10px] uppercase">Late</Badge>
<Badge variant="destructive" className="h-5 px-1.5 text-[10px] uppercase">{t("badge.late")}</Badge>
)}
</div>
</TableCell>
@@ -107,7 +109,7 @@ export function StudentUpcomingAssignmentsCard({ upcomingAssignments }: { upcomi
<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)}
{t(getActionLabelKey(a.progressStatus))}
</Link>
</Button>
</TableCell>