Spaces:

dvc890
/

stud-manager

Sleeping

App Files Files Community

dvc890 commited on Dec 1, 2025

Commit

42332c7

verified ·

1 Parent(s): b2bb4f0

Upload 25 files

Browse files

Files changed (6) hide show

index.html +7 -6
pages/Reports.tsx +168 -26
pages/ScoreList.tsx +60 -11
server.js +29 -0
services/api.ts +5 -0
types.ts +8 -0

index.html CHANGED Viewed

@@ -1,3 +1,4 @@
 <!DOCTYPE html>
 <html lang="zh-CN">
   <head>
@@ -32,13 +33,13 @@
   <script type="importmap">
 {
   "imports": {
-    "react": "https://aistudiocdn.com/react@^19.2.0",
-    "react-dom/": "https://aistudiocdn.com/react-dom@^19.2.0/",
     "react/": "https://aistudiocdn.com/react@^19.2.0/",
     "lucide-react": "https://aistudiocdn.com/lucide-react@^0.555.0",
-    "recharts": "https://aistudiocdn.com/recharts@^3.5.1",
-    "vite": "https://aistudiocdn.com/vite@^7.2.4",
-    "@vitejs/plugin-react": "https://aistudiocdn.com/@vitejs/plugin-react@^5.1.1"
   }
 }
 </script>
@@ -48,4 +49,4 @@
     <div id="root"></div>
     <script type="module" src="/index.tsx"></script>
   </body>
-</html>

 <!DOCTYPE html>
 <html lang="zh-CN">
   <head>
   <script type="importmap">
 {
   "imports": {
+    "vite": "https://aistudiocdn.com/vite@^7.2.6",
+    "recharts": "https://aistudiocdn.com/recharts@^3.5.1",
     "react/": "https://aistudiocdn.com/react@^19.2.0/",
+    "react": "https://aistudiocdn.com/react@^19.2.0",
+    "@vitejs/plugin-react": "https://aistudiocdn.com/@vitejs/plugin-react@^5.1.1",
     "lucide-react": "https://aistudiocdn.com/lucide-react@^0.555.0",
+    "react-dom/": "https://aistudiocdn.com/react-dom@^19.2.0/"
   }
 }
 </script>
     <div id="root"></div>
     <script type="module" src="/index.tsx"></script>
   </body>
+</html>

pages/Reports.tsx CHANGED Viewed

@@ -2,25 +2,26 @@
 import React, { useState, useEffect } from 'react';
 import {
   BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer,
-  LineChart, Line, AreaChart, Area, PieChart as RePieChart, Pie, Cell
 } from 'recharts';
 import { api } from '../services/api';
-import { Loader2, Download, Filter, TrendingUp, Users, BookOpen, PieChart as PieChartIcon, Grid, BarChart2 } from 'lucide-react';
-import { Score, Student, ClassInfo, Subject } from '../types';
 export const Reports: React.FC = () => {
   const [loading, setLoading] = useState(true);
-  const [activeTab, setActiveTab] = useState<'overview' | 'grade' | 'trend' | 'matrix'>('grade');
   // Data
   const [scores, setScores] = useState<Score[]>([]);
   const [students, setStudents] = useState<Student[]>([]);
   const [classes, setClasses] = useState<ClassInfo[]>([]);
   const [subjects, setSubjects] = useState<Subject[]>([]);
   // Filters
   const [selectedGrade, setSelectedGrade] = useState<string>('六年级');
-  const [selectedClass, setSelectedClass] = useState<string>(''); // For Trend
   const [selectedSubject, setSelectedSubject] = useState<string>(''); // For Trend
   // Computed Data
@@ -28,20 +29,25 @@ export const Reports: React.FC = () => {
   const [trendData, setTrendData] = useState<any[]>([]);
   const [matrixData, setMatrixData] = useState<any[]>([]);
   useEffect(() => {
     const loadData = async () => {
       setLoading(true);
       try {
-        const [scs, stus, cls, subs] = await Promise.all([
           api.scores.getAll(),
           api.students.getAll(),
           api.classes.getAll(),
-          api.subjects.getAll()
         ]);
         setScores(scs);
         setStudents(stus);
         setClasses(cls);
         setSubjects(subs);
         // Set Defaults
         if (cls.length > 0) setSelectedClass(cls[0].grade + cls[0].className);
@@ -93,16 +99,20 @@ export const Reports: React.FC = () => {
     // --- 2. Trend Analysis (Time/Exam based) ---
-    // Group by Exam Name or Type. Since we don't have real dates, we'll use examName as categories.
-    // Filter for selectedClass and selectedSubject
     if (selectedClass && selectedSubject) {
       const classStudentIds = students.filter(s => s.className === selectedClass).map(s => s.studentNo);
-      // Get all unique exam names in database order (assuming insertion order implies time for mock)
-      // In real app, sort by exam date.
-      const uniqueExams = Array.from(new Set(scores.map(s => s.examName || s.type)));
-      const tData = uniqueExams.map(exam => {
          const examScores = scores.filter(s =>
             (s.examName === exam || s.type === exam) &&
             s.courseName === selectedSubject &&
@@ -116,7 +126,6 @@ export const Reports: React.FC = () => {
             : 0;
          // Grade Avg (for comparison)
-         // Find grade of selected class
          const currentGrade = classes.find(c => c.grade + c.className === selectedClass)?.grade || '';
          const gradeStudentIds = students.filter(s => s.className.startsWith(currentGrade)).map(s => s.studentNo);
          const gradeExamScores = examScores.filter(s => gradeStudentIds.includes(s.studentNo));
@@ -134,7 +143,6 @@ export const Reports: React.FC = () => {
     }
     // --- 3. Subject Matrix (Heatmap Table) ---
-    // Rows: Classes in selectedGrade. Cols: Subjects.
     const mData = gradeClasses.map(cls => {
        const fullClassName = cls.grade + cls.className;
        const classStudentIds = students.filter(s => s.className === fullClassName).map(s => s.studentNo);
@@ -154,7 +162,7 @@ export const Reports: React.FC = () => {
     });
     setMatrixData(mData);
-  }, [scores, students, classes, subjects, selectedGrade, selectedClass, selectedSubject]);
   const exportExcel = () => {
@@ -176,9 +184,45 @@ export const Reports: React.FC = () => {
     XLSX.writeFile(wb, `Report_${activeTab}_${new Date().toISOString().slice(0,10)}.xlsx`);
   };
-  const COLORS = ['#3b82f6', '#10b981', '#f59e0b', '#ef4444', '#8b5cf6'];
   const uniqueGrades = Array.from(new Set(classes.map(c => c.grade))).sort();
   const allClasses = classes.map(c => c.grade + c.className);
   if (loading) return <div className="flex justify-center py-20"><Loader2 className="animate-spin text-blue-600"/></div>;
@@ -202,6 +246,7 @@ export const Reports: React.FC = () => {
             { id: 'grade', label: '年级横向分析', icon: BarChart2 },
             { id: 'trend', label: '教学成长轨迹', icon: TrendingUp },
             { id: 'matrix', label: '学科质量透视', icon: Grid },
             { id: 'overview', label: '全校概览', icon: PieChartIcon },
          ].map(tab => (
             <button
@@ -230,15 +275,16 @@ export const Reports: React.FC = () => {
                </select>
             )}
             {activeTab === 'trend' && (
-               <>
-                  <select className="border border-gray-300 p-2 rounded text-sm text-gray-800" value={selectedClass} onChange={e => setSelectedClass(e.target.value)}>
-                     {allClasses.map(c => <option key={c} value={c}>{c}</option>)}
-                  </select>
-                  <select className="border border-gray-300 p-2 rounded text-sm text-gray-800" value={selectedSubject} onChange={e => setSelectedSubject(e.target.value)}>
-                     {subjects.map(s => <option key={s._id} value={s.name}>{s.name}</option>)}
-                  </select>
-               </>
             )}
          </div>
@@ -348,8 +394,39 @@ export const Reports: React.FC = () => {
                <p className="text-xs text-gray-400 mt-4 text-right">* 绿色底色代表优秀，红色底色代表需要关注</p>
             </div>
          )}
-         {/* --- 4. Overview View --- */}
          {activeTab === 'overview' && (
              <div className="flex flex-col items-center justify-center py-20 text-gray-400">
                 <PieChartIcon size={64} className="mb-4 opacity-20"/>
@@ -359,6 +436,71 @@ export const Reports: React.FC = () => {
          )}
       </div>
     </div>
   );
 };

 import React, { useState, useEffect } from 'react';
 import {
   BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer,
+  LineChart, Line, AreaChart, Area, PieChart as RePieChart, Pie, Cell, RadarChart, Radar, PolarGrid, PolarAngleAxis, PolarRadiusAxis
 } from 'recharts';
 import { api } from '../services/api';
+import { Loader2, Download, Filter, TrendingUp, Users, BookOpen, PieChart as PieChartIcon, Grid, BarChart2, User, UserCheck } from 'lucide-react';
+import { Score, Student, ClassInfo, Subject, Exam } from '../types';
 export const Reports: React.FC = () => {
   const [loading, setLoading] = useState(true);
+  const [activeTab, setActiveTab] = useState<'overview' | 'grade' | 'trend' | 'matrix' | 'student'>('grade');
   // Data
   const [scores, setScores] = useState<Score[]>([]);
   const [students, setStudents] = useState<Student[]>([]);
   const [classes, setClasses] = useState<ClassInfo[]>([]);
   const [subjects, setSubjects] = useState<Subject[]>([]);
+  const [exams, setExams] = useState<Exam[]>([]);
   // Filters
   const [selectedGrade, setSelectedGrade] = useState<string>('六年级');
+  const [selectedClass, setSelectedClass] = useState<string>(''); // For Trend/Student
   const [selectedSubject, setSelectedSubject] = useState<string>(''); // For Trend
   // Computed Data
   const [trendData, setTrendData] = useState<any[]>([]);
   const [matrixData, setMatrixData] = useState<any[]>([]);
+  // Student Focus State
+  const [selectedStudent, setSelectedStudent] = useState<Student | null>(null);
   useEffect(() => {
     const loadData = async () => {
       setLoading(true);
       try {
+        const [scs, stus, cls, subs, exs] = await Promise.all([
           api.scores.getAll(),
           api.students.getAll(),
           api.classes.getAll(),
+          api.subjects.getAll(),
+          api.exams.getAll()
         ]);
         setScores(scs);
         setStudents(stus);
         setClasses(cls);
         setSubjects(subs);
+        setExams(exs);
         // Set Defaults
         if (cls.length > 0) setSelectedClass(cls[0].grade + cls[0].className);
     // --- 2. Trend Analysis (Time/Exam based) ---
+    // Group by Exam Name or Type. Sort using Exam Dates if available.
     if (selectedClass && selectedSubject) {
       const classStudentIds = students.filter(s => s.className === selectedClass).map(s => s.studentNo);
+      const uniqueExamNames = Array.from(new Set(scores.map(s => s.examName || s.type)));
+      // Sort exams by date
+      uniqueExamNames.sort((a, b) => {
+         const dateA = exams.find(e => e.name === a)?.date || '9999-99-99';
+         const dateB = exams.find(e => e.name === b)?.date || '9999-99-99';
+         return dateA.localeCompare(dateB);
+      });
+      const tData = uniqueExamNames.map(exam => {
          const examScores = scores.filter(s =>
             (s.examName === exam || s.type === exam) &&
             s.courseName === selectedSubject &&
             : 0;
          // Grade Avg (for comparison)
          const currentGrade = classes.find(c => c.grade + c.className === selectedClass)?.grade || '';
          const gradeStudentIds = students.filter(s => s.className.startsWith(currentGrade)).map(s => s.studentNo);
          const gradeExamScores = examScores.filter(s => gradeStudentIds.includes(s.studentNo));
     }
     // --- 3. Subject Matrix (Heatmap Table) ---
     const mData = gradeClasses.map(cls => {
        const fullClassName = cls.grade + cls.className;
        const classStudentIds = students.filter(s => s.className === fullClassName).map(s => s.studentNo);
     });
     setMatrixData(mData);
+  }, [scores, students, classes, subjects, exams, selectedGrade, selectedClass, selectedSubject]);
   const exportExcel = () => {
     XLSX.writeFile(wb, `Report_${activeTab}_${new Date().toISOString().slice(0,10)}.xlsx`);
   };
+  // Helper for Student Focus
+  const getStudentTrend = (studentNo: string) => {
+     // Get all scores for this student, grouped by exam, sorted by date
+     const stuScores = scores.filter(s => s.studentNo === studentNo && s.status === 'Normal');
+     const uniqueExamNames = Array.from(new Set(stuScores.map(s => s.examName || s.type)));
+     uniqueExamNames.sort((a, b) => {
+        const dateA = exams.find(e => e.name === a)?.date || '9999-99-99';
+        const dateB = exams.find(e => e.name === b)?.date || '9999-99-99';
+        return dateA.localeCompare(dateB);
+     });
+     return uniqueExamNames.map(exam => {
+        const s = stuScores.find(s => (s.examName || s.type) === exam);
+        return { name: exam, score: s ? s.score : 0 };
+     });
+  };
+  const getStudentRadar = (studentNo: string) => {
+      const stuScores = scores.filter(s => s.studentNo === studentNo && s.status === 'Normal');
+      return subjects.map(sub => {
+         const subScores = stuScores.filter(s => s.courseName === sub.name);
+         const avg = subScores.length ? subScores.reduce((a,b)=>a+b.score,0)/subScores.length : 0;
+         return { subject: sub.name, score: Number(avg.toFixed(1)), fullMark: 100 };
+      });
+  };
+  const getStudentAttendance = (studentNo: string) => {
+      const all = scores.filter(s => s.studentNo === studentNo);
+      return {
+         absent: all.filter(s => s.status === 'Absent').length,
+         leave: all.filter(s => s.status === 'Leave').length
+      };
+  };
   const uniqueGrades = Array.from(new Set(classes.map(c => c.grade))).sort();
   const allClasses = classes.map(c => c.grade + c.className);
+  // Student List for Focus Tab
+  const focusStudents = students.filter(s => selectedClass ? s.className === selectedClass : true);
   if (loading) return <div className="flex justify-center py-20"><Loader2 className="animate-spin text-blue-600"/></div>;
             { id: 'grade', label: '年级横向分析', icon: BarChart2 },
             { id: 'trend', label: '教学成长轨迹', icon: TrendingUp },
             { id: 'matrix', label: '学科质量透视', icon: Grid },
+            { id: 'student', label: '学生个像', icon: User },
             { id: 'overview', label: '全校概览', icon: PieChartIcon },
          ].map(tab => (
             <button
                </select>
             )}
+            {(activeTab === 'trend' || activeTab === 'student') && (
+               <select className="border border-gray-300 p-2 rounded text-sm text-gray-800" value={selectedClass} onChange={e => setSelectedClass(e.target.value)}>
+                  {allClasses.map(c => <option key={c} value={c}>{c}</option>)}
+               </select>
+            )}
             {activeTab === 'trend' && (
+               <select className="border border-gray-300 p-2 rounded text-sm text-gray-800" value={selectedSubject} onChange={e => setSelectedSubject(e.target.value)}>
+                  {subjects.map(s => <option key={s._id} value={s.name}>{s.name}</option>)}
+               </select>
             )}
          </div>
                <p className="text-xs text-gray-400 mt-4 text-right">* 绿色底色代表优秀，红色底色代表需要关注</p>
             </div>
          )}
+         {/* --- 4. Student Focus View --- */}
+         {activeTab === 'student' && (
+             <div className="animate-in fade-in">
+                <h3 className="font-bold text-gray-800 mb-4">{selectedClass} - 学生个像分析</h3>
+                <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4">
+                   {focusStudents.map(s => {
+                      const trend = getStudentTrend(s.studentNo);
+                      return (
+                         <div key={s._id||s.id} onClick={() => setSelectedStudent(s)} className="bg-white border rounded-xl p-4 hover:shadow-md cursor-pointer transition-shadow">
+                            <div className="flex items-center space-x-3 mb-3">
+                               <div className={`w-10 h-10 rounded-full flex items-center justify-center text-white font-bold ${s.gender==='Male'?'bg-blue-500':'bg-pink-500'}`}>{s.name[0]}</div>
+                               <div>
+                                  <p className="font-bold text-gray-800">{s.name}</p>
+                                  <p className="text-xs text-gray-500">{s.studentNo}</p>
+                               </div>
+                            </div>
+                            {/* Sparkline */}
+                            <div className="h-12">
+                               <ResponsiveContainer width="100%" height="100%">
+                                  <LineChart data={trend}>
+                                     <Line type="monotone" dataKey="score" stroke="#94a3b8" strokeWidth={2} dot={false} />
+                                  </LineChart>
+                               </ResponsiveContainer>
+                            </div>
+                         </div>
+                      );
+                   })}
+                </div>
+             </div>
+         )}
+         {/* --- 5. Overview View --- */}
          {activeTab === 'overview' && (
              <div className="flex flex-col items-center justify-center py-20 text-gray-400">
                 <PieChartIcon size={64} className="mb-4 opacity-20"/>
          )}
       </div>
+      {/* Student Detail Modal */}
+      {selectedStudent && (
+         <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
+            <div className="bg-white rounded-xl w-full max-w-4xl max-h-[90vh] overflow-y-auto p-6 relative">
+               <button onClick={()=>setSelectedStudent(null)} className="absolute top-4 right-4 text-gray-400 hover:text-gray-600"><UserCheck size={24}/></button>
+               <div className="flex items-center space-x-4 mb-8">
+                  <div className={`w-16 h-16 rounded-full flex items-center justify-center text-2xl text-white font-bold ${selectedStudent.gender==='Male'?'bg-blue-600':'bg-pink-500'}`}>
+                     {selectedStudent.name[0]}
+                  </div>
+                  <div>
+                     <h2 className="text-2xl font-bold text-gray-800">{selectedStudent.name}</h2>
+                     <p className="text-gray-500">{selectedStudent.studentNo} | {selectedStudent.className}</p>
+                  </div>
+               </div>
+               <div className="grid grid-cols-1 md:grid-cols-2 gap-8">
+                  {/* Radar */}
+                  <div className="bg-gray-50 rounded-xl p-4">
+                     <h3 className="font-bold text-gray-700 mb-4 text-center">学科能力模型</h3>
+                     <div className="h-64">
+                        <ResponsiveContainer width="100%" height="100%">
+                           <RadarChart cx="50%" cy="50%" outerRadius="80%" data={getStudentRadar(selectedStudent.studentNo)}>
+                              <PolarGrid />
+                              <PolarAngleAxis dataKey="subject" />
+                              <PolarRadiusAxis angle={30} domain={[0, 100]} />
+                              <Radar name={selectedStudent.name} dataKey="score" stroke="#3b82f6" fill="#3b82f6" fillOpacity={0.6} />
+                              <Tooltip />
+                           </RadarChart>
+                        </ResponsiveContainer>
+                     </div>
+                  </div>
+                  {/* Trend */}
+                  <div className="bg-gray-50 rounded-xl p-4">
+                     <h3 className="font-bold text-gray-700 mb-4 text-center">综合成绩走势</h3>
+                     <div className="h-64">
+                        <ResponsiveContainer width="100%" height="100%">
+                           <LineChart data={getStudentTrend(selectedStudent.studentNo)}>
+                              <CartesianGrid strokeDasharray="3 3" vertical={false}/>
+                              <XAxis dataKey="name" fontSize={10}/>
+                              <YAxis domain={[0, 100]}/>
+                              <Tooltip />
+                              <Line type="monotone" dataKey="score" stroke="#10b981" strokeWidth={3} />
+                           </LineChart>
+                        </ResponsiveContainer>
+                     </div>
+                  </div>
+                  {/* Attendance */}
+                  <div className="bg-gray-50 rounded-xl p-4 md:col-span-2 flex justify-around">
+                      <div className="text-center">
+                         <p className="text-gray-500 text-sm">缺考次数</p>
+                         <p className="text-2xl font-bold text-red-500">{getStudentAttendance(selectedStudent.studentNo).absent}</p>
+                      </div>
+                      <div className="text-center">
+                         <p className="text-gray-500 text-sm">请假次数</p>
+                         <p className="text-2xl font-bold text-orange-500">{getStudentAttendance(selectedStudent.studentNo).leave}</p>
+                      </div>
+                  </div>
+               </div>
+            </div>
+         </div>
+      )}
     </div>
   );
 };

pages/ScoreList.tsx CHANGED Viewed

@@ -1,7 +1,8 @@
 import React, { useState, useEffect } from 'react';
 import { api } from '../services/api';
-import { Score, Student, Subject, ClassInfo, ExamStatus } from '../types';
-import { Loader2, Plus, Trash2, Award, FileSpreadsheet, X, Upload, Edit, Save } from 'lucide-react';
 export const ScoreList: React.FC = () => {
   const [subjects, setSubjects] = useState<Subject[]>([]);
@@ -9,6 +10,7 @@ export const ScoreList: React.FC = () => {
   const [scores, setScores] = useState<Score[]>([]);
   const [students, setStudents] = useState<Student[]>([]);
   const [classList, setClassList] = useState<ClassInfo[]>([]);
   const [loading, setLoading] = useState(true);
   const [selectedGrade, setSelectedGrade] = useState('All');
@@ -17,6 +19,8 @@ export const ScoreList: React.FC = () => {
   const [isAddOpen, setIsAddOpen] = useState(false);
   const [isImportOpen, setIsImportOpen] = useState(false);
   const [importFile, setImportFile] = useState<File | null>(null);
   const [submitting, setSubmitting] = useState(false);
@@ -36,17 +40,19 @@ export const ScoreList: React.FC = () => {
   const loadData = async () => {
     setLoading(true);
     try {
-      const [subs, scs, stus, cls] = await Promise.all([
         api.subjects.getAll(),
         api.scores.getAll(),
         api.students.getAll(),
-        api.classes.getAll()
       ]);
       setSubjects(subs);
       if (subs.length > 0 && !activeSubject) setActiveSubject(subs[0].name);
       setScores(scs);
       setStudents(stus);
       setClassList(cls);
     } catch (e) { console.error(e); }
     finally { setLoading(false); }
   };
@@ -194,6 +200,11 @@ export const ScoreList: React.FC = () => {
     reader.readAsArrayBuffer(importFile);
   };
   const toggleSelect = (id: string) => {
      const newSet = new Set(selectedIds);
@@ -202,12 +213,12 @@ export const ScoreList: React.FC = () => {
   };
   const uniqueGrades = Array.from(new Set(classList.map(c => c.grade))).sort();
-  // FIX: Cascading filter logic.
-  // If a grade is selected, ONLY show classes from that grade.
   const filteredClasses = classList.filter(c => selectedGrade === 'All' || c.grade === selectedGrade);
   const uniqueClasses = Array.from(new Set(filteredClasses.map(c => c.className))).sort();
   return (
     <div className="space-y-6">
        <div className="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden min-h-[500px]">
@@ -216,11 +227,14 @@ export const ScoreList: React.FC = () => {
           <div className="p-4 md:p-6 border-b border-gray-100">
              <div className="flex flex-col md:flex-row justify-between items-start md:items-center mb-4 gap-4">
                 <h2 className="text-xl font-bold flex items-center text-gray-800"><Award className="mr-2 text-blue-600"/>成绩管理</h2>
-                <div className="flex gap-2 w-full md:w-auto">
-                   <button onClick={() => { setIsImportOpen(true); setImportFile(null); }} className="flex-1 md:flex-none px-4 py-2 bg-emerald-50 text-emerald-600 border border-emerald-200 rounded-lg flex items-center justify-center text-sm hover:bg-emerald-100 transition-colors">
                       <FileSpreadsheet size={16} className="mr-1"/> Excel导入
                    </button>
-                   <button onClick={() => setIsAddOpen(true)} className="flex-1 md:flex-none px-4 py-2 bg-blue-600 text-white rounded-lg flex items-center justify-center text-sm hover:bg-blue-700 transition-colors">
                       <Plus size={16} className="mr-1"/> 手动录入
                    </button>
                 </div>
@@ -362,6 +376,41 @@ export const ScoreList: React.FC = () => {
           </div>
        )}
        {/* Excel Import Modal */}
        {isImportOpen && (
           <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
@@ -419,4 +468,4 @@ export const ScoreList: React.FC = () => {
        )}
     </div>
   );
-};

 import React, { useState, useEffect } from 'react';
 import { api } from '../services/api';
+import { Score, Student, Subject, ClassInfo, ExamStatus, Exam } from '../types';
+import { Loader2, Plus, Trash2, Award, FileSpreadsheet, X, Upload, Edit, Save, Calendar } from 'lucide-react';
 export const ScoreList: React.FC = () => {
   const [subjects, setSubjects] = useState<Subject[]>([]);
   const [scores, setScores] = useState<Score[]>([]);
   const [students, setStudents] = useState<Student[]>([]);
   const [classList, setClassList] = useState<ClassInfo[]>([]);
+  const [exams, setExams] = useState<Exam[]>([]);
   const [loading, setLoading] = useState(true);
   const [selectedGrade, setSelectedGrade] = useState('All');
   const [isAddOpen, setIsAddOpen] = useState(false);
   const [isImportOpen, setIsImportOpen] = useState(false);
+  const [isExamModalOpen, setIsExamModalOpen] = useState(false);
   const [importFile, setImportFile] = useState<File | null>(null);
   const [submitting, setSubmitting] = useState(false);
   const loadData = async () => {
     setLoading(true);
     try {
+      const [subs, scs, stus, cls, exs] = await Promise.all([
         api.subjects.getAll(),
         api.scores.getAll(),
         api.students.getAll(),
+        api.classes.getAll(),
+        api.exams.getAll()
       ]);
       setSubjects(subs);
       if (subs.length > 0 && !activeSubject) setActiveSubject(subs[0].name);
       setScores(scs);
       setStudents(stus);
       setClassList(cls);
+      setExams(exs);
     } catch (e) { console.error(e); }
     finally { setLoading(false); }
   };
     reader.readAsArrayBuffer(importFile);
   };
+  const handleUpdateExamDate = async (name: string, date: string) => {
+     await api.exams.save({ name, date });
+     loadData();
+  };
   const toggleSelect = (id: string) => {
      const newSet = new Set(selectedIds);
   };
   const uniqueGrades = Array.from(new Set(classList.map(c => c.grade))).sort();
   const filteredClasses = classList.filter(c => selectedGrade === 'All' || c.grade === selectedGrade);
   const uniqueClasses = Array.from(new Set(filteredClasses.map(c => c.className))).sort();
+  // Unique Exam Names for Modal
+  const uniqueExamNames = Array.from(new Set(scores.map(s => s.examName || s.type)));
   return (
     <div className="space-y-6">
        <div className="bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden min-h-[500px]">
           <div className="p-4 md:p-6 border-b border-gray-100">
              <div className="flex flex-col md:flex-row justify-between items-start md:items-center mb-4 gap-4">
                 <h2 className="text-xl font-bold flex items-center text-gray-800"><Award className="mr-2 text-blue-600"/>成绩管理</h2>
+                <div className="grid grid-cols-2 md:flex gap-2 w-full md:w-auto">
+                   <button onClick={() => setIsExamModalOpen(true)} className="col-span-2 md:col-span-1 px-4 py-2 bg-indigo-50 text-indigo-600 border border-indigo-200 rounded-lg flex items-center justify-center text-sm hover:bg-indigo-100 transition-colors">
+                      <Calendar size={16} className="mr-1"/> 考试排期
+                   </button>
+                   <button onClick={() => { setIsImportOpen(true); setImportFile(null); }} className="px-4 py-2 bg-emerald-50 text-emerald-600 border border-emerald-200 rounded-lg flex items-center justify-center text-sm hover:bg-emerald-100 transition-colors">
                       <FileSpreadsheet size={16} className="mr-1"/> Excel导入
                    </button>
+                   <button onClick={() => setIsAddOpen(true)} className="px-4 py-2 bg-blue-600 text-white rounded-lg flex items-center justify-center text-sm hover:bg-blue-700 transition-colors">
                       <Plus size={16} className="mr-1"/> 手动录入
                    </button>
                 </div>
           </div>
        )}
+       {/* Exam Schedule Modal */}
+       {isExamModalOpen && (
+          <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
+             <div className="bg-white rounded-xl p-6 w-full max-w-lg max-h-[80vh] overflow-y-auto">
+                <div className="flex justify-between items-center mb-4">
+                   <h3 className="font-bold text-lg">考试排期管理</h3>
+                   <button onClick={()=>setIsExamModalOpen(false)}><X size={20}/></button>
+                </div>
+                <p className="text-sm text-gray-500 mb-4">设置考试的具体日期，以便生成准确的时间轴趋势图。</p>
+                <div className="space-y-3">
+                   {uniqueExamNames.map((name, idx) => {
+                      const examInfo = exams.find(e => e.name === name);
+                      return (
+                         <div key={idx} className="flex items-center justify-between bg-gray-50 p-3 rounded">
+                            <span className="font-medium text-gray-800">{name}</span>
+                            <input
+                               type="date"
+                               className="border rounded px-2 py-1 text-sm"
+                               value={examInfo?.date || ''}
+                               onChange={(e) => handleUpdateExamDate(name!, e.target.value)}
+                            />
+                         </div>
+                      );
+                   })}
+                   {uniqueExamNames.length === 0 && <p className="text-center text-gray-400 py-4">暂无考试记录</p>}
+                </div>
+                <div className="mt-6 flex justify-end">
+                   <button onClick={()=>setIsExamModalOpen(false)} className="px-4 py-2 bg-blue-600 text-white rounded">完成</button>
+                </div>
+             </div>
+          </div>
+       )}
        {/* Excel Import Modal */}
        {isImportOpen && (
           <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4">
        )}
     </div>
   );
+};

server.js CHANGED Viewed

@@ -28,6 +28,7 @@ const InMemoryDB = {
   scores: [],
   classes: [],
   subjects: [],
   config: {
     systemName: '智慧校园管理系统',
     semester: '2023-2024学年 第一学期',
@@ -115,6 +116,13 @@ const SubjectSchema = new mongoose.Schema({
 });
 const SubjectModel = mongoose.model('Subject', SubjectSchema);
 const ConfigSchema = new mongoose.Schema({
   key: { type: String, default: 'main' },
   systemName: String,
@@ -273,6 +281,27 @@ app.delete('/api/subjects/:id', async (req, res) => {
   } catch (e) { res.status(500).json({ error: e.message }); }
 });
 // --- Batch Operations ---
 app.post('/api/batch-delete', async (req, res) => {
   const { type, ids } = req.body; // type: 'student' | 'score' | 'user'

   scores: [],
   classes: [],
   subjects: [],
+  exams: [],
   config: {
     systemName: '智慧校园管理系统',
     semester: '2023-2024学年 第一学期',
 });
 const SubjectModel = mongoose.model('Subject', SubjectSchema);
+const ExamSchema = new mongoose.Schema({
+  name: { type: String, required: true, unique: true },
+  date: String,
+  semester: String
+});
+const ExamModel = mongoose.model('Exam', ExamSchema);
 const ConfigSchema = new mongoose.Schema({
   key: { type: String, default: 'main' },
   systemName: String,
   } catch (e) { res.status(500).json({ error: e.message }); }
 });
+// --- Exams ---
+app.get('/api/exams', async (req, res) => {
+  if (InMemoryDB.isFallback) return res.json(InMemoryDB.exams);
+  const exams = await ExamModel.find().sort({ date: 1 });
+  res.json(exams);
+});
+app.post('/api/exams', async (req, res) => {
+  try {
+    // Upsert based on name
+    const { name, date, semester } = req.body;
+    if (InMemoryDB.isFallback) {
+      const idx = InMemoryDB.exams.findIndex(e => e.name === name);
+      if (idx >= 0) InMemoryDB.exams[idx] = { ...InMemoryDB.exams[idx], date, semester };
+      else InMemoryDB.exams.push({ name, date, semester, id: Date.now(), _id: String(Date.now()) });
+      return res.json({ success: true });
+    }
+    await ExamModel.findOneAndUpdate({ name }, { date, semester }, { upsert: true });
+    res.json({ success: true });
+  } catch (e) { res.status(500).json({ error: e.message }); }
+});
 // --- Batch Operations ---
 app.post('/api/batch-delete', async (req, res) => {
   const { type, ids } = req.body; // type: 'student' | 'score' | 'user'

services/api.ts CHANGED Viewed

@@ -91,6 +91,11 @@ export const api = {
     delete: (id: string | number) => request(`/subjects/${id}`, { method: 'DELETE' })
   },
   courses: {
     getAll: () => request('/courses'),
     add: (data: any) => request('/courses', { method: 'POST', body: JSON.stringify(data) }),

     delete: (id: string | number) => request(`/subjects/${id}`, { method: 'DELETE' })
   },
+  exams: {
+    getAll: () => request('/exams'),
+    save: (data: any) => request('/exams', { method: 'POST', body: JSON.stringify(data) })
+  },
   courses: {
     getAll: () => request('/courses'),
     add: (data: any) => request('/courses', { method: 'POST', body: JSON.stringify(data) }),

types.ts CHANGED Viewed

@@ -88,6 +88,14 @@ export interface Score {
   status?: ExamStatus; // Default: Normal
 }
 export interface ApiResponse<T> {
   code: number;
   message: string;

   status?: ExamStatus; // Default: Normal
 }
+export interface Exam {
+  id?: number;
+  _id?: string;
+  name: string; // e.g. "期中考试"
+  date: string; // e.g. "2023-11-01"
+  semester?: string;
+}
 export interface ApiResponse<T> {
   code: number;
   message: string;