Upload 44 files

models.js

@@ -1,4 +1,3 @@
-
 const mongoose = require('mongoose');
 
 const SchoolSchema = new mongoose.Schema({ name: String, code: String });
@@ -144,4 +143,4 @@ module.exports = {
     School, User, Student, Course, Score, ClassModel, SubjectModel, ExamModel, ScheduleModel,
     ConfigModel, NotificationModel, GameSessionModel, StudentRewardModel, LuckyDrawConfigModel, GameMonsterConfigModel, GameZenConfigModel,
     AchievementConfigModel, StudentAchievementModel, AttendanceModel, LeaveRequestModel
-};
+};

pages/GameMonster.tsx

@@ -1,316 +1,281 @@
-
-import React, { useState, useEffect, useRef } from 'react';
+import React, { useState, useEffect } from 'react';
 import { api } from '../services/api';
-import { Student, GameMonsterConfig, AchievementItem } from '../types';
-import { Mic, Volume2, Shield, Sword, Heart, Settings, X, Gift, PlayCircle, PauseCircle, Filter, CheckCircle, Loader2 } from 'lucide-react';
+import { Student, GameMonsterConfig, AchievementConfig } from '../types';
+import { Sword, Settings, Loader2, Save, X, Mic, Volume2, Trophy } from 'lucide-react';
 
 export const GameMonster: React.FC = () => {
   const [config, setConfig] = useState<GameMonsterConfig | null>(null);
-  const [isPlaying, setIsPlaying] = useState(false);
-  const [volume, setVolume] = useState(0);
-  const [monsterHp, setMonsterHp] = useState(100);
-  const [students, setStudents] = useState<Student[]>([]);
-  const [achievements, setAchievements] = useState<AchievementItem[]>([]);
-  
+  const [loading, setLoading] = useState(true);
   const [isSettingsOpen, setIsSettingsOpen] = useState(false);
-  const [gameResult, setGameResult] = useState<'WIN' | 'LOSE' | null>(null);
-
-  // Exclusion
-  const [excludedIds, setExcludedIds] = useState<Set<string>>(new Set());
-  const [showFilterModal, setShowFilterModal] = useState(false);
-
-  // Audio Refs
-  const audioContextRef = useRef<AudioContext | null>(null);
-  const analyserRef = useRef<AnalyserNode | null>(null);
-  const microphoneRef = useRef<MediaStreamAudioSourceNode | null>(null);
-  const animationFrameRef = useRef<number | null>(null);
+  
+  // Game State
+  const [hp, setHp] = useState(100);
+  const [monsterState, setMonsterState] = useState<'IDLE' | 'HIT' | 'DEAD'>('IDLE');
+  const [volume, setVolume] = useState(0); // Simulated volume 0-100
+  const [isFighting, setIsFighting] = useState(false);
+  const [students, setStudents] = useState<Student[]>([]);
+  const [achConfig, setAchConfig] = useState<AchievementConfig | null>(null);
 
   const currentUser = api.auth.getCurrentUser();
   const isTeacher = currentUser?.role === 'TEACHER';
+  const homeroomClass = isTeacher ? currentUser?.homeroomClass : (currentUser?.role === 'STUDENT' ? currentUser?.class : '');
+
+  // Simulation Interval for "Microphone" volume
+  useEffect(() => {
+    let interval: any;
+    if (isFighting && monsterState !== 'DEAD') {
+      interval = setInterval(() => {
+        // Simulate volume fluctuation or use real Web Audio API if browser allows without gesture
+        const simulatedVol = Math.random() * 100;
+        setVolume(simulatedVol);
+        
+        // Damage logic based on sensitivity
+        if (config && simulatedVol > (100 - config.sensitivity)) {
+            setHp(prev => {
+                const damage = config.difficulty > 0 ? (simulatedVol / 10) / config.difficulty : 1;
+                const newHp = Math.max(0, prev - damage);
+                if (newHp === 0) setMonsterState('DEAD');
+                else setMonsterState('HIT');
+                return newHp;
+            });
+            setTimeout(() => setMonsterState(prev => prev === 'DEAD' ? 'DEAD' : 'IDLE'), 200);
+        }
+      }, 500);
+    }
+    return () => clearInterval(interval);
+  }, [isFighting, config, monsterState]);
 
   useEffect(() => {
     loadData();
-    return () => stopGame();
   }, []);
 
   const loadData = async () => {
-     if (isTeacher && currentUser.homeroomClass) {
-         try {
-             // Load students
-             const all = await api.students.getAll();
-             setStudents(all.filter((s: Student) => s.className === currentUser.homeroomClass));
-             
-             // Load achievements
-             const ac = await api.achievements.getConfig(currentUser.homeroomClass);
-             if (ac) setAchievements(ac.achievements);
+    if (!homeroomClass) {
+        setLoading(false);
+        return;
+    }
+    try {
+        const [cfg, stus, ac] = await Promise.all([
+            api.games.getMonsterConfig(homeroomClass),
+            api.students.getAll(),
+            api.achievements.getConfig(homeroomClass)
+        ]);
+        
+        const classStudents = stus.filter((s: Student) => s.className === homeroomClass);
+        setStudents(classStudents);
+        setAchConfig(ac);
 
-             // Load Config
-             let cfg = await api.games.getMonsterConfig(currentUser.homeroomClass);
-             if (!cfg) {
-                 cfg = {
-                     schoolId: currentUser.schoolId || '',
-                     className: currentUser.homeroomClass,
-                     duration: 300,
-                     sensitivity: 50,
-                     difficulty: 5,
-                     useKeyboardMode: false,
-                     rewardConfig: { enabled: true, type: 'DRAW_COUNT', val: '1', count: 1 }
-                 };
-             }
-             setConfig(cfg);
-         } catch(e) { console.error(e); }
-     }
+        if (cfg && cfg.className) {
+            setConfig(cfg);
+        } else {
+            // Default Config
+            setConfig({
+                schoolId: currentUser?.schoolId || '',
+                className: homeroomClass,
+                duration: 300,
+                sensitivity: 50,
+                difficulty: 5,
+                useKeyboardMode: false,
+                rewardConfig: {
+                    enabled: true,
+                    type: 'DRAW_COUNT',
+                    val: '1',
+                    count: 1
+                }
+            });
+        }
+    } catch (e) { console.error(e); } 
+    finally { setLoading(false); }
   };
 
-  const startGame = async () => {
-      if (!config) return;
-      try {
-          const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
-          audioContextRef.current = new (window.AudioContext || (window as any).webkitAudioContext)();
-          analyserRef.current = audioContextRef.current.createAnalyser();
-          microphoneRef.current = audioContextRef.current.createMediaStreamSource(stream);
-          microphoneRef.current.connect(analyserRef.current);
-          analyserRef.current.fftSize = 256;
-          
-          setIsPlaying(true);
-          setMonsterHp(100);
-          setGameResult(null);
-          
-          processAudio();
-      } catch (e) {
-          alert('无法访问麦克风，请检查权限');
-      }
+  const handleStart = () => {
+      setHp(100);
+      setMonsterState('IDLE');
+      setIsFighting(true);
   };
 
-  const processAudio = () => {
-      if (!analyserRef.current || !config) return;
-      
-      const dataArray = new Uint8Array(analyserRef.current.frequencyBinCount);
-      analyserRef.current.getByteFrequencyData(dataArray);
-      
-      const avgVolume = dataArray.reduce((a,b) => a+b) / dataArray.length;
-      setVolume(avgVolume); // 0-255
-
-      // Damage Logic
-      // Threshold based on sensitivity (Inverted: higher sensitivity = lower threshold)
-      const threshold = 100 - (config.sensitivity || 50); 
-      
-      if (avgVolume > threshold) {
-          // Damage formula
-          const damage = (avgVolume - threshold) / (config.difficulty * 10);
-          setMonsterHp(prev => {
-              const next = prev - damage;
-              if (next <= 0) {
-                  endGame('WIN');
-                  return 0;
-              }
-              return next;
-          });
-      }
-
-      if (isPlaying && monsterHp > 0) {
-          animationFrameRef.current = requestAnimationFrame(processAudio);
-      }
-  };
-
-  const stopGame = () => {
-      setIsPlaying(false);
-      if (audioContextRef.current) audioContextRef.current.close();
-      if (animationFrameRef.current) cancelAnimationFrame(animationFrameRef.current);
+  const handleStop = () => {
+      setIsFighting(false);
+      setVolume(0);
   };
 
-  const endGame = (result: 'WIN' | 'LOSE') => {
-      stopGame();
-      setGameResult(result);
-      if (result === 'WIN' && config?.rewardConfig?.enabled) {
-          grantBatchReward(config.rewardConfig);
-      }
-  };
+  const handleGrantReward = async () => {
+      if (!config?.rewardConfig.enabled || students.length === 0) return;
+      if (!confirm('怪兽已被击败！确认给全班同学发放奖励吗？')) return;
 
-  const grantBatchReward = async (rewardConfig: any) => {
-      const activeStudents = students.filter(s => !excludedIds.has(s._id || String(s.id)));
-      if (!activeStudents.length) return;
       try {
-          const promises = activeStudents.map(s => {
-              if (rewardConfig.type === 'ACHIEVEMENT') {
+          const promises = students.map(s => {
+              if (config.rewardConfig.type === 'ACHIEVEMENT' && config.rewardConfig.val) {
                   return api.achievements.grant({
                       studentId: s._id || String(s.id),
-                      achievementId: rewardConfig.val,
+                      achievementId: config.rewardConfig.val,
                       semester: '当前学期'
                   });
               } else {
                   return api.games.grantReward({
                       studentId: s._id || String(s.id),
-                      count: rewardConfig.count,
-                      rewardType: rewardConfig.type,
-                      name: rewardConfig.type === 'DRAW_COUNT' ? '早读抽奖券' : rewardConfig.val,
+                      count: config.rewardConfig.count || 1,
+                      rewardType: config.rewardConfig.type,
+                      name: config.rewardConfig.type === 'DRAW_COUNT' ? '早读抽奖券' : config.rewardConfig.val,
                       source: '早读战怪兽'
                   });
               }
           });
           await Promise.all(promises);
-      } catch (e) { console.error(e); }
+          alert('奖励发放成功！');
+          handleStart(); // Reset
+      } catch (e) { alert('发放失败'); }
   };
 
-  const saveSettings = async () => {
-      if (config) {
-          await api.games.saveMonsterConfig(config);
-          setIsSettingsOpen(false);
-      }
+  const saveConfig = async () => {
+      if (config) await api.games.saveMonsterConfig(config);
+      setIsSettingsOpen(false);
   };
 
-  if (!config) return <div className="p-10 text-center"><Loader2 className="animate-spin inline mr-2"/> 加载配置中...</div>;
+  if (loading) return <div className="h-full flex items-center justify-center"><Loader2 className="animate-spin text-blue-600"/></div>;
+  if (!config) return <div className="h-full flex items-center justify-center text-gray-400">无法加载配置 (仅限班级成员)</div>;
 
   return (
-    <div className="h-full flex flex-col relative bg-slate-900 overflow-hidden text-white">
-        {/* Header */}
-        <div className="p-4 flex justify-between items-center z-10">
-            <h3 className="font-bold text-lg flex items-center"><Mic className="mr-2 text-purple-400"/> 早读战怪兽</h3>
-            {isTeacher && (
-                <div className="flex gap-2">
-                    <button onClick={()=>setShowFilterModal(true)} className="bg-white/10 px-3 py-2 rounded text-sm flex items-center hover:bg-white/20">
-                        <Filter size={16} className="mr-1"/> 人员 ({students.length - excludedIds.size})
-                    </button>
-                    <button onClick={()=>setIsSettingsOpen(true)} className="bg-white/10 p-2 rounded hover:bg-white/20">
-                        <Settings size={20}/>
-                    </button>
-                </div>
-            )}
-        </div>
+    <div className="h-full flex flex-col bg-slate-900 text-white overflow-hidden relative">
+        {/* Settings Button */}
+        {isTeacher && (
+            <button 
+                onClick={() => setIsSettingsOpen(true)} 
+                className="absolute top-4 right-4 z-20 p-2 bg-white/10 hover:bg-white/20 rounded-full transition-colors"
+            >
+                <Settings size={20} className="text-white"/>
+            </button>
+        )}
 
-        {/* Game Area */}
+        {/* Main Game Area */}
         <div className="flex-1 flex flex-col items-center justify-center relative">
+            {/* Background Effect */}
+            <div className={`absolute inset-0 transition-opacity duration-100 ${monsterState === 'HIT' ? 'bg-red-500/20' : 'bg-transparent'}`}></div>
+
             {/* Monster */}
-            <div className={`transition-all duration-100 relative ${isPlaying && volume > 50 ? 'animate-pulse scale-105' : ''}`}>
-                 <div className="text-[150px] md:text-[200px] leading-none filter drop-shadow-[0_0_30px_rgba(168,85,247,0.5)]">
-                     {gameResult === 'WIN' ? '💀' : '👾'}
-                 </div>
-                 {/* HP Bar */}
-                 <div className="w-64 h-6 bg-gray-700 rounded-full mt-8 overflow-hidden border-2 border-gray-600 relative">
-                     <div 
-                        className="h-full bg-gradient-to-r from-red-600 to-purple-600 transition-all duration-200"
-                        style={{ width: `${monsterHp}%` }}
-                     ></div>
-                     <span className="absolute inset-0 flex items-center justify-center text-xs font-bold drop-shadow">
-                         BOSS HP: {Math.ceil(monsterHp)}%
-                     </span>
-                 </div>
+            <div className={`relative transition-transform duration-100 ${monsterState === 'HIT' ? 'scale-95 translate-x-2' : 'scale-100'}`}>
+                <div className={`text-9xl filter drop-shadow-[0_0_20px_rgba(255,255,255,0.5)] transition-all duration-500 ${monsterState === 'DEAD' ? 'opacity-0 scale-0 rotate-180' : 'opacity-100'}`}>
+                    👾
+                </div>
+                {/* HP Bar */}
+                <div className="absolute -bottom-12 left-1/2 -translate-x-1/2 w-64 h-6 bg-slate-700 rounded-full overflow-hidden border-2 border-slate-500">
+                    <div 
+                        className={`h-full transition-all duration-200 ${hp > 50 ? 'bg-green-500' : hp > 20 ? 'bg-yellow-500' : 'bg-red-500'}`}
+                        style={{ width: `${hp}%` }}
+                    ></div>
+                </div>
+                <div className="absolute -bottom-20 left-1/2 -translate-x-1/2 text-2xl font-black font-mono">
+                    HP: {Math.ceil(hp)}%
+                </div>
             </div>
 
-            {/* Volume Meter */}
-            <div className="mt-10 flex items-center gap-4">
-                 <Volume2 size={24} className={volume > 30 ? 'text-green-400' : 'text-gray-500'}/>
-                 <div className="w-48 h-2 bg-gray-700 rounded-full overflow-hidden">
-                     <div 
-                        className="h-full bg-green-400 transition-all duration-75"
-                        style={{ width: `${(volume/255)*100}%` }}
-                     ></div>
-                 </div>
-                 <span className="font-mono text-sm">{Math.round(volume)}</span>
-            </div>
-            
-            <p className="mt-4 text-gray-400 text-sm">
-                {isPlaying ? '大声朗读来攻击怪兽！' : '点击开始，全班齐读'}
-            </p>
-            
-            {!isPlaying && !gameResult && (
-                <button onClick={startGame} className="mt-8 bg-purple-600 hover:bg-purple-500 text-white px-8 py-3 rounded-full font-bold text-lg flex items-center shadow-lg hover:scale-105 transition-all">
-                    <PlayCircle className="mr-2"/> 开始挑战
-                </button>
-            )}
-
-            {gameResult === 'WIN' && (
-                <div className="absolute inset-0 bg-black/80 flex flex-col items-center justify-center z-20 animate-in zoom-in">
-                    <div className="text-6xl mb-4">🎉</div>
-                    <h2 className="text-4xl font-black text-yellow-400 mb-4">挑战成功!</h2>
-                    <p className="text-gray-300 mb-8">怪兽已被击败，全班奖励已发放！</p>
-                    <button onClick={() => { setGameResult(null); setMonsterHp(100); }} className="bg-white text-purple-900 px-6 py-2 rounded-full font-bold">再来一次</button>
+            {/* Victory Screen */}
+            {monsterState === 'DEAD' && (
+                <div className="absolute inset-0 flex flex-col items-center justify-center bg-black/60 z-10 animate-in zoom-in">
+                    <Trophy size={80} className="text-yellow-400 mb-4"/>
+                    <h2 className="text-4xl font-bold mb-6 text-yellow-100">怪兽已被击败！</h2>
+                    {isTeacher && (
+                        <button 
+                            onClick={handleGrantReward}
+                            className="bg-yellow-500 hover:bg-yellow-600 text-black px-8 py-3 rounded-full font-bold text-lg shadow-lg flex items-center gap-2 transform hover:scale-105 transition-all"
+                        >
+                            <Trophy size={20}/> 发放全班奖励
+                        </button>
+                    )}
+                    <button onClick={handleStart} className="mt-4 text-slate-400 hover:text-white underline">再来一局</button>
                 </div>
             )}
         </div>
 
-        {/* Filter Modal */}
-        {showFilterModal && (
-            <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4 text-gray-800">
-                <div className="bg-white rounded-xl p-6 w-full max-w-lg h-[80vh] flex flex-col animate-in zoom-in-95">
-                    <div className="flex justify-between items-center mb-4">
-                        <h3 className="font-bold text-lg">参与人员筛选 (不参与奖励)</h3>
-                        <button onClick={()=>setShowFilterModal(false)}><X size={20}/></button>
-                    </div>
-                    <div className="flex-1 overflow-y-auto grid grid-cols-3 gap-2 custom-scrollbar">
-                        {students.map(s => {
-                            const isExcluded = excludedIds.has(s._id || String(s.id));
-                            return (
-                                <div 
-                                    key={s._id} 
-                                    onClick={() => {
-                                        const newSet = new Set(excludedIds);
-                                        const sid = s._id || String(s.id);
-                                        if (newSet.has(sid)) newSet.delete(sid);
-                                        else newSet.add(sid);
-                                        setExcludedIds(newSet);
-                                    }}
-                                    className={`p-2 rounded border cursor-pointer flex items-center justify-between text-sm select-none ${!isExcluded ? 'bg-blue-50 border-blue-300 text-blue-800' : 'bg-gray-100 border-gray-200 text-gray-400'}`}
-                                >
-                                    <span>{s.seatNo ? s.seatNo+'.':''}{s.name}</span>
-                                    {!isExcluded && <CheckCircle size={14}/>}
-                                </div>
-                            );
-                        })}
-                    </div>
-                    <div className="pt-4 border-t mt-2">
-                        <button onClick={()=>setShowFilterModal(false)} className="w-full bg-blue-600 text-white py-2 rounded-lg font-bold">确定</button>
+        {/* Controls */}
+        <div className="h-32 bg-slate-800 border-t border-slate-700 flex items-center justify-between px-8">
+            <div className="flex items-center gap-4">
+                <div className={`p-4 rounded-full ${isFighting ? 'bg-red-500 animate-pulse' : 'bg-slate-600'}`}>
+                    <Mic size={24}/>
+                </div>
+                <div>
+                    <div className="text-xs text-slate-400 uppercase font-bold mb-1">当前音量能量</div>
+                    <div className="flex items-end gap-1 h-10">
+                        {Array.from({length: 10}).map((_, i) => (
+                            <div 
+                                key={i} 
+                                className={`w-3 rounded-t-sm transition-all duration-100 ${i < (volume/10) ? 'bg-green-400' : 'bg-slate-600'}`}
+                                style={{ height: `${i < (volume/10) ? (Math.random()*50 + 50) : 20}%` }}
+                            ></div>
+                        ))}
                     </div>
                 </div>
             </div>
-        )}
+
+            <div className="flex items-center gap-4">
+                {!isFighting && monsterState !== 'DEAD' && (
+                    <button onClick={handleStart} className="bg-blue-600 hover:bg-blue-700 text-white px-8 py-3 rounded-xl font-bold flex items-center gap-2 text-lg shadow-lg shadow-blue-900/50">
+                        <Sword size={20}/> 开始战斗
+                    </button>
+                )}
+                {isFighting && (
+                    <button onClick={handleStop} className="bg-slate-700 hover:bg-slate-600 text-white px-6 py-3 rounded-xl font-bold">
+                        暂停
+                    </button>
+                )}
+            </div>
+        </div>
 
         {/* Settings Modal */}
         {isSettingsOpen && (
-            <div className="fixed inset-0 bg-black/80 z-50 flex items-center justify-center p-4 text-gray-800">
-                <div className="bg-white rounded-xl p-6 w-full max-w-md animate-in zoom-in-95">
+            <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4 text-slate-800">
+                <div className="bg-white rounded-xl w-full max-w-md p-6 shadow-2xl animate-in zoom-in-95">
                     <div className="flex justify-between items-center mb-6">
-                        <h3 className="font-bold text-lg">游戏设置</h3>
-                        <button onClick={()=>setIsSettingsOpen(false)}><X/></button>
+                        <h3 className="text-xl font-bold">游戏设置</h3>
+                        <button onClick={() => setIsSettingsOpen(false)}><X size={24} className="text-gray-400 hover:text-gray-600"/></button>
                     </div>
-                    <div className="space-y-4">
+                    
+                    <div className="space-y-4 mb-6">
                         <div>
-                            <label className="text-xs font-bold text-gray-500 uppercase block mb-1">灵敏度 (更容易造成伤害)</label>
-                            <input type="range" min="1" max="100" className="w-full" value={config.sensitivity} onChange={e=>setConfig({...config, sensitivity: Number(e.target.value)})}/>
+                            <label className="block text-sm font-bold text-gray-700 mb-1">声音灵敏度 (0-100)</label>
+                            <input type="range" min="0" max="90" className="w-full" value={config.sensitivity} onChange={e => setConfig({...config, sensitivity: Number(e.target.value)})}/>
+                            <div className="text-xs text-right text-gray-500">{config.sensitivity} (数值越大越容易触发)</div>
                         </div>
                         <div>
-                            <label className="text-xs font-bold text-gray-500 uppercase block mb-1">怪兽血量 (难度)</label>
-                            <input type="range" min="1" max="20" className="w-full" value={config.difficulty} onChange={e=>setConfig({...config, difficulty: Number(e.target.value)})}/>
+                            <label className="block text-sm font-bold text-gray-700 mb-1">怪兽防御力 (难度)</label>
+                            <input type="number" min="1" max="20" className="w-full border rounded p-2" value={config.difficulty} onChange={e => setConfig({...config, difficulty: Number(e.target.value)})}/>
                         </div>
                         
-                        <div className="bg-gray-50 p-4 rounded-lg border border-gray-200">
-                            <div className="flex items-center justify-between mb-2">
-                                <label className="font-bold text-sm">胜利奖励</label>
-                                <input type="checkbox" checked={config.rewardConfig.enabled} onChange={e=>setConfig({...config, rewardConfig: {...config.rewardConfig, enabled: e.target.checked}})}/>
+                        <div className="border-t pt-4">
+                            <label className="block text-sm font-bold text-gray-700 mb-2">通关奖励设置</label>
+                            <div className="flex items-center gap-2 mb-2">
+                                <input type="checkbox" checked={config.rewardConfig.enabled} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, enabled: e.target.checked}})}/>
+                                <span className="text-sm">启用自动奖励</span>
                             </div>
                             {config.rewardConfig.enabled && (
-                                <div className="space-y-2">
-                                    <div className="flex gap-2">
-                                        <button onClick={()=>setConfig({...config, rewardConfig:{...config.rewardConfig, type:'DRAW_COUNT'}})} className={`flex-1 text-xs py-1.5 rounded border ${config.rewardConfig.type==='DRAW_COUNT'?'bg-blue-50 border-blue-500 text-blue-600':'bg-white'}`}>抽奖券</button>
-                                        <button onClick={()=>setConfig({...config, rewardConfig:{...config.rewardConfig, type:'ACHIEVEMENT'}})} className={`flex-1 text-xs py-1.5 rounded border ${config.rewardConfig.type==='ACHIEVEMENT'?'bg-blue-50 border-blue-500 text-blue-600':'bg-white'}`}>成就</button>
-                                    </div>
+                                <div className="bg-gray-50 p-3 rounded-lg space-y-2 border">
+                                    <select className="w-full border rounded p-2 text-sm" value={config.rewardConfig.type} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, type: e.target.value as any}})}>
+                                        <option value="DRAW_COUNT">🎲 抽奖券</option>
+                                        <option value="ITEM">🎁 物品</option>
+                                        <option value="ACHIEVEMENT">🏆 成就</option>
+                                    </select>
+                                    
                                     {config.rewardConfig.type === 'ACHIEVEMENT' ? (
-                                        <select className="w-full border rounded p-1.5 text-sm" value={config.rewardConfig.val} onChange={e=>setConfig({...config, rewardConfig: {...config.rewardConfig, val: e.target.value}})}>
+                                        <select className="w-full border rounded p-2 text-sm" value={config.rewardConfig.val} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, val: e.target.value}})}>
                                             <option value="">选择成就</option>
-                                            {achievements.map(a=><option key={a.id} value={a.id}>{a.name}</option>)}
+                                            {achConfig?.achievements.map(a => <option key={a.id} value={a.id}>{a.icon} {a.name}</option>)}
                                         </select>
                                     ) : (
-                                        <div className="flex items-center gap-2">
-                                            <span className="text-sm">数量:</span>
-                                            <input type="number" min="1" className="border rounded p-1 w-20" value={config.rewardConfig.count} onChange={e=>setConfig({...config, rewardConfig: {...config.rewardConfig, count: Number(e.target.value)}})}/>
-                                        </div>
+                                        <input className="w-full border rounded p-2 text-sm" placeholder={config.rewardConfig.type === 'ITEM' ? '物品名称' : '备注'} value={config.rewardConfig.val} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, val: e.target.value}})}/>
                                     )}
+                                    
+                                    <div className="flex items-center gap-2">
+                                        <span className="text-sm">数量:</span>
+                                        <input type="number" min="1" className="border rounded p-1 w-16 text-sm" value={config.rewardConfig.count} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, count: Number(e.target.value)}})}/>
+                                    </div>
                                 </div>
                             )}
                         </div>
-                        
-                        <button onClick={saveSettings} className="w-full bg-purple-600 text-white py-2 rounded-lg font-bold hover:bg-purple-700">保存设置</button>
                     </div>
+
+                    <button onClick={saveConfig} className="w-full bg-blue-600 text-white py-2 rounded-lg font-bold hover:bg-blue-700 flex items-center justify-center gap-2">
+                        <Save size={18}/> 保存配置
+                    </button>
                 </div>
             </div>
         )}

pages/GameRandom.tsx

@@ -1,99 +1,202 @@
 
 import React, { useState, useEffect, useRef } from 'react';
+import { createPortal } from 'react-dom';
 import { api } from '../services/api';
-import { Student } from '../types';
-import { Zap, Play, Square, Gift, Users, Check, X, RotateCcw, Filter, CheckCircle } from 'lucide-react';
+import { Student, GameSession, GameTeam, AchievementConfig } from '../types';
+import { Loader2, User, Users, Play, Pause, Gift, CheckCircle, XCircle, Award, Volume2, Settings, Maximize, Minimize, UserX, RotateCcw, Repeat } from 'lucide-react';
 
 export const GameRandom: React.FC = () => {
+  const [loading, setLoading] = useState(true);
   const [students, setStudents] = useState<Student[]>([]);
-  const [selectedStudents, setSelectedStudents] = useState<Student[]>([]);
-  const [isRolling, setIsRolling] = useState(false);
-  const [displayIndex, setDisplayIndex] = useState(0);
-  const [rollCount, setRollCount] = useState(1);
-  const [showRewardModal, setShowRewardModal] = useState(false);
+  const [teams, setTeams] = useState<GameTeam[]>([]);
+  const [achConfig, setAchConfig] = useState<AchievementConfig | null>(null);
   
-  // Exclusion Logic
-  const [excludedIds, setExcludedIds] = useState<Set<string>>(new Set());
-  const [showFilterModal, setShowFilterModal] = useState(false);
+  // Game State
+  const [mode, setMode] = useState<'STUDENT' | 'TEAM'>('STUDENT');
+  const [scopeTeamId, setScopeTeamId] = useState<string>('ALL'); // 'ALL' or specific team ID
+  const [isRunning, setIsRunning] = useState(false);
+  const [highlightIndex, setHighlightIndex] = useState<number | null>(null);
+  const [selectedResult, setSelectedResult] = useState<Student | GameTeam | null>(null);
+  const [showResultModal, setShowResultModal] = useState(false);
+  const [isFullscreen, setIsFullscreen] = useState(false);
 
-  // Reward Form
+  // Filter State
+  const [excludedStudentIds, setExcludedStudentIds] = useState<Set<string>>(new Set());
+  const [isFilterOpen, setIsFilterOpen] = useState(false);
+
+  // Avoid Repetition State
+  const [avoidRepeat, setAvoidRepeat] = useState(false);
+  const [pickedIds, setPickedIds] = useState<Set<string>>(new Set());
+
+  // Reward State
   const [rewardType, setRewardType] = useState<'DRAW_COUNT' | 'ITEM' | 'ACHIEVEMENT'>('DRAW_COUNT');
-  const [rewardName, setRewardName] = useState('随机奖励');
+  const [rewardId, setRewardId] = useState(''); // Achievement ID or Item Name
   const [rewardCount, setRewardCount] = useState(1);
-  const [achieveId, setAchieveId] = useState('');
-  const [achievements, setAchievements] = useState<any[]>([]);
+  const [enableReward, setEnableReward] = useState(true);
+
+  const timerRef = useRef<any>(null);
+  const speedRef = useRef<number>(50);
 
-  const timerRef = useRef<number | null>(null);
   const currentUser = api.auth.getCurrentUser();
-  const isTeacher = currentUser?.role === 'TEACHER';
+  const homeroomClass = currentUser?.homeroomClass;
 
   useEffect(() => {
     loadData();
-    return () => stopRolling();
+    return () => stopAnimation();
   }, []);
 
+  // Clear picked history when switching modes
+  useEffect(() => {
+      setPickedIds(new Set());
+      setHighlightIndex(null);
+  }, [mode]);
+
   const loadData = async () => {
-      try {
-          const all = await api.students.getAll();
-          let list = all;
-          if (isTeacher && currentUser.homeroomClass) {
-              list = all.filter((s: Student) => s.className === currentUser.homeroomClass);
-              // Load achievements for reward dropdown
-              const ac = await api.achievements.getConfig(currentUser.homeroomClass);
-              if (ac) setAchievements(ac.achievements);
-          }
-          setStudents(list);
-      } catch(e) { console.error(e); }
+    if (!homeroomClass) return setLoading(false);
+    try {
+      const [allStus, session, ac] = await Promise.all([
+        api.students.getAll(),
+        api.games.getMountainSession(homeroomClass),
+        api.achievements.getConfig(homeroomClass)
+      ]);
+
+      const classStudents = allStus.filter((s: Student) => s.className === homeroomClass);
+      // Sort by Seat No
+      classStudents.sort((a: Student, b: Student) => {
+          const seatA = parseInt(a.seatNo || '99999');
+          const seatB = parseInt(b.seatNo || '99999');
+          if (seatA !== seatB) return seatA - seatB;
+          return a.name.localeCompare(b.name, 'zh-CN');
+      });
+
+      setStudents(classStudents);
+      if (session) setTeams(session.teams || []);
+      setAchConfig(ac);
+    } catch (e) { console.error(e); } 
+    finally { setLoading(false); }
   };
 
-  const getActiveStudents = () => students.filter(s => !excludedIds.has(s._id || String(s.id)));
+  const getTargetList = () => {
+      if (mode === 'TEAM') {
+          let tList = teams;
+          if (avoidRepeat) {
+              tList = tList.filter(t => !pickedIds.has(t.id));
+          }
+          return tList;
+      }
+      
+      let baseList = students;
+      if (scopeTeamId !== 'ALL') {
+          const team = teams.find(t => t.id === scopeTeamId);
+          if (team) {
+              baseList = students.filter(s => team.members.includes(s._id || String(s.id)));
+          }
+      }
+      
+      // Filter out excluded students (Attendance)
+      let list = baseList.filter(s => !excludedStudentIds.has(s._id || String(s.id)));
+
+      // Filter out picked students (Avoid Repetition)
+      if (avoidRepeat) {
+          list = list.filter(s => !pickedIds.has(s._id || String(s.id)));
+      }
 
-  const startRolling = () => {
-      const active = getActiveStudents();
-      if (active.length === 0) return alert('没有参与的学生');
-      setIsRolling(true);
-      setSelectedStudents([]);
+      return list;
+  };
+
+  const startRandom = () => {
+      const list = getTargetList();
+      if (list.length === 0) {
+          if (avoidRepeat && pickedIds.size > 0) return alert('所有对象都已点过名，请点击“重置”按钮重新开始。');
+          return alert('当前范围内没有可选对象');
+      }
+      
+      setIsRunning(true);
+      setShowResultModal(false);
+      setSelectedResult(null);
+      speedRef.current = 50;
       
-      let speed = 50;
-      const animate = () => {
-          setDisplayIndex(Math.floor(Math.random() * active.length));
-          timerRef.current = window.setTimeout(animate, speed);
+      const run = () => {
+          setHighlightIndex(prev => {
+              const next = (prev === null || prev >= list.length - 1) ? 0 : prev + 1;
+              return next;
+          });
+          
+          // Slow down logic
+          speedRef.current = Math.min(speedRef.current * 1.1, 600);
+          
+          if (speedRef.current < 500) {
+              timerRef.current = setTimeout(run, speedRef.current);
+          } else {
+              // Stop
+              stopAnimation();
+              // IMPORTANT: The highlightIndex corresponds to the *filtered* list, not the original data
+              setTimeout(() => finalizeSelection(list), 500);
+          }
       };
-      animate();
+      run();
   };
 
-  const stopRolling = () => {
-      if (timerRef.current) {
-          clearTimeout(timerRef.current);
-          timerRef.current = null;
-      }
-      if (isRolling) {
-          setIsRolling(false);
-          const active = getActiveStudents();
-          // Pick unique randoms
-          const picked = new Set<number>();
-          const results: Student[] = [];
+  const finalizeSelection = (list: any[]) => {
+      setHighlightIndex(prev => {
+          if (prev === null) return 0;
+          const result = list[prev];
+          setSelectedResult(result);
           
-          while(results.length < Math.min(rollCount, active.length)) {
-              const idx = Math.floor(Math.random() * active.length);
-              if (!picked.has(idx)) {
-                  picked.add(idx);
-                  results.push(active[idx]);
-              }
+          // Mark as picked
+          if (avoidRepeat) {
+              const id = mode === 'TEAM' ? (result as GameTeam).id : (result as Student)._id || String((result as Student).id);
+              setPickedIds(prevSet => new Set(prevSet).add(id));
           }
-          setSelectedStudents(results);
+
+          setShowResultModal(true);
+          return prev;
+      });
+  };
+
+  const stopAnimation = () => {
+      if (timerRef.current) clearTimeout(timerRef.current);
+      setIsRunning(false);
+  };
+
+  const resetPicked = () => {
+      if (confirm('确定要清空已点名记录，重新开始吗？')) {
+          setPickedIds(new Set());
       }
   };
 
   const handleGrantReward = async () => {
-      if (selectedStudents.length === 0) return;
-      
+      if (!selectedResult || !enableReward) {
+          setShowResultModal(false);
+          return;
+      }
+
+      let targets: Student[] = [];
+      if (mode === 'STUDENT') {
+          targets = [selectedResult as Student];
+      } else {
+          // Team mode: find all students in team
+          const team = selectedResult as GameTeam;
+          // IMPORTANT: Exclude absent students from team reward
+          targets = students.filter(s => team.members.includes(s._id || String(s.id)) && !excludedStudentIds.has(s._id || String(s.id)));
+      }
+
+      if (targets.length === 0) {
+          alert('没有符合条件的学生可发放奖励');
+          setShowResultModal(false);
+          return;
+      }
+
+      const rewardName = rewardType === 'ACHIEVEMENT' 
+          ? achConfig?.achievements.find(a => a.id === rewardId)?.name 
+          : (rewardId || (rewardType === 'DRAW_COUNT' ? '抽奖券' : '奖励'));
+
       try {
-          const promises = selectedStudents.map(s => {
-              if (rewardType === 'ACHIEVEMENT') {
+          const promises = targets.map(s => {
+              if (rewardType === 'ACHIEVEMENT' && rewardId) {
                   return api.achievements.grant({
                       studentId: s._id || String(s.id),
-                      achievementId: achieveId,
+                      achievementId: rewardId,
                       semester: '当前学期' // Ideally fetch from config
                   });
               } else {
@@ -107,153 +210,219 @@ export const GameRandom: React.FC = () => {
               }
           });
           await Promise.all(promises);
-          alert(`已发放奖励给 ${selectedStudents.length} 名学生！`);
-          setShowRewardModal(false);
+          alert(`已发放奖励给 ${targets.length} 名学生！`);
       } catch (e) {
+          console.error(e);
           alert('发放失败');
       }
+      setShowResultModal(false);
   };
 
-  const activePool = getActiveStudents();
+  if (loading) return <div className="h-full flex items-center justify-center"><Loader2 className="animate-spin text-blue-600"/></div>;
+
+  const targetList = getTargetList();
 
-  return (
-    <div className="h-full flex flex-col relative overflow-hidden bg-gradient-to-br from-yellow-50 to-orange-50">
-        <div className="p-6 border-b border-yellow-100 flex justify-between items-center bg-white/50 backdrop-blur-sm">
-            <h3 className="text-xl font-bold text-gray-800 flex items-center"><Zap className="text-yellow-500 mr-2" fill="currentColor"/> 随机点名</h3>
-            {isTeacher && (
-                <div className="flex items-center gap-2">
-                    <button onClick={()=>setShowFilterModal(true)} className="px-3 py-1.5 bg-white border border-gray-200 rounded-lg text-sm text-gray-600 flex items-center hover:bg-gray-50">
-                        <Filter size={16} className="mr-1"/> 人员 ({activePool.length}/{students.length})
+  const GameContent = (
+    <div className={`${isFullscreen ? 'fixed inset-0 z-[9999] w-screen h-screen' : 'h-full w-full relative'} flex flex-col bg-slate-50 overflow-hidden transition-all duration-300`}>
+        {/* Floating Fullscreen Toggle Button */}
+        <button 
+            onClick={() => setIsFullscreen(!isFullscreen)} 
+            className={`absolute top-4 right-4 z-50 p-2 rounded-lg shadow-md transition-all flex items-center gap-2 ${
+                isFullscreen 
+                ? 'bg-slate-800/80 text-white hover:bg-slate-700 backdrop-blur-md border border-white/20' 
+                : 'bg-white text-gray-600 hover:bg-gray-100 border border-gray-200'
+            }`}
+            title={isFullscreen ? "退出全屏" : "全屏显示"}
+        >
+            {isFullscreen ? <Minimize size={20}/> : <Maximize size={20}/>}
+            <span className="text-xs font-bold hidden sm:inline">{isFullscreen ? '退出全屏' : '全屏模式'}</span>
+        </button>
+        {/* Header Config */}
+        <div className="bg-white p-4 shadow-sm border-b border-gray-200 z-10 flex flex-wrap gap-4 items-center justify-between shrink-0 pr-36">
+            <div className="flex flex-wrap gap-4 items-center">
+                <div className="flex gap-2 bg-gray-100 p-1 rounded-lg">
+                    <button onClick={()=>{setMode('STUDENT'); setHighlightIndex(null);}} className={`px-4 py-2 rounded-md text-sm font-bold transition-all ${mode==='STUDENT'?'bg-white shadow text-blue-600':'text-gray-500'}`}>
+                        <User size={16} className="inline mr-1"/> 点名学生
+                    </button>
+                    <button onClick={()=>{setMode('TEAM'); setHighlightIndex(null);}} className={`px-4 py-2 rounded-md text-sm font-bold transition-all ${mode==='TEAM'?'bg-white shadow text-purple-600':'text-gray-500'}`}>
+                        <Users size={16} className="inline mr-1"/> 随机小组
                     </button>
-                    <div className="flex items-center gap-2 border-l pl-3 ml-1 border-gray-200">
-                        <span className="text-sm font-bold text-gray-500">抽取:</span>
-                        <select className="border rounded-lg p-1 text-sm font-bold bg-white outline-none focus:ring-2 focus:ring-yellow-400" value={rollCount} onChange={e=>setRollCount(Number(e.target.value))}>
-                            {[1,2,3,4,5,10].map(n=><option key={n} value={n}>{n}人</option>)}
-                        </select>
-                    </div>
                 </div>
-            )}
-        </div>
+                {mode === 'STUDENT' && (
+                    <select className="border border-gray-300 rounded-lg px-3 py-2 text-sm bg-white outline-none focus:ring-2 focus:ring-blue-500" value={scopeTeamId} onChange={e=>setScopeTeamId(e.target.value)}>
+                        <option value="ALL">全班范围</option>
+                        {teams.map(t => <option key={t.id} value={t.id}>{t.name} (组)</option>)}
+                    </select>
+                )}
+                
+                <button 
+                    onClick={() => setIsFilterOpen(true)} 
+                    className={`flex items-center gap-1 px-3 py-2 rounded-lg text-sm border font-medium ${excludedStudentIds.size > 0 ? 'bg-red-50 text-red-600 border-red-200' : 'bg-gray-50 text-gray-600 border-gray-200'}`}
+                >
+                    <UserX size={16}/> 排除 ({excludedStudentIds.size})
+                </button>
 
-        <div className="flex-1 flex flex-col items-center justify-center p-8">
-            {isRolling ? (
-                 <div className="text-9xl font-black text-transparent bg-clip-text bg-gradient-to-r from-yellow-500 to-red-500 animate-pulse transition-all duration-75">
-                     {activePool[displayIndex]?.name || '???'}
-                 </div>
-            ) : selectedStudents.length > 0 ? (
-                 <div className="flex flex-wrap gap-6 justify-center max-w-4xl animate-in zoom-in duration-300">
-                     {selectedStudents.map(s => (
-                         <div key={s._id} className="bg-white p-6 rounded-2xl shadow-xl border-4 border-yellow-400 transform hover:scale-105 transition-transform flex flex-col items-center">
-                             <div className="text-4xl font-bold text-gray-800 mb-2">{s.name}</div>
-                             <div className="text-gray-400 text-sm font-mono">{s.seatNo ? `${s.seatNo}号` : ''}</div>
-                         </div>
-                     ))}
-                 </div>
-            ) : (
-                 <div className="text-center text-gray-400">
-                     <Users size={64} className="mx-auto mb-4 opacity-20"/>
-                     <p className="text-xl">准备好开始了吗？</p>
-                 </div>
-            )}
-        </div>
+                <div className="h-8 w-px bg-gray-200 mx-2"></div>
 
-        {isTeacher && (
-            <div className="p-8 flex justify-center gap-4">
-                {!isRolling ? (
-                    <>
-                        <button onClick={startRolling} disabled={activePool.length===0} className="bg-blue-600 text-white px-8 py-3 rounded-full font-bold text-lg shadow-lg hover:bg-blue-700 hover:scale-105 transition-all flex items-center disabled:opacity-50">
-                            <Play className="mr-2" fill="currentColor"/> 开始点名
-                        </button>
-                        {selectedStudents.length > 0 && (
-                             <button onClick={() => setShowRewardModal(true)} className="bg-amber-500 text-white px-8 py-3 rounded-full font-bold text-lg shadow-lg hover:bg-amber-600 hover:scale-105 transition-all flex items-center">
-                                 <Gift className="mr-2"/> 发放奖励
-                             </button>
-                        )}
-                    </>
-                ) : (
-                    <button onClick={stopRolling} className="bg-red-500 text-white px-10 py-3 rounded-full font-bold text-lg shadow-lg hover:bg-red-600 hover:scale-105 transition-all flex items-center">
-                        <Square className="mr-2" fill="currentColor"/> 停止
+                <button 
+                    onClick={() => setAvoidRepeat(!avoidRepeat)} 
+                    className={`flex items-center gap-1 px-3 py-2 rounded-lg text-sm border font-medium transition-colors ${avoidRepeat ? 'bg-indigo-50 text-indigo-600 border-indigo-200' : 'bg-white text-gray-500 border-gray-200 hover:bg-gray-50'}`}
+                >
+                    <Repeat size={16} className={avoidRepeat ? '' : 'text-gray-400'}/> {avoidRepeat ? '不重复点名' : '允许重复'}
+                </button>
+
+                {avoidRepeat && pickedIds.size > 0 && (
+                    <button 
+                        onClick={resetPicked} 
+                        className="flex items-center gap-1 px-3 py-2 rounded-lg text-sm font-medium text-gray-500 hover:text-red-500 hover:bg-red-50 transition-colors"
+                        title="清空已点名记录"
+                    >
+                        <RotateCcw size={14}/> 重置 ({pickedIds.size})
                     </button>
                 )}
+
+                <div className="h-8 w-px bg-gray-200 mx-2"></div>
+
+                <div className="flex items-center gap-2 bg-amber-50 px-3 py-2 rounded-lg border border-amber-100">
+                    <Gift size={16} className="text-amber-500"/>
+                    <label className="text-sm font-bold text-gray-700">奖励:</label>
+                    <select className="text-sm border-gray-300 rounded bg-white outline-none" value={rewardType} onChange={e=>setRewardType(e.target.value as any)}>
+                        <option value="DRAW_COUNT">抽奖券</option>
+                        <option value="ITEM">实物</option>
+                        <option value="ACHIEVEMENT">成就</option>
+                    </select>
+                    {rewardType === 'ACHIEVEMENT' ? (
+                        <select className="text-sm border-gray-300 rounded w-32 bg-white outline-none" value={rewardId} onChange={e=>setRewardId(e.target.value)}>
+                            <option value="">选择成就</option>
+                            {achConfig?.achievements.map(a => <option key={a.id} value={a.id}>{a.icon} {a.name}</option>)}
+                        </select>
+                    ) : rewardType === 'ITEM' ? (
+                        <input className="text-sm border-gray-300 rounded w-24 p-1 outline-none" placeholder="奖品名" value={rewardId} onChange={e=>setRewardId(e.target.value)}/>
+                    ) : null}
+                    <span className="text-xs text-gray-400">x</span>
+                    <input type="number" min={1} className="w-12 text-sm border-gray-300 rounded p-1 text-center outline-none" value={rewardCount} onChange={e=>setRewardCount(Number(e.target.value))}/>
+                </div>
             </div>
-        )}
+        </div>
+        {/* Grid Area */}
+        <div className="flex-1 overflow-y-auto p-6 custom-scrollbar bg-slate-50">
+            <div className={`grid gap-4 transition-all pb-24 ${mode==='STUDENT' ? (isFullscreen ? 'grid-cols-6 sm:grid-cols-8 md:grid-cols-10 lg:grid-cols-12' : 'grid-cols-4 sm:grid-cols-6 md:grid-cols-8 lg:grid-cols-10') : 'grid-cols-2 md:grid-cols-3 lg:grid-cols-4'}`}>
+                {targetList.map((item, idx) => {
+                    const isHighlighted = idx === highlightIndex;
+                    const isTeam = mode === 'TEAM';
+                    // @ts-ignore
+                    const name = isTeam ? item.name : item.name;
+                    // @ts-ignore
+                    const avatar = isTeam ? (item.avatar || '🚩') : (item.seatNo || 'User');
+                    // @ts-ignore
+                    const subText = isTeam ? `${item.members.length}人` : item.studentNo;
+                    // @ts-ignore
+                    const color = isTeam ? (item.color || '#3b82f6') : '#3b82f6';
+                    return (
+                        <div key={idx} className={`relative aspect-square flex flex-col items-center justify-center rounded-2xl border-4 transition-all duration-100 ${
+                            isHighlighted 
+                            ? 'bg-yellow-100 border-yellow-400 scale-110 shadow-2xl z-10' 
+                            : 'bg-white border-gray-100 shadow-sm opacity-80'
+                        }`}>
+                            {isHighlighted && <div className="absolute inset-0 bg-yellow-400 opacity-20 animate-pulse rounded-xl"></div>}
+                            <div className={`mb-2 font-bold ${isFullscreen ? 'text-5xl' : 'text-3xl'}`} style={{color: isTeam ? color : '#64748b'}}>
+                                {mode === 'STUDENT' ? (
+                                    <div className={`rounded-full bg-blue-100 flex items-center justify-center text-blue-600 ${isFullscreen ? 'w-24 h-24 text-4xl' : 'w-12 h-12 text-lg'}`}>
+                                        {name[0]}
+                                    </div>
+                                ) : avatar}
+                            </div>
+                            <div className={`font-bold text-gray-800 text-center truncate w-full px-2 ${isFullscreen ? 'text-2xl' : 'text-base'}`}>{name}</div>
+                            <div className="text-xs text-gray-400">{subText}</div>
+                        </div>
+                    );
+                })}
+            </div>
+        </div>
+        {/* Start Button */}
+        <div className="absolute bottom-0 left-0 right-0 p-6 flex justify-center bg-white/90 backdrop-blur-sm border-t border-gray-200 z-10 shadow-[0_-4px_10px_-1px_rgba(0,0,0,0.1)]">
+            <button 
+                onClick={isRunning ? stopAnimation : startRandom} 
+                className={`px-12 py-4 rounded-full text-xl font-black text-white shadow-lg transition-all transform active:scale-95 flex items-center gap-3 ${isRunning ? 'bg-red-500 hover:bg-red-600' : 'bg-blue-600 hover:bg-blue-700'}`}
+            >
+                {isRunning ? <><Pause fill="white"/> 停止</> : <><Play fill="white"/> 开始随机</>}
+            </button>
+        </div>
 
-        {/* Filter Modal */}
-        {showFilterModal && (
-            <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 h-[80vh] flex flex-col animate-in zoom-in-95">
-                    <div className="flex justify-between items-center mb-4">
-                        <h3 className="font-bold text-lg">参与人员筛选</h3>
-                        <button onClick={()=>setShowFilterModal(false)}><X size={20}/></button>
-                    </div>
-                    <div className="bg-gray-50 p-2 rounded mb-2 text-xs text-gray-500">
-                        取消勾选的学生将不会被点到。适用于请假或缺勤的学生。
+        {/* Student Filter Modal */}
+        {isFilterOpen && (
+            <div className="absolute inset-0 bg-black/50 z-[1000000] flex items-center justify-center p-4">
+                <div className="bg-white rounded-xl w-full max-w-3xl h-[80vh] flex flex-col shadow-2xl animate-in zoom-in-95 text-gray-800">
+                    <div className="p-4 border-b flex justify-between items-center">
+                        <h3 className="font-bold text-lg">排除请假/缺勤学生</h3>
+                        <div className="flex gap-2">
+                            <button onClick={() => setExcludedStudentIds(new Set())} className="text-xs text-blue-600 hover:underline">清空选择</button>
+                            <button onClick={() => setIsFilterOpen(false)} className="px-4 py-1 bg-blue-600 text-white rounded text-sm">确定</button>
+                        </div>
                     </div>
-                    <div className="flex-1 overflow-y-auto grid grid-cols-3 gap-2 custom-scrollbar">
-                        {students.map(s => {
-                            const isExcluded = excludedIds.has(s._id || String(s.id));
-                            return (
-                                <div 
-                                    key={s._id} 
-                                    onClick={() => {
-                                        const newSet = new Set(excludedIds);
-                                        const sid = s._id || String(s.id);
-                                        if (newSet.has(sid)) newSet.delete(sid);
-                                        else newSet.add(sid);
-                                        setExcludedIds(newSet);
-                                    }}
-                                    className={`p-2 rounded border cursor-pointer flex items-center justify-between text-sm select-none ${!isExcluded ? 'bg-blue-50 border-blue-300 text-blue-800' : 'bg-gray-100 border-gray-200 text-gray-400'}`}
-                                >
-                                    <span>{s.seatNo ? s.seatNo+'.':''}{s.name}</span>
-                                    {!isExcluded && <CheckCircle size={14}/>}
-                                </div>
-                            );
-                        })}
-                    </div>
-                    <div className="pt-4 border-t mt-2 flex justify-between items-center">
-                        <span className="text-sm text-gray-500">已排除 {excludedIds.size} 人</span>
-                        <button onClick={()=>setShowFilterModal(false)} className="bg-blue-600 text-white px-6 py-2 rounded-lg text-sm font-bold">确定</button>
+                    <div className="flex-1 overflow-y-auto p-4 bg-gray-50">
+                        <div className="grid grid-cols-4 sm:grid-cols-5 md:grid-cols-6 gap-2">
+                            {students.map(s => {
+                                const isExcluded = excludedStudentIds.has(s._id || String(s.id));
+                                return (
+                                    <div 
+                                        key={s._id} 
+                                        onClick={() => {
+                                            const newSet = new Set(excludedStudentIds);
+                                            if (isExcluded) newSet.delete(s._id || String(s.id));
+                                            else newSet.add(s._id || String(s.id));
+                                            setExcludedStudentIds(newSet);
+                                        }}
+                                        className={`p-2 rounded border cursor-pointer text-center text-sm transition-all select-none ${isExcluded ? 'bg-red-50 border-red-300 text-red-500 opacity-60' : 'bg-white border-gray-200 hover:border-blue-300'}`}
+                                    >
+                                        <div className="font-bold">{s.name}</div>
+                                        <div className="text-xs opacity-70">{s.seatNo}</div>
+                                        {isExcluded && <div className="text-[10px] font-bold mt-1">已排除</div>}
+                                    </div>
+                                )
+                            })}
+                        </div>
                     </div>
                 </div>
             </div>
         )}
 
-        {/* Reward Modal */}
-        {showRewardModal && (
-            <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-sm animate-in zoom-in-95">
-                    <h3 className="font-bold text-lg mb-4 text-gray-800">给幸运儿发放奖励</h3>
-                    <div className="space-y-4">
-                         <div>
-                             <label className="text-xs font-bold text-gray-500 uppercase block mb-1">奖励类型</label>
-                             <div className="flex bg-gray-100 p-1 rounded-lg">
-                                 <button onClick={()=>setRewardType('DRAW_COUNT')} className={`flex-1 py-1.5 rounded text-xs font-bold ${rewardType==='DRAW_COUNT'?'bg-white shadow text-blue-600':'text-gray-500'}`}>抽奖券</button>
-                                 <button onClick={()=>setRewardType('ITEM')} className={`flex-1 py-1.5 rounded text-xs font-bold ${rewardType==='ITEM'?'bg-white shadow text-blue-600':'text-gray-500'}`}>实物</button>
-                                 <button onClick={()=>setRewardType('ACHIEVEMENT')} className={`flex-1 py-1.5 rounded text-xs font-bold ${rewardType==='ACHIEVEMENT'?'bg-white shadow text-blue-600':'text-gray-500'}`}>成就</button>
-                             </div>
-                         </div>
-                         
-                         {rewardType === 'ACHIEVEMENT' ? (
-                             <select className="w-full border p-2 rounded" value={achieveId} onChange={e=>setAchieveId(e.target.value)}>
-                                 <option value="">-- 选择成就 --</option>
-                                 {achievements.map(a => <option key={a.id} value={a.id}>{a.icon} {a.name}</option>)}
-                             </select>
-                         ) : (
-                             <input className="w-full border p-2 rounded" placeholder="奖励名称" value={rewardName} onChange={e=>setRewardName(e.target.value)}/>
-                         )}
-
-                         {rewardType !== 'ACHIEVEMENT' && (
-                             <input type="number" className="w-full border p-2 rounded" placeholder="数量" min={1} value={rewardCount} onChange={e=>setRewardCount(Number(e.target.value))}/>
-                         )}
-
-                         <div className="flex gap-2">
-                             <button onClick={handleGrantReward} className="flex-1 bg-amber-500 text-white py-2 rounded font-bold hover:bg-amber-600">确认发放</button>
-                             <button onClick={()=>setShowRewardModal(false)} className="flex-1 bg-gray-100 py-2 rounded text-gray-600">取消</button>
-                         </div>
+        {/* Result Modal */}
+        {showResultModal && selectedResult && (
+            <div className="fixed inset-0 bg-black/60 z-[110] flex items-center justify-center p-4 backdrop-blur-sm animate-in fade-in">
+                <div className="bg-white rounded-3xl p-8 w-full max-w-md text-center shadow-2xl relative animate-in zoom-in-95">
+                    <div className="absolute -top-12 left-1/2 -translate-x-1/2 w-24 h-24 bg-yellow-400 rounded-full flex items-center justify-center border-4 border-white shadow-lg">
+                        <span className="text-5xl">✨</span>
+                    </div>
+                    
+                    <h2 className="mt-10 text-gray-500 text-sm font-bold uppercase tracking-widest">选中对象</h2>
+                    <div className="text-5xl font-black text-gray-800 my-6">
+                        {/* @ts-ignore */}
+                        {selectedResult.name}
                     </div>
+                    {/* @ts-ignore */}
+                    <div className="text-gray-400 mb-8">{mode==='STUDENT' ? `座号: ${selectedResult.seatNo || '-'}` : `${selectedResult.members.length} 位成员`}</div>
+                    <div className="grid grid-cols-2 gap-4 mb-4">
+                        <button onClick={() => { setEnableReward(true); handleGrantReward(); }} className="bg-green-500 hover:bg-green-600 text-white py-4 rounded-2xl font-bold text-lg flex flex-col items-center justify-center shadow-md transition-transform hover:-translate-y-1">
+                            <CheckCircle size={32} className="mb-1"/>
+                            回答正确
+                            <span className="text-xs font-normal opacity-80 mt-1">发放奖励</span>
+                        </button>
+                        <button onClick={() => { setEnableReward(false); handleGrantReward(); }} className="bg-gray-100 hover:bg-gray-200 text-gray-600 py-4 rounded-2xl font-bold text-lg flex flex-col items-center justify-center shadow-sm transition-transform hover:-translate-y-1">
+                            <XCircle size={32} className="mb-1"/>
+                            回答错误
+                            <span className="text-xs font-normal opacity-80 mt-1">无奖励</span>
+                        </button>
+                    </div>
+                    <button onClick={() => setShowResultModal(false)} className="text-gray-400 hover:text-gray-600 text-sm underline">跳过 / 关闭</button>
                 </div>
             </div>
         )}
     </div>
   );
+
+  if (isFullscreen) {
+      return createPortal(GameContent, document.body);
+  }
+  return GameContent;
 };

pages/GameZen.tsx

@@ -1,410 +1,276 @@
-
 import React, { useState, useEffect, useRef } from 'react';
 import { api } from '../services/api';
-import { Student, AchievementItem } from '../types';
-import { Moon, Settings, X, Play, Volume2, CheckCircle, Filter, Trophy, Zap, CloudRain, Wind } from 'lucide-react';
+import { Student, GameZenConfig, AchievementConfig } from '../types';
+import { Moon, Play, Square, Settings, Save, X, Loader2, Clock, CheckCircle } from 'lucide-react';
 
-export const GameZen: React.FC = () => {
-  const [config, setConfig] = useState<any>(null);
-  const [isPlaying, setIsPlaying] = useState(false);
-  const [volume, setVolume] = useState(0); // Smoothed Volume
-  const [gameTime, setGameTime] = useState(0); // Ms elapsed
-  const [quietTime, setQuietTime] = useState(0); // Ms in quiet state
-  const [startTime, setStartTime] = useState(0);
-  const [gameResult, setGameResult] = useState<'SUCCESS' | 'FAIL' | null>(null);
+const formatTime = (seconds: number) => {
+    const mins = Math.floor(seconds / 60);
+    const secs = seconds % 60;
+    return `${mins.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
+};
 
-  const [students, setStudents] = useState<Student[]>([]);
-  const [achievements, setAchievements] = useState<AchievementItem[]>([]);
+export const GameZen: React.FC = () => {
+  const [config, setConfig] = useState<GameZenConfig | null>(null);
+  const [loading, setLoading] = useState(true);
   const [isSettingsOpen, setIsSettingsOpen] = useState(false);
-  
-  // Exclusion
-  const [excludedIds, setExcludedIds] = useState<Set<string>>(new Set());
-  const [showFilterModal, setShowFilterModal] = useState(false);
+  const [students, setStudents] = useState<Student[]>([]);
+  const [achConfig, setAchConfig] = useState<AchievementConfig | null>(null);
 
-  // Audio & State Refs
-  const audioContextRef = useRef<AudioContext | null>(null);
-  const analyserRef = useRef<AnalyserNode | null>(null);
-  const microphoneRef = useRef<MediaStreamAudioSourceNode | null>(null);
-  const animationFrameRef = useRef<number | null>(null);
-  const smoothedVolRef = useRef(0);
-  const lastTimeRef = useRef(0);
+  // Game State
+  const [timeLeft, setTimeLeft] = useState(0);
+  const [isActive, setIsActive] = useState(false);
+  const [isFinished, setIsFinished] = useState(false);
+  
+  const timerRef = useRef<any>(null);
 
   const currentUser = api.auth.getCurrentUser();
   const isTeacher = currentUser?.role === 'TEACHER';
-
-  // 4 States: 0=Deep(Quiet), 1=Focused, 2=Restless, 3=Chaos
-  const [zenState, setZenState] = useState(0);
+  const homeroomClass = isTeacher ? currentUser?.homeroomClass : (currentUser?.role === 'STUDENT' ? currentUser?.class : '');
 
   useEffect(() => {
     loadData();
-    return () => stopGame();
+    return () => clearInterval(timerRef.current);
   }, []);
 
   const loadData = async () => {
-    if (isTeacher && currentUser.homeroomClass) {
-        try {
-            const all = await api.students.getAll();
-            setStudents(all.filter((s: Student) => s.className === currentUser.homeroomClass));
-            
-            const ac = await api.achievements.getConfig(currentUser.homeroomClass);
-            if (ac) setAchievements(ac.achievements);
-
-            let cfg = await api.games.getZenConfig(currentUser.homeroomClass);
-            if (!cfg) {
-                cfg = {
-                    schoolId: currentUser.schoolId || '',
-                    className: currentUser.homeroomClass,
-                    durationMinutes: 40,
-                    threshold: 30, 
-                    passRate: 90,
-                    rewardConfig: { enabled: true, type: 'DRAW_COUNT', val: '1', count: 1 }
-                };
-            }
-            setConfig(cfg);
-        } catch(e) { console.error(e); }
+    if (!homeroomClass) {
+        setLoading(false);
+        return;
     }
+    try {
+        const [cfg, stus, ac] = await Promise.all([
+            api.games.getZenConfig(homeroomClass),
+            api.students.getAll(),
+            api.achievements.getConfig(homeroomClass)
+        ]);
+        
+        const classStudents = stus.filter((s: Student) => s.className === homeroomClass);
+        setStudents(classStudents);
+        setAchConfig(ac);
+
+        if (cfg && cfg.className) {
+            setConfig(cfg);
+            setTimeLeft(cfg.durationMinutes * 60);
+        } else {
+            // Default Config
+            const defaultCfg = {
+                schoolId: currentUser?.schoolId || '',
+                className: homeroomClass,
+                durationMinutes: 40,
+                threshold: 30, // unused in simple mode
+                passRate: 90, // unused
+                rewardConfig: {
+                    enabled: true,
+                    type: 'DRAW_COUNT' as any,
+                    val: '1',
+                    count: 1
+                }
+            };
+            setConfig(defaultCfg);
+            setTimeLeft(40 * 60);
+        }
+    } catch (e) { console.error(e); } 
+    finally { setLoading(false); }
   };
 
-  const startGame = async () => {
-      if (!config) return;
-      try {
-          const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
-          audioContextRef.current = new (window.AudioContext || (window as any).webkitAudioContext)();
-          analyserRef.current = audioContextRef.current.createAnalyser();
-          microphoneRef.current = audioContextRef.current.createMediaStreamSource(stream);
-          microphoneRef.current.connect(analyserRef.current);
-          analyserRef.current.fftSize = 256;
-
-          setIsPlaying(true);
-          setGameResult(null);
-          setGameTime(0);
-          setQuietTime(0);
-          smoothedVolRef.current = 0;
-          setZenState(0);
-          
-          setStartTime(Date.now());
-          lastTimeRef.current = Date.now();
-
-          processAudio();
-      } catch (e) { alert('无法访问麦克风'); }
+  const startTimer = () => {
+      setIsActive(true);
+      setIsFinished(false);
+      timerRef.current = setInterval(() => {
+          setTimeLeft(prev => {
+              if (prev <= 1) {
+                  clearInterval(timerRef.current);
+                  finishSession();
+                  return 0;
+              }
+              return prev - 1;
+          });
+      }, 1000);
   };
 
-  const processAudio = () => {
-      if (!analyserRef.current || !config) return;
-      
-      const now = Date.now();
-      const delta = now - lastTimeRef.current;
-      lastTimeRef.current = now;
-
-      // 1. Get Volume
-      const dataArray = new Uint8Array(analyserRef.current.frequencyBinCount);
-      analyserRef.current.getByteFrequencyData(dataArray);
-      const rawAvg = dataArray.reduce((a,b)=>a+b)/dataArray.length;
-
-      // 2. Smooth Volume (Fast Attack, Slow Decay)
-      // Attack: 0.2 (react fast to noise), Decay: 0.05 (calm down slowly)
-      const smoothingFactor = rawAvg > smoothedVolRef.current ? 0.2 : 0.05;
-      smoothedVolRef.current = smoothedVolRef.current * (1 - smoothingFactor) + rawAvg * smoothingFactor;
-      setVolume(smoothedVolRef.current);
-
-      // 3. Determine State
-      const threshold = config.threshold;
-      let currentState = 0;
-      if (smoothedVolRef.current < threshold * 0.5) currentState = 0; // Deep
-      else if (smoothedVolRef.current < threshold) currentState = 1; // Focused
-      else if (smoothedVolRef.current < threshold * 1.5) currentState = 2; // Restless
-      else currentState = 3; // Chaos
-      setZenState(currentState);
-
-      // 4. Update Time
-      if (gameTime < config.durationMinutes * 60 * 1000) {
-          setGameTime(prev => prev + delta);
-          // Only count Quiet(0) and Focused(1) as valid time
-          if (currentState <= 1) {
-              setQuietTime(prev => prev + delta);
-          }
-      } else {
-          endGame(); // Time's up
-          return; 
-      }
-
-      if (isPlaying) animationFrameRef.current = requestAnimationFrame(processAudio);
+  const stopTimer = () => {
+      clearInterval(timerRef.current);
+      setIsActive(false);
   };
 
-  const stopGame = () => {
-      setIsPlaying(false);
-      if (audioContextRef.current) audioContextRef.current.close();
-      if (animationFrameRef.current) cancelAnimationFrame(animationFrameRef.current);
+  const resetTimer = () => {
+      stopTimer();
+      setTimeLeft((config?.durationMinutes || 40) * 60);
+      setIsFinished(false);
   };
 
-  const endGame = () => {
-      stopGame();
-      // Calculate Score
-      const totalTime = Math.min(gameTime, config.durationMinutes * 60 * 1000);
-      if (totalTime <= 0) {
-          setGameResult(null); 
-          return;
-      }
-      
-      const score = (quietTime / totalTime) * 100;
-      const passed = score >= config.passRate;
-      
-      setGameResult(passed ? 'SUCCESS' : 'FAIL');
-      
-      if (passed && config.rewardConfig.enabled) {
-          grantBatchReward(config.rewardConfig);
-      }
+  const finishSession = () => {
+      setIsActive(false);
+      setIsFinished(true);
+      // Play sound
+      const audio = new Audio('https://assets.mixkit.co/active_storage/sfx/2869/2869-preview.mp3');
+      audio.play().catch(() => {});
   };
 
-  const grantBatchReward = async (rewardConfig: any) => {
-      const activeStudents = students.filter(s => !excludedIds.has(s._id || String(s.id)));
-      if (!activeStudents.length) return;
+  const handleGrantReward = async () => {
+      if (!config?.rewardConfig.enabled || students.length === 0) return;
+      if (!confirm('修行结束！确认给全班同学发放奖励吗？')) return;
+
       try {
-          const promises = activeStudents.map(s => {
-              if (rewardConfig.type === 'ACHIEVEMENT') {
+          const promises = students.map(s => {
+              if (config.rewardConfig.type === 'ACHIEVEMENT' && config.rewardConfig.val) {
                   return api.achievements.grant({
                       studentId: s._id || String(s.id),
-                      achievementId: rewardConfig.val,
+                      achievementId: config.rewardConfig.val,
                       semester: '当前学期'
                   });
               } else {
                   return api.games.grantReward({
                       studentId: s._id || String(s.id),
-                      count: rewardConfig.count,
-                      rewardType: rewardConfig.type,
-                      name: rewardConfig.type === 'DRAW_COUNT' ? '禅修奖励' : rewardConfig.val,
-                      source: '禅道修行' // Updated Source
+                      count: config.rewardConfig.count || 1,
+                      rewardType: config.rewardConfig.type,
+                      name: config.rewardConfig.type === 'DRAW_COUNT' ? '禅道修行奖励' : config.rewardConfig.val,
+                      source: '禅道修行'
                   });
               }
           });
           await Promise.all(promises);
-      } catch (e) { console.error(e); }
+          alert('奖励发放成功！');
+          resetTimer();
+      } catch (e) { alert('发放失败'); }
   };
 
-  const saveSettings = async () => {
+  const saveConfig = async () => {
       if (config) {
           await api.games.saveZenConfig(config);
-          setIsSettingsOpen(false);
+          setTimeLeft(config.durationMinutes * 60);
       }
+      setIsSettingsOpen(false);
   };
 
-  const formatTime = (ms: number) => {
-      const sec = Math.floor(ms / 1000);
-      const m = Math.floor(sec / 60);
-      const s = sec % 60;
-      return `${m.toString().padStart(2,'0')}:${s.toString().padStart(2,'0')}`;
-  };
-
-  // State Styles Map
-  const stateConfig = [
-      { color: 'from-emerald-900 to-teal-800', textColor: 'text-emerald-100', label: '极静', icon: <Moon size={48} className="text-emerald-200 drop-shadow-[0_0_15px_rgba(52,211,153,0.8)]"/>, msg: '心如止水' },
-      { color: 'from-green-800 to-emerald-700', textColor: 'text-green-100', label: '专注', icon: <Wind size={48} className="text-green-200"/>, msg: '渐入佳境' },
-      { color: 'from-amber-700 to-orange-800', textColor: 'text-orange-100', label: '浮躁', icon: <CloudRain size={48} className="text-orange-200 animate-bounce"/>, msg: '有些嘈杂...' },
-      { color: 'from-red-900 to-rose-800', textColor: 'text-red-100', label: '喧哗', icon: <Zap size={48} className="text-red-200 animate-pulse"/>, msg: '太吵了！！！' },
-  ];
-
-  const currentState = stateConfig[zenState];
-  const currentScore = gameTime > 0 ? (quietTime / gameTime * 100).toFixed(1) : '100.0';
-
-  if (!config) return <div className="p-10 text-center text-white">加载配置...</div>;
+  if (loading) return <div className="h-full flex items-center justify-center"><Loader2 className="animate-spin text-teal-600"/></div>;
+  if (!config) return <div className="h-full flex items-center justify-center text-gray-400">无法加载配置</div>;
 
   return (
-      <div className={`h-full flex flex-col relative overflow-hidden transition-all duration-1000 bg-gradient-to-b ${currentState.color}`}>
-          {/* Header */}
-          <div className="p-4 flex justify-between items-center z-10 text-white/80">
-              <h3 className="font-bold text-lg flex items-center gap-2">
-                  <span>禅道修行</span>
-                  {isPlaying && <span className="text-xs border px-2 py-0.5 rounded-full bg-black/20">目标: &gt;{config.passRate}%</span>}
-              </h3>
-              {isTeacher && (
-                  <div className="flex gap-2">
-                      <button onClick={()=>setShowFilterModal(true)} className="bg-white/10 px-3 py-2 rounded text-sm flex items-center hover:bg-white/20">
-                          <Filter size={16} className="mr-1"/> 人员 ({students.length - excludedIds.size})
-                      </button>
-                      <button onClick={()=>setIsSettingsOpen(true)} className="bg-white/10 p-2 rounded hover:bg-white/20"><Settings size={20}/></button>
-                  </div>
-              )}
-          </div>
-
-          <div className="flex-1 flex flex-col items-center justify-center relative">
-              {/* Monk / Centerpiece */}
-              <div className={`relative transition-all duration-500 flex flex-col items-center ${zenState >= 2 ? 'scale-110' : 'scale-100'}`}>
-                   {/* Aura */}
-                   {zenState === 0 && <div className="absolute inset-0 bg-emerald-400/20 blur-3xl rounded-full animate-pulse scale-150"></div>}
-                   {zenState === 3 && <div className="absolute inset-0 bg-red-500/20 blur-2xl rounded-full animate-ping"></div>}
-                   
-                   <div className="mb-6 transform transition-all duration-300">
-                       {currentState.icon}
-                   </div>
-                   
-                   <div className={`text-4xl font-bold mb-2 ${currentState.textColor} drop-shadow-md`}>{currentState.label}</div>
-                   <div className="text-sm text-white/60 mb-8">{currentState.msg}</div>
-
-                   {/* Main Timer */}
-                   <div className="text-6xl font-mono font-bold text-white tracking-widest drop-shadow-lg">
-                       {formatTime(Math.max(0, config.durationMinutes * 60 * 1000 - gameTime))}
-                   </div>
-              </div>
-
-              {/* Stats Bar */}
-              <div className="mt-12 flex gap-8 items-center bg-black/20 p-4 rounded-2xl backdrop-blur-md border border-white/10">
-                   <div className="text-center">
-                       <div className="text-xs text-white/50 mb-1">当前音量</div>
-                       <div className="flex items-center gap-2">
-                           <div className="w-24 h-2 bg-white/20 rounded-full overflow-hidden">
-                               <div className={`h-full transition-all duration-100 ${zenState>=2?'bg-red-400':'bg-emerald-400'}`} style={{width: `${(volume/255)*100}%`}}></div>
-                           </div>
-                           <span className="text-sm font-mono text-white w-8">{Math.round(volume)}</span>
-                       </div>
-                   </div>
-                   <div className="w-px h-8 bg-white/10"></div>
-                   <div className="text-center">
-                       <div className="text-xs text-white/50 mb-1">专注评分</div>
-                       <div className={`text-xl font-bold font-mono ${Number(currentScore)>=config.passRate ? 'text-green-300' : 'text-red-300'}`}>
-                           {currentScore}
-                       </div>
-                   </div>
-              </div>
-
-              {!isPlaying && !gameResult && (
-                  <button onClick={startGame} className="mt-12 bg-white/10 hover:bg-white/20 text-white border border-white/40 px-10 py-4 rounded-full font-bold text-lg flex items-center shadow-lg transition-all hover:scale-105 backdrop-blur-sm">
-                      <Play className="mr-2" fill="currentColor"/> 开始修习
-                  </button>
-              )}
-
-              {isPlaying && (
-                  <button onClick={endGame} className="mt-12 text-white/50 hover:text-white text-sm border-b border-transparent hover:border-white transition-colors">
-                      提前结束
-                  </button>
-              )}
+    <div className="h-full flex flex-col bg-teal-900 text-teal-50 overflow-hidden relative">
+        {/* Decorative Elements */}
+        <div className="absolute top-10 left-10 text-teal-800 text-9xl opacity-20 select-none animate-pulse duration-[10s]">🌑</div>
+        <div className="absolute bottom-10 right-10 text-teal-800 text-9xl opacity-20 select-none animate-bounce duration-[20s]">🎋</div>
+
+        {/* Settings Button */}
+        {isTeacher && (
+            <button 
+                onClick={() => setIsSettingsOpen(true)} 
+                className="absolute top-4 right-4 z-20 p-2 bg-white/10 hover:bg-white/20 rounded-full transition-colors"
+            >
+                <Settings size={20} className="text-white"/>
+            </button>
+        )}
 
-              {/* Result Overlay */}
-              {gameResult && (
-                  <div className="absolute inset-0 bg-black/80 flex flex-col items-center justify-center z-50 animate-in zoom-in backdrop-blur-md">
-                      {gameResult === 'SUCCESS' ? (
-                          <>
-                              <Trophy size={80} className="text-yellow-400 mb-4 drop-shadow-[0_0_20px_rgba(250,204,21,0.5)]"/>
-                              <h2 className="text-4xl font-black text-white mb-2">修行圆满</h2>
-                              <p className="text-emerald-300 text-lg mb-6">最终评分: {currentScore} (通过)</p>
-                              {config.rewardConfig.enabled && <div className="text-sm bg-white/10 px-4 py-2 rounded-full text-white/80">已自动发放奖励</div>}
-                          </>
-                      ) : (
-                          <>
-                              <X size={80} className="text-red-400 mb-4"/>
-                              <h2 className="text-4xl font-black text-white mb-2">修行失败</h2>
-                              <p className="text-red-300 text-lg mb-6">最终评分: {currentScore} (未达 {config.passRate})</p>
-                              <p className="text-white/50 text-sm">心浮气躁，难成大器。下次再来。</p>
-                          </>
-                      )}
-                      <button onClick={() => { setGameResult(null); setGameTime(0); setQuietTime(0); }} className="mt-8 bg-white text-slate-900 px-8 py-3 rounded-full font-bold hover:scale-105 transition-transform">返回</button>
-                  </div>
-              )}
-          </div>
-          
-          {/* Settings Modal */}
-          {isSettingsOpen && (
-              <div className="fixed inset-0 bg-black/80 z-50 flex items-center justify-center p-4 text-gray-800">
-                  <div className="bg-white rounded-xl p-6 w-full max-w-md animate-in zoom-in-95">
-                      <div className="flex justify-between items-center mb-6">
-                          <h3 className="font-bold text-lg">修行设置</h3>
-                          <button onClick={()=>setIsSettingsOpen(false)}><X/></button>
-                      </div>
-                      <div className="space-y-4">
-                          <div>
-                              <label className="text-xs font-bold text-gray-500 uppercase block mb-1">测试当前环境音量</label>
-                              <div className="flex items-center gap-2 bg-gray-100 p-2 rounded">
-                                  <Volume2 size={16}/>
-                                  <div className="flex-1 h-2 bg-gray-300 rounded overflow-hidden">
-                                      <div className="bg-blue-500 h-full transition-all" style={{width: `${(volume/255)*100}%`}}></div>
-                                  </div>
-                                  <span className="text-xs font-mono">{Math.round(volume)}</span>
-                                  <button onClick={()=>startGame().then(()=>setTimeout(stopGame, 5000))} className="text-xs bg-blue-100 text-blue-600 px-2 py-1 rounded">测试5秒</button>
-                              </div>
-                          </div>
-                          <div className="grid grid-cols-2 gap-4">
-                              <div>
-                                  <label className="text-xs font-bold text-gray-500 uppercase block mb-1">时长 (分钟)</label>
-                                  <input type="number" className="w-full border rounded p-2" value={config.durationMinutes} onChange={e=>setConfig({...config, durationMinutes: Number(e.target.value)})}/>
-                              </div>
-                              <div>
-                                  <label className="text-xs font-bold text-gray-500 uppercase block mb-1">及格分 (%)</label>
-                                  <input type="number" className="w-full border rounded p-2" value={config.passRate} onChange={e=>setConfig({...config, passRate: Number(e.target.value)})}/>
-                              </div>
-                          </div>
-                          <div>
-                              <label className="text-xs font-bold text-gray-500 uppercase block mb-1">安静阈值 (建议设为环境音+10)</label>
-                              <div className="flex items-center gap-2">
-                                  <input type="range" min="1" max="100" className="flex-1" value={config.threshold} onChange={e=>setConfig({...config, threshold: Number(e.target.value)})}/>
-                                  <span className="w-8 text-center font-bold text-sm">{config.threshold}</span>
-                              </div>
-                              <button onClick={()=>setConfig({...config, threshold: Math.round(volume)+10})} className="text-xs text-blue-600 underline mt-1">设为当前环境音+10</button>
-                          </div>
-                          <div className="bg-gray-50 p-4 rounded-lg border border-gray-200">
-                              <div className="flex items-center justify-between mb-2">
-                                  <label className="font-bold text-sm">完成奖励</label>
-                                  <input type="checkbox" checked={config.rewardConfig.enabled} onChange={e=>setConfig({...config, rewardConfig: {...config.rewardConfig, enabled: e.target.checked}})}/>
-                              </div>
-                              {config.rewardConfig.enabled && (
-                                  <div className="space-y-2">
-                                      <div className="flex gap-2">
-                                          <button onClick={()=>setConfig({...config, rewardConfig:{...config.rewardConfig, type:'DRAW_COUNT'}})} className={`flex-1 text-xs py-1.5 rounded border ${config.rewardConfig.type==='DRAW_COUNT'?'bg-blue-50 border-blue-500 text-blue-600':'bg-white'}`}>抽奖券</button>
-                                          <button onClick={()=>setConfig({...config, rewardConfig:{...config.rewardConfig, type:'ACHIEVEMENT'}})} className={`flex-1 text-xs py-1.5 rounded border ${config.rewardConfig.type==='ACHIEVEMENT'?'bg-blue-50 border-blue-500 text-blue-600':'bg-white'}`}>成就</button>
-                                      </div>
-                                      {config.rewardConfig.type === 'ACHIEVEMENT' ? (
-                                          <select className="w-full border rounded p-1.5 text-sm" value={config.rewardConfig.val} onChange={e=>setConfig({...config, rewardConfig: {...config.rewardConfig, val: e.target.value}})}>
-                                              <option value="">选择成就</option>
-                                              {achievements.map(a=><option key={a.id} value={a.id}>{a.name}</option>)}
-                                          </select>
-                                      ) : (
-                                          <div className="flex items-center gap-2">
-                                              <span className="text-sm">数量:</span>
-                                              <input type="number" min="1" className="border rounded p-1 w-20" value={config.rewardConfig.count} onChange={e=>setConfig({...config, rewardConfig: {...config.rewardConfig, count: Number(e.target.value)}})}/>
-                                          </div>
-                                      )}
-                                  </div>
-                              )}
-                          </div>
-                          <button onClick={saveSettings} className="w-full bg-emerald-600 text-white py-2 rounded-lg font-bold hover:bg-emerald-700">保存设置</button>
-                      </div>
-                  </div>
-              </div>
-          )}
+        <div className="flex-1 flex flex-col items-center justify-center relative z-10">
+            <h2 className="text-teal-200 font-medium tracking-[0.5em] mb-8 text-xl">禅 · 道 · 修 · 行</h2>
+            
+            <div className={`relative w-80 h-80 rounded-full border-4 flex items-center justify-center transition-all duration-1000 ${isActive ? 'border-teal-400 shadow-[0_0_50px_rgba(45,212,191,0.3)]' : 'border-teal-700'}`}>
+                {isActive && (
+                    <div className="absolute inset-0 rounded-full border-4 border-t-transparent border-teal-300 animate-spin duration-[10s]"></div>
+                )}
+                <div className="text-6xl font-thin font-mono tracking-wider">
+                    {formatTime(timeLeft)}
+                </div>
+            </div>
 
-          {/* Filter Modal */}
-          {showFilterModal && (
-            <div className="fixed inset-0 bg-black/50 z-50 flex items-center justify-center p-4 text-gray-800">
-                <div className="bg-white rounded-xl p-6 w-full max-w-lg h-[80vh] flex flex-col animate-in zoom-in-95">
-                    <div className="flex justify-between items-center mb-4">
-                        <h3 className="font-bold text-lg">参与人员筛选 (不参与奖励)</h3>
-                        <button onClick={()=>setShowFilterModal(false)}><X size={20}/></button>
+            {isFinished && (
+                <div className="mt-8 flex flex-col items-center animate-in fade-in slide-in-from-bottom-4">
+                    <div className="bg-teal-500/20 text-teal-200 px-6 py-2 rounded-full border border-teal-500/50 mb-4 flex items-center gap-2">
+                        <CheckCircle size={18}/> 修行圆满完成
                     </div>
-                    <div className="flex-1 overflow-y-auto grid grid-cols-3 gap-2 custom-scrollbar">
-                        {students.map(s => {
-                            const isExcluded = excludedIds.has(s._id || String(s.id));
-                            return (
-                                <div 
-                                    key={s._id} 
-                                    onClick={() => {
-                                        const newSet = new Set(excludedIds);
-                                        const sid = s._id || String(s.id);
-                                        if (newSet.has(sid)) newSet.delete(sid);
-                                        else newSet.add(sid);
-                                        setExcludedIds(newSet);
-                                    }}
-                                    className={`p-2 rounded border cursor-pointer flex items-center justify-between text-sm select-none ${!isExcluded ? 'bg-blue-50 border-blue-300 text-blue-800' : 'bg-gray-100 border-gray-200 text-gray-400'}`}
-                                >
-                                    <span>{s.seatNo ? s.seatNo+'.':''}{s.name}</span>
-                                    {!isExcluded && <CheckCircle size={14}/>}
-                                </div>
-                            );
-                        })}
+                    {isTeacher && (
+                        <button 
+                            onClick={handleGrantReward}
+                            className="bg-amber-500 hover:bg-amber-600 text-white px-8 py-3 rounded-full font-bold shadow-lg transform hover:scale-105 transition-all"
+                        >
+                            发放全班奖励
+                        </button>
+                    )}
+                </div>
+            )}
+        </div>
+
+        {/* Controls */}
+        <div className="h-24 bg-teal-950/50 border-t border-teal-800/50 flex items-center justify-center gap-8 relative z-10">
+            {!isActive && !isFinished && (
+                <button onClick={startTimer} className="bg-teal-600 hover:bg-teal-500 text-white w-14 h-14 rounded-full flex items-center justify-center shadow-lg transition-transform hover:scale-110">
+                    <Play size={24} className="ml-1"/>
+                </button>
+            )}
+            {isActive && (
+                <button onClick={stopTimer} className="bg-amber-600 hover:bg-amber-500 text-white w-14 h-14 rounded-full flex items-center justify-center shadow-lg transition-transform hover:scale-110">
+                    <Square size={20} fill="white"/>
+                </button>
+            )}
+            <button onClick={resetTimer} className="text-teal-400 hover:text-white p-2 rounded-full hover:bg-white/5 transition-colors absolute right-8">
+                重置
+            </button>
+        </div>
+
+        {/* Settings Modal */}
+        {isSettingsOpen && (
+            <div className="fixed inset-0 bg-black/60 z-50 flex items-center justify-center p-4 text-slate-800">
+                <div className="bg-white rounded-xl w-full max-w-md p-6 shadow-2xl animate-in zoom-in-95">
+                    <div className="flex justify-between items-center mb-6">
+                        <h3 className="text-xl font-bold">修行设置</h3>
+                        <button onClick={() => setIsSettingsOpen(false)}><X size={24} className="text-gray-400 hover:text-gray-600"/></button>
                     </div>
-                    <div className="pt-4 border-t mt-2">
-                        <button onClick={()=>setShowFilterModal(false)} className="w-full bg-blue-600 text-white py-2 rounded-lg font-bold">确定</button>
+                    
+                    <div className="space-y-6 mb-6">
+                        <div>
+                            <label className="block text-sm font-bold text-gray-700 mb-2 flex items-center"><Clock size={16} className="mr-2"/> 修行时长 (分钟)</label>
+                            <div className="grid grid-cols-4 gap-2">
+                                {[10, 20, 30, 40, 45, 60, 90].map(m => (
+                                    <button 
+                                        key={m} 
+                                        onClick={() => setConfig({...config, durationMinutes: m})}
+                                        className={`py-2 rounded border text-sm font-medium transition-colors ${config.durationMinutes === m ? 'bg-teal-600 text-white border-teal-600' : 'bg-white text-gray-600 hover:border-teal-400'}`}
+                                    >
+                                        {m}
+                                    </button>
+                                ))}
+                            </div>
+                        </div>
+                        
+                        <div className="border-t pt-4">
+                            <label className="block text-sm font-bold text-gray-700 mb-2">完成奖励</label>
+                            <div className="flex items-center gap-2 mb-2">
+                                <input type="checkbox" checked={config.rewardConfig.enabled} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, enabled: e.target.checked}})}/>
+                                <span className="text-sm">启用自动奖励</span>
+                            </div>
+                            {config.rewardConfig.enabled && (
+                                <div className="bg-gray-50 p-3 rounded-lg space-y-2 border">
+                                    <select className="w-full border rounded p-2 text-sm" value={config.rewardConfig.type} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, type: e.target.value as any}})}>
+                                        <option value="DRAW_COUNT">🎲 抽奖券</option>
+                                        <option value="ITEM">🎁 物品</option>
+                                        <option value="ACHIEVEMENT">🏆 成就</option>
+                                    </select>
+                                    
+                                    {config.rewardConfig.type === 'ACHIEVEMENT' ? (
+                                        <select className="w-full border rounded p-2 text-sm" value={config.rewardConfig.val} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, val: e.target.value}})}>
+                                            <option value="">选择成就</option>
+                                            {achConfig?.achievements.map(a => <option key={a.id} value={a.id}>{a.icon} {a.name}</option>)}
+                                        </select>
+                                    ) : (
+                                        <input className="w-full border rounded p-2 text-sm" placeholder={config.rewardConfig.type === 'ITEM' ? '物品名称' : '备注'} value={config.rewardConfig.val} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, val: e.target.value}})}/>
+                                    )}
+                                    
+                                    <div className="flex items-center gap-2">
+                                        <span className="text-sm">数量:</span>
+                                        <input type="number" min="1" className="border rounded p-1 w-16 text-sm" value={config.rewardConfig.count} onChange={e => setConfig({...config, rewardConfig: {...config.rewardConfig, count: Number(e.target.value)}})}/>
+                                    </div>
+                                </div>
+                            )}
+                        </div>
                     </div>
+
+                    <button onClick={saveConfig} className="w-full bg-teal-600 text-white py-2 rounded-lg font-bold hover:bg-teal-700 flex items-center justify-center gap-2">
+                        <Save size={18}/> 保存并重置
+                    </button>
                 </div>
             </div>
         )}
-      </div>
+    </div>
   );
 };

pages/Games.tsx

@@ -75,4 +75,4 @@ export const Games: React.FC = () => {
       </div>
     </div>
   );
-};
+};

server.js

@@ -1,30 +1,8 @@
-
-// ... existing imports ...
-const { 
-    School, User, Student, Course, Score, ClassModel, SubjectModel, ExamModel, ScheduleModel,
-    ConfigModel, NotificationModel, GameSessionModel, StudentRewardModel, LuckyDrawConfigModel, GameMonsterConfigModel, GameZenConfigModel,
-    AchievementConfigModel, StudentAchievementModel, AttendanceModel, LeaveRequestModel 
-} = require('./models');
-
-// ... existing setup ...
-
-// --- Game Routes ---
-app.post('/api/games/mountain', async (req, res) => { 
-    const filter = { className: req.body.className };
-    const sId = req.headers['x-school-id'];
-    if(sId) filter.schoolId = sId;
-    await GameSessionModel.findOneAndUpdate(filter, injectSchoolId(req, req.body), {upsert:true}); 
-    res.json({}); 
-});
-
 app.post('/api/games/grant-reward', async (req, res) => { 
     const { studentId, count, rewardType, name, source } = req.body;
     const finalCount = count || 1;
     const finalName = name || (rewardType === 'DRAW_COUNT' ? '抽奖券' : '奖品');
-    const finalSource = source || '教师发放'; // Use provided source or default
-    
     if (rewardType === 'DRAW_COUNT') await Student.findByIdAndUpdate(studentId, { $inc: { drawAttempts: finalCount } });
-    
     await StudentRewardModel.create({ 
         schoolId: req.headers['x-school-id'], 
         studentId, 
@@ -33,24 +11,7 @@ app.post('/api/games/grant-reward', async (req, res) => {
         name: finalName, 
         count: finalCount, 
         status: rewardType === 'DRAW_COUNT' ? 'REDEEMED' : 'PENDING', 
-        source: finalSource 
+        source: source || '教师发放' 
     });
     res.json({}); 
-});
-
-app.get('/api/games/zen-config', async (req, res) => {
-    const data = await GameZenConfigModel.findOne({ className: req.query.className });
-    res.json(data);
-});
-
-app.post('/api/games/zen-config', async (req, res) => {
-    const filter = { className: req.body.className };
-    const sId = req.headers['x-school-id'];
-    if(sId) filter.schoolId = sId;
-    await GameZenConfigModel.findOneAndUpdate(filter, injectSchoolId(req, req.body), { upsert: true });
-    res.json({});
-});
-
-// ... Keep existing routes ...
-app.put('/api/rewards/:id', async (req, res) => { await StudentRewardModel.findByIdAndUpdate(req.params.id, req.body); res.json({}); });
-// ... existing code ...
+});

services/api.ts

@@ -1,187 +1,174 @@
-
-import { 
-    User, UserRole, School, ClassInfo, Subject, Score, Student, 
-    SystemConfig, Notification, GameSession, GameRewardConfig, 
-    LuckyDrawConfig, AchievementConfig, StudentReward, Attendance,
-    GameMonsterConfig
-} from '../types';
+import { User, UserRole, Student, ClassInfo, School, Subject, Course, Score, Schedule, SystemConfig, Notification, ApiResponse, GameSession, LuckyDrawConfig, StudentReward, GameMonsterConfig, GameZenConfig, AchievementConfig, StudentAchievement, Attendance } from '../types';
 
 const API_BASE = '/api';
 
-// Simple request helper
-const request = async (endpoint: string, options: RequestInit = {}) => {
-    const token = localStorage.getItem('token');
-    const headers: any = {
-        'Content-Type': 'application/json',
-        ...options.headers,
-    };
-    
-    if (token) {
-        headers['Authorization'] = `Bearer ${token}`;
-    }
-
-    // Pass selected school ID header for Admin view
-    const viewSchoolId = localStorage.getItem('admin_view_school_id');
-    if (viewSchoolId) {
-        headers['x-school-id'] = viewSchoolId;
-    }
-
-    const response = await fetch(`${API_BASE}${endpoint}`, {
-        ...options,
-        headers
-    });
-
-    const data = await response.json();
+const getHeaders = () => {
+  const token = localStorage.getItem('token');
+  const schoolId = localStorage.getItem('admin_view_school_id') || localStorage.getItem('user_school_id');
+  const headers: HeadersInit = {
+    'Content-Type': 'application/json',
+  };
+  if (token) headers['Authorization'] = `Bearer ${token}`;
+  if (schoolId) headers['x-school-id'] = schoolId;
+  return headers;
+};
 
-    if (!response.ok) {
-        if (response.status === 401) {
-            localStorage.removeItem('token');
-            // Optional: Redirect to login
-        }
-        throw new Error(data.message || '请求失败');
-    }
+const request = async <T>(endpoint: string, options: RequestInit = {}): Promise<T> => {
+  const res = await fetch(`${API_BASE}${endpoint}`, {
+    ...options,
+    headers: { ...getHeaders(), ...options.headers },
+  });
 
-    return data;
+  const data = await res.json();
+  if (!res.ok) {
+    throw new Error(data.message || 'API request failed');
+  }
+  return data as T;
 };
 
 export const api = {
-    init: () => {
-        // Any init logic
-    },
-    auth: {
-        login: (username: string, password: string) => 
-            request('/auth/login', { method: 'POST', body: JSON.stringify({ username, password }) }),
-        register: (data: any) => 
-            request('/auth/register', { method: 'POST', body: JSON.stringify(data) }),
-        getCurrentUser: (): User | null => {
-            const u = localStorage.getItem('user');
-            return u ? JSON.parse(u) : null;
-        },
-        refreshSession: async () => {
-            try {
-                const user = await request('/auth/me');
-                localStorage.setItem('user', JSON.stringify(user));
-                return user;
-            } catch (e) { return null; }
-        },
-        updateProfile: (data: any) => request('/auth/profile', { method: 'PUT', body: JSON.stringify(data) }),
-        logout: () => {
-            localStorage.removeItem('token');
-            localStorage.removeItem('user');
-            window.location.reload();
-        }
-    },
-    stats: {
-        getSummary: () => request('/stats/summary'),
-    },
-    students: {
-        getAll: () => request('/students'),
-        add: (data: any) => request('/students', { method: 'POST', body: JSON.stringify(data) }),
-        update: (id: string, data: any) => request(`/students/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
-        delete: (id: string) => request(`/students/${id}`, { method: 'DELETE' }),
-        transfer: (data: { studentId: string, targetClass: string }) => request('/students/transfer', { method: 'POST', body: JSON.stringify(data) }),
-        promote: (data: { teacherFollows: boolean }) => request('/students/promote', { method: 'POST', body: JSON.stringify(data) }),
-    },
-    classes: {
-        getAll: () => request('/classes'),
-        add: (data: any) => request('/classes', { method: 'POST', body: JSON.stringify(data) }),
-        delete: (id: string | number) => request(`/classes/${id}`, { method: 'DELETE' }),
-    },
-    schools: {
-        getAll: () => request('/schools'),
-        getPublic: () => request('/public/schools'),
-        add: (data: any) => request('/schools', { method: 'POST', body: JSON.stringify(data) }),
-        update: (id: string, data: any) => request(`/schools/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
-        delete: (id: string) => request(`/schools/${id}`, { method: 'DELETE' }),
-    },
-    users: {
-        getAll: (params?: any) => {
-            const qs = params ? '?' + new URLSearchParams(params).toString() : '';
-            return request(`/users${qs}`);
-        },
-        update: (id: string, data: any) => request(`/users/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
-        delete: (id: string) => request(`/users/${id}`, { method: 'DELETE' }),
-        applyClass: (data: any) => request('/users/apply-class', { method: 'POST', body: JSON.stringify(data) }),
-    },
-    subjects: {
-        getAll: () => request('/subjects'),
-        add: (data: any) => request('/subjects', { method: 'POST', body: JSON.stringify(data) }),
-        update: (id: string, data: any) => request(`/subjects/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
-        delete: (id: string) => request(`/subjects/${id}`, { method: 'DELETE' }),
-    },
-    courses: {
-        getAll: () => request('/courses'),
-        add: (data: any) => request('/courses', { method: 'POST', body: JSON.stringify(data) }),
-        update: (id: string, data: any) => request(`/courses/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
-        delete: (id: string) => request(`/courses/${id}`, { method: 'DELETE' }),
-    },
-    scores: {
-        getAll: () => request('/scores'),
-        add: (data: any) => request('/scores', { method: 'POST', body: JSON.stringify(data) }),
-        update: (id: string, data: any) => request(`/scores/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
-        delete: (id: string) => request(`/scores/${id}`, { method: 'DELETE' }),
-    },
-    exams: {
-        getAll: () => request('/exams'),
-        save: (data: any) => request('/exams', { method: 'POST', body: JSON.stringify(data) }),
-    },
-    schedules: {
-        get: (params?: any) => {
-            const qs = params ? '?' + new URLSearchParams(params).toString() : '';
-            return request(`/schedules${qs}`);
-        },
-        save: (data: any) => request('/schedules', { method: 'POST', body: JSON.stringify(data) }),
-        delete: (data: any) => request('/schedules', { method: 'DELETE', body: JSON.stringify(data) }),
-    },
-    config: {
-        get: () => request('/config'),
-        getPublic: () => request('/public/config'),
-        save: (data: any) => request('/config', { method: 'POST', body: JSON.stringify(data) }),
-    },
-    notifications: {
-        getAll: (userId: string, role: string) => request(`/notifications?userId=${userId}&role=${role}`),
-    },
-    games: {
-        getMountainSession: (className: string) => request(`/games/mountain?className=${className}`),
-        saveMountainSession: (data: GameSession) => request('/games/mountain', { method: 'POST', body: JSON.stringify(data) }),
-        getLuckyConfig: (className?: string) => request(`/games/lucky-config${className ? `?className=${className}` : ''}`),
-        saveLuckyConfig: (data: LuckyDrawConfig) => request('/games/lucky-config', { method: 'POST', body: JSON.stringify(data) }),
-        drawLucky: (studentId: string) => request('/games/lucky-draw', { method: 'POST', body: JSON.stringify({ studentId }) }),
-        
-        // Updated grantReward with 'source'
-        grantReward: (data: { studentId: string, count: number, rewardType: string, name?: string, source?: string }) => request('/games/grant-reward', { method: 'POST', body: JSON.stringify(data) }),
-        
-        getMonsterConfig: (className: string) => request(`/games/monster-config?className=${className}`),
-        saveMonsterConfig: (data: any) => request('/games/monster-config', { method: 'POST', body: JSON.stringify(data) }),
-        
-        // Added Zen Mode
-        getZenConfig: (className: string) => request(`/games/zen-config?className=${className}`),
-        saveZenConfig: (data: any) => request('/games/zen-config', { method: 'POST', body: JSON.stringify(data) }),
-    },
-    rewards: {
-        getClassRewards: (page: number, size: number, className?: string) => request(`/rewards?page=${page}&size=${size}${className ? `&className=${className}` : ''}`),
-        getMyRewards: (studentId: string, page: number, size: number) => request(`/rewards/my?studentId=${studentId}&page=${page}&size=${size}`),
-        redeem: (id: string) => request(`/rewards/${id}/redeem`, { method: 'POST' }),
-        delete: (id: string) => request(`/rewards/${id}`, { method: 'DELETE' }),
-        update: (id: string, data: any) => request(`/rewards/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
-        addReward: (data: any) => request('/rewards/add', { method: 'POST', body: JSON.stringify(data) }),
-    },
-    attendance: {
-        get: (params: any) => {
-            const qs = new URLSearchParams(params).toString();
-            return request(`/attendance?${qs}`);
-        },
-        checkIn: (data: any) => request('/attendance/checkin', { method: 'POST', body: JSON.stringify(data) }),
-        update: (data: any) => request('/attendance/update', { method: 'POST', body: JSON.stringify(data) }),
-        batch: (data: any) => request('/attendance/batch', { method: 'POST', body: JSON.stringify(data) }),
-        applyLeave: (data: any) => request('/attendance/leave', { method: 'POST', body: JSON.stringify(data) }),
-    },
-    achievements: {
-        getConfig: (className: string) => request(`/achievements/config?className=${className}`),
-        saveConfig: (data: AchievementConfig) => request('/achievements/config', { method: 'POST', body: JSON.stringify(data) }),
-        getStudentAchievements: (studentId: string, semester?: string) => request(`/achievements/student/${studentId}${semester ? `?semester=${semester}` : ''}`),
-        grant: (data: { studentId: string, achievementId: string, semester: string }) => request('/achievements/grant', { method: 'POST', body: JSON.stringify(data) }),
-        exchange: (data: { studentId: string, ruleId: string }) => request('/achievements/exchange', { method: 'POST', body: JSON.stringify(data) }),
-    },
-    batchDelete: (type: string, ids: string[]) => request('/batch-delete', { method: 'POST', body: JSON.stringify({ type, ids }) })
+  init: () => {
+      // Any initialization logic if needed
+  },
+  auth: {
+    login: async (username: string, password: string): Promise<User> => {
+        const user = await request<User>('/auth/login', {
+            method: 'POST',
+            body: JSON.stringify({ username, password })
+        });
+        localStorage.setItem('user', JSON.stringify(user));
+        if(user.schoolId) localStorage.setItem('user_school_id', user.schoolId);
+        return user;
+    },
+    register: (data: any) => request<any>('/auth/register', { method: 'POST', body: JSON.stringify(data) }),
+    logout: () => {
+        localStorage.removeItem('user');
+        localStorage.removeItem('user_school_id');
+        localStorage.removeItem('admin_view_school_id');
+        // Clear token if token based auth is fully implemented in future
+    },
+    getCurrentUser: (): User | null => {
+        const u = localStorage.getItem('user');
+        return u ? JSON.parse(u) : null;
+    },
+    refreshSession: () => request<User>('/auth/session'),
+    updateProfile: (data: any) => request('/auth/profile', { method: 'PUT', body: JSON.stringify(data) }),
+  },
+  users: {
+    getAll: (params: any = {}) => {
+        const search = new URLSearchParams(params);
+        return request<User[]>(`/users?${search.toString()}`);
+    },
+    update: (id: string, data: Partial<User>) => request(`/users/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
+    delete: (id: string) => request(`/users/${id}`, { method: 'DELETE' }),
+    applyClass: (data: any) => request('/users/apply-class', { method: 'POST', body: JSON.stringify(data) }),
+  },
+  students: {
+    getAll: () => request<Student[]>('/students'),
+    add: (data: Partial<Student>) => request('/students', { method: 'POST', body: JSON.stringify(data) }),
+    update: (id: string, data: Partial<Student>) => request(`/students/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
+    delete: (id: string) => request(`/students/${id}`, { method: 'DELETE' }),
+    transfer: (data: {studentId: string, targetClass: string}) => request('/students/transfer', { method: 'POST', body: JSON.stringify(data) }),
+    promote: (data: { teacherFollows: boolean }) => request<{count: number}>('/students/promote', { method: 'POST', body: JSON.stringify(data) }),
+  },
+  classes: {
+    getAll: () => request<ClassInfo[]>('/classes'),
+    add: (data: Partial<ClassInfo>) => request('/classes', { method: 'POST', body: JSON.stringify(data) }),
+    update: (id: string, data: Partial<ClassInfo>) => request(`/classes/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
+    delete: (id: string | number) => request(`/classes/${id}`, { method: 'DELETE' }),
+  },
+  schools: {
+    getAll: () => request<School[]>('/schools'), // Admin only
+    getPublic: () => request<School[]>('/public/schools'), // For registration
+    add: (data: Partial<School>) => request('/schools', { method: 'POST', body: JSON.stringify(data) }),
+    update: (id: string, data: Partial<School>) => request(`/schools/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
+    delete: (id: string) => request(`/schools/${id}`, { method: 'DELETE' }),
+  },
+  subjects: {
+    getAll: () => request<Subject[]>('/subjects'),
+    add: (data: Partial<Subject>) => request('/subjects', { method: 'POST', body: JSON.stringify(data) }),
+    update: (id: string, data: Partial<Subject>) => request(`/subjects/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
+    delete: (id: string) => request(`/subjects/${id}`, { method: 'DELETE' }),
+  },
+  courses: {
+    getAll: () => request<Course[]>('/courses'),
+    add: (data: Partial<Course>) => request('/courses', { method: 'POST', body: JSON.stringify(data) }),
+    update: (id: string, data: Partial<Course>) => request(`/courses/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
+    delete: (id: string) => request(`/courses/${id}`, { method: 'DELETE' }),
+  },
+  scores: {
+    getAll: () => request<Score[]>('/scores'),
+    add: (data: Partial<Score>) => request('/scores', { method: 'POST', body: JSON.stringify(data) }),
+    update: (id: string, data: Partial<Score>) => request(`/scores/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
+    delete: (id: string) => request(`/scores/${id}`, { method: 'DELETE' }),
+  },
+  exams: {
+    getAll: () => request<any[]>('/exams'),
+    save: (data: any) => request('/exams', { method: 'POST', body: JSON.stringify(data) }),
+  },
+  schedules: {
+    get: (params: any = {}) => {
+        const search = new URLSearchParams(params);
+        return request<Schedule[]>(`/schedules?${search.toString()}`);
+    },
+    save: (data: Partial<Schedule>) => request('/schedules', { method: 'POST', body: JSON.stringify(data) }),
+    delete: (data: Partial<Schedule>) => request('/schedules', { method: 'DELETE', body: JSON.stringify(data) }),
+  },
+  config: {
+    get: () => request<SystemConfig>('/config'),
+    getPublic: () => request<SystemConfig>('/public/config'),
+    save: (data: SystemConfig) => request('/config', { method: 'POST', body: JSON.stringify(data) }),
+  },
+  stats: {
+    getSummary: () => request<any>('/stats/summary'),
+  },
+  notifications: {
+    getAll: (userId: string, role: string) => request<Notification[]>(`/notifications?userId=${userId}&role=${role}`),
+  },
+  batchDelete: (type: string, ids: string[]) => request('/batch-delete', { method: 'POST', body: JSON.stringify({ type, ids }) }),
+  
+  games: {
+    // Mountain
+    getMountainSession: (className: string) => request<GameSession | null>(`/games/mountain-session?className=${className}`),
+    saveMountainSession: (session: GameSession) => request('/games/mountain-session', { method: 'POST', body: JSON.stringify(session) }),
+    // Lucky Draw
+    getLuckyConfig: (className: string) => request<LuckyDrawConfig>(`/games/lucky-config?className=${className}`),
+    saveLuckyConfig: (config: LuckyDrawConfig) => request('/games/lucky-config', { method: 'POST', body: JSON.stringify(config) }),
+    drawLucky: (studentId: string) => request<{prize: string, rewardType: string}>('/games/lucky-draw', { method: 'POST', body: JSON.stringify({ studentId }) }),
+    // Common
+    grantReward: (data: { studentId: string, count: number, rewardType: string, name?: string, source?: string }) => request('/games/grant-reward', { method: 'POST', body: JSON.stringify(data) }),
+    
+    // Monster
+    getMonsterConfig: (className: string) => request<GameMonsterConfig>(`/games/monster-config?className=${className}`),
+    saveMonsterConfig: (config: GameMonsterConfig) => request('/games/monster-config', { method: 'POST', body: JSON.stringify(config) }),
+    
+    // Zen
+    getZenConfig: (className: string) => request<GameZenConfig>(`/games/zen-config?className=${className}`),
+    saveZenConfig: (config: GameZenConfig) => request('/games/zen-config', { method: 'POST', body: JSON.stringify(config) }),
+  },
+  achievements: {
+      getConfig: (className: string) => request<AchievementConfig | null>(`/achievements/config?className=${className}`),
+      saveConfig: (config: AchievementConfig) => request('/achievements/config', { method: 'POST', body: JSON.stringify(config) }),
+      getStudentAchievements: (studentId: string, semester?: string) => request<StudentAchievement[]>(`/achievements/student/${studentId}?semester=${semester||''}`),
+      grant: (data: { studentId: string, achievementId: string, semester: string }) => request('/achievements/grant', { method: 'POST', body: JSON.stringify(data) }),
+      exchange: (data: { studentId: string, ruleId: string }) => request('/achievements/exchange', { method: 'POST', body: JSON.stringify(data) }),
+  },
+  rewards: {
+      getMyRewards: (studentId: string, page: number, pageSize: number) => request<any>(`/rewards/my?studentId=${studentId}&page=${page}&pageSize=${pageSize}`),
+      getClassRewards: (page: number, pageSize: number, className?: string) => request<any>(`/rewards/class?page=${page}&pageSize=${pageSize}&className=${className||''}`),
+      addReward: (data: Partial<StudentReward>) => request('/rewards', { method: 'POST', body: JSON.stringify(data) }),
+      redeem: (id: string) => request(`/rewards/${id}/redeem`, { method: 'POST' }),
+      update: (id: string, data: Partial<StudentReward>) => request(`/rewards/${id}`, { method: 'PUT', body: JSON.stringify(data) }),
+      delete: (id: string) => request(`/rewards/${id}`, { method: 'DELETE' }),
+  },
+  attendance: {
+      get: (params: any) => {
+          const s = new URLSearchParams(params);
+          return request<Attendance[]>(`/attendance?${s.toString()}`);
+      },
+      checkIn: (data: {studentId: string, date: string}) => request('/attendance/checkin', { method: 'POST', body: JSON.stringify(data) }),
+      update: (data: {studentId: string, date: string, status: string}) => request('/attendance/update', { method: 'POST', body: JSON.stringify(data) }),
+      batch: (data: {className: string, date: string}) => request('/attendance/batch', { method: 'POST', body: JSON.stringify(data) }),
+      applyLeave: (data: any) => request('/attendance/leave', { method: 'POST', body: JSON.stringify(data) }),
+  }
 };