教师工作台 (Teacher Workbench)

面向中小学教师的一体化教学与班主任工作台，作为 DSH 静态 Web 插件 运行在浏览器中，进程重启后自动恢复。

v0.1.1 — 一键安装：支持 dsh plugin add 一键安装，自动注册 Loader 与 Profile Bundle，无需手动编辑 cordis.patch.yml 或 package.json。

界面基于暖白底色 + 蓝紫主色（#4F63D2）的 Notion Warm Workspace × Editorial Magazine 风格，内置手写 SVG 图表（折线 / 雷达 / 分组柱状 / 环形图），无需任何外部图表库。

---

✨ 功能

教学功能

• 今日工作台 — 课程 / 待办 / 备课进度 / 下一步建议
• 教学驾驶舱 — 平行班对比、五维能力雷达图、教学风险预警
• 个人课表 — 周课表 + 单课跳转备课资源
• 教学日历 — 月历 + 学期规划
• 备课中心 — AI 评分与校验建议、课堂流程编辑、教案 localStorage 持久化
• 本学期课程 — 平行班进度对比
• 教育热点 — 政策 / 教研 / 教材动态
• 优质课例库 — 精选可复用教学经验
• 我的知识库 — 长期沉淀个人教学资产
• AI 教师助手 — 上下文感知对话，建议一键同步到待办 / 备课

班主任功能

• 班级概览（成绩趋势）、学生列表（搜索 / 筛选）
• 🪑 座位管理 — 6×6 座位网格，点击交换 / 拖拽移动，随机排座，智能排座规则（男女隔列 / 按身高 / 成绩帮扶配对）
• 成绩分析（柱状 + 环形 + 趋势图）、出勤率统计
• 通知发布、班会记录、家校沟通
• 学生评价（五维素质）、教学资源库、节日活动方案、黑板报素材、学年学期管理

---

🏗 架构

静态 Web 插件结构

tai-teacher-workbench/
├── package.json          # dsh.client + dsh.bundle.patch 声明 + exports["./client"]
├── cordis.patch.yml      # Bundle layer patch（Loader 插入条目）
├── tsconfig.json         # TypeScript 配置
├── tsdown.config.ts      # tsdown 构建配置
├── src/
│   ├── index.ts          # Host 半区（纯 UI 插件，空 apply）
│   └── client/
│       ├── index.ts      # Client 入口：shell.overlay 注册 + CSS 注入
│       ├── app.ts        # 主 UI 组件（React.createElement，~1440 行）
│       ├── ai.ts         # AI 离线模拟生成器（9 种场景模板）
│       ├── data.ts       # 嵌入的教学 / 班级 Mock 数据
│       └── styles.ts     # CSS 样式字符串
└── lib/
    ├── index.js          # Host 半区构建产物
    ├── client.js         # Client bundle（CJS，~225 KB）
    └── client.js.map     # Source map

从动态插件到静态插件的关键变更

动态 Cordis 插件	静态 Web 插件
harness.handle / host.call RPC	数据嵌入 Client bundle、AI 本地生成
ctx.timeout() (Host 沙箱)	setTimeout() (原生浏览器)
styles.insert()	<style> 标签注入 + ctx.effect() 清理
eval(new Function(...)) 执行 UI 源码	TypeScript 直接 import + tsdown 打包
教案 fs 持久化 (Host fs 服务)	localStorage 持久化 (浏览器原生)
会话级生命周期，重启消失	进程级生命周期，重启保留
手动粘贴代码到 cordis_define	npm install 一键安装

---

🚀 安装与使用

一键安装（推荐）

dsh plugin add @pzchenhui/dsh-extension-tai-teacher-workbench

插件声明了 dsh.bundle.patch，DSH CLI 会自动：

1. 在 Profile 目录执行 pnpm add
2. 读取 cordis.patch.yml 中的 Loader 插入条目
3. 将插件添加到 dsh.profile.bundles 列表
4. 下次启动时自动加载 Client bundle

安装后重启 DSH Web 服务，右下角出现「教师工作台」悬浮按钮，点击进入。

npm 手动安装

npm install @pzchenhui/dsh-extension-tai-teacher-workbench
# 或
pnpm add @pzchenhui/dsh-extension-tai-teacher-workbench

在 DSH 中注册

1. 将插件添加到 cordis.patch.yml 的浏览器 roster：

- id: tai-teacher-workbench
  name: '@pzchenhui/dsh-extension-tai-teacher-workbench'

2. 将包添加到 package.json 依赖：

{
  "dependencies": {
    "@pzchenhui/dsh-extension-tai-teacher-workbench": "^0.1.0"
  }
}

3. 重启 DSH Web 服务

4. 右下角出现「教师工作台」悬浮按钮，点击进入

从源码构建

cd packages/extensions/tai-teacher-workbench
pnpm install
pnpm run bundle    # 输出 lib/index.js + lib/client.js

---

🧩 DSH 集成细节

• Host 半区：空 apply() — 纯 UI 插件，无 Host 端逻辑
• Client 入口：注册 shell.overlay 槽位 + 注入 CSS 样式
• dsh.client 声明：

{
  "dsh": {
    "bundle": {
      "patch": "./cordis.patch.yml"
    },
    "client": {
      "inject": [
        "@deepseek-ai/dsh-client-runtime",
        "@deepseek-ai/dsh-client-ui-slots"
      ],
      "platform": "web"
    }
  }
}

• Module Loader：Client bundle 通过 window.__ModuleLoader__.load() 注册，由 DSH 模块扫描器在启动时发现

---

📝 技术要点

• UI 框架：React 18，全部使用 React.createElement（无 JSX / 编译步骤）
• 数据：Mock 数据直接嵌入 Client bundle（从原始 data.json 转译为 TypeScript as const）
• AI 生成：9 种场景的离线模板生成器，模拟 600-1400ms 延迟
• 教案持久化：localStorage 存取，首次加载从嵌入数据播种
• CSS：23KB+ 手写样式，通过 <style data-plugin="tai-teacher-workbench"> 注入，插件卸载时自动移除
• 图表：手写 SVG（折线图、雷达图、分组柱状图、环形图），零外部依赖
• 设计规范：Notion Warm Workspace × Editorial Magazine

---

📦 npm

• 包名：@pzchenhui/dsh-extension-tai-teacher-workbench
• 版本：0.1.1
• 许可：MIT
• 大小：146.3 KB (gzipped)

---

📄 License

MIT