feat: 新增备课模块并修复全模块 P0/P1/P2 缺陷
Some checks failed
Security / deep-security-scan (push) Failing after 20m5s
DR Drill / dr-drill (push) Failing after 1m31s
CI / scheduled-backup (push) Failing after 1m31s
CI / backup-verify (push) Has been skipped
CI / weekly-dr-drill (push) Failing after 0s
CI / build-deploy (push) Has been cancelled
CI / security-scan (push) Has been cancelled
Some checks failed
Security / deep-security-scan (push) Failing after 20m5s
DR Drill / dr-drill (push) Failing after 1m31s
CI / scheduled-backup (push) Failing after 1m31s
CI / backup-verify (push) Has been skipped
CI / weekly-dr-drill (push) Failing after 0s
CI / build-deploy (push) Has been cancelled
CI / security-scan (push) Has been cancelled
主要变更: - 新增 lesson-preparation 模块: 备课编辑器、节点编辑、AI 建议、知识点选择、版本历史、作业发布 - 新增 shared 通用组件: charts/question-bank-filters/schedule-list/ui (chip-nav/filter-bar/page-header/stat-card/stat-item) - 新增 student/admin 端 loading.tsx 与 error.tsx, 优化加载与错误态体验 - 新增 teacher/lesson-plans 页面 (列表/新建/编辑) - 新增 drizzle 迁移 0002_tiny_lionheart 及 snapshot - 新增 textbooks/schema.ts 与 exams/utils/normalize-structure.ts - 修复 Tiptap v3 SSR hydration 崩溃 (rich-text-block immediatelyRender: false) - 重构多模块 data-access/actions/组件, 修复权限校验与类型规范 - 同步架构文档 004/005 反映新增模块、导出、依赖关系 - 归档 bugs/* 测试报告与 e2e 测试脚本 (admin/parent/student/teacher web_test)
This commit is contained in:
@@ -1,135 +1,76 @@
|
||||
"use client"
|
||||
|
||||
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/shared/components/ui/card"
|
||||
import { TrendingUp } from "lucide-react"
|
||||
import { EmptyState } from "@/shared/components/ui/empty-state"
|
||||
|
||||
import { ChartCardShell } from "@/shared/components/charts/chart-card-shell"
|
||||
import { TrendLineChart } from "@/shared/components/charts/trend-line-chart"
|
||||
import type { TeacherGradeTrendItem } from "@/modules/homework/types"
|
||||
import { CartesianGrid, Line, LineChart, XAxis, YAxis } from "recharts"
|
||||
import { ChartContainer, ChartTooltip, ChartTooltipContent } from "@/shared/components/ui/chart"
|
||||
|
||||
export function TeacherGradeTrends({ trends }: { trends: TeacherGradeTrendItem[] }) {
|
||||
const hasTrends = trends.length > 0
|
||||
|
||||
// Calculate percentages for the chart
|
||||
const chartData = trends.map((item) => {
|
||||
const percentage = item.maxScore > 0 ? (item.averageScore / item.maxScore) * 100 : 0
|
||||
return {
|
||||
title: item.title,
|
||||
score: Math.round(percentage),
|
||||
fullTitle: item.title, // For tooltip
|
||||
fullTitle: item.title,
|
||||
submissionCount: item.submissionCount,
|
||||
totalStudents: item.totalStudents,
|
||||
}
|
||||
})
|
||||
|
||||
const chartConfig = {
|
||||
score: {
|
||||
label: "Average Score (%)",
|
||||
color: "hsl(var(--primary))",
|
||||
},
|
||||
}
|
||||
|
||||
return (
|
||||
<Card className="col-span-1">
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2 text-base font-medium">
|
||||
<TrendingUp className="h-4 w-4 text-primary" />
|
||||
Class Performance
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
Average scores for the last {trends.length} assignments
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
{!hasTrends ? (
|
||||
<EmptyState
|
||||
icon={TrendingUp}
|
||||
title="No data available"
|
||||
description="Publish assignments to see class performance trends."
|
||||
className="border-none h-[200px] p-0"
|
||||
/>
|
||||
) : (
|
||||
<div className="space-y-4">
|
||||
<ChartContainer config={chartConfig} className="h-[200px] w-full">
|
||||
<LineChart
|
||||
data={chartData}
|
||||
margin={{
|
||||
left: 12,
|
||||
right: 12,
|
||||
top: 12,
|
||||
bottom: 12,
|
||||
}}
|
||||
>
|
||||
<CartesianGrid vertical={false} strokeDasharray="4 4" strokeOpacity={0.4} />
|
||||
<XAxis
|
||||
dataKey="title"
|
||||
tickLine={false}
|
||||
axisLine={false}
|
||||
tickMargin={8}
|
||||
tickFormatter={(value) => value.slice(0, 10) + (value.length > 10 ? "..." : "")}
|
||||
/>
|
||||
<YAxis
|
||||
domain={[0, 100]}
|
||||
tickLine={false}
|
||||
axisLine={false}
|
||||
tickFormatter={(value) => `${value}%`}
|
||||
width={30}
|
||||
/>
|
||||
<ChartTooltip
|
||||
cursor={{
|
||||
stroke: "hsl(var(--muted-foreground))",
|
||||
strokeWidth: 1,
|
||||
strokeDasharray: "4 4",
|
||||
}}
|
||||
content={
|
||||
<ChartTooltipContent
|
||||
indicator="line"
|
||||
labelKey="fullTitle"
|
||||
className="w-[200px]"
|
||||
/>
|
||||
}
|
||||
/>
|
||||
<Line
|
||||
dataKey="score"
|
||||
type="monotone"
|
||||
stroke="var(--color-score)"
|
||||
strokeWidth={2}
|
||||
dot={{
|
||||
fill: "var(--color-score)",
|
||||
r: 4,
|
||||
strokeWidth: 2,
|
||||
stroke: "hsl(var(--background))"
|
||||
}}
|
||||
activeDot={{
|
||||
r: 6,
|
||||
strokeWidth: 2,
|
||||
stroke: "hsl(var(--background))"
|
||||
}}
|
||||
/>
|
||||
</LineChart>
|
||||
</ChartContainer>
|
||||
<ChartCardShell
|
||||
title="Class Performance"
|
||||
description={`Average scores for the last ${trends.length} assignments`}
|
||||
icon={TrendingUp}
|
||||
iconClassName="text-primary"
|
||||
titleClassName="text-base font-medium"
|
||||
isEmpty={!hasTrends}
|
||||
emptyTitle="No data available"
|
||||
emptyDescription="Publish assignments to see class performance trends."
|
||||
emptyClassName="h-[200px] p-0"
|
||||
className="col-span-1"
|
||||
>
|
||||
<div className="space-y-4">
|
||||
<TrendLineChart
|
||||
data={chartData}
|
||||
series={[
|
||||
{
|
||||
dataKey: "score",
|
||||
name: "Average Score (%)",
|
||||
color: "hsl(var(--primary))",
|
||||
dotRadius: 4,
|
||||
activeDotRadius: 6,
|
||||
},
|
||||
]}
|
||||
heightClassName="h-[200px]"
|
||||
margin={{ left: 12, right: 12, top: 12, bottom: 12 }}
|
||||
yWidth={30}
|
||||
tooltipClassName="w-[200px]"
|
||||
/>
|
||||
|
||||
{/* Metric Summary */}
|
||||
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
||||
{chartData.slice().reverse().slice(0, 3).map((item, i) => (
|
||||
<div key={i} className="flex flex-col gap-1 rounded-lg border p-3 bg-card/50">
|
||||
<div className="text-xs text-muted-foreground truncate" title={item.fullTitle}>
|
||||
{item.fullTitle}
|
||||
</div>
|
||||
<div className="flex items-baseline gap-2">
|
||||
<span className="text-xl font-bold tabular-nums">
|
||||
{item.score}%
|
||||
</span>
|
||||
</div>
|
||||
<div className="text-[10px] text-muted-foreground">
|
||||
{item.submissionCount}/{item.totalStudents} submitted
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
||||
{chartData
|
||||
.slice()
|
||||
.reverse()
|
||||
.slice(0, 3)
|
||||
.map((item, i) => (
|
||||
<div key={i} className="flex flex-col gap-1 rounded-lg border p-3 bg-card/50">
|
||||
<div className="text-xs text-muted-foreground truncate" title={item.fullTitle}>
|
||||
{item.fullTitle}
|
||||
</div>
|
||||
<div className="flex items-baseline gap-2">
|
||||
<span className="text-xl font-bold tabular-nums">{item.score}%</span>
|
||||
</div>
|
||||
<div className="text-[10px] text-muted-foreground">
|
||||
{item.submissionCount}/{item.totalStudents} submitted
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</ChartCardShell>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,8 +1,5 @@
|
||||
import Link from "next/link";
|
||||
import { Card, CardContent, CardHeader, CardTitle } from "@/shared/components/ui/card";
|
||||
import { FileCheck, PenTool, TrendingUp, BarChart } from "lucide-react";
|
||||
import { Skeleton } from "@/shared/components/ui/skeleton";
|
||||
import { cn } from "@/shared/lib/utils";
|
||||
import { StatCard } from "@/shared/components/ui/stat-card";
|
||||
|
||||
interface TeacherStatsProps {
|
||||
toGradeCount: number;
|
||||
@@ -19,84 +16,45 @@ export function TeacherStats({
|
||||
submissionRate,
|
||||
isLoading = false,
|
||||
}: TeacherStatsProps) {
|
||||
if (isLoading) {
|
||||
return (
|
||||
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
|
||||
{Array.from({ length: 4 }).map((_, i) => (
|
||||
<Card key={i}>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
||||
<Skeleton className="h-4 w-[100px]" />
|
||||
<Skeleton className="h-4 w-4 rounded-full" />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<Skeleton className="h-8 w-[60px] mb-2" />
|
||||
<Skeleton className="h-3 w-[140px]" />
|
||||
</CardContent>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const stats = [
|
||||
{
|
||||
title: "Needs Grading",
|
||||
value: String(toGradeCount),
|
||||
description: "Submissions pending review",
|
||||
icon: FileCheck,
|
||||
href: "/teacher/homework/submissions?status=submitted",
|
||||
highlight: toGradeCount > 0,
|
||||
color: "text-amber-500",
|
||||
},
|
||||
{
|
||||
title: "Active Assignments",
|
||||
value: String(activeAssignmentsCount),
|
||||
description: "Published and ongoing",
|
||||
icon: PenTool,
|
||||
href: "/teacher/homework/assignments?status=published",
|
||||
highlight: false,
|
||||
color: "text-blue-500",
|
||||
},
|
||||
{
|
||||
title: "Average Score",
|
||||
value: `${Math.round(averageScore)}%`,
|
||||
description: "Across recent assignments",
|
||||
icon: TrendingUp,
|
||||
href: "#grade-trends",
|
||||
highlight: false,
|
||||
color: "text-emerald-500",
|
||||
},
|
||||
{
|
||||
title: "Submission Rate",
|
||||
value: `${Math.round(submissionRate)}%`,
|
||||
description: "Overall completion rate",
|
||||
icon: BarChart,
|
||||
href: "#grade-trends",
|
||||
highlight: false,
|
||||
color: "text-purple-500",
|
||||
},
|
||||
] as const;
|
||||
|
||||
return (
|
||||
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
|
||||
{stats.map((stat, i) => (
|
||||
<Link key={i} href={stat.href} className="block transition-transform hover:-translate-y-1">
|
||||
<Card className={cn(stat.highlight && "border-amber-200 bg-amber-50/50 dark:border-amber-900 dark:bg-amber-950/20")}>
|
||||
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
||||
<CardTitle className="text-sm font-medium">
|
||||
{stat.title}
|
||||
</CardTitle>
|
||||
<stat.icon className={cn("h-4 w-4", stat.color)} />
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="text-2xl font-bold">{stat.value}</div>
|
||||
<p className="text-xs text-muted-foreground">
|
||||
{stat.description}
|
||||
</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</Link>
|
||||
))}
|
||||
<StatCard
|
||||
title="Needs Grading"
|
||||
value={String(toGradeCount)}
|
||||
description="Submissions pending review"
|
||||
icon={FileCheck}
|
||||
href="/teacher/homework/submissions?status=submitted"
|
||||
highlight={toGradeCount > 0}
|
||||
color="text-amber-500"
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
<StatCard
|
||||
title="Active Assignments"
|
||||
value={String(activeAssignmentsCount)}
|
||||
description="Published and ongoing"
|
||||
icon={PenTool}
|
||||
href="/teacher/homework/assignments?status=published"
|
||||
color="text-blue-500"
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
<StatCard
|
||||
title="Average Score"
|
||||
value={`${Math.round(averageScore)}%`}
|
||||
description="Across recent assignments"
|
||||
icon={TrendingUp}
|
||||
href="#grade-trends"
|
||||
color="text-emerald-500"
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
<StatCard
|
||||
title="Submission Rate"
|
||||
value={`${Math.round(submissionRate)}%`}
|
||||
description="Overall completion rate"
|
||||
icon={BarChart}
|
||||
href="#grade-trends"
|
||||
color="text-purple-500"
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user