fix:第三章开发结束

frontend/src/app/(app)/genotyping/call-set/page.tsx

@@ -0,0 +1,56 @@
+"use client";
+
+import { Suspense, useEffect, useState } from "react";
+import { useSearchParams } from "next/navigation";
+import { Binary, Dna } from "lucide-react";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { Skeleton } from "@/components/ui/skeleton";
+import { AlleleCallTab } from "./components/AlleleCallTab";
+import { CallSetTab } from "./components/CallSetTab";
+
+function TabFallback() {
+  return <Skeleton className="h-96 w-full rounded-xl" />;
+}
+
+export default function CallSetPage() {
+  const searchParams = useSearchParams();
+  const [tab, setTab] = useState("callsets");
+
+  useEffect(() => {
+    const requested = searchParams.get("tab");
+    if (requested === "allele-calls") {
+      setTab("allele-calls");
+    }
+  }, [searchParams]);
+
+  return (
+    <Tabs value={tab} onValueChange={setTab} className="flex min-h-full flex-col gap-4">
+      <TabsList className="w-full justify-start overflow-x-auto rounded-lg border bg-white p-1 dark:border-slate-800 dark:bg-slate-950 sm:w-fit">
+        <TabsTrigger value="callsets" className="gap-2">
+          <Binary className="h-4 w-4" />
+          CallSet
+        </TabsTrigger>
+        <TabsTrigger value="allele-calls" className="gap-2">
+          <Dna className="h-4 w-4" />
+          allele_call
+        </TabsTrigger>
+      </TabsList>
+
+      {tab === "callsets" ? (
+        <TabsContent value="callsets" className="mt-0 min-h-0 flex-1">
+          <Suspense fallback={<TabFallback />}>
+            <CallSetTab />
+          </Suspense>
+        </TabsContent>
+      ) : null}
+
+      {tab === "allele-calls" ? (
+        <TabsContent value="allele-calls" className="mt-0 min-h-0 flex-1">
+          <Suspense fallback={<TabFallback />}>
+            <AlleleCallTab />
+          </Suspense>
+        </TabsContent>
+      ) : null}
+    </Tabs>
+  );
+}