学习闭环增强:错题本+每周能力检测+学习概览日历+模板日历+课程管理

- 错题本:所有检测错题自动入库,带详细讲解,可标记掌握,孩子端可查
- 每周能力检测:从已学知识点确定性组卷10题,计分记录,达标关联当日
  英语打卡,错题进错题本,家长可见成绩
- 家长"今日概览"改"学习概览",月日历展示每日打卡/语法点亮/周检测
- 任务模板改日历展示,灵活添加:某一天/每周X/本周/日期区间批量,可删
- 家长中心新增"课程管理"栏目(语法课程编辑+周测成绩),设备管理弱化为
  栏目内二级区块

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/app/parent/overview-tab.tsx

@@ -1,108 +1,102 @@
 "use client";
 
-import { useTransition } from "react";
-import { Flame } from "lucide-react";
-import { Badge } from "@/components/ui/badge";
-import { Button } from "@/components/ui/button";
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { useState } from "react";
 import { cn } from "@/lib/utils";
-import { subjectMeta } from "@/lib/subjects";
-import { makeupTask } from "./actions";
+import { addDays, dowOf, todayStr } from "@/lib/dates";
+import { Button } from "@/components/ui/button";
 import type { OverviewData } from "./dashboard";
 
-const DOW_LABELS = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
-
-function dateLabel(date: string) {
-  const [y, m, d] = date.split("-").map(Number);
-  const dow = new Date(Date.UTC(y, m - 1, d)).getUTCDay();
-  return `${m}月${d}日 ${DOW_LABELS[dow]}`;
-}
-
+// 学习概览:按孩子的月日历,展示每日 打卡/语法/周检测 情况
 export function OverviewTab({ data }: { data: OverviewData }) {
-  const [, startTransition] = useTransition();
+  const [kidId, setKidId] = useState(data.kids[0]?.id);
+  const kid = data.kids.find((k) => k.id === kidId) ?? data.kids[0];
+  if (!kid) return null;
+
+  const today = todayStr();
+  const ym = today.slice(0, 7);
+  const first = `${ym}-01`;
+  const daysInMonth = new Date(Number(ym.slice(0, 4)), Number(ym.slice(5, 7)), 0).getDate();
+  const lead = (dowOf(first) + 6) % 7; // 周一开头的前导空位数
+  const dates = Array.from({ length: daysInMonth }, (_, i) => `${ym}-${String(i + 1).padStart(2, "0")}`);
 
   return (
     <div className="space-y-4">
-      {data.kids.map((kid) => (
-        <Card key={kid.id}>
-          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-            <CardTitle className="text-lg">{kid.name}</CardTitle>
-            <div className="flex items-center gap-1 text-orange-600">
-              <Flame className="size-5" fill="currentColor" />
-              <span className="font-bold">{kid.streak}</span>
-              <span className="text-xs">天连击</span>
-            </div>
-          </CardHeader>
-          <CardContent className="space-y-3">
-            <p className="text-sm text-muted-foreground">
-              今日完成 {kid.today.done} / {kid.today.total} 项
-            </p>
-            <div className="flex items-center gap-2 text-sm text-muted-foreground">
-              <span className="shrink-0">英语语法</span>
-              <div className="h-1.5 flex-1 overflow-hidden rounded-full bg-slate-100">
-                <div
-                  className="h-full rounded-full bg-gradient-to-r from-indigo-500 to-violet-500"
-                  style={{
-                    width: `${kid.grammar.total ? (kid.grammar.done / kid.grammar.total) * 100 : 0}%`,
-                  }}
-                />
+      <div className="flex flex-wrap gap-2">
+        {data.kids.map((k) => (
+          <Button
+            key={k.id}
+            size="sm"
+            variant={k.id === kid.id ? "default" : "outline"}
+            onClick={() => setKidId(k.id)}
+          >
+            {k.name}
+          </Button>
+        ))}
+      </div>
+
+      <div className="grid grid-cols-3 gap-3">
+        <div className="rounded-xl border border-slate-100 bg-white p-3 text-center shadow-soft">
+          <p className="text-xs text-muted-foreground">语法进度</p>
+          <p className="text-lg font-extrabold text-indigo-600">
+            {kid.grammar.done}/{kid.grammar.total}
+          </p>
+        </div>
+        <div className="rounded-xl border border-slate-100 bg-white p-3 text-center shadow-soft">
+          <p className="text-xs text-muted-foreground">待掌握错题</p>
+          <p className="text-lg font-extrabold text-rose-600">{kid.wrongOpen}</p>
+        </div>
+        <div className="rounded-xl border border-slate-100 bg-white p-3 text-center shadow-soft">
+          <p className="text-xs text-muted-foreground">最近周测</p>
+          <p className="text-lg font-extrabold text-violet-600">
+            {kid.weeklyLatest ? `${kid.weeklyLatest.score}分` : "—"}
+          </p>
+        </div>
+      </div>
+
+      <div className="rounded-xl border border-slate-100 bg-white p-4 shadow-soft">
+        <div className="grid grid-cols-7 gap-1 text-center text-xs font-medium text-muted-foreground">
+          {["一", "二", "三", "四", "五", "六", "日"].map((w) => (
+            <div key={w}>周{w}</div>
+          ))}
+        </div>
+        <div className="mt-1 grid grid-cols-7 gap-1">
+          {Array.from({ length: lead }).map((_, i) => (
+            <div key={`e${i}`} />
+          ))}
+          {dates.map((d) => {
+            const c = kid.days[d];
+            const isToday = d === today;
+            const check = c && c.total > 0 ? (c.done >= c.total && c.done > 0 ? 2 : c.done > 0 ? 1 : 0) : 0;
+            return (
+              <div
+                key={d}
+                title={`${d} 打卡${c?.done ?? 0}/${c?.total ?? 0} 语法${c?.grammar ?? 0} ${c?.weekly != null ? `周测${c.weekly}` : ""}`}
+                className={cn(
+                  "flex aspect-square flex-col items-center justify-center rounded-lg border text-sm",
+                  isToday ? "border-indigo-400 ring-1 ring-indigo-300" : "border-slate-100",
+                  "bg-white",
+                )}
+              >
+                <span className={cn("leading-none", isToday ? "font-extrabold text-indigo-600" : "text-slate-600")}>
+                  {Number(d.slice(8))}
+                </span>
+                <span className="mt-1 flex h-2 items-center gap-0.5">
+                  {check === 2 && <span className="size-2 rounded-full bg-emerald-500" />}
+                  {check === 1 && <span className="size-2 rounded-full bg-amber-400" />}
+                  {(c?.grammar ?? 0) > 0 && <span className="size-2 rounded-full bg-indigo-500" />}
+                  {c?.weekly != null && <span className="size-2 rounded-full bg-violet-500" />}
+                </span>
               </div>
-              <span className="shrink-0 font-medium text-indigo-600">
-                {kid.grammar.done}/{kid.grammar.total}
-              </span>
-            </div>
-            <div className="space-y-2">
-              {kid.week.map((day) => (
-                <div key={day.date} className="rounded-lg border p-2">
-                  <p className="mb-1 text-xs font-medium text-muted-foreground">
-                    {dateLabel(day.date)}
-                    {day.isToday && " · 今天"}
-                  </p>
-                  {day.tasks.length === 0 ? (
-                    <p className="text-xs text-muted-foreground">无任务(自动保持连击)</p>
-                  ) : (
-                    <div className="flex flex-wrap gap-1.5">
-                      {day.tasks.map((t) => (
-                        <span key={t.id} className="inline-flex items-center gap-1">
-                          <Badge variant={t.status === "done" ? "default" : "secondary"}>
-                            <span className={cn("size-1.5 rounded-full", subjectMeta(t.subject).dot)} />
-                            {t.title}
-                            {t.isMakeup && " · 补"}
-                          </Badge>
-                          {!day.isToday && t.status === "pending" && (
-                            <Button
-                              variant="outline"
-                              size="sm"
-                              className="h-5 px-1.5 text-xs"
-                              onClick={() =>
-                                startTransition(() => makeupTask(t.id, true))
-                              }
-                            >
-                              补卡
-                            </Button>
-                          )}
-                          {!day.isToday && t.isMakeup && (
-                            <Button
-                              variant="ghost"
-                              size="sm"
-                              className="h-5 px-1.5 text-xs"
-                              onClick={() =>
-                                startTransition(() => makeupTask(t.id, false))
-                              }
-                            >
-                              撤销
-                            </Button>
-                          )}
-                        </span>
-                      ))}
-                    </div>
-                  )}
-                </div>
-              ))}
-            </div>
-          </CardContent>
-        </Card>
-      ))}
+            );
+          })}
+        </div>
+        <p className="mt-3 text-xs text-muted-foreground">
+          <span className="mr-2 inline-flex items-center gap-1"><span className="size-2 rounded-full bg-emerald-500" />打卡完成</span>
+          <span className="mr-2 inline-flex items-center gap-1"><span className="size-2 rounded-full bg-amber-400" />打卡部分</span>
+          <span className="mr-2 inline-flex items-center gap-1"><span className="size-2 rounded-full bg-indigo-500" />语法点亮</span>
+          <span className="inline-flex items-center gap-1"><span className="size-2 rounded-full bg-violet-500" />周检测</span>
+        </p>
+      </div>
     </div>
   );
 }