A-21 Create Class
- P1新增 +1移除 −0
第一版式樣草案 · Markdown 來源：04-App畫面-管理員.mdGitHub 版本尚未推送；目前以本機手冊為準
取圖紀錄： QL APP，2026-10-18，版本
2410774734466577464；節點 722:7676 。學生 2x／Web 1x。圖片是目前設計稿，文字為 APlus 首版目標規格。
新增/編輯班級
🎨 Figma: node-722-7676 (A-20/A-21/A-23 共用) 🔗
🎯 功能定位
使用者： Admin / Super Admin
A-21 用於定義班級的物理與教學歸屬。除了校區、等級等基礎設定外，增加了 [Assigned Teachers] 區塊，支援一個班級掛鉤多位老師，這將決定哪些老師在 T-01 Teacher Portal 中能看到該班級的學生數據與進度。
🧱 畫面結構
| 區域 | 說明 |
|---|---|
| Header | APlus Admin Dashboard > Class Management > Create Class, [👤] |
| Sidebar | 深色側邊欄導航 |
| Basic Info | Class Name, Class ID 輸入框 |
| Hierarchy Configuration | Zone, School, Category, Level 下拉選單 |
| Assigned Teachers | Tag-style Multi-select 搜尋框 |
| Status | Active / Inactive 切換 |
| Actions | [Save Class] 按鈕 |
📋 欄位與交互詳細定義
1. Hierarchy Configuration (層級聯動)
- Zone & School: 下拉選單。
- 連動邏輯： 當管理員選擇了特定的 School 後，下方 [Assigned Teachers] 的搜尋建議應優先過濾並顯示該 School 下屬的老師。
- ZoneAdmin 僅可以看到同一個 Zone 的老師，SuperAdmin 可以看到所有老師。
- 與 A-23 共用資格校驗： 同 School 僅是搜尋排序偏好，不是額外的強制條件；Admin 可選其管轄 Zone 中的 Teacher，Super Admin 依全域權限選取。手動與批量操作使用相同的可指派老師清單，不得出現手動可選、CSV 卻因跨 School 被拒絕的情況。
2. Assigned Teachers (老師多選邏輯)
- 組件樣式： 採用 Tag-style Multi-select (標籤式多選框)。
- 行為細節：
- 搜尋： 管理員輸入姓名或 Email 關鍵字，下拉選單會即時顯示匹配的老師。
- 新增： 點擊搜尋結果，該老師會以「標籤」形式加入框內。
- 移除： 點擊標籤旁的 x 即可取消該老師對此班級的管轄權限。
- 目的： 支援一班多師制（例如：外教 + 中教，或導師 + 助教）。
3. 數據連動說明
- Teacher Portal (T-01): 在 A-21 被選中的所有老師，登入系統後都會在「我的班級」列表中看到此班級。
- 權限資料源： A-21 與 A-23 寫入同一份班級－老師關聯，該關聯是教師查看班級與學生資料的唯一權限來源。
- User Management (A-10): 學生畫面中的
teacher_emails為所屬有效班級老師的衍生顯示值，不可獨立授予教師存取權限，避免班級設定與學生欄位漂移。
4. Class Status 共用語義
| Status | 顯示與存取 | 可執行操作 | 歷史資料 |
|---|---|---|---|
Active | A-20 預設列表與 Teacher 的 Active Class Switch 顯示 | 可加入學生、調整老師、建立排程與派送 Trophy Challenge | 正常累積 |
Inactive | A-20 以 Status Filter 查找；Teacher 只可從歷史／分析上下文唯讀查看，不出現在 Active Class Switch | 不可加入學生、建立新排程或派送新 Challenge；可由授權 Admin／Super Admin 重新啟用 | 保留班級、學生、老師、已送 Challenge、Attempt 與 Result 關聯 |
- Active 轉 Inactive 後，已送出的 Challenge 仍可完成至原
due_at；尚未實際送出的 Pre-arrange 任務暫停，重新啟用後需教師再次確認，不得自動補送。 - 直接以
Inactive導入時仍建立合法的班級－老師關聯，但不向老師／學生建立新任務或發通知；重新啟用後才進入正常操作列表。 - 所有狀態轉換由伺服器端驗權並寫入 Audit Log；前端禁用按鈕不能代替 API 權限與狀態校驗。
🔁 交互流程圖
正在載入流程圖…
⚙️ 狀態管理
| 狀態 | 觸發條件 | 畫面表現 |
|---|---|---|
| 新增模式 | 從 A-20 點擊 "+" | 空白表單 |
| 編輯模式 | 從 A-20 點擊 [E] | 載入現有數據 |
| 驗證錯誤 | 必填欄位為空 | 欄位標紅，提示訊息 |
| 保存中 | API 請求中 | 按鈕顯示 Loading |
| 保存成功 | API 成功 | Toast + 返回 A-20 |