完整性更新

现在已经实现了大部分基础功能

src/modules/classes/actions.ts

@@ -0,0 +1,434 @@
+"use server";
+
+import { revalidatePath } from "next/cache"
+import { auth } from "@/auth"
+
+import type { ActionState } from "@/shared/types/action-state"
+import {
+  createAdminClass,
+  createClassScheduleItem,
+  createTeacherClass,
+  deleteAdminClass,
+  deleteClassScheduleItem,
+  deleteTeacherClass,
+  enrollStudentByEmail,
+  enrollStudentByInvitationCode,
+  ensureClassInvitationCode,
+  regenerateClassInvitationCode,
+  setClassSubjectTeachers,
+  setStudentEnrollmentStatus,
+  updateAdminClass,
+  updateClassScheduleItem,
+  updateTeacherClass,
+} from "./data-access"
+import { DEFAULT_CLASS_SUBJECTS, type ClassSubject } from "./types"
+
+const isClassSubject = (v: string): v is ClassSubject => DEFAULT_CLASS_SUBJECTS.includes(v as ClassSubject)
+
+export async function createTeacherClassAction(
+  prevState: ActionState<string> | null,
+  formData: FormData
+): Promise<ActionState<string>> {
+  const schoolName = formData.get("schoolName")
+  const schoolId = formData.get("schoolId")
+  const name = formData.get("name")
+  const grade = formData.get("grade")
+  const gradeId = formData.get("gradeId")
+  const homeroom = formData.get("homeroom")
+  const room = formData.get("room")
+
+  if (typeof name !== "string" || name.trim().length === 0) {
+    return { success: false, message: "Class name is required" }
+  }
+  if (typeof grade !== "string" || grade.trim().length === 0) {
+    return { success: false, message: "Grade is required" }
+  }
+
+  try {
+    const id = await createTeacherClass({
+      schoolName: typeof schoolName === "string" ? schoolName : null,
+      schoolId: typeof schoolId === "string" ? schoolId : null,
+      name,
+      grade,
+      gradeId: typeof gradeId === "string" ? gradeId : null,
+      homeroom: typeof homeroom === "string" ? homeroom : null,
+      room: typeof room === "string" ? room : null,
+    })
+    revalidatePath("/teacher/classes/my")
+    revalidatePath("/teacher/classes/students")
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Class created successfully", data: id }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to create class" }
+  }
+}
+
+export async function updateTeacherClassAction(
+  classId: string,
+  prevState: ActionState | null,
+  formData: FormData
+): Promise<ActionState> {
+  const schoolName = formData.get("schoolName")
+  const schoolId = formData.get("schoolId")
+  const name = formData.get("name")
+  const grade = formData.get("grade")
+  const gradeId = formData.get("gradeId")
+  const homeroom = formData.get("homeroom")
+  const room = formData.get("room")
+
+  if (typeof classId !== "string" || classId.trim().length === 0) {
+    return { success: false, message: "Missing class id" }
+  }
+
+  try {
+    await updateTeacherClass(classId, {
+      schoolName: typeof schoolName === "string" ? schoolName : undefined,
+      schoolId: typeof schoolId === "string" ? schoolId : undefined,
+      name: typeof name === "string" ? name : undefined,
+      grade: typeof grade === "string" ? grade : undefined,
+      gradeId: typeof gradeId === "string" ? gradeId : undefined,
+      homeroom: typeof homeroom === "string" ? homeroom : undefined,
+      room: typeof room === "string" ? room : undefined,
+    })
+    revalidatePath("/teacher/classes/my")
+    revalidatePath("/teacher/classes/students")
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Class updated successfully" }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to update class" }
+  }
+}
+
+export async function deleteTeacherClassAction(classId: string): Promise<ActionState> {
+  if (typeof classId !== "string" || classId.trim().length === 0) {
+    return { success: false, message: "Missing class id" }
+  }
+
+  try {
+    await deleteTeacherClass(classId)
+    revalidatePath("/teacher/classes/my")
+    revalidatePath("/teacher/classes/students")
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Class deleted successfully" }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to delete class" }
+  }
+}
+
+export async function enrollStudentByEmailAction(
+  classId: string,
+  prevState: ActionState | null,
+  formData: FormData
+): Promise<ActionState> {
+  const email = formData.get("email")
+  if (typeof classId !== "string" || classId.trim().length === 0) {
+    return { success: false, message: "Please select a class" }
+  }
+  if (typeof email !== "string" || email.trim().length === 0) {
+    return { success: false, message: "Student email is required" }
+  }
+
+  try {
+    await enrollStudentByEmail(classId, email)
+    revalidatePath("/teacher/classes/students")
+    revalidatePath("/teacher/classes/my")
+    return { success: true, message: "Student added successfully" }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to add student" }
+  }
+}
+
+export async function joinClassByInvitationCodeAction(
+  prevState: ActionState<{ classId: string }> | null,
+  formData: FormData
+): Promise<ActionState<{ classId: string }>> {
+  const code = formData.get("code")
+  if (typeof code !== "string" || code.trim().length === 0) {
+    return { success: false, message: "Invitation code is required" }
+  }
+
+  const session = await auth()
+  if (!session?.user?.id || String(session.user.role ?? "") !== "student") {
+    return { success: false, message: "Unauthorized" }
+  }
+
+  try {
+    const classId = await enrollStudentByInvitationCode(session.user.id, code)
+    revalidatePath("/student/learning/courses")
+    revalidatePath("/student/schedule")
+    revalidatePath("/profile")
+    return { success: true, message: "Joined class successfully", data: { classId } }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to join class" }
+  }
+}
+
+export async function ensureClassInvitationCodeAction(classId: string): Promise<ActionState<{ code: string }>> {
+  if (typeof classId !== "string" || classId.trim().length === 0) {
+    return { success: false, message: "Missing class id" }
+  }
+
+  try {
+    const code = await ensureClassInvitationCode(classId)
+    revalidatePath("/teacher/classes/my")
+    revalidatePath(`/teacher/classes/my/${encodeURIComponent(classId)}`)
+    return { success: true, message: "Invitation code ready", data: { code } }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to generate code" }
+  }
+}
+
+export async function regenerateClassInvitationCodeAction(classId: string): Promise<ActionState<{ code: string }>> {
+  if (typeof classId !== "string" || classId.trim().length === 0) {
+    return { success: false, message: "Missing class id" }
+  }
+
+  try {
+    const code = await regenerateClassInvitationCode(classId)
+    revalidatePath("/teacher/classes/my")
+    revalidatePath(`/teacher/classes/my/${encodeURIComponent(classId)}`)
+    return { success: true, message: "Invitation code updated", data: { code } }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to regenerate code" }
+  }
+}
+
+export async function setStudentEnrollmentStatusAction(
+  classId: string,
+  studentId: string,
+  status: "active" | "inactive"
+): Promise<ActionState> {
+  if (!classId?.trim() || !studentId?.trim()) {
+    return { success: false, message: "Missing enrollment info" }
+  }
+
+  try {
+    await setStudentEnrollmentStatus(classId, studentId, status)
+    revalidatePath("/teacher/classes/students")
+    revalidatePath("/teacher/classes/my")
+    return { success: true, message: "Student updated successfully" }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to update student" }
+  }
+}
+
+export async function createClassScheduleItemAction(
+  prevState: ActionState<string> | null,
+  formData: FormData
+): Promise<ActionState<string>> {
+  const classId = formData.get("classId")
+  const weekday = formData.get("weekday")
+  const startTime = formData.get("startTime")
+  const endTime = formData.get("endTime")
+  const course = formData.get("course")
+  const location = formData.get("location")
+
+  if (typeof classId !== "string" || classId.trim().length === 0) {
+    return { success: false, message: "Please select a class" }
+  }
+  if (typeof weekday !== "string" || weekday.trim().length === 0) {
+    return { success: false, message: "Weekday is required" }
+  }
+  const weekdayNum = Number(weekday)
+  if (!Number.isInteger(weekdayNum) || weekdayNum < 1 || weekdayNum > 7) {
+    return { success: false, message: "Invalid weekday" }
+  }
+  if (typeof course !== "string" || course.trim().length === 0) {
+    return { success: false, message: "Course is required" }
+  }
+  if (typeof startTime !== "string" || typeof endTime !== "string") {
+    return { success: false, message: "Time is required" }
+  }
+
+  try {
+    const id = await createClassScheduleItem({
+      classId,
+      weekday: weekdayNum as 1 | 2 | 3 | 4 | 5 | 6 | 7,
+      startTime,
+      endTime,
+      course,
+      location: typeof location === "string" ? location : null,
+    })
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Schedule item created successfully", data: id }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to create schedule item" }
+  }
+}
+
+export async function updateClassScheduleItemAction(
+  scheduleId: string,
+  prevState: ActionState | null,
+  formData: FormData
+): Promise<ActionState> {
+  const classId = formData.get("classId")
+  const weekday = formData.get("weekday")
+  const startTime = formData.get("startTime")
+  const endTime = formData.get("endTime")
+  const course = formData.get("course")
+  const location = formData.get("location")
+
+  if (typeof scheduleId !== "string" || scheduleId.trim().length === 0) {
+    return { success: false, message: "Missing schedule id" }
+  }
+
+  const weekdayNum = typeof weekday === "string" && weekday.trim().length > 0 ? Number(weekday) : undefined
+  if (weekdayNum !== undefined && (!Number.isInteger(weekdayNum) || weekdayNum < 1 || weekdayNum > 7)) {
+    return { success: false, message: "Invalid weekday" }
+  }
+
+  try {
+    await updateClassScheduleItem(scheduleId, {
+      classId: typeof classId === "string" ? classId : undefined,
+      weekday: weekdayNum as 1 | 2 | 3 | 4 | 5 | 6 | 7 | undefined,
+      startTime: typeof startTime === "string" ? startTime : undefined,
+      endTime: typeof endTime === "string" ? endTime : undefined,
+      course: typeof course === "string" ? course : undefined,
+      location: typeof location === "string" ? location : undefined,
+    })
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Schedule item updated successfully" }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to update schedule item" }
+  }
+}
+
+export async function deleteClassScheduleItemAction(scheduleId: string): Promise<ActionState> {
+  if (typeof scheduleId !== "string" || scheduleId.trim().length === 0) {
+    return { success: false, message: "Missing schedule id" }
+  }
+
+  try {
+    await deleteClassScheduleItem(scheduleId)
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Schedule item deleted successfully" }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to delete schedule item" }
+  }
+}
+
+export async function createAdminClassAction(
+  prevState: ActionState<string> | undefined,
+  formData: FormData
+): Promise<ActionState<string>> {
+  const schoolName = formData.get("schoolName")
+  const schoolId = formData.get("schoolId")
+  const name = formData.get("name")
+  const grade = formData.get("grade")
+  const gradeId = formData.get("gradeId")
+  const teacherId = formData.get("teacherId")
+  const homeroom = formData.get("homeroom")
+  const room = formData.get("room")
+
+  if (typeof name !== "string" || name.trim().length === 0) {
+    return { success: false, message: "Class name is required" }
+  }
+  if (typeof grade !== "string" || grade.trim().length === 0) {
+    return { success: false, message: "Grade is required" }
+  }
+  if (typeof teacherId !== "string" || teacherId.trim().length === 0) {
+    return { success: false, message: "Teacher is required" }
+  }
+
+  try {
+    const id = await createAdminClass({
+      schoolName: typeof schoolName === "string" ? schoolName : null,
+      schoolId: typeof schoolId === "string" ? schoolId : null,
+      name,
+      grade,
+      gradeId: typeof gradeId === "string" ? gradeId : null,
+      teacherId,
+      homeroom: typeof homeroom === "string" ? homeroom : null,
+      room: typeof room === "string" ? room : null,
+    })
+    revalidatePath("/admin/school/classes")
+    revalidatePath("/teacher/classes/my")
+    revalidatePath("/teacher/classes/students")
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Class created successfully", data: id }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to create class" }
+  }
+}
+
+export async function updateAdminClassAction(
+  classId: string,
+  prevState: ActionState | undefined,
+  formData: FormData
+): Promise<ActionState> {
+  const schoolName = formData.get("schoolName")
+  const schoolId = formData.get("schoolId")
+  const name = formData.get("name")
+  const grade = formData.get("grade")
+  const gradeId = formData.get("gradeId")
+  const teacherId = formData.get("teacherId")
+  const homeroom = formData.get("homeroom")
+  const room = formData.get("room")
+  const subjectTeachers = formData.get("subjectTeachers")
+
+  if (typeof classId !== "string" || classId.trim().length === 0) {
+    return { success: false, message: "Missing class id" }
+  }
+
+  try {
+    await updateAdminClass(classId, {
+      schoolName: typeof schoolName === "string" ? schoolName : undefined,
+      schoolId: typeof schoolId === "string" ? schoolId : undefined,
+      name: typeof name === "string" ? name : undefined,
+      grade: typeof grade === "string" ? grade : undefined,
+      gradeId: typeof gradeId === "string" ? gradeId : undefined,
+      teacherId: typeof teacherId === "string" ? teacherId : undefined,
+      homeroom: typeof homeroom === "string" ? homeroom : undefined,
+      room: typeof room === "string" ? room : undefined,
+    })
+
+    if (typeof subjectTeachers === "string" && subjectTeachers.trim().length > 0) {
+      const parsed = JSON.parse(subjectTeachers) as unknown
+      if (!Array.isArray(parsed)) throw new Error("Invalid subject teachers")
+
+      await setClassSubjectTeachers({
+        classId,
+        assignments: parsed.flatMap((item) => {
+          if (!item || typeof item !== "object") return []
+          const subject = (item as { subject?: unknown }).subject
+          const teacherId = (item as { teacherId?: unknown }).teacherId
+
+          if (typeof subject !== "string" || !isClassSubject(subject)) return []
+
+          if (teacherId === null || typeof teacherId === "undefined") {
+            return [{ subject, teacherId: null }]
+          }
+
+          if (typeof teacherId !== "string") return []
+          const trimmed = teacherId.trim()
+          return [{ subject, teacherId: trimmed.length > 0 ? trimmed : null }]
+        }),
+      })
+    }
+
+    revalidatePath("/admin/school/classes")
+    revalidatePath("/teacher/classes/my")
+    revalidatePath("/teacher/classes/students")
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Class updated successfully" }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to update class" }
+  }
+}
+
+export async function deleteAdminClassAction(classId: string): Promise<ActionState> {
+  if (typeof classId !== "string" || classId.trim().length === 0) {
+    return { success: false, message: "Missing class id" }
+  }
+
+  try {
+    await deleteAdminClass(classId)
+    revalidatePath("/admin/school/classes")
+    revalidatePath("/teacher/classes/my")
+    revalidatePath("/teacher/classes/students")
+    revalidatePath("/teacher/classes/schedule")
+    return { success: true, message: "Class deleted successfully" }
+  } catch (error) {
+    return { success: false, message: error instanceof Error ? error.message : "Failed to delete class" }
+  }
+}

src/modules/classes/components/admin-classes-view.tsx

@@ -0,0 +1,434 @@
+"use client"
+
+import { useEffect, useMemo, useState } from "react"
+import { MoreHorizontal, Pencil, Plus, Trash2 } from "lucide-react"
+import { toast } from "sonner"
+import { useRouter } from "next/navigation"
+
+import type { AdminClassListItem, ClassSubjectTeacherAssignment, TeacherOption } from "../types"
+import { DEFAULT_CLASS_SUBJECTS } from "../types"
+import { createAdminClassAction, deleteAdminClassAction, updateAdminClassAction } from "../actions"
+import { Button } from "@/shared/components/ui/button"
+import { Card, CardContent, CardHeader, CardTitle } from "@/shared/components/ui/card"
+import { Dialog, DialogContent, DialogFooter, DialogHeader, DialogTitle } from "@/shared/components/ui/dialog"
+import { Input } from "@/shared/components/ui/input"
+import { Label } from "@/shared/components/ui/label"
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/shared/components/ui/table"
+import { EmptyState } from "@/shared/components/ui/empty-state"
+import { Badge } from "@/shared/components/ui/badge"
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/shared/components/ui/dropdown-menu"
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/shared/components/ui/alert-dialog"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/shared/components/ui/select"
+import { formatDate } from "@/shared/lib/utils"
+
+export function AdminClassesClient({
+  classes,
+  teachers,
+}: {
+  classes: AdminClassListItem[]
+  teachers: TeacherOption[]
+}) {
+  const router = useRouter()
+  const [isWorking, setIsWorking] = useState(false)
+  const [createOpen, setCreateOpen] = useState(false)
+  const [editItem, setEditItem] = useState<AdminClassListItem | null>(null)
+  const [deleteItem, setDeleteItem] = useState<AdminClassListItem | null>(null)
+
+  const defaultTeacherId = useMemo(() => teachers[0]?.id ?? "", [teachers])
+  const [createTeacherId, setCreateTeacherId] = useState(defaultTeacherId)
+  const [editTeacherId, setEditTeacherId] = useState("")
+  const [editSubjectTeachers, setEditSubjectTeachers] = useState<Array<{ subject: string; teacherId: string | null }>>([])
+
+  useEffect(() => {
+    if (!createOpen) return
+    setCreateTeacherId(defaultTeacherId)
+  }, [createOpen, defaultTeacherId])
+
+  useEffect(() => {
+    if (!editItem) return
+    setEditTeacherId(editItem.teacher.id)
+    setEditSubjectTeachers(
+      DEFAULT_CLASS_SUBJECTS.map((s) => ({
+        subject: s,
+        teacherId: editItem.subjectTeachers.find((st) => st.subject === s)?.teacher?.id ?? null,
+      }))
+    )
+  }, [editItem])
+
+  const handleCreate = async (formData: FormData) => {
+    setIsWorking(true)
+    try {
+      const res = await createAdminClassAction(undefined, formData)
+      if (res.success) {
+        toast.success(res.message)
+        setCreateOpen(false)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to create class")
+      }
+    } catch {
+      toast.error("Failed to create class")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  const handleUpdate = async (formData: FormData) => {
+    if (!editItem) return
+    setIsWorking(true)
+    try {
+      const res = await updateAdminClassAction(editItem.id, undefined, formData)
+      if (res.success) {
+        toast.success(res.message)
+        setEditItem(null)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to update class")
+      }
+    } catch {
+      toast.error("Failed to update class")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  const handleDelete = async () => {
+    if (!deleteItem) return
+    setIsWorking(true)
+    try {
+      const res = await deleteAdminClassAction(deleteItem.id)
+      if (res.success) {
+        toast.success(res.message)
+        setDeleteItem(null)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to delete class")
+      }
+    } catch {
+      toast.error("Failed to delete class")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  const setSubjectTeacher = (subject: string, teacherId: string | null) => {
+    setEditSubjectTeachers((prev) => prev.map((p) => (p.subject === subject ? { ...p, teacherId } : p)))
+  }
+
+  const formatSubjectTeachers = (list: ClassSubjectTeacherAssignment[]) => {
+    const pairs = list
+      .filter((x) => x.teacher)
+      .map((x) => `${x.subject}:${x.teacher?.name ?? ""}`)
+      .filter((x) => x.length > 0)
+    return pairs.length > 0 ? pairs.join("，") : "-"
+  }
+
+  return (
+    <>
+      <div className="flex justify-end">
+        <Button onClick={() => setCreateOpen(true)} disabled={isWorking}>
+          <Plus className="mr-2 h-4 w-4" />
+          New class
+        </Button>
+      </div>
+
+      <Card className="shadow-none">
+        <CardHeader className="flex flex-row items-center justify-between space-y-0">
+          <CardTitle className="text-base">All classes</CardTitle>
+          <Badge variant="secondary" className="tabular-nums">
+            {classes.length}
+          </Badge>
+        </CardHeader>
+        <CardContent>
+          {classes.length === 0 ? (
+            <EmptyState
+              title="No classes"
+              description="Create classes to manage students and schedules."
+              className="h-auto border-none shadow-none"
+            />
+          ) : (
+            <Table>
+              <TableHeader>
+                <TableRow>
+                  <TableHead>School</TableHead>
+                  <TableHead>Name</TableHead>
+                  <TableHead>Grade</TableHead>
+                  <TableHead>Homeroom</TableHead>
+                  <TableHead>Room</TableHead>
+                  <TableHead>班主任</TableHead>
+                  <TableHead>任课老师</TableHead>
+                  <TableHead className="text-right">Students</TableHead>
+                  <TableHead>Updated</TableHead>
+                  <TableHead className="w-[60px]" />
+                </TableRow>
+              </TableHeader>
+              <TableBody>
+                {classes.map((c) => (
+                  <TableRow key={c.id}>
+                    <TableCell className="text-muted-foreground">{c.schoolName ?? "-"}</TableCell>
+                    <TableCell className="font-medium">{c.name}</TableCell>
+                    <TableCell className="text-muted-foreground">{c.grade}</TableCell>
+                    <TableCell className="text-muted-foreground">{c.homeroom ?? "-"}</TableCell>
+                    <TableCell className="text-muted-foreground">{c.room ?? "-"}</TableCell>
+                    <TableCell className="text-muted-foreground">{c.teacher.name}</TableCell>
+                    <TableCell className="text-muted-foreground">{formatSubjectTeachers(c.subjectTeachers)}</TableCell>
+                    <TableCell className="text-muted-foreground tabular-nums text-right">{c.studentCount}</TableCell>
+                    <TableCell className="text-muted-foreground">{formatDate(c.updatedAt)}</TableCell>
+                    <TableCell className="text-right">
+                      <DropdownMenu>
+                        <DropdownMenuTrigger asChild>
+                          <Button variant="ghost" size="icon" className="h-8 w-8" disabled={isWorking}>
+                            <MoreHorizontal className="h-4 w-4" />
+                          </Button>
+                        </DropdownMenuTrigger>
+                        <DropdownMenuContent align="end">
+                          <DropdownMenuItem onClick={() => setEditItem(c)}>
+                            <Pencil className="mr-2 h-4 w-4" />
+                            Edit
+                          </DropdownMenuItem>
+                          <DropdownMenuSeparator />
+                          <DropdownMenuItem
+                            className="text-destructive focus:text-destructive"
+                            onClick={() => setDeleteItem(c)}
+                          >
+                            <Trash2 className="mr-2 h-4 w-4" />
+                            Delete
+                          </DropdownMenuItem>
+                        </DropdownMenuContent>
+                      </DropdownMenu>
+                    </TableCell>
+                  </TableRow>
+                ))}
+              </TableBody>
+            </Table>
+          )}
+        </CardContent>
+      </Card>
+
+      <Dialog open={createOpen} onOpenChange={setCreateOpen}>
+        <DialogContent className="sm:max-w-[560px]">
+          <DialogHeader>
+            <DialogTitle>New class</DialogTitle>
+          </DialogHeader>
+          <form action={handleCreate} className="space-y-4">
+            <div className="grid grid-cols-4 items-center gap-4">
+              <Label htmlFor="create-school-name" className="text-right">
+                School
+              </Label>
+              <Input id="create-school-name" name="schoolName" className="col-span-3" placeholder="e.g. First Primary School" />
+            </div>
+
+            <div className="grid grid-cols-4 items-center gap-4">
+              <Label htmlFor="create-name" className="text-right">
+                Name
+              </Label>
+              <Input id="create-name" name="name" className="col-span-3" placeholder="e.g. Grade 10 · Class 3" autoFocus />
+            </div>
+
+            <div className="grid grid-cols-4 items-center gap-4">
+              <Label htmlFor="create-grade" className="text-right">
+                Grade
+              </Label>
+              <Input id="create-grade" name="grade" className="col-span-3" placeholder="e.g. Grade 10" />
+            </div>
+
+            <div className="grid grid-cols-4 items-center gap-4">
+              <Label htmlFor="create-homeroom" className="text-right">
+                Homeroom
+              </Label>
+              <Input id="create-homeroom" name="homeroom" className="col-span-3" placeholder="Optional" />
+            </div>
+
+            <div className="grid grid-cols-4 items-center gap-4">
+              <Label htmlFor="create-room" className="text-right">
+                Room
+              </Label>
+              <Input id="create-room" name="room" className="col-span-3" placeholder="Optional" />
+            </div>
+
+            <div className="grid grid-cols-4 items-center gap-4">
+              <Label className="text-right">Teacher</Label>
+              <div className="col-span-3">
+                <Select value={createTeacherId} onValueChange={setCreateTeacherId} disabled={teachers.length === 0}>
+                  <SelectTrigger>
+                    <SelectValue placeholder={teachers.length === 0 ? "No teachers" : "Select a teacher"} />
+                  </SelectTrigger>
+                  <SelectContent>
+                    {teachers.map((t) => (
+                      <SelectItem key={t.id} value={t.id}>
+                        {t.name} ({t.email})
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+                <input type="hidden" name="teacherId" value={createTeacherId} />
+              </div>
+            </div>
+
+            <DialogFooter>
+              <Button type="button" variant="outline" onClick={() => setCreateOpen(false)} disabled={isWorking}>
+                Cancel
+              </Button>
+              <Button type="submit" disabled={isWorking || teachers.length === 0 || !createTeacherId}>
+                Create
+              </Button>
+            </DialogFooter>
+          </form>
+        </DialogContent>
+      </Dialog>
+
+      <Dialog
+        open={Boolean(editItem)}
+        onOpenChange={(open) => {
+          if (isWorking) return
+          if (!open) setEditItem(null)
+        }}
+      >
+        <DialogContent className="sm:max-w-[560px]">
+          <DialogHeader>
+            <DialogTitle>Edit class</DialogTitle>
+          </DialogHeader>
+          {editItem ? (
+            <form action={handleUpdate} className="space-y-4">
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="edit-school-name" className="text-right">
+                  School
+                </Label>
+                <Input
+                  id="edit-school-name"
+                  name="schoolName"
+                  className="col-span-3"
+                  defaultValue={editItem.schoolName ?? ""}
+                />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="edit-name" className="text-right">
+                  Name
+                </Label>
+                <Input id="edit-name" name="name" className="col-span-3" defaultValue={editItem.name} />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="edit-grade" className="text-right">
+                  Grade
+                </Label>
+                <Input id="edit-grade" name="grade" className="col-span-3" defaultValue={editItem.grade} />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="edit-homeroom" className="text-right">
+                  Homeroom
+                </Label>
+                <Input id="edit-homeroom" name="homeroom" className="col-span-3" defaultValue={editItem.homeroom ?? ""} />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="edit-room" className="text-right">
+                  Room
+                </Label>
+                <Input id="edit-room" name="room" className="col-span-3" defaultValue={editItem.room ?? ""} />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label className="text-right">班主任</Label>
+                <div className="col-span-3">
+                  <Select value={editTeacherId} onValueChange={setEditTeacherId} disabled={teachers.length === 0}>
+                    <SelectTrigger>
+                      <SelectValue placeholder={teachers.length === 0 ? "No teachers" : "Select a teacher"} />
+                    </SelectTrigger>
+                    <SelectContent>
+                      {teachers.map((t) => (
+                        <SelectItem key={t.id} value={t.id}>
+                          {t.name} ({t.email})
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                  <input type="hidden" name="teacherId" value={editTeacherId} />
+                </div>
+              </div>
+
+              <div className="space-y-3 rounded-md border p-4">
+                <div className="text-sm font-medium">任课老师</div>
+                <div className="grid gap-3">
+                  {DEFAULT_CLASS_SUBJECTS.map((subject) => {
+                    const selected = editSubjectTeachers.find((x) => x.subject === subject)?.teacherId ?? null
+                    return (
+                      <div key={subject} className="grid grid-cols-4 items-center gap-4">
+                        <Label className="text-right">{subject}</Label>
+                        <div className="col-span-3">
+                          <Select
+                            value={selected ?? ""}
+                            onValueChange={(v) => setSubjectTeacher(subject, v ? v : null)}
+                            disabled={teachers.length === 0}
+                          >
+                            <SelectTrigger>
+                              <SelectValue placeholder={teachers.length === 0 ? "No teachers" : "Select a teacher"} />
+                            </SelectTrigger>
+                            <SelectContent>
+                              {teachers.map((t) => (
+                                <SelectItem key={t.id} value={t.id}>
+                                  {t.name} ({t.email})
+                                </SelectItem>
+                              ))}
+                            </SelectContent>
+                          </Select>
+                        </div>
+                      </div>
+                    )
+                  })}
+                </div>
+                <input type="hidden" name="subjectTeachers" value={JSON.stringify(editSubjectTeachers)} />
+              </div>
+
+              <DialogFooter>
+                <Button type="button" variant="outline" onClick={() => setEditItem(null)} disabled={isWorking}>
+                  Cancel
+                </Button>
+                <Button type="submit" disabled={isWorking || !editTeacherId}>
+                  Save
+                </Button>
+              </DialogFooter>
+            </form>
+          ) : null}
+        </DialogContent>
+      </Dialog>
+
+      <AlertDialog
+        open={Boolean(deleteItem)}
+        onOpenChange={(open) => {
+          if (!open) setDeleteItem(null)
+        }}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Delete class</AlertDialogTitle>
+            <AlertDialogDescription>This will permanently delete {deleteItem?.name || "this class"}.</AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel disabled={isWorking}>Cancel</AlertDialogCancel>
+            <AlertDialogAction onClick={handleDelete} disabled={isWorking}>
+              Delete
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </>
+  )
+}

src/modules/classes/components/insights-filters.tsx

@@ -0,0 +1,40 @@
+"use client"
+
+import { useQueryState, parseAsString } from "nuqs"
+import { X } from "lucide-react"
+
+import { Button } from "@/shared/components/ui/button"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/shared/components/ui/select"
+import type { TeacherClass } from "../types"
+
+export function InsightsFilters({ classes }: { classes: TeacherClass[] }) {
+  const [classId, setClassId] = useQueryState("classId", parseAsString.withDefault("all"))
+
+  return (
+    <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+      <div className="flex items-center gap-2">
+        <Select value={classId} onValueChange={(val) => setClassId(val === "all" ? null : val)}>
+          <SelectTrigger className="w-[240px]">
+            <SelectValue placeholder="Class" />
+          </SelectTrigger>
+          <SelectContent>
+            <SelectItem value="all">Select a class</SelectItem>
+            {classes.map((c) => (
+              <SelectItem key={c.id} value={c.id}>
+                {c.name}
+              </SelectItem>
+            ))}
+          </SelectContent>
+        </Select>
+
+        {classId !== "all" && (
+          <Button variant="ghost" onClick={() => setClassId(null)} className="h-8 px-2 lg:px-3">
+            Reset
+            <X className="ml-2 h-4 w-4" />
+          </Button>
+        )}
+      </div>
+    </div>
+  )
+}
+

src/modules/classes/components/my-classes-grid.tsx

@@ -0,0 +1,533 @@
+"use client"
+
+import Link from "next/link"
+import { useMemo, useState } from "react"
+import { useRouter } from "next/navigation"
+import { Calendar, Copy, MoreHorizontal, Pencil, Plus, RefreshCw, Trash2, Users } from "lucide-react"
+import { toast } from "sonner"
+import { parseAsString, useQueryState } from "nuqs"
+
+import { Card, CardContent, CardHeader, CardTitle } from "@/shared/components/ui/card"
+import { Button } from "@/shared/components/ui/button"
+import { Badge } from "@/shared/components/ui/badge"
+import { EmptyState } from "@/shared/components/ui/empty-state"
+import { cn } from "@/shared/lib/utils"
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/shared/components/ui/dropdown-menu"
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/shared/components/ui/alert-dialog"
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@/shared/components/ui/dialog"
+import { Input } from "@/shared/components/ui/input"
+import { Label } from "@/shared/components/ui/label"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/shared/components/ui/select"
+import type { TeacherClass } from "../types"
+import {
+  createTeacherClassAction,
+  deleteTeacherClassAction,
+  ensureClassInvitationCodeAction,
+  regenerateClassInvitationCodeAction,
+  updateTeacherClassAction,
+} from "../actions"
+
+export function MyClassesGrid({ classes }: { classes: TeacherClass[] }) {
+  const router = useRouter()
+  const [isWorking, setIsWorking] = useState(false)
+  const [createOpen, setCreateOpen] = useState(false)
+
+  const [q, setQ] = useQueryState("q", parseAsString.withDefault(""))
+  const [grade, setGrade] = useQueryState("grade", parseAsString.withDefault("all"))
+
+  const gradeOptions = useMemo(() => {
+    const set = new Set<string>()
+    for (const c of classes) set.add(c.grade)
+    return Array.from(set).sort((a, b) => a.localeCompare(b))
+  }, [classes])
+
+  const filteredClasses = useMemo(() => {
+    const needle = q.trim().toLowerCase()
+    return classes.filter((c) => {
+      const gradeOk = grade === "all" ? true : c.grade === grade
+      const qOk = needle.length === 0 ? true : c.name.toLowerCase().includes(needle)
+      return gradeOk && qOk
+    })
+  }, [classes, grade, q])
+
+  const defaultGrade = useMemo(() => (grade !== "all" ? grade : classes[0]?.grade ?? ""), [classes, grade])
+
+  const handleCreate = async (formData: FormData) => {
+    setIsWorking(true)
+    try {
+      const res = await createTeacherClassAction(null, formData)
+      if (res.success) {
+        toast.success(res.message)
+        setCreateOpen(false)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to create class")
+      }
+    } catch {
+      toast.error("Failed to create class")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  return (
+    <div className="space-y-4">
+      <div className="flex items-center justify-between gap-3">
+        <div className="flex flex-1 items-center gap-2">
+          <div className="relative flex-1 md:max-w-sm">
+            <Input
+              placeholder="Search classes..."
+              value={q}
+              onChange={(e) => setQ(e.target.value || null)}
+            />
+          </div>
+          <Select value={grade} onValueChange={(v) => setGrade(v === "all" ? null : v)}>
+            <SelectTrigger className="w-[200px]">
+              <SelectValue placeholder="Grade" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="all">All grades</SelectItem>
+              {gradeOptions.map((g) => (
+                <SelectItem key={g} value={g}>
+                  {g}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          {(q || grade !== "all") && (
+            <Button
+              variant="ghost"
+              className="h-9"
+              onClick={() => {
+                setQ(null)
+                setGrade(null)
+              }}
+            >
+              Reset
+            </Button>
+          )}
+        </div>
+        <Dialog
+          open={createOpen}
+          onOpenChange={(open) => {
+            if (isWorking) return
+            setCreateOpen(open)
+          }}
+        >
+          <DialogTrigger asChild>
+            <Button className="gap-2" disabled={isWorking}>
+              <Plus className="size-4" />
+              New class
+            </Button>
+          </DialogTrigger>
+          <DialogContent className="sm:max-w-[480px]">
+            <DialogHeader>
+              <DialogTitle>Create class</DialogTitle>
+              <DialogDescription>Add a new class to start managing students.</DialogDescription>
+            </DialogHeader>
+            <form action={handleCreate}>
+              <div className="grid gap-4 py-4">
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="create-school-name" className="text-right">
+                    School
+                  </Label>
+                  <Input
+                    id="create-school-name"
+                    name="schoolName"
+                    className="col-span-3"
+                    placeholder="Optional"
+                  />
+                </div>
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="create-name" className="text-right">
+                    Name
+                  </Label>
+                  <Input id="create-name" name="name" className="col-span-3" placeholder="e.g. Class 1A" required />
+                </div>
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="create-grade" className="text-right">
+                    Grade
+                  </Label>
+                  <Input
+                    id="create-grade"
+                    name="grade"
+                    className="col-span-3"
+                    placeholder="e.g. Grade 7"
+                    defaultValue={defaultGrade}
+                    required
+                  />
+                </div>
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="create-homeroom" className="text-right">
+                    Homeroom
+                  </Label>
+                  <Input id="create-homeroom" name="homeroom" className="col-span-3" placeholder="Optional" />
+                </div>
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="create-room" className="text-right">
+                    Room
+                  </Label>
+                  <Input id="create-room" name="room" className="col-span-3" placeholder="Optional" />
+                </div>
+              </div>
+              <DialogFooter>
+                <Button type="submit" disabled={isWorking}>
+                  {isWorking ? "Creating..." : "Create"}
+                </Button>
+              </DialogFooter>
+            </form>
+          </DialogContent>
+        </Dialog>
+      </div>
+
+      <div className="grid gap-6 sm:grid-cols-2 lg:grid-cols-3">
+        {classes.length === 0 ? (
+          <EmptyState
+            title="No classes yet"
+            description="Create your first class to start managing students and schedules."
+            icon={Users}
+            action={{ label: "Create class", onClick: () => setCreateOpen(true) }}
+            className="h-[360px] bg-card sm:col-span-2 lg:col-span-3"
+          />
+        ) : filteredClasses.length === 0 ? (
+          <EmptyState
+            title="No classes match your filters"
+            description="Try clearing filters or adjusting keywords."
+            icon={Users}
+            action={{ label: "Clear filters", onClick: () => {
+              setQ(null)
+              setGrade(null)
+            }}}
+            className="h-[360px] bg-card sm:col-span-2 lg:col-span-3"
+          />
+        ) : (
+          filteredClasses.map((c) => (
+            <ClassCard
+              key={c.id}
+              c={c}
+              onWorkingChange={setIsWorking}
+              isWorking={isWorking}
+            />
+          ))
+        )}
+      </div>
+    </div>
+  )
+}
+
+function ClassCard({
+  c,
+  isWorking,
+  onWorkingChange,
+}: {
+  c: TeacherClass
+  isWorking: boolean
+  onWorkingChange: (v: boolean) => void
+}) {
+  const router = useRouter()
+  const [showEdit, setShowEdit] = useState(false)
+  const [showDelete, setShowDelete] = useState(false)
+
+  const handleEnsureCode = async () => {
+    onWorkingChange(true)
+    try {
+      const res = await ensureClassInvitationCodeAction(c.id)
+      if (res.success) {
+        toast.success(res.message || "Invitation code ready")
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to generate invitation code")
+      }
+    } catch {
+      toast.error("Failed to generate invitation code")
+    } finally {
+      onWorkingChange(false)
+    }
+  }
+
+  const handleRegenerateCode = async () => {
+    onWorkingChange(true)
+    try {
+      const res = await regenerateClassInvitationCodeAction(c.id)
+      if (res.success) {
+        toast.success(res.message || "Invitation code updated")
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to regenerate invitation code")
+      }
+    } catch {
+      toast.error("Failed to regenerate invitation code")
+    } finally {
+      onWorkingChange(false)
+    }
+  }
+
+  const handleCopyCode = async () => {
+    const code = c.invitationCode ?? ""
+    if (!code) return
+    try {
+      await navigator.clipboard.writeText(code)
+      toast.success("Copied invitation code")
+    } catch {
+      toast.error("Failed to copy")
+    }
+  }
+
+  const handleEdit = async (formData: FormData) => {
+    onWorkingChange(true)
+    try {
+      const res = await updateTeacherClassAction(c.id, null, formData)
+      if (res.success) {
+        toast.success(res.message)
+        setShowEdit(false)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to update class")
+      }
+    } catch {
+      toast.error("Failed to update class")
+    } finally {
+      onWorkingChange(false)
+    }
+  }
+
+  const handleDelete = async () => {
+    onWorkingChange(true)
+    try {
+      const res = await deleteTeacherClassAction(c.id)
+      if (res.success) {
+        toast.success(res.message)
+        setShowDelete(false)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to delete class")
+      }
+    } catch {
+      toast.error("Failed to delete class")
+    } finally {
+      onWorkingChange(false)
+    }
+  }
+
+  return (
+    <Card className="shadow-none">
+      <CardHeader className="space-y-2">
+        <div className="flex items-start justify-between gap-3">
+          <div className="min-w-0">
+            <CardTitle className="text-base truncate">
+              <Link href={`/teacher/classes/my/${encodeURIComponent(c.id)}`} className="hover:underline">
+                {c.name}
+              </Link>
+            </CardTitle>
+            <div className="text-muted-foreground text-sm mt-1">
+              {c.room ? `Room: ${c.room}` : "Room: Not set"}
+            </div>
+          </div>
+
+          <div className="flex items-center gap-2">
+            <Badge variant="secondary">{c.grade}</Badge>
+            <DropdownMenu>
+              <DropdownMenuTrigger asChild>
+                <Button variant="ghost" size="icon" className="h-8 w-8" disabled={isWorking}>
+                  <MoreHorizontal className="size-4" />
+                </Button>
+              </DropdownMenuTrigger>
+              <DropdownMenuContent align="end">
+                <DropdownMenuItem onClick={() => setShowEdit(true)}>
+                  <Pencil className="mr-2 size-4" />
+                  Edit
+                </DropdownMenuItem>
+                <DropdownMenuSeparator />
+                <DropdownMenuItem
+                  className="text-destructive focus:text-destructive"
+                  onClick={() => setShowDelete(true)}
+                >
+                  <Trash2 className="mr-2 size-4" />
+                  Delete
+                </DropdownMenuItem>
+              </DropdownMenuContent>
+            </DropdownMenu>
+          </div>
+        </div>
+      </CardHeader>
+
+      <CardContent className="space-y-4">
+        <div className="flex items-center justify-between">
+          <div className="text-sm font-medium tabular-nums">{c.studentCount} students</div>
+          {c.homeroom ? <Badge variant="outline">{c.homeroom}</Badge> : null}
+        </div>
+        <div className="flex items-center justify-between gap-3">
+          <div className="min-w-0">
+            <div className="text-xs uppercase text-muted-foreground">Invitation code</div>
+            <div className="font-mono tabular-nums text-sm">{c.invitationCode ?? "-"}</div>
+          </div>
+          <div className="flex items-center gap-2">
+            {c.invitationCode ? (
+              <>
+                <Button variant="outline" size="sm" className="gap-2" onClick={handleCopyCode} disabled={isWorking}>
+                  <Copy className="size-4" />
+                  Copy
+                </Button>
+                <Button variant="outline" size="sm" className="gap-2" onClick={handleRegenerateCode} disabled={isWorking}>
+                  <RefreshCw className="size-4" />
+                  Regenerate
+                </Button>
+              </>
+            ) : (
+              <Button variant="outline" size="sm" onClick={handleEnsureCode} disabled={isWorking}>
+                Generate
+              </Button>
+            )}
+          </div>
+        </div>
+        <div className={cn("grid gap-2", "grid-cols-2")}>
+          <Button asChild variant="outline" className="w-full justify-start gap-2">
+            <Link href={`/teacher/classes/students?classId=${encodeURIComponent(c.id)}`}>
+              <Users className="size-4" />
+              Students
+            </Link>
+          </Button>
+          <Button asChild variant="outline" className="w-full justify-start gap-2">
+            <Link href={`/teacher/classes/schedule?classId=${encodeURIComponent(c.id)}`}>
+              <Calendar className="size-4" />
+              Schedule
+            </Link>
+          </Button>
+        </div>
+      </CardContent>
+
+      <Dialog
+        open={showEdit}
+        onOpenChange={(open) => {
+          if (isWorking) return
+          setShowEdit(open)
+        }}
+      >
+        <DialogContent className="sm:max-w-[480px]">
+          <DialogHeader>
+            <DialogTitle>Edit class</DialogTitle>
+            <DialogDescription>Update basic class information.</DialogDescription>
+          </DialogHeader>
+          <form action={handleEdit}>
+            <div className="grid gap-4 py-4">
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor={`edit-school-name-${c.id}`} className="text-right">
+                  School
+                </Label>
+                <Input
+                  id={`edit-school-name-${c.id}`}
+                  name="schoolName"
+                  className="col-span-3"
+                  defaultValue={c.schoolName ?? ""}
+                  placeholder="Optional"
+                />
+              </div>
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor={`edit-name-${c.id}`} className="text-right">
+                  Name
+                </Label>
+                <Input
+                  id={`edit-name-${c.id}`}
+                  name="name"
+                  className="col-span-3"
+                  defaultValue={c.name}
+                  required
+                />
+              </div>
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor={`edit-grade-${c.id}`} className="text-right">
+                  Grade
+                </Label>
+                <Input
+                  id={`edit-grade-${c.id}`}
+                  name="grade"
+                  className="col-span-3"
+                  defaultValue={c.grade}
+                  required
+                />
+              </div>
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor={`edit-homeroom-${c.id}`} className="text-right">
+                  Homeroom
+                </Label>
+                <Input
+                  id={`edit-homeroom-${c.id}`}
+                  name="homeroom"
+                  className="col-span-3"
+                  defaultValue={c.homeroom ?? ""}
+                />
+              </div>
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor={`edit-room-${c.id}`} className="text-right">
+                  Room
+                </Label>
+                <Input
+                  id={`edit-room-${c.id}`}
+                  name="room"
+                  className="col-span-3"
+                  defaultValue={c.room ?? ""}
+                />
+              </div>
+            </div>
+            <DialogFooter>
+              <Button type="submit" disabled={isWorking}>
+                {isWorking ? "Saving..." : "Save"}
+              </Button>
+            </DialogFooter>
+          </form>
+        </DialogContent>
+      </Dialog>
+
+      <AlertDialog
+        open={showDelete}
+        onOpenChange={(open) => {
+          if (isWorking) return
+          setShowDelete(open)
+        }}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Delete class?</AlertDialogTitle>
+            <AlertDialogDescription>
+              This will permanently delete <span className="font-medium text-foreground">{c.name}</span> and remove all
+              enrollments.
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel disabled={isWorking}>Cancel</AlertDialogCancel>
+            <AlertDialogAction
+              className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
+              onClick={handleDelete}
+              disabled={isWorking}
+            >
+              {isWorking ? "Deleting..." : "Delete"}
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </Card>
+  )
+}

src/modules/classes/components/schedule-filters.tsx

@@ -0,0 +1,195 @@
+"use client"
+
+import { useEffect, useMemo, useState } from "react"
+import { useRouter } from "next/navigation"
+import { useQueryState, parseAsString } from "nuqs"
+import { Plus, X } from "lucide-react"
+import { toast } from "sonner"
+
+import { Button } from "@/shared/components/ui/button"
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/shared/components/ui/select"
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@/shared/components/ui/dialog"
+import { Input } from "@/shared/components/ui/input"
+import { Label } from "@/shared/components/ui/label"
+import type { TeacherClass } from "../types"
+import { createClassScheduleItemAction } from "../actions"
+
+export function ScheduleFilters({ classes }: { classes: TeacherClass[] }) {
+  const [classId, setClassId] = useQueryState("classId", parseAsString.withDefault("all"))
+
+  const router = useRouter()
+  const [open, setOpen] = useState(false)
+  const [isWorking, setIsWorking] = useState(false)
+
+  const defaultClassId = useMemo(() => (classId !== "all" ? classId : classes[0]?.id ?? ""), [classId, classes])
+  const [createClassId, setCreateClassId] = useState(defaultClassId)
+  const [weekday, setWeekday] = useState<string>("1")
+
+  useEffect(() => {
+    if (!open) return
+    setCreateClassId(defaultClassId)
+    setWeekday("1")
+  }, [open, defaultClassId])
+
+  const handleCreate = async (formData: FormData) => {
+    setIsWorking(true)
+    try {
+      formData.set("classId", createClassId)
+      const res = await createClassScheduleItemAction(null, formData)
+      if (res.success) {
+        toast.success(res.message)
+        setOpen(false)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to create schedule item")
+      }
+    } catch {
+      toast.error("Failed to create schedule item")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  return (
+    <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+      <div className="flex items-center gap-2">
+        <Select value={classId} onValueChange={(val) => setClassId(val === "all" ? null : val)}>
+          <SelectTrigger className="w-[240px]">
+            <SelectValue placeholder="Class" />
+          </SelectTrigger>
+          <SelectContent>
+            <SelectItem value="all">All Classes</SelectItem>
+            {classes.map((c) => (
+              <SelectItem key={c.id} value={c.id}>
+                {c.name}
+              </SelectItem>
+            ))}
+          </SelectContent>
+        </Select>
+
+        {classId !== "all" && (
+          <Button
+            variant="ghost"
+            onClick={() => setClassId(null)}
+            className="h-8 px-2 lg:px-3"
+          >
+            Reset
+            <X className="ml-2 h-4 w-4" />
+          </Button>
+        )}
+      </div>
+
+      <Dialog
+        open={open}
+        onOpenChange={(v) => {
+          if (isWorking) return
+          setOpen(v)
+        }}
+      >
+        <DialogTrigger asChild>
+          <Button className="gap-2" disabled={classes.length === 0}>
+            <Plus className="size-4" />
+            Add item
+          </Button>
+        </DialogTrigger>
+        <DialogContent className="sm:max-w-[560px]">
+          <DialogHeader>
+            <DialogTitle>Add schedule item</DialogTitle>
+            <DialogDescription>Create a class schedule entry.</DialogDescription>
+          </DialogHeader>
+          <form action={handleCreate}>
+            <div className="grid gap-4 py-4">
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label className="text-right">Class</Label>
+                <div className="col-span-3">
+                  <Select value={createClassId} onValueChange={setCreateClassId}>
+                    <SelectTrigger>
+                      <SelectValue placeholder="Select a class" />
+                    </SelectTrigger>
+                    <SelectContent>
+                      {classes.map((c) => (
+                        <SelectItem key={c.id} value={c.id}>
+                          {c.name}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                </div>
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="weekday" className="text-right">
+                  Weekday
+                </Label>
+                <div className="col-span-3">
+                  <Select value={weekday} onValueChange={setWeekday}>
+                    <SelectTrigger>
+                      <SelectValue placeholder="Select weekday" />
+                    </SelectTrigger>
+                    <SelectContent>
+                      <SelectItem value="1">Mon</SelectItem>
+                      <SelectItem value="2">Tue</SelectItem>
+                      <SelectItem value="3">Wed</SelectItem>
+                      <SelectItem value="4">Thu</SelectItem>
+                      <SelectItem value="5">Fri</SelectItem>
+                      <SelectItem value="6">Sat</SelectItem>
+                      <SelectItem value="7">Sun</SelectItem>
+                    </SelectContent>
+                  </Select>
+                  <input type="hidden" name="weekday" value={weekday} />
+                </div>
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="startTime" className="text-right">
+                  Start
+                </Label>
+                <Input id="startTime" name="startTime" type="time" className="col-span-3" required />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="endTime" className="text-right">
+                  End
+                </Label>
+                <Input id="endTime" name="endTime" type="time" className="col-span-3" required />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="course" className="text-right">
+                  Course
+                </Label>
+                <Input id="course" name="course" className="col-span-3" placeholder="e.g. Math" required />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="location" className="text-right">
+                  Location
+                </Label>
+                <Input id="location" name="location" className="col-span-3" placeholder="Optional" />
+              </div>
+            </div>
+            <DialogFooter>
+              <Button type="submit" disabled={isWorking || !createClassId}>
+                {isWorking ? "Creating..." : "Create"}
+              </Button>
+            </DialogFooter>
+          </form>
+        </DialogContent>
+      </Dialog>
+    </div>
+  )
+}

src/modules/classes/components/schedule-view.tsx

@@ -0,0 +1,465 @@
+"use client"
+
+import { useEffect, useMemo, useState } from "react"
+import { useRouter } from "next/navigation"
+import { Clock, MapPin, MoreHorizontal, Pencil, Plus, Trash2 } from "lucide-react"
+import { toast } from "sonner"
+
+import { Card, CardContent, CardHeader, CardTitle } from "@/shared/components/ui/card"
+import { Badge } from "@/shared/components/ui/badge"
+import { cn } from "@/shared/lib/utils"
+import { Button } from "@/shared/components/ui/button"
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/shared/components/ui/dropdown-menu"
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/shared/components/ui/alert-dialog"
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/shared/components/ui/dialog"
+import { Input } from "@/shared/components/ui/input"
+import { Label } from "@/shared/components/ui/label"
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/shared/components/ui/select"
+import type { ClassScheduleItem, TeacherClass } from "../types"
+import {
+  createClassScheduleItemAction,
+  deleteClassScheduleItemAction,
+  updateClassScheduleItemAction,
+} from "../actions"
+
+const WEEKDAYS: Array<{ key: ClassScheduleItem["weekday"]; label: string }> = [
+  { key: 1, label: "Mon" },
+  { key: 2, label: "Tue" },
+  { key: 3, label: "Wed" },
+  { key: 4, label: "Thu" },
+  { key: 5, label: "Fri" },
+  { key: 6, label: "Sat" },
+  { key: 7, label: "Sun" },
+]
+
+export function ScheduleView({
+  schedule,
+  classes,
+}: {
+  schedule: ClassScheduleItem[]
+  classes: TeacherClass[]
+}) {
+  const router = useRouter()
+  const [isWorking, setIsWorking] = useState(false)
+  const [editItem, setEditItem] = useState<ClassScheduleItem | null>(null)
+  const [deleteItem, setDeleteItem] = useState<ClassScheduleItem | null>(null)
+
+  const [createWeekday, setCreateWeekday] = useState<ClassScheduleItem["weekday"]>(1)
+  const [createOpen, setCreateOpen] = useState(false)
+  const [createClassId, setCreateClassId] = useState<string>("")
+
+  const [editClassId, setEditClassId] = useState<string>("")
+  const [editWeekday, setEditWeekday] = useState<string>("1")
+
+  const classNameById = useMemo(() => new Map(classes.map((c) => [c.id, c.name] as const)), [classes])
+  const defaultClassId = useMemo(() => classes[0]?.id ?? "", [classes])
+
+  useEffect(() => {
+    if (!editItem) return
+    setEditClassId(editItem.classId)
+    setEditWeekday(String(editItem.weekday))
+  }, [editItem])
+
+  useEffect(() => {
+    if (!createOpen) return
+    setCreateClassId(defaultClassId)
+  }, [createOpen, defaultClassId])
+
+  const byDay = new Map<ClassScheduleItem["weekday"], ClassScheduleItem[]>()
+  for (const d of WEEKDAYS) byDay.set(d.key, [])
+  for (const item of schedule) byDay.get(item.weekday)?.push(item)
+
+  const handleCreate = async (formData: FormData) => {
+    setIsWorking(true)
+    try {
+      formData.set("classId", createClassId || defaultClassId)
+      formData.set("weekday", String(createWeekday))
+      const res = await createClassScheduleItemAction(null, formData)
+      if (res.success) {
+        toast.success(res.message)
+        setCreateOpen(false)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to create schedule item")
+      }
+    } catch {
+      toast.error("Failed to create schedule item")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  const handleUpdate = async (formData: FormData) => {
+    if (!editItem) return
+    setIsWorking(true)
+    try {
+      formData.set("classId", editClassId)
+      formData.set("weekday", editWeekday)
+      const res = await updateClassScheduleItemAction(editItem.id, null, formData)
+      if (res.success) {
+        toast.success(res.message)
+        setEditItem(null)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to update schedule item")
+      }
+    } catch {
+      toast.error("Failed to update schedule item")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  const handleDelete = async () => {
+    if (!deleteItem) return
+    setIsWorking(true)
+    try {
+      const res = await deleteClassScheduleItemAction(deleteItem.id)
+      if (res.success) {
+        toast.success(res.message)
+        setDeleteItem(null)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to delete schedule item")
+      }
+    } catch {
+      toast.error("Failed to delete schedule item")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  return (
+    <div className="grid gap-6 md:grid-cols-2 xl:grid-cols-3">
+      {WEEKDAYS.map((d) => {
+        const items = byDay.get(d.key) ?? []
+        return (
+          <Card key={d.key} className="shadow-none">
+            <CardHeader className="flex flex-row items-center justify-between space-y-0">
+              <div className="flex items-center gap-2">
+                <CardTitle className="text-base">{d.label}</CardTitle>
+                <Badge variant="secondary" className={cn(items.length === 0 && "opacity-60")}>
+                  {items.length} items
+                </Badge>
+              </div>
+              <Button
+                variant="ghost"
+                size="icon"
+                className="h-8 w-8"
+                disabled={classes.length === 0}
+                onClick={() => {
+                  setCreateWeekday(d.key)
+                  setCreateOpen(true)
+                }}
+              >
+                <Plus className="size-4" />
+              </Button>
+            </CardHeader>
+            <CardContent>
+              {items.length === 0 ? (
+                <div className="text-muted-foreground text-sm">No classes scheduled.</div>
+              ) : (
+                <div className="space-y-4">
+                  {items.map((item) => (
+                    <div key={item.id} className="space-y-1 border-b pb-4 last:border-0 last:pb-0">
+                      <div className="flex items-start justify-between gap-3">
+                        <div className="min-w-0 flex-1">
+                          <div className="font-medium leading-none">{item.course}</div>
+                        </div>
+                        <div className="flex items-center gap-2">
+                          <Badge variant="outline">{classNameById.get(item.classId) ?? "Class"}</Badge>
+                          <DropdownMenu>
+                            <DropdownMenuTrigger asChild>
+                              <Button variant="ghost" size="icon" className="h-8 w-8" disabled={isWorking}>
+                                <MoreHorizontal className="size-4" />
+                              </Button>
+                            </DropdownMenuTrigger>
+                            <DropdownMenuContent align="end">
+                              <DropdownMenuItem onClick={() => setEditItem(item)}>
+                                <Pencil className="mr-2 size-4" />
+                                Edit
+                              </DropdownMenuItem>
+                              <DropdownMenuSeparator />
+                              <DropdownMenuItem
+                                className="text-destructive focus:text-destructive"
+                                onClick={() => setDeleteItem(item)}
+                              >
+                                <Trash2 className="mr-2 size-4" />
+                                Delete
+                              </DropdownMenuItem>
+                            </DropdownMenuContent>
+                          </DropdownMenu>
+                        </div>
+                      </div>
+                      <div className="text-muted-foreground flex items-center gap-3 text-sm">
+                        <span className="inline-flex items-center gap-1 tabular-nums">
+                          <Clock className="h-3.5 w-3.5" />
+                          {item.startTime}–{item.endTime}
+                        </span>
+                        {item.location ? (
+                          <span className="inline-flex items-center gap-1">
+                            <MapPin className="h-3.5 w-3.5" />
+                            {item.location}
+                          </span>
+                        ) : null}
+                      </div>
+                    </div>
+                  ))}
+                </div>
+              )}
+            </CardContent>
+          </Card>
+        )
+      })}
+
+      <Dialog
+        open={createOpen}
+        onOpenChange={(v) => {
+          if (isWorking) return
+          setCreateOpen(v)
+        }}
+      >
+        <DialogContent className="sm:max-w-[560px]">
+          <DialogHeader>
+            <DialogTitle>Add schedule item</DialogTitle>
+            <DialogDescription>Create a class schedule entry.</DialogDescription>
+          </DialogHeader>
+          <form action={handleCreate}>
+            <div className="grid gap-4 py-4">
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label className="text-right">Class</Label>
+                <div className="col-span-3">
+                  <Select value={createClassId} onValueChange={setCreateClassId}>
+                    <SelectTrigger>
+                      <SelectValue placeholder="Select a class" />
+                    </SelectTrigger>
+                    <SelectContent>
+                      {classes.map((c) => (
+                        <SelectItem key={c.id} value={c.id}>
+                          {c.name}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                  <input type="hidden" name="classId" value={createClassId} />
+                </div>
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label className="text-right">Weekday</Label>
+                <Input value={WEEKDAYS.find((w) => w.key === createWeekday)?.label ?? ""} readOnly className="col-span-3" />
+                <input type="hidden" name="weekday" value={String(createWeekday)} />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="create-startTime" className="text-right">
+                  Start
+                </Label>
+                <Input id="create-startTime" name="startTime" type="time" className="col-span-3" required />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="create-endTime" className="text-right">
+                  End
+                </Label>
+                <Input id="create-endTime" name="endTime" type="time" className="col-span-3" required />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="create-course" className="text-right">
+                  Course
+                </Label>
+                <Input id="create-course" name="course" className="col-span-3" placeholder="e.g. Math" required />
+              </div>
+
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="create-location" className="text-right">
+                  Location
+                </Label>
+                <Input id="create-location" name="location" className="col-span-3" placeholder="Optional" />
+              </div>
+            </div>
+            <DialogFooter>
+              <Button type="submit" disabled={isWorking || !createClassId}>
+                {isWorking ? "Creating..." : "Create"}
+              </Button>
+            </DialogFooter>
+          </form>
+        </DialogContent>
+      </Dialog>
+
+      <Dialog
+        open={Boolean(editItem)}
+        onOpenChange={(v) => {
+          if (isWorking) return
+          if (!v) setEditItem(null)
+        }}
+      >
+        <DialogContent className="sm:max-w-[560px]">
+          <DialogHeader>
+            <DialogTitle>Edit schedule item</DialogTitle>
+            <DialogDescription>Update this schedule entry.</DialogDescription>
+          </DialogHeader>
+          {editItem ? (
+            <form action={handleUpdate}>
+              <div className="grid gap-4 py-4">
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label className="text-right">Class</Label>
+                  <div className="col-span-3">
+                    <Select value={editClassId} onValueChange={setEditClassId}>
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select a class" />
+                      </SelectTrigger>
+                      <SelectContent>
+                        {classes.map((c) => (
+                          <SelectItem key={c.id} value={c.id}>
+                            {c.name}
+                          </SelectItem>
+                        ))}
+                      </SelectContent>
+                    </Select>
+                    <input type="hidden" name="classId" value={editClassId} />
+                  </div>
+                </div>
+
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label className="text-right">Weekday</Label>
+                  <div className="col-span-3">
+                    <Select value={editWeekday} onValueChange={setEditWeekday}>
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select weekday" />
+                      </SelectTrigger>
+                      <SelectContent>
+                        <SelectItem value="1">Mon</SelectItem>
+                        <SelectItem value="2">Tue</SelectItem>
+                        <SelectItem value="3">Wed</SelectItem>
+                        <SelectItem value="4">Thu</SelectItem>
+                        <SelectItem value="5">Fri</SelectItem>
+                        <SelectItem value="6">Sat</SelectItem>
+                        <SelectItem value="7">Sun</SelectItem>
+                      </SelectContent>
+                    </Select>
+                    <input type="hidden" name="weekday" value={editWeekday} />
+                  </div>
+                </div>
+
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="edit-startTime" className="text-right">
+                    Start
+                  </Label>
+                  <Input
+                    id="edit-startTime"
+                    name="startTime"
+                    type="time"
+                    className="col-span-3"
+                    defaultValue={editItem.startTime}
+                    required
+                  />
+                </div>
+
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="edit-endTime" className="text-right">
+                    End
+                  </Label>
+                  <Input
+                    id="edit-endTime"
+                    name="endTime"
+                    type="time"
+                    className="col-span-3"
+                    defaultValue={editItem.endTime}
+                    required
+                  />
+                </div>
+
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="edit-course" className="text-right">
+                    Course
+                  </Label>
+                  <Input
+                    id="edit-course"
+                    name="course"
+                    className="col-span-3"
+                    defaultValue={editItem.course}
+                    required
+                  />
+                </div>
+
+                <div className="grid grid-cols-4 items-center gap-4">
+                  <Label htmlFor="edit-location" className="text-right">
+                    Location
+                  </Label>
+                  <Input
+                    id="edit-location"
+                    name="location"
+                    className="col-span-3"
+                    defaultValue={editItem.location ?? ""}
+                  />
+                </div>
+              </div>
+              <DialogFooter>
+                <Button type="submit" disabled={isWorking}>
+                  {isWorking ? "Saving..." : "Save"}
+                </Button>
+              </DialogFooter>
+            </form>
+          ) : null}
+        </DialogContent>
+      </Dialog>
+
+      <AlertDialog
+        open={Boolean(deleteItem)}
+        onOpenChange={(v) => {
+          if (isWorking) return
+          if (!v) setDeleteItem(null)
+        }}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Delete schedule item?</AlertDialogTitle>
+            <AlertDialogDescription>
+              {deleteItem ? (
+                <>
+                  This will permanently delete <span className="font-medium text-foreground">{deleteItem.course}</span>{" "}
+                  ({deleteItem.startTime}–{deleteItem.endTime}).
+                </>
+              ) : null}
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel disabled={isWorking}>Cancel</AlertDialogCancel>
+            <AlertDialogAction
+              className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
+              onClick={handleDelete}
+              disabled={isWorking}
+            >
+              {isWorking ? "Deleting..." : "Delete"}
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </div>
+  )
+}
+

src/modules/classes/components/students-filters.tsx

@@ -0,0 +1,169 @@
+"use client"
+
+import { useEffect, useMemo, useState } from "react"
+import { useRouter } from "next/navigation"
+import { useQueryState, parseAsString } from "nuqs"
+import { Search, UserPlus, X } from "lucide-react"
+import { toast } from "sonner"
+
+import { Input } from "@/shared/components/ui/input"
+import { Button } from "@/shared/components/ui/button"
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@/shared/components/ui/select"
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@/shared/components/ui/dialog"
+import { Label } from "@/shared/components/ui/label"
+import type { TeacherClass } from "../types"
+import { enrollStudentByEmailAction } from "../actions"
+
+export function StudentsFilters({ classes }: { classes: TeacherClass[] }) {
+  const [search, setSearch] = useQueryState("q", parseAsString.withDefault(""))
+  const [classId, setClassId] = useQueryState("classId", parseAsString.withDefault("all"))
+
+  const router = useRouter()
+  const [open, setOpen] = useState(false)
+  const [isWorking, setIsWorking] = useState(false)
+
+  const defaultClassId = useMemo(() => (classId !== "all" ? classId : classes[0]?.id ?? ""), [classId, classes])
+  const [enrollClassId, setEnrollClassId] = useState(defaultClassId)
+
+  useEffect(() => {
+    if (!open) return
+    setEnrollClassId(defaultClassId)
+  }, [open, defaultClassId])
+
+  const handleEnroll = async (formData: FormData) => {
+    setIsWorking(true)
+    try {
+      const res = await enrollStudentByEmailAction(enrollClassId, null, formData)
+      if (res.success) {
+        toast.success(res.message)
+        setOpen(false)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to add student")
+      }
+    } catch {
+      toast.error("Failed to add student")
+    } finally {
+      setIsWorking(false)
+    }
+  }
+
+  return (
+    <div className="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
+      <div className="flex flex-1 items-center gap-2">
+        <div className="relative flex-1 md:max-w-sm">
+          <Search className="text-muted-foreground absolute left-2.5 top-2.5 h-4 w-4" />
+          <Input
+            placeholder="Search students..."
+            className="pl-8"
+            value={search}
+            onChange={(e) => setSearch(e.target.value || null)}
+          />
+        </div>
+
+        <Select value={classId} onValueChange={(val) => setClassId(val === "all" ? null : val)}>
+          <SelectTrigger className="w-[200px]">
+            <SelectValue placeholder="Class" />
+          </SelectTrigger>
+          <SelectContent>
+            <SelectItem value="all">All Classes</SelectItem>
+            {classes.map((c) => (
+              <SelectItem key={c.id} value={c.id}>
+                {c.name}
+              </SelectItem>
+            ))}
+          </SelectContent>
+        </Select>
+
+        {(search || classId !== "all") && (
+          <Button
+            variant="ghost"
+            onClick={() => {
+              setSearch(null)
+              setClassId(null)
+            }}
+            className="h-8 px-2 lg:px-3"
+          >
+            Reset
+            <X className="ml-2 h-4 w-4" />
+          </Button>
+        )}
+      </div>
+
+      <Dialog
+        open={open}
+        onOpenChange={(v) => {
+          if (isWorking) return
+          setOpen(v)
+        }}
+      >
+        <DialogTrigger asChild>
+          <Button className="gap-2" disabled={classes.length === 0}>
+            <UserPlus className="size-4" />
+            Add student
+          </Button>
+        </DialogTrigger>
+        <DialogContent className="sm:max-w-[520px]">
+          <DialogHeader>
+            <DialogTitle>Add student</DialogTitle>
+            <DialogDescription>Enroll a student by email to a class.</DialogDescription>
+          </DialogHeader>
+          <form action={handleEnroll}>
+            <div className="grid gap-4 py-4">
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label className="text-right">Class</Label>
+                <div className="col-span-3">
+                  <Select value={enrollClassId} onValueChange={setEnrollClassId}>
+                    <SelectTrigger>
+                      <SelectValue placeholder="Select a class" />
+                    </SelectTrigger>
+                    <SelectContent>
+                      {classes.map((c) => (
+                        <SelectItem key={c.id} value={c.id}>
+                          {c.name}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                </div>
+              </div>
+              <div className="grid grid-cols-4 items-center gap-4">
+                <Label htmlFor="student-email" className="text-right">
+                  Email
+                </Label>
+                <Input
+                  id="student-email"
+                  name="email"
+                  type="email"
+                  className="col-span-3"
+                  placeholder="student@example.com"
+                  required
+                />
+              </div>
+            </div>
+            <DialogFooter>
+              <Button type="submit" disabled={isWorking || !enrollClassId}>
+                {isWorking ? "Adding..." : "Add"}
+              </Button>
+            </DialogFooter>
+          </form>
+        </DialogContent>
+      </Dialog>
+    </div>
+  )
+}
+

src/modules/classes/components/students-table.tsx

@@ -0,0 +1,158 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { MoreHorizontal, UserCheck, UserX } from "lucide-react"
+import { toast } from "sonner"
+
+import { Badge } from "@/shared/components/ui/badge"
+import { Button } from "@/shared/components/ui/button"
+import { cn } from "@/shared/lib/utils"
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/shared/components/ui/dropdown-menu"
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/shared/components/ui/alert-dialog"
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from "@/shared/components/ui/table"
+import type { ClassStudent } from "../types"
+import { setStudentEnrollmentStatusAction } from "../actions"
+
+export function StudentsTable({ students }: { students: ClassStudent[] }) {
+  const router = useRouter()
+  const [workingKey, setWorkingKey] = useState<string | null>(null)
+  const [removeTarget, setRemoveTarget] = useState<ClassStudent | null>(null)
+
+  const setStatus = async (student: ClassStudent, status: "active" | "inactive") => {
+    const key = `${student.classId}:${student.id}:${status}`
+    setWorkingKey(key)
+    try {
+      const res = await setStudentEnrollmentStatusAction(student.classId, student.id, status)
+      if (res.success) {
+        toast.success(res.message)
+        router.refresh()
+      } else {
+        toast.error(res.message || "Failed to update student")
+      }
+    } catch {
+      toast.error("Failed to update student")
+    } finally {
+      setWorkingKey(null)
+    }
+  }
+
+  return (
+    <>
+      <Table>
+        <TableHeader>
+          <TableRow className="bg-muted/50">
+            <TableHead className="text-xs font-medium uppercase text-muted-foreground">Student</TableHead>
+            <TableHead className="text-xs font-medium uppercase text-muted-foreground">Email</TableHead>
+            <TableHead className="text-xs font-medium uppercase text-muted-foreground">Class</TableHead>
+            <TableHead className="text-xs font-medium uppercase text-muted-foreground">Status</TableHead>
+            <TableHead className="text-xs font-medium uppercase text-muted-foreground text-right">Actions</TableHead>
+          </TableRow>
+        </TableHeader>
+        <TableBody>
+          {students.map((s) => (
+            <TableRow key={`${s.classId}:${s.id}`} className={cn("h-12", s.status !== "active" && "opacity-70")}>
+              <TableCell className="font-medium">{s.name}</TableCell>
+              <TableCell className="text-muted-foreground">{s.email}</TableCell>
+              <TableCell>{s.className}</TableCell>
+              <TableCell>
+                <Badge variant={s.status === "active" ? "secondary" : "outline"}>
+                  {s.status === "active" ? "Active" : "Inactive"}
+                </Badge>
+              </TableCell>
+              <TableCell className="text-right">
+                <DropdownMenu>
+                  <DropdownMenuTrigger asChild>
+                    <Button variant="ghost" size="icon" className="h-8 w-8" disabled={workingKey !== null}>
+                      <MoreHorizontal className="size-4" />
+                    </Button>
+                  </DropdownMenuTrigger>
+                  <DropdownMenuContent align="end">
+                    {s.status !== "active" ? (
+                      <DropdownMenuItem onClick={() => setStatus(s, "active")} disabled={workingKey !== null}>
+                        <UserCheck className="mr-2 size-4" />
+                        Set active
+                      </DropdownMenuItem>
+                    ) : (
+                      <DropdownMenuItem onClick={() => setStatus(s, "inactive")} disabled={workingKey !== null}>
+                        <UserX className="mr-2 size-4" />
+                        Set inactive
+                      </DropdownMenuItem>
+                    )}
+                    <DropdownMenuSeparator />
+                    <DropdownMenuItem
+                      onClick={() => setRemoveTarget(s)}
+                      className="text-destructive focus:text-destructive"
+                      disabled={s.status === "inactive" || workingKey !== null}
+                    >
+                      <UserX className="mr-2 size-4" />
+                      Remove from class
+                    </DropdownMenuItem>
+                  </DropdownMenuContent>
+                </DropdownMenu>
+              </TableCell>
+            </TableRow>
+          ))}
+        </TableBody>
+      </Table>
+
+      <AlertDialog
+        open={Boolean(removeTarget)}
+        onOpenChange={(open) => {
+          if (workingKey !== null) return
+          if (!open) setRemoveTarget(null)
+        }}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Remove student from class?</AlertDialogTitle>
+            <AlertDialogDescription>
+              {removeTarget ? (
+                <>
+                  This will set <span className="font-medium text-foreground">{removeTarget.name}</span> to inactive in{" "}
+                  <span className="font-medium text-foreground">{removeTarget.className}</span>.
+                </>
+              ) : null}
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel disabled={workingKey !== null}>Cancel</AlertDialogCancel>
+            <AlertDialogAction
+              className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
+              disabled={workingKey !== null}
+              onClick={() => {
+                if (!removeTarget) return
+                setRemoveTarget(null)
+                setStatus(removeTarget, "inactive")
+              }}
+            >
+              Remove
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </>
+  )
+}

src/modules/classes/types.ts

@@ -0,0 +1,194 @@
+export type TeacherClass = {
+  id: string
+  schoolName?: string | null
+  name: string
+  grade: string
+  homeroom?: string | null
+  room?: string | null
+  invitationCode?: string | null
+  studentCount: number
+}
+
+export type TeacherOption = {
+  id: string
+  name: string
+  email: string
+}
+
+export const DEFAULT_CLASS_SUBJECTS = ["语文", "数学", "英语", "美术", "体育", "科学", "社会", "音乐"] as const
+
+export type ClassSubject = (typeof DEFAULT_CLASS_SUBJECTS)[number]
+
+export type ClassSubjectTeacherAssignment = {
+  subject: ClassSubject
+  teacher: TeacherOption | null
+}
+
+export type AdminClassListItem = {
+  id: string
+  schoolName?: string | null
+  schoolId?: string | null
+  name: string
+  grade: string
+  gradeId?: string | null
+  homeroom?: string | null
+  room?: string | null
+  invitationCode?: string | null
+  teacher: TeacherOption
+  subjectTeachers: ClassSubjectTeacherAssignment[]
+  studentCount: number
+  createdAt: string
+  updatedAt: string
+}
+
+export type CreateTeacherClassInput = {
+  schoolName?: string | null
+  schoolId?: string | null
+  name: string
+  grade: string
+  gradeId?: string | null
+  homeroom?: string | null
+  room?: string | null
+}
+
+export type UpdateTeacherClassInput = {
+  schoolName?: string | null
+  schoolId?: string | null
+  name?: string
+  grade?: string
+  gradeId?: string | null
+  homeroom?: string | null
+  room?: string | null
+}
+
+export type ClassStudent = {
+  id: string
+  name: string
+  email: string
+  classId: string
+  className: string
+  status: "active" | "inactive"
+}
+
+export type ClassScheduleItem = {
+  id: string
+  classId: string
+  weekday: 1 | 2 | 3 | 4 | 5 | 6 | 7
+  startTime: string
+  endTime: string
+  course: string
+  location?: string | null
+}
+
+export type StudentEnrolledClass = {
+  id: string
+  schoolName?: string | null
+  name: string
+  grade: string
+  homeroom?: string | null
+  room?: string | null
+}
+
+export type StudentScheduleItem = {
+  id: string
+  classId: string
+  className: string
+  weekday: 1 | 2 | 3 | 4 | 5 | 6 | 7
+  startTime: string
+  endTime: string
+  course: string
+  location?: string | null
+}
+
+export type CreateClassScheduleItemInput = {
+  classId: string
+  weekday: 1 | 2 | 3 | 4 | 5 | 6 | 7
+  startTime: string
+  endTime: string
+  course: string
+  location?: string | null
+}
+
+export type UpdateClassScheduleItemInput = {
+  classId?: string
+  weekday?: 1 | 2 | 3 | 4 | 5 | 6 | 7
+  startTime?: string
+  endTime?: string
+  course?: string
+  location?: string | null
+}
+
+export type ClassBasicInfo = {
+  id: string
+  name: string
+  grade: string
+  homeroom?: string | null
+  room?: string | null
+  invitationCode?: string | null
+}
+
+export type ScoreStats = {
+  count: number
+  avg: number | null
+  median: number | null
+  min: number | null
+  max: number | null
+}
+
+export type ClassHomeworkAssignmentStats = {
+  assignmentId: string
+  title: string
+  status: string
+  createdAt: string
+  dueAt: string | null
+  isActive: boolean
+  isOverdue: boolean
+  maxScore: number
+  targetCount: number
+  submittedCount: number
+  gradedCount: number
+  scoreStats: ScoreStats
+}
+
+export type ClassHomeworkInsights = {
+  class: ClassBasicInfo
+  studentCounts: {
+    total: number
+    active: number
+    inactive: number
+  }
+  assignments: ClassHomeworkAssignmentStats[]
+  latest: ClassHomeworkAssignmentStats | null
+  overallScores: ScoreStats
+}
+
+export type GradeHomeworkClassSummary = {
+  class: ClassBasicInfo
+  studentCounts: {
+    total: number
+    active: number
+    inactive: number
+  }
+  latestAvg: number | null
+  prevAvg: number | null
+  deltaAvg: number | null
+  overallScores: ScoreStats
+}
+
+export type GradeHomeworkInsights = {
+  grade: {
+    id: string
+    name: string
+    school: { id: string; name: string }
+  }
+  classCount: number
+  studentCounts: {
+    total: number
+    active: number
+    inactive: number
+  }
+  assignments: ClassHomeworkAssignmentStats[]
+  latest: ClassHomeworkAssignmentStats | null
+  overallScores: ScoreStats
+  classes: GradeHomeworkClassSummary[]
+}