完整性更新

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

src/app/(dashboard)/teacher/classes/students/page.tsx

@@ -1,10 +1,74 @@
-import { EmptyState } from "@/shared/components/ui/empty-state"
+import { Suspense } from "react"
 import { User } from "lucide-react"
 
-export default function StudentsPage() {
+import { getClassStudents, getTeacherClasses } from "@/modules/classes/data-access"
+import { StudentsFilters } from "@/modules/classes/components/students-filters"
+import { StudentsTable } from "@/modules/classes/components/students-table"
+import { EmptyState } from "@/shared/components/ui/empty-state"
+import { Skeleton } from "@/shared/components/ui/skeleton"
+
+export const dynamic = "force-dynamic"
+
+type SearchParams = { [key: string]: string | string[] | undefined }
+
+const getParam = (params: SearchParams, key: string) => {
+  const v = params[key]
+  return Array.isArray(v) ? v[0] : v
+}
+
+async function StudentsResults({ searchParams }: { searchParams: Promise<SearchParams> }) {
+  const params = await searchParams
+
+  const q = getParam(params, "q") || undefined
+  const classId = getParam(params, "classId")
+
+  const filteredStudents = await getClassStudents({
+    q,
+    classId: classId && classId !== "all" ? classId : undefined,
+  })
+
+  const hasFilters = Boolean(q || (classId && classId !== "all"))
+
+  if (filteredStudents.length === 0) {
+    return (
+      <EmptyState
+        icon={User}
+        title={hasFilters ? "No students match your filters" : "No students found"}
+        description={hasFilters ? "Try clearing filters or adjusting keywords." : "There are no students in your classes yet."}
+        action={hasFilters ? { label: "Clear filters", href: "/teacher/classes/students" } : undefined}
+        className="h-[360px] bg-card"
+      />
+    )
+  }
+
   return (
-    <div className="h-full flex-1 flex-col space-y-8 p-8 md:flex">
-      <div className="flex items-center justify-between space-y-2">
+    <div className="rounded-md border bg-card">
+      <StudentsTable students={filteredStudents} />
+    </div>
+  )
+}
+
+function StudentsResultsFallback() {
+  return (
+    <div className="rounded-md border bg-card">
+      <div className="p-4">
+        <Skeleton className="h-8 w-full" />
+      </div>
+      <div className="space-y-2 p-4 pt-0">
+        {Array.from({ length: 8 }).map((_, idx) => (
+          <Skeleton key={idx} className="h-10 w-full" />
+        ))}
+      </div>
+    </div>
+  )
+}
+
+export default async function StudentsPage({ searchParams }: { searchParams: Promise<SearchParams> }) {
+  const classes = await getTeacherClasses()
+
+  return (
+    <div className="flex h-full flex-col space-y-8 p-8">
+      <div className="flex flex-col justify-between space-y-4 md:flex-row md:items-center md:space-y-0">
         <div>
           <h2 className="text-2xl font-bold tracking-tight">Students</h2>
           <p className="text-muted-foreground">
@@ -12,11 +76,16 @@ export default function StudentsPage() {
           </p>
         </div>
       </div>
-      <EmptyState
-        title="No students found"
-        description="There are no students in your classes yet."
-        icon={User}
-      />
+
+      <div className="space-y-4">
+        <Suspense fallback={<div className="h-10 w-full animate-pulse rounded-md bg-muted" />}>
+          <StudentsFilters classes={classes} />
+        </Suspense>
+
+        <Suspense fallback={<StudentsResultsFallback />}>
+          <StudentsResults searchParams={searchParams} />
+        </Suspense>
+      </div>
     </div>
   )
 }