judge4c/src/app/(protected)/dashboard/teacher/dashboard/test-data.tsx

94 lines
2.4 KiB
TypeScript

"use client";
import { useState, useEffect } from "react";
import { getDashboardStats } from "@/app/(protected)/dashboard/actions/teacher-dashboard";
interface DashboardData {
problemData: Array<{
problemId: string;
problemDisplayId: number;
problemTitle: string;
completed: number;
uncompleted: number;
total: number;
completedPercent: number;
uncompletedPercent: number;
}>;
difficultProblems: Array<{
id: string;
className: string;
problemCount: number;
problemTitle: string;
problemDisplayId: number;
}>;
totalProblems: number;
totalDifficultProblems: number;
}
export default function TestDataPage() {
const [data, setData] = useState<DashboardData | null>(null);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
useEffect(() => {
const fetchData = async () => {
try {
setLoading(true);
const result = await getDashboardStats();
setData(result);
} catch (err) {
setError(err instanceof Error ? err.message : "获取数据失败");
console.error("Failed to fetch data:", err);
} finally {
setLoading(false);
}
};
fetchData();
}, []);
if (loading) {
return <div>...</div>;
}
if (error) {
return <div>: {error}</div>;
}
return (
<div className="p-6">
<h1 className="text-2xl font-bold mb-4"></h1>
<div className="space-y-6">
<div>
<h2 className="text-xl font-semibold mb-2"></h2>
<pre className="bg-gray-100 p-4 rounded overflow-auto">
{JSON.stringify(data?.problemData, null, 2)}
</pre>
</div>
<div>
<h2 className="text-xl font-semibold mb-2"></h2>
<pre className="bg-gray-100 p-4 rounded overflow-auto">
{JSON.stringify(data?.difficultProblems, null, 2)}
</pre>
</div>
<div>
<h2 className="text-xl font-semibold mb-2"></h2>
<pre className="bg-gray-100 p-4 rounded overflow-auto">
{JSON.stringify(
{
totalProblems: data?.totalProblems,
totalDifficultProblems: data?.totalDifficultProblems,
},
null,
2
)}
</pre>
</div>
</div>
</div>
);
}