Skip to content

A-30 Course Management

管理員端課程管理設計規格
畫面用途

Course Management的畫面結構、操作與規則說明。

閱讀完整規格 ↓

內容依原始規格呈現 · 查看 Markdown 來源 ↗需具備倉庫查看權限

🎨 Figma: node-698-2843 (A-30/A-31/A-32/A-33-O/A-33 共用) 🔗

🎯 核心說明:動態內容引擎

使用者: Admin (新增/查詢) / Super Admin (修改/刪除)

系統採層級式管理:Category (大類) > Level (等級) > Session (單元) > Vocabulary (單字/句子)

  • 架構層 (Cat/Lvl/Ses): 支援畫面上直接 CRUD 與批量導入。
  • 內容層 (Vocab): 畫面僅限查詢與刪除,新增與修改必須透過批量導入以確保數據一致性。

🧱 畫面結構

區域說明
HeaderNihao Admin Dashboard > Course Management, [👤]
Sidebar含 [⤒ Bulk Import Structure], [⤒ Bulk Import Vocabulary] 按鈕
Category Tabs[EK], [ES], [NH] 三個分類 Tab,每個含 [✎] [🗑️] 按鈕
Level TableLevel Code, Level Name, Sessions, Status, Actions [🔧] [👁️] [✎] [🗑️]

🔐 權限與操作矩陣 (Permission Matrix)

項目查詢 (R)新增 (C)修改 (U)刪除 (D)批量導入
CategorySuper / AdminSuper / AdminSuperSuper支援
LevelSuper / AdminSuper / AdminSuperSuper支援
SessionSuper / AdminSuper / AdminSuperSuper支援
VocabularySuper / Admin不可直接新增不可直接修改Super / Admin唯一途徑

※ 不可操作的部分不可見

📦 區塊說明

#區塊元件行為/交互備註
1Bulk Import Entry[⤒ Bulk Import Structure] / [⤒ Bulk Import Vocabulary]跳轉至 A-33-OSidebar 頂部按鈕
2Category TabsTab Buttons + [✎] [🗑️]切換 Category,編輯/刪除Super Only for Edit/Delete
3Level TableData Table顯示該 Category 下的所有 LevelSessions Count, Status, Actions
4[🔧] Manage SessionsButton進入 A-31 Session 管理所有 Admin
5[👁️] View VocabButton進入 A-32 Vocabulary 查詢所有 Admin
6[✎] Edit NameButton修改 Level 名稱Super Admin Only
7[🗑️] DeleteButton階梯式確認刪除Super Admin Only

⚠️ 刪除確認邏輯 (Delete Guard)

為了防止災難性操作,Super Admin 執行刪除時,系統會觸發 「階梯式確認彈窗」

  1. 初次提醒: 「您正在刪除 [Level Code]。此操作將同時刪除所屬的 N 個 Sessions 以及 N 個單字內容。」
  2. 二次確認: 系統要求用戶手動輸入該 Level 的 Code 或是單字 DELETE,按鈕才會解鎖。
  3. 衝突檢查: 若有班級正在使用該 Level,則禁止刪除,並引導至 A-20 處理。

🔁 交互流程圖

流程圖

正在載入流程圖…

🔎 邏輯自我檢查

  1. 層級結構: Web 端 Category 作為 Tab,Level 作為 Table Row,Session 與 Vocabulary 作為下鑽頁面,層級邏輯清晰。
  2. 權限隔離: 已嚴格區分「新增(Admin 可做)」與「修刪(僅 Super 可做)」。
  3. 操作流向: Vocabulary 的「不可線上新增/修改」透過 UI 提示引導至「批量導入」,減少單點出錯。

提交版本內容版本 29c89979提交 5ca7557規格文件,功能實現狀態另行確認