完整性更新
现在已经实现了大部分基础功能
This commit is contained in:
@@ -1,6 +1,7 @@
|
||||
# Textbooks Module Implementation Details
|
||||
|
||||
**Date**: 2025-12-23
|
||||
**Updated**: 2025-12-31
|
||||
**Author**: DevOps Architect
|
||||
**Module**: Textbooks (`src/modules/textbooks`)
|
||||
|
||||
@@ -27,6 +28,13 @@ src/
|
||||
│ ├── page.tsx
|
||||
│ └── loading.tsx
|
||||
│
|
||||
│ └── student/
|
||||
│ └── learning/
|
||||
│ └── textbooks/ # 学生端只读阅读(Server Components)
|
||||
│ ├── page.tsx # 列表页(复用筛选与卡片)
|
||||
│ └── [id]/ # 详情页(阅读器)
|
||||
│ └── page.tsx
|
||||
│
|
||||
├── modules/
|
||||
│ └── textbooks/ # 业务模块
|
||||
│ ├── actions.ts # Server Actions (增删改)
|
||||
@@ -34,6 +42,7 @@ src/
|
||||
│ ├── types.ts # 类型定义 (Schema-aligned)
|
||||
│ └── components/ # 模块私有组件
|
||||
│ ├── textbook-content-layout.tsx # [核心] 三栏布局工作台
|
||||
│ ├── textbook-reader.tsx # [新增] 学生端只读阅读器(URL state)
|
||||
│ ├── chapter-sidebar-list.tsx # 递归章节树
|
||||
│ ├── knowledge-point-panel.tsx # 知识点管理面板
|
||||
│ ├── create-chapter-dialog.tsx # 章节创建弹窗
|
||||
@@ -64,6 +73,11 @@ src/
|
||||
* **Optimistic UI**: 虽然使用 Server Actions,但通过本地状态 (`useState`) 实现了操作的即时反馈(如保存正文后立即退出编辑模式)。
|
||||
* **Feedback**: 使用 `sonner` (`toast`) 提供操作成功或失败的提示。
|
||||
|
||||
### 3.3 学生端阅读体验(Read-Only Reader)
|
||||
* **两栏阅读**:左侧章节树,右侧正文渲染(Markdown)。
|
||||
* **URL State**:选中章节通过 `?chapterId=` 写入 URL,支持刷新/分享后保持定位(nuqs)。
|
||||
* **只读边界**:学生端不暴露创建/删除/编辑/知识点管理入口,避免误用教师工作台能力。
|
||||
|
||||
## 4. 数据流与逻辑 (Data Flow)
|
||||
|
||||
### 4.1 Server Actions
|
||||
@@ -71,18 +85,22 @@ src/
|
||||
* `createChapterAction`: 创建章节(支持嵌套)。
|
||||
* `updateChapterContentAction`: 更新正文内容。
|
||||
* `createKnowledgePointAction`: 创建知识点并自动关联当前章节。
|
||||
* `deleteKnowledgePointAction`: 删除知识点并刷新详情页数据。
|
||||
* `updateTextbookAction`: 更新教材元数据(Title, Subject, Grade, Publisher)。
|
||||
* `deleteTextbookAction`: 删除教材及其关联数据。
|
||||
* `delete...Action`: 处理删除逻辑。
|
||||
|
||||
### 4.2 数据访问层 (Data Access)
|
||||
* **Mock Implementation**: 目前在 `data-access.ts` 中使用内存数组模拟数据库操作,并人为增加了延迟 (`setTimeout`) 以测试 Loading 状态。
|
||||
* **Type Safety**: 定义了严格的 TypeScript 类型 (`Chapter`, `KnowledgePoint`, `UpdateTextbookInput`),确保前后端数据契约一致。
|
||||
* **DB Implementation**: 教材模块已接入真实数据库访问,`data-access.ts` 使用 `drizzle-orm` 直接查询并返回教材、章节、知识点数据。
|
||||
* **章节树构建**: 章节采用父子关系存储,通过一次性拉取后在内存中构建嵌套树结构,避免 N+1 查询。
|
||||
* **级联删除**: 删除章节时会同时删除其子章节以及关联的知识点,确保数据一致性。
|
||||
* **Type Safety**: 定义严格的 TypeScript 类型(如 `Chapter`, `KnowledgePoint`, `UpdateTextbookInput`),保证数据契约与 UI 组件一致。
|
||||
|
||||
## 5. 组件复用
|
||||
* 使用了 `src/shared/components/ui` 中的 Shadcn 组件:
|
||||
* `Dialog`, `ScrollArea`, `Card`, `Button`, `Input`, `Textarea`, `Select`.
|
||||
* `Collapsible` 用于实现递归章节树。
|
||||
* `AlertDialog` 用于危险操作的二次确认(删除章节/删除知识点)。
|
||||
* 图标库统一使用 `lucide-react`.
|
||||
|
||||
## 6. Settings 功能实现 (New)
|
||||
@@ -92,7 +110,39 @@ src/
|
||||
* **Edit**: 修改教材的基本信息。
|
||||
* **Delete**: 提供红色删除按钮,二次确认后执行删除并跳转回列表页。
|
||||
|
||||
## 7. 后续计划 (Next Steps)
|
||||
* [ ] **富文本编辑器**: 集成 Tiptap 替换现有的 Markdown Textarea,支持更丰富的格式。
|
||||
* [ ] **拖拽排序**: 实现章节树的拖拽排序 (`dnd-kit`)。
|
||||
* [ ] **数据库对接**: 将 `data-access.ts` 中的 Mock 逻辑替换为真实的 `drizzle-orm` 数据库调用。
|
||||
## 7. 关键更新记录 (Changelog)
|
||||
|
||||
### 7.1 数据与页面
|
||||
* 教材模块从 Mock 切换为真实 DB:新增教材/章节/知识点的数据访问与 Server Actions 刷新策略。
|
||||
* 列表页支持过滤/搜索:通过 query 参数驱动,统一空状态反馈。
|
||||
|
||||
### 7.2 章节侧边栏与弹窗
|
||||
* 修复子章节创建弹窗“闪现后消失”:改为受控 Dialog 状态管理。
|
||||
* 修复移动端操作按钮不可见/被遮挡:调整布局与可见性策略,确保小屏可点。
|
||||
* 删除章节使用确认弹窗并提供删除中状态。
|
||||
|
||||
### 7.3 Markdown 阅读体验
|
||||
* 阅读模式使用 `react-markdown` 渲染章节内容,支持 GFM(表格/任务列表等)。
|
||||
* 启用 Typography(`prose`)排版样式,使 `h1/h2/...` 在视觉上有明显层级差异。
|
||||
* 修复阅读模式内容区无法滚动:为 flex 容器补齐 `min-h-0` 等必要约束。
|
||||
|
||||
### 7.4 知识点删除交互
|
||||
* 删除知识点从浏览器 `confirm()` 升级为 `AlertDialog`:
|
||||
* 显示目标名称、危险样式按钮
|
||||
* 删除中禁用交互并显示 loading 文案
|
||||
* 删除成功后刷新页面数据
|
||||
|
||||
### 7.5 学生端 Textbooks 列表与阅读页(New)
|
||||
* 新增学生端路由:
|
||||
* `/student/learning/textbooks`:教材列表页(RSC),复用筛选组件(nuqs)与卡片布局。
|
||||
* `/student/learning/textbooks/[id]`:教材阅读页(RSC + client 阅读器容器),章节选择与阅读不跳页。
|
||||
* 复用与适配:
|
||||
* `TextbookCard` 增加可配置跳转基地址,避免学生端卡片误跳到教师端详情页。
|
||||
* 新增 `TextbookReader`(client)用于只读阅读体验:左侧章节树 + 右侧正文渲染,章节定位 URL 化(`chapterId`)。
|
||||
* 质量门禁:
|
||||
* 通过 `npm run lint / typecheck / build`。
|
||||
|
||||
## 8. 后续计划 (Next Steps)
|
||||
* [ ] **富文本编辑器**: 集成编辑器替换当前 Markdown Textarea,提升编辑体验。
|
||||
* [ ] **拖拽排序**: 实现章节树拖拽排序与持久化。
|
||||
* [ ] **知识点能力增强**: 支持编辑、排序、分层(如需要)。
|
||||
|
||||
Reference in New Issue
Block a user