Compare commits

..
11 Commits
Author SHA1 Message Date
xuyueandClaude Opus 5.5 489274ba0e feat: 加 prompt-stats 脚本,对比某天前后学生和 AI 对话的情况
Deploy / deploy (build, debian, 22) (push) Canceled after 0s
轮数分布、层级分布、第 2 轮起的 L1、只粘贴外部代码的比例、“出问题了”“帮我写清楚”
和交作品反思的使用情况。只读。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 22:16:33 +08:00
xuyueandClaude Opus 5.5 e9127318cb feat: “出问题了”三栏说清问题,交作品时写一句反思,外部提示词至少 8 个字
Deploy / deploy (build, debian, 22) (push) Canceled after 0s
- 对话框加“出问题了”:做了什么 / 想看到什么 / 实际看到了什么拼成一句发给 AI;
  只说“还是不行”这类的提醒一次,可以直接发
- “交这一版”先弹框问最满意的改动和理由(可以不写),存在 submission_reflection,
  批改面板显示为“学生说”,只有老师和作者本人看得到
- 粘贴外部 AI 代码时提示词至少 8 个字,可以把几轮都贴进来

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 22:10:48 +08:00
xuyueandClaude Opus 5.5 5bdacc438d feat: 挑战的题目要求发给 AI 当对照清单,学生没提到的不替他做,在“想一想”里问
Deploy / deploy (build, debian, 22) (push) Canceled after 0s
学生不用再整段贴题目;AI 只做学生说了的,从没提到的要求里挑一项问他打算怎么做。
整段贴了题目的照做。自由创作的题目是学生自己写的,不发。输入框提示改成“用你自己的话说说”。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 21:40:04 +08:00
xuyueandClaude Opus 5.5 43c18cdb88 feat: AI 回复说明替学生定了什么并问一个问题,“帮我写清楚”能看到题目和之前的对话
Deploy / deploy (build, debian, 22) (push) Canceled after 0s
- 生成回复分“做了什么 / 我替你定的 / 想一想”三项;只问问题时直接回答、不给代码
- 没有代码的回复发 code: null,不再清空网页;上下文保留最近一份带代码的回复
- 教练带上题目要求、最近的提问和 AI 上一次的说明,照搬题目不算写清楚

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 21:36:06 +08:00
xuyueandClaude Opus 5.5 9fee688d95 fix: AI 对话和引导里的提问回复完后自动打层级
Deploy / deploy (build, debian, 22) (push) Canceled after 0s
旧后端在消息保存后自动分类,改写成 Bun 时漏了:只有外部 AI 版本和手动提交带的提示词会分类,
学生在 AI 对话和引导里发的提问都没有层级。现在回复存库后在后台分类(失败或断开的提问不分类)。

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 21:13:46 +08:00
xuyueandClaude Opus 5.5 9f3f7187e1 feat: AI 对话等待时显示构思了多久,代码不在对话里展开
Deploy / deploy (build, debian, 22) (push) Canceled after 0s
deepseek-flash 生成代码前要思考,复杂的题第一个字要等一两分钟,之前只有三个跳动的点;
出字后又把几万字的代码一段段渲染在对话里,学生并不看代码,机房的旧机器也吃力。

- 出字前显示“AI 正在构思… 已 N 秒”,超过 20 秒提示复杂的网页要想一两分钟
- 生成中只显示文字说明和“正在写网页… 已写 N 行”;写完的回复里代码块换成
  “网页代码 N 行,在右边‘代码’里看”

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 21:09:47 +08:00
xuyueandClaude Opus 5.5 6b2ffbb3ec fix: 按 DeepSeek 文档为每种调用指定是否思考,修复分类器拿不到结果
deepseek-flash 默认先思考(reasoning_effort high),思考也占输出 token,思考模式下 temperature 无效。
分类器只给 10 个 token,全被思考用掉,正文为空,切到新后端后的提问都没有层级。

- 生成代码:开思考;引导:关思考,回得快;分类:关思考,temperature 0 才生效
- thinking 只发给 DeepSeek,豆包请求不变
- 实测 deepseek-flash:分类约 1.2s,引导约 1.5s;固定 68 条样本两次一致 65 条

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 20:53:30 +08:00
xuyueandClaude Opus 5.5 b765cbf1aa fix: 理清 L1/L2 的含义,并写死几条容易判错的边界
- L2 理解按布鲁姆的本义改成“想弄懂原理”:问为什么、是什么意思、怎么做到的;
  只报结果(“没反应”“进不去”“有 bug”)归 L1
- 标准改成按顺序判断,并写明:只说风格和功能没有理由是 L3 不是 L5,
  说明要改成什么样是 L3 不是 L4,整段贴题目要求是 L3 不是 L1
- 生产库副本固定抽 70 条(含 10 条“为什么”提问),两次结果一致 66/68

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 20:45:44 +08:00
xuyueandClaude Opus 5.5 e06930c8f7 feat: 提示词链显示层级走势、每轮改了多少行;课堂总结加“怎么问的 AI”
- 提示词弹框:顶部每轮一根层级柱子,点了跳到那一轮;每轮标出代码比上一版 +/− 多少行
  (没改标“代码没变”),和前面某轮一字不差的提问标“重复提问”
- 课堂总结:每人最新一版平均几轮、一轮就交、最后一版用外部 AI、问过引导的比例,
  以及各层级提问次数
- prompt_message 加两个覆盖索引,统计只读小列(像素画板全部班级 197 份约 0.3 ms)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 20:35:33 +08:00
xuyueandClaude Opus 5.5 f41fda3c19 feat: 提示词分类按“指挥 AI 做网页”的场景重写标准,并带上题目和上一轮
- 以前只看单句、例子是学前端知识,把题目要求原样贴过去也判成 L6(首轮近一半 L6)。
  现在把题目要求和同一对话里上一轮的提问一起发给模型,只看学生自己想的部分:
  照搬题目功能清单算 L3,重复上一轮不高于上一轮
- L1–L6 说明跟着改成新的标准
- 生产库副本抽 60 条:新标准两次结果一致 57 条;L3 占 75%,L6 从 25 条降到 4 条

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 20:35:33 +08:00
xuyueandClaude Opus 5.5 30630e8125 fix: 提示词链里的引导提问不算轮数,分类器固定结果、跳过过短输入
- 引导对话和 AI 对话存在同一个对话里,提示词链把它当成一轮“AI 对话”,显示“没有网页”。
  现在标成“引导”,淡化显示,不计入轮数,也不能选中(↑↓ 跳过)
- 分类器 temperature 设为 0:同一句提示词以前约两成会被打成不同层级
- 不到 4 个字的提问(“1”“,”等)不打层级,--force 重标时清掉旧标签

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-10-27 20:26:29 +08:00
23 changed files with 1140 additions and 98 deletions

No files matched your search

+4 -3
View File
@@ -17,9 +17,9 @@ The backend was rewritten from Django in 2026-10 to cut memory use (~25 MB vs. 1
- `src/auth.ts` — Django-compatible password hashing; JWT login, no cookies: `POST /account/login` returns a 15-min HS256 `access_token` (sent as `Authorization: Bearer`, signed with `JWT_SECRET`, random per process if unset) and a 14-day opaque `refresh_token` (only its sha256 is stored, in `auth_refresh_token`; `POST /account/refresh` trades it for a new access token, logout / password change / deactivation delete it). An invalid or expired Bearer token is a 401 even on public endpoints so the client knows to refresh. `requireUser/requireAdmin/requireSuper` (401 / 403) - `src/auth.ts` — Django-compatible password hashing; JWT login, no cookies: `POST /account/login` returns a 15-min HS256 `access_token` (sent as `Authorization: Bearer`, signed with `JWT_SECRET`, random per process if unset) and a 14-day opaque `refresh_token` (only its sha256 is stored, in `auth_refresh_token`; `POST /account/refresh` trades it for a new access token, logout / password change / deactivation delete it). An invalid or expired Bearer token is a 401 even on public endpoints so the client knows to refresh. `requireUser/requireAdmin/requireSuper` (401 / 403)
- `src/routes/` — `account`, `tasks` (tutorial / challenge / creation), `files` (task assets + image upload), `submission`, `showcase` (mounted under `/submission/showcase`), `review` (mounted under `/submission/review`: teacher class × task wall — no `classname` means all classes —, students' peer works with `scope=class|all`), `prompt` - `src/routes/` — `account`, `tasks` (tutorial / challenge / creation), `files` (task assets + image upload), `submission`, `showcase` (mounted under `/submission/showcase`), `review` (mounted under `/submission/review`: teacher class × task wall — no `classname` means all classes —, students' peer works with `scope=class|all`), `prompt`
- Who can read a submission (`canView` in `routes/submission.ts`): staff, the owner, anyone if it's in the showcase, or any student who has submitted the same task (any class). Students' `GET /submission/` only lists their own. Peer works and the random-rating item are anonymous until the viewer rates them (`PUT /:id/score` returns the author). `flag` now only carries `present` (teacher's in-class presentation queue); the old four colors are no longer shown - Who can read a submission (`canView` in `routes/submission.ts`): staff, the owner, anyone if it's in the showcase, or any student who has submitted the same task (any class). Students' `GET /submission/` only lists their own. Peer works and the random-rating item are anonymous until the viewer rates them (`PUT /:id/score` returns the author). `flag` now only carries `present` (teacher's in-class presentation queue); the old four colors are no longer shown
- `src/services/` — `score.ts` (rating weights super×0.5, admin×0.3, normal×0.2, then Bayesian smoothing with C=3 and zones), `gradebook.ts`, `llm.ts` (OpenAI-compatible streaming via fetch; DeepSeek default, ARK for doubao models; chat context is the last 20 messages with older code blocks elided), `classifier.ts` (Bloom-level L1–L6 prompt tagging, runs in background), `cascade.ts` (Django's CASCADE deletes done by hand, plus the shared delete rules: `hasRatingsOrAwards`, `deleteRound`), `pyround.ts` (`pyRound`/`pySum` reproduce Python's `round()` and `sum()` so scores match the old system bit-for-bit) - `src/services/` — `score.ts` (rating weights super×0.5, admin×0.3, normal×0.2, then Bayesian smoothing with C=3 and zones), `gradebook.ts`, `llm.ts` (OpenAI-compatible streaming via fetch; DeepSeek default, ARK for doubao models; chat context is the last 20 messages with code kept only in the newest reply that has code. Chat replies are written as **做了什么 / 我替你定的 / 想一想** — the decisions the AI made for the student and one open question, to prompt the next round; a reply to a plain question has no code and the WebSocket sends `code: null`. For challenges the AI also gets the task brief (`challengeBrief`) as a checklist only (`BRIEF_RULES`): it builds just what the student asked for and asks about one missing requirement in “想一想”; creations get no brief. The “帮我写清楚” coach gets the task brief, recent prompts and the last AI explanation from `guidanceContext` in `services/prompt.ts`, and judges by what the student added beyond the brief, like the classifier), `classifier.ts` (Bloom-level L1–L6 prompt tagging, runs in background; the model sees the task brief and the previous prompt, temperature 0, prompts under 4 chars get no level), `cascade.ts` (Django's CASCADE deletes done by hand, plus the shared delete rules: `hasRatingsOrAwards`, `deleteRound`), `pyround.ts` (`pyRound`/`pySum` reproduce Python's `round()` and `sum()` so scores match the old system bit-for-bit)
- `src/ws.ts` — `/ws/prompt/<task_id>/?token=<access_token>` (code generation chat; the AI context and the page's chat include `conversation`, `edit` and `manual` messages) and `/ws/guidance/<task_id>/?token=...` (prompt coaching); one message per connection at a time (a message sent while the AI is still replying gets an error, payloads capped at 64 KB); on disconnect the pending user message is deleted and the LLM request aborted - `src/ws.ts` — `/ws/prompt/<task_id>/?token=<access_token>` (code generation chat; the AI context and the page's chat include `conversation`, `edit` and `manual` messages) and `/ws/guidance/<task_id>/?token=...` (prompt coaching); one message per connection at a time (a message sent while the AI is still replying gets an error, payloads capped at 64 KB); on disconnect the pending user message is deleted and the LLM request aborted
- `scripts/` — one-off CLIs: `create-superuser.ts`, `classify-prompts.ts`, `recalculate-scores.ts` - `scripts/` — one-off CLIs: `create-superuser.ts`, `classify-prompts.ts`, `recalculate-scores.ts`, `prompt-stats.ts` (read-only before/after comparison of AI-chat behavior: rounds, levels, external-code share, “出问题了” / reflection usage)
- Roles: `super`, `admin`, `normal`. Task model is multi-table: `task_task` + one of `task_tutorial` / `task_challenge` / `task_creation` (`task_ptr_id`) - Roles: `super`, `admin`, `normal`. Task model is multi-table: `task_task` + one of `task_tutorial` / `task_challenge` / `task_creation` (`task_ptr_id`)
- **`client/`** — Vue 3 + TypeScript SPA built with **Vite**; Bun is the package manager and runtime (no Node/npm) - **`client/`** — Vue 3 + TypeScript SPA built with **Vite**; Bun is the package manager and runtime (no Node/npm)
@@ -30,7 +30,7 @@ The backend was rewritten from Django in 2026-10 to cut memory use (~25 MB vs. 1
- `src/router.ts` — Vue Router; `meta.auth` needs login, `meta.role` (`staff` = admin+super, `super`) is checked in the guard after `store/session.loadUser()`, `meta.bare` pages render without the top bar - `src/router.ts` — Vue Router; `meta.auth` needs login, `meta.role` (`staff` = admin+super, `super`) is checked in the guard after `store/session.loadUser()`, `meta.bare` pages render without the top bar
- `src/theme.ts` — the only place colors are defined: one palette (light + dark values) becomes both `--wp-*` CSS variables and Naive UI `themeOverrides`; use `var(--wp-...)` in styles, never hard-coded colors (iframes stay white: they show students' pages). No `color-mix()` (Chrome 105). `store/theme.ts` holds the mode (auto / light / dark, toggled in the top bar) and sets `data-theme` on `<html>`; `styles/dark-content.css` is generated from the GitHub dark markdown and highlight.js styles (selectors prefixed with `:root[data-theme="dark"]`); CodeMirror uses One Dark highlighting in dark mode - `src/theme.ts` — the only place colors are defined: one palette (light + dark values) becomes both `--wp-*` CSS variables and Naive UI `themeOverrides`; use `var(--wp-...)` in styles, never hard-coded colors (iframes stay white: they show students' pages). No `color-mix()` (Chrome 105). `store/theme.ts` holds the mode (auto / light / dark, toggled in the top bar) and sets `data-theme` on `<html>`; `styles/dark-content.css` is generated from the GitHub dark markdown and highlight.js styles (selectors prefixed with `:root[data-theme="dark"]`); CodeMirror uses One Dark highlighting in dark mode
- `src/icons.ts` — `<Icon icon="lucide:name" />` renders bundled `lucide-vue-next` icons (works offline); register new names in its map. Fonts are bundled too (`@fontsource/jetbrains-mono`) - `src/icons.ts` — `<Icon icon="lucide:name" />` renders bundled `lucide-vue-next` icons (works offline); register new names in its map. Fonts are bundled too (`@fontsource/jetbrains-mono`)
- `components/workbench/Workbench.vue` — shared challenge / creation page: left = brief + AI chat (`PromptPanel`), right = preview / code (`CodeTabs`) + `VersionBar`. Every assistant message with code is a version; hand edits and pasted external-AI code are saved as versions via `POST /prompt/versions` (`source` `edit` / `manual`, stored as a user+assistant pair). Challenges are submitted only when the student clicks “交这一版” (`POST /submission/` with `message_id`), never automatically. Editor code is per task (`composables/useTaskCode.ts`, localStorage `web-code:<user>:<task>`); the tutorial page edits the shared `store/editors.ts` refs but `Workspace.vue` saves them under the same per-task key and `TutorialContent` restores them (example code only the first time) - `components/workbench/Workbench.vue` — shared challenge / creation page: left = brief + AI chat (`PromptPanel`), right = preview / code (`CodeTabs`) + `VersionBar`. Every assistant message with code is a version; hand edits and pasted external-AI code are saved as versions via `POST /prompt/versions` (`source` `edit` / `manual`, stored as a user+assistant pair). Challenges are submitted only when the student clicks “交这一版” (`POST /submission/` with `message_id`), never automatically; `SubmitModal` first asks an optional one-line reflection (最满意的改动和理由), stored in `submission_reflection` (`ON DELETE CASCADE`, returned by `GET /submission/:id` only to staff and the author, shown as “学生说” in `ReviewPanel`). In `PromptPanel`, “出问题了” is a three-field form (做了什么 / 想看到什么 / 实际看到了什么) joined into one prompt; a short vague complaint (“还是不行”) gets a one-time hint offering it. Pasted external-AI prompts need at least 8 characters Editor code is per task (`composables/useTaskCode.ts`, localStorage `web-code:<user>:<task>`); the tutorial page edits the shared `store/editors.ts` refs but `Workspace.vue` saves them under the same per-task key and `TutorialContent` restores them (example code only the first time)
- `pages/ChallengeHome.vue` — challenge list page; `pages/TaskEditor.vue` (prop `kind`) is the single tutorial / challenge authoring page - `pages/ChallengeHome.vue` — challenge list page; `pages/TaskEditor.vue` (prop `kind`) is the single tutorial / challenge authoring page
- `pages/Review.vue` (“批改”, default teaching page) + `components/review/ReviewPanel.vue` (also opened from the gradebook) — opens as a large preview (wall hidden, Esc returns; “小面板” switches to a side panel, remembered); keys: J/K previous/next student (by key position), 1–5 rate, P present; “全部班级” groups the wall by class; `components/review/PeersDrawer.vue` is the students' “同学作品” (本班 / 全部班级) - `pages/Review.vue` (“批改”, default teaching page) + `components/review/ReviewPanel.vue` (also opened from the gradebook) — opens as a large preview (wall hidden, Esc returns; “小面板” switches to a side panel, remembered); keys: J/K previous/next student (by key position), 1–5 rate, P present; “全部班级” groups the wall by class; `components/review/PeersDrawer.vue` is the students' “同学作品” (本班 / 全部班级)
- `components/layout/AppShell.vue` — top bar for every page; `pages/Dashboard.vue` is the teaching sidebar (“教学”) under `/dashboard` - `components/layout/AppShell.vue` — top bar for every page; `pages/Dashboard.vue` is the teaching sidebar (“教学”) under `/dashboard`
@@ -62,6 +62,7 @@ bun run typecheck
bun scripts/create-superuser.ts <username> <password> bun scripts/create-superuser.ts <username> <password>
bun scripts/classify-prompts.ts [--task-id N] [--force] [--dry-run] bun scripts/classify-prompts.ts [--task-id N] [--force] [--dry-run]
bun scripts/recalculate-scores.ts [--dry-run] bun scripts/recalculate-scores.ts [--dry-run]
bun scripts/prompt-stats.ts <split-date> [--from date] [--to date] # dates in Beijing time
``` ```
Config comes from `server/.env` (see `server/.env.example`); dev DB is `server/data/db.sqlite3`, uploads go to the repo-root `media/`. Config comes from `server/.env` (see `server/.env.example`); dev DB is `server/data/db.sqlite3`, uploads go to the repo-root `media/`.
+2
View File
@@ -264,6 +264,7 @@ export const Submission = {
prompt?: string prompt?: string
}, },
messageId?: number, messageId?: number,
reflection?: string,
) { ) {
const { prompt, ...rest } = code const { prompt, ...rest } = code
const data = { const data = {
@@ -271,6 +272,7 @@ export const Submission = {
...rest, ...rest,
prompt: prompt || null, prompt: prompt || null,
message_id: messageId ?? null, message_id: messageId ?? null,
reflection: reflection || null,
} }
const res = await http.post("/submission/", data) const res = await http.post("/submission/", data)
return res.data return res.data
+179 -9
View File
@@ -52,20 +52,59 @@
<!-- Streaming indicator --> <!-- Streaming indicator -->
<div v-if="streaming" class="message assistant"> <div v-if="streaming" class="message assistant">
<div class="message-role">AI</div> <div class="message-role">AI</div>
<div v-if="!streamingContent" class="typing-indicator"> <template v-if="!streamingContent">
<div class="typing-indicator">
<span></span><span></span><span></span> <span></span><span></span><span></span>
</div> </div>
<div class="streaming-hint">
AI 正在构思… 已 {{ elapsedText }}<template v-if="elapsed >= 20">,复杂的网页要想一两分钟</template>
</div>
</template>
<template v-else>
<div <div
v-else v-if="streamParts.prose"
class="message-content" class="message-content"
v-html="renderMarkdown(streamingContent)" v-html="renderMarkdown(streamParts.prose)"
></div> ></div>
<div class="streaming-hint">AI 正在生成中…</div> <div v-if="streamParts.lines >= 0" class="code-progress">
<Icon icon="lucide:sparkles" :width="14" />
正在写网页… 已写 {{ streamParts.lines }} 行
</div>
<div v-else class="streaming-hint">AI 正在回复…</div>
</template>
</div> </div>
<RatingCard v-if="rating" :active="streaming" /> <RatingCard v-if="rating" :active="streaming" />
</div> </div>
<GuidancePanel @generate="onGuidanceGenerate" /> <GuidancePanel @generate="onGuidanceGenerate" />
<div class="input-area"> <div class="input-area">
<!-- 只说“不行”“没反应”时提醒一下,可以直接发 -->
<div v-if="vagueHint" class="vague-hint">
<span>说清楚哪里不对,AI 更容易一次修好</span>
<n-flex :size="4" :wrap="false">
<n-button size="tiny" type="primary" secondary @click="openProblem">说清楚</n-button>
<n-button size="tiny" quaternary @click="sendAnyway">直接发</n-button>
</n-flex>
</div>
<div v-if="problemOpen" class="problem">
<div class="problem-title">出问题了?说清楚这三件事</div>
<label>我做了什么</label>
<n-input v-model:value="problem.did" placeholder="比如:点了「开始」按钮" />
<label>想看到什么</label>
<n-input v-model:value="problem.want" placeholder="比如:倒计时开始走" />
<label>实际看到了什么</label>
<n-input v-model:value="problem.saw" placeholder="比如:数字一直停在 60 不动" />
<n-flex justify="end" :size="8" style="margin-top: 10px">
<n-button @click="problemOpen = false">取消</n-button>
<n-button
type="primary"
:disabled="!problem.did.trim() || !problem.saw.trim() || !connected || streaming"
@click="sendProblem"
>
发给 AI
</n-button>
</n-flex>
</div>
<template v-else>
<n-flex <n-flex
class="prompt-input-row" class="prompt-input-row"
align="flex-start" align="flex-start"
@@ -76,7 +115,7 @@
v-model:value="input" v-model:value="input"
type="textarea" type="textarea"
:autosize="{ minRows: 1, maxRows: 4 }" :autosize="{ minRows: 1, maxRows: 4 }"
placeholder="描述你想要的网页效果..." placeholder="用你自己的话说说想做成什么样…"
:disabled="streaming" :disabled="streaming"
style="flex: 1; min-width: 0" style="flex: 1; min-width: 0"
@keydown.enter.exact.prevent="send" @keydown.enter.exact.prevent="send"
@@ -98,7 +137,19 @@
AI 教练会问你几个问题,帮你把想要的效果描述清楚 AI 教练会问你几个问题,帮你把想要的效果描述清楚
</n-tooltip> </n-tooltip>
</n-flex> </n-flex>
<n-flex justify="flex-end" align="center" style="margin-top: 8px"> <n-flex justify="space-between" align="center" style="margin-top: 8px">
<n-tooltip>
<template #trigger>
<n-button quaternary :disabled="!hasVersion || streaming" @click="openProblem">
<template #icon>
<Icon icon="lucide:bug" :width="16" />
</template>
出问题了
</n-button>
</template>
网页哪里不对?说清楚做了什么、想看到什么、实际看到了什么
</n-tooltip>
<n-flex align="center" :size="8">
<n-select <n-select
v-model:value="selectedModel" v-model:value="selectedModel"
:options="modelOptions" :options="modelOptions"
@@ -117,12 +168,14 @@
发送 发送
</n-button> </n-button>
</n-flex> </n-flex>
</n-flex>
</template>
</div> </div>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, watch, nextTick, computed } from "vue" import { ref, reactive, watch, nextTick, computed, onUnmounted } from "vue"
import { useStorage } from "@vueuse/core" import { useStorage } from "@vueuse/core"
import { useMessage } from "naive-ui" import { useMessage } from "naive-ui"
import { Icon } from "../../icons" import { Icon } from "../../icons"
@@ -133,6 +186,7 @@ import {
messages, messages,
streaming, streaming,
streamingContent, streamingContent,
streamStartedAt,
connected, connected,
sendPrompt, sendPrompt,
stopPrompt, stopPrompt,
@@ -221,6 +275,46 @@ async function deletePair(assistantMsgId: number) {
async function send() { async function send() {
const text = input.value.trim() const text = input.value.trim()
if (!text || streaming.value) return if (!text || streaming.value) return
// 只说“不行”“没反应”,AI 只能瞎猜;提醒一次,学生选“直接发”以后这次就不再拦
if (!skipVagueCheck && hasVersion.value && [...text].length <= 15 && VAGUE.test(text)) {
vagueHint.value = true
return
}
input.value = ""
await props.beforeSend?.()
sendPrompt(text, selectedModel.value)
}
// “出问题了”:做了什么、想看到什么、实际看到了什么,拼成一句发给 AI
const VAGUE =
/不行|不对|没反应|没用|没效果|用不了|不能用|不能玩|动不了|进不去|打不开|没显示|不显示|显示不出|bug|出错|报错|错了|坏了|白屏|空白|有问题/i
const vagueHint = ref(false)
let skipVagueCheck = false
const problemOpen = ref(false)
const problem = reactive({ did: "", want: "", saw: "" })
watch(input, () => (vagueHint.value = false))
const hasVersion = computed(() => messages.value.some((m) => m.role === "assistant" && hasCode(m)))
function openProblem() {
vagueHint.value = false
problemOpen.value = true
}
function sendAnyway() {
skipVagueCheck = true
vagueHint.value = false
send()
}
async function sendProblem() {
const part = (s: string) => s.trim().replace(/[。,,.!!;;]+$/, "")
const did = part(problem.did).replace(/^我/, "")
const want = part(problem.want)
const text = `我${did},${want ? `想看到${want},` : ""}但实际${part(problem.saw)}。`
Object.assign(problem, { did: "", want: "", saw: "" })
problemOpen.value = false
input.value = "" input.value = ""
await props.beforeSend?.() await props.beforeSend?.()
sendPrompt(text, selectedModel.value) sendPrompt(text, selectedModel.value)
@@ -238,10 +332,47 @@ async function onGuidanceGenerate(finalPrompt: string) {
sendPrompt(finalPrompt, selectedModel.value) sendPrompt(finalPrompt, selectedModel.value)
} }
function renderContent(msg: { role: string; content: string }): string { // 学生只关心成品:AI 回复里的代码块不在对话里展开(右边“代码”里能看),只说写了多少行。
return renderMarkdown(msg.content) // 按 ``` 切开,奇数段是代码;段数是偶数说明最后一个代码块还没写完
function splitCode(text: string) {
const parts = text.split("```")
const prose = parts.filter((_, i) => i % 2 === 0).join("\n\n").trim()
const code = parts.filter((_, i) => i % 2 === 1)
const lines = code.reduce((n, c) => n + c.split("\n").length - 1, 0)
return { prose, lines: code.length ? lines : -1 }
} }
const streamParts = computed(() => splitCode(streamingContent.value))
function renderContent(msg: { role: string; content: string }): string {
if (msg.role !== "assistant") return renderMarkdown(msg.content)
const { prose, lines } = splitCode(msg.content)
const note = lines >= 0 ? `<p class="code-note">网页代码 ${lines} 行,在右边“代码”里看</p>` : ""
return renderMarkdown(prose) + note
}
// 等 AI 的计时:每秒刷新一次
const now = ref(Date.now())
let ticker: ReturnType<typeof setInterval> | undefined
watch(
streaming,
(on) => {
clearInterval(ticker)
now.value = Date.now()
if (on) ticker = setInterval(() => (now.value = Date.now()), 1000)
},
{ immediate: true },
)
onUnmounted(() => clearInterval(ticker))
const elapsed = computed(() =>
streamStartedAt.value ? Math.max(0, Math.floor((now.value - streamStartedAt.value) / 1000)) : 0,
)
const elapsedText = computed(() => {
const s = elapsed.value
return s < 60 ? `${s} 秒` : `${Math.floor(s / 60)} 分 ${s % 60} 秒`
})
watch([() => messages.value.length, streamingContent], () => { watch([() => messages.value.length, streamingContent], () => {
nextTick(() => { nextTick(() => {
if (messagesRef.value) { if (messagesRef.value) {
@@ -377,6 +508,20 @@ watch([() => messages.value.length, streamingContent], () => {
} }
} }
.code-progress {
display: flex;
align-items: center;
gap: 6px;
margin-top: 6px;
font-size: 12px;
color: var(--wp-muted);
}
.message-content :deep(.code-note) {
font-size: 12px;
color: var(--wp-muted);
}
.streaming-hint { .streaming-hint {
font-size: 11px; font-size: 11px;
color: var(--wp-faint); color: var(--wp-faint);
@@ -384,6 +529,31 @@ watch([() => messages.value.length, streamingContent], () => {
animation: pulse 1.5s ease-in-out infinite; animation: pulse 1.5s ease-in-out infinite;
} }
.vague-hint {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-bottom: 8px;
padding: 6px 10px;
border-radius: 6px;
background: var(--wp-brand-soft);
font-size: 13px;
}
.problem-title {
margin-bottom: 4px;
font-size: 13px;
font-weight: 600;
}
.problem label {
display: block;
margin: 8px 0 4px;
font-size: 12px;
color: var(--wp-muted);
}
.input-area { .input-area {
flex-shrink: 0; flex-shrink: 0;
padding: 12px; padding: 12px;
+26 -2
View File
@@ -119,16 +119,21 @@
</n-popconfirm> </n-popconfirm>
</section> </section>
<section v-if="sub.reflection">
<h4>学生说</h4>
<div class="reflection">{{ sub.reflection }}</div>
</section>
<section> <section>
<n-flex justify="space-between" align="center" class="chain-head"> <n-flex justify="space-between" align="center" class="chain-head">
<h4>提示词 <span class="muted" v-if="chain.length">· {{ chain.length }} 轮</span></h4> <h4>提示词 <span class="muted" v-if="chainSteps">· {{ chainSteps }} 轮</span></h4>
<n-button v-if="chain.length" size="tiny" quaternary @click="showChain = true"> <n-button v-if="chain.length" size="tiny" quaternary @click="showChain = true">
逐轮看网页 逐轮看网页
</n-button> </n-button>
</n-flex> </n-flex>
<div v-if="!chain.length" class="muted">这份提交没有关联的提示词</div> <div v-if="!chain.length" class="muted">这份提交没有关联的提示词</div>
<ol class="chain"> <ol class="chain">
<li v-for="(r, i) in chain" :key="i"> <li v-for="(r, i) in chain" :key="i" :class="{ guide: r.source === 'guidance' }">
<n-flex :size="6" align="center"> <n-flex :size="6" align="center">
<span class="src">{{ sourceLabel(r.source) }}</span> <span class="src">{{ sourceLabel(r.source) }}</span>
<span v-if="r.prompt_level" class="level">{{ levelLabel(r.prompt_level) }}</span> <span v-if="r.prompt_level" class="level">{{ levelLabel(r.prompt_level) }}</span>
@@ -195,6 +200,8 @@ const versions = ref<SubmissionOut[]>([])
const chain = ref<PromptRound[]>([]) const chain = ref<PromptRound[]>([])
const rating = ref(false) const rating = ref(false)
const showChain = ref(false) const showChain = ref(false)
// 引导对话不生成网页,不算轮数
const chainSteps = computed(() => chain.value.filter((r) => r.source !== "guidance").length)
let awardsCache: Promise<AwardManageOut[]> | null = null let awardsCache: Promise<AwardManageOut[]> | null = null
const awards = ref<AwardManageOut[]>([]) const awards = ref<AwardManageOut[]>([])
@@ -477,6 +484,17 @@ h4 {
flex-wrap: wrap; flex-wrap: wrap;
} }
/* 交的时候写的反思 */
.reflection {
padding: 6px 10px;
border-left: 3px solid var(--wp-brand);
background: var(--wp-brand-soft);
font-size: 13px;
line-height: 1.6;
white-space: pre-wrap;
word-break: break-word;
}
.chain { .chain {
margin: 0; margin: 0;
padding-left: 20px; padding-left: 20px;
@@ -490,6 +508,12 @@ h4 {
color: var(--wp-muted); color: var(--wp-muted);
} }
/* 不是 list-item,就不占 ol 的序号 */
.chain .guide {
display: block;
color: var(--wp-muted);
}
.level { .level {
font: 600 11px var(--wp-font-mono); font: 600 11px var(--wp-font-mono);
color: var(--wp-brand); color: var(--wp-brand);
@@ -9,7 +9,7 @@
<template #header> <template #header>
<div class="head"> <div class="head">
<b>提示词</b> <b>提示词</b>
<span v-if="rounds.length" class="muted">{{ rounds.length }} 轮</span> <span v-if="steps" class="muted">{{ steps }} 轮</span>
<span v-if="title" class="muted title">{{ title }}</span> <span v-if="title" class="muted title">{{ title }}</span>
</div> </div>
</template> </template>
@@ -37,20 +37,37 @@
style="padding: 80px 0" style="padding: 80px 0"
/> />
<div v-else class="body"> <div v-else class="body">
<div class="left">
<div v-if="showTrend" class="trend">
<span class="muted">层级</span>
<div class="bars">
<button
v-for="b in trend"
:key="b.i"
:class="['bar', { on: b.i === selected, none: !b.level }]"
:style="{ height: `${b.level ? 6 + b.level * 5 : 4}px` }"
:title="`第 ${nums[b.i]} 轮${b.level ? ' · ' + levelLabel(b.level) : ''}`"
@click="select(b.i)"
></button>
</div>
</div>
<ol class="rounds"> <ol class="rounds">
<li <li
v-for="(r, i) in rounds" v-for="(r, i) in rounds"
:key="i" :key="i"
:class="['round', { on: i === selected }]" :class="['round', { on: i === selected, guide: isGuide(r) }]"
@click="selected = i" @click="isGuide(r) || (selected = i)"
> >
<div class="round-head"> <div class="round-head">
<span class="num">{{ i + 1 }}</span> <span class="num">{{ nums[i] }}</span>
<span :class="['src', `src-${r.source || 'conversation'}`]"> <span :class="['src', `src-${r.source || 'conversation'}`]">
{{ sourceLabel(r.source) }} {{ sourceLabel(r.source) }}
</span> </span>
<span v-if="r.prompt_level" class="level">{{ levelLabel(r.prompt_level) }}</span> <span v-if="r.prompt_level" class="level">{{ levelLabel(r.prompt_level) }}</span>
<span v-if="repeats[i]" class="repeat" title="和前面某一轮的提问一字不差">重复提问</span>
<span v-if="changes[i]" class="muted">{{ changes[i] }}</span>
<span v-if="i === rounds.length - 1" class="final">交的这一版</span> <span v-if="i === rounds.length - 1" class="final">交的这一版</span>
<span v-else-if="isGuide(r)" class="muted no-code">问写提示词的建议,不生成网页</span>
<span v-else-if="!r.html" class="muted no-code">没有网页</span> <span v-else-if="!r.html" class="muted no-code">没有网页</span>
</div> </div>
<div <div
@@ -62,10 +79,11 @@
</button> </button>
</li> </li>
</ol> </ol>
</div>
<div class="stage"> <div class="stage">
<div class="stage-head"> <div class="stage-head">
<b>第 {{ selected + 1 }} 轮生成的网页</b> <b>第 {{ nums[selected] }} 轮生成的网页</b>
<span class="muted">↑ ↓ 切换</span> <span class="muted">↑ ↓ 切换</span>
</div> </div>
<div class="frame"> <div class="frame">
@@ -110,6 +128,65 @@ const rounds = ref<PromptRound[]>([])
const selected = ref(0) const selected = ref(0)
const expanded = ref(new Set<number>()) const expanded = ref(new Set<number>())
// 引导对话(问怎么写提示词)夹在 AI 对话中间,不算轮数,也不能选中
const isGuide = (r: PromptRound) => r.source === "guidance"
const steps = computed(() => rounds.value.filter((r) => !isGuide(r)).length)
const nums = computed(() => {
let n = 0
return rounds.value.map((r) => (isGuide(r) ? "" : String(++n)))
})
// 层级走势:每轮 AI 对话 / 外部 AI 一根柱子,两轮以上、有标过层级才显示
const trend = computed(() =>
rounds.value.flatMap((r, i) => (isGuide(r) ? [] : [{ i, level: r.prompt_level }])),
)
const showTrend = computed(() => trend.value.length > 1 && trend.value.some((b) => b.level))
// 和前面某一轮一字不差的提问(手改那一轮的正文都一样,不算)
const repeats = computed(() => {
const seen = new Set<string>()
return rounds.value.map((r) => {
if (isGuide(r) || r.source === "edit") return false
const key = r.question.replace(/\s+/g, " ").trim()
const dup = seen.has(key)
seen.add(key)
return dup
})
})
// 这一轮的代码比上一版改了多少行:只按行内容数,不管顺序
function codeLines(r: PromptRound) {
return [r.html, r.css, r.js]
.join("\n")
.split("\n")
.map((l) => l.trim())
.filter(Boolean)
}
function lineDiff(before: string[], after: string[]) {
const left = new Map<string, number>()
for (const l of before) left.set(l, (left.get(l) ?? 0) + 1)
let added = 0
for (const l of after) {
const n = left.get(l) ?? 0
if (n) left.set(l, n - 1)
else added++
}
const removed = before.length - (after.length - added)
return added || removed ? `+${added} −${removed} 行` : "代码没变"
}
const changes = computed(() => {
let prev: string[] | null = null
return rounds.value.map((r) => {
if (isGuide(r) || !r.html) return ""
const cur = codeLines(r)
const text = prev ? lineDiff(prev, cur) : ""
prev = cur
return text
})
})
const doc = computed(() => { const doc = computed(() => {
const r = rounds.value[selected.value] const r = rounds.value[selected.value]
if (!r?.html) return "" if (!r?.html) return ""
@@ -154,6 +231,13 @@ async function load() {
} }
} }
function select(i: number) {
selected.value = i
nextTick(() =>
document.querySelector(".rounds .round.on")?.scrollIntoView({ block: "nearest" }),
)
}
// 在捕获阶段接管按键:弹框开着时,批改页的 Esc / J / K、批改面板的 1–5 / P 都不能触发 // 在捕获阶段接管按键:弹框开着时,批改页的 Esc / J / K、批改面板的 1–5 / P 都不能触发
function onKey(e: KeyboardEvent) { function onKey(e: KeyboardEvent) {
if (!props.show) return if (!props.show) return
@@ -165,10 +249,9 @@ function onKey(e: KeyboardEvent) {
const step = e.key === "ArrowDown" ? 1 : e.key === "ArrowUp" ? -1 : 0 const step = e.key === "ArrowDown" ? 1 : e.key === "ArrowUp" ? -1 : 0
if (!step || !rounds.value.length) return if (!step || !rounds.value.length) return
e.preventDefault() e.preventDefault()
selected.value = Math.min(rounds.value.length - 1, Math.max(0, selected.value + step)) let i = selected.value + step
nextTick(() => while (rounds.value[i] && isGuide(rounds.value[i]!)) i += step
document.querySelector(".rounds .round.on")?.scrollIntoView({ block: "nearest" }), if (rounds.value[i]) select(i)
)
} }
watch( watch(
@@ -222,7 +305,57 @@ onUnmounted(() => window.removeEventListener("keydown", onKey, true))
height: 72vh; height: 72vh;
} }
.left {
min-height: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
.trend {
display: flex;
align-items: flex-end;
gap: 10px;
padding: 0 6px 6px 2px;
border-bottom: 1px solid var(--wp-line);
}
.bars {
flex: 1;
height: 38px;
display: flex;
align-items: flex-end;
gap: 3px;
}
.bar {
flex: 1;
max-width: 22px;
padding: 0;
border: 0;
border-radius: 2px 2px 0 0;
background: var(--wp-faint);
opacity: 0.55;
cursor: pointer;
}
.bar.none {
background: var(--wp-line);
opacity: 1;
}
.bar:hover,
.bar.on {
opacity: 1;
}
.bar.on {
background: var(--wp-brand);
}
.rounds { .rounds {
flex: 1;
min-height: 0;
margin: 0; margin: 0;
padding: 0 6px 0 0; padding: 0 6px 0 0;
list-style: none; list-style: none;
@@ -269,6 +402,7 @@ onUnmounted(() => window.removeEventListener("keydown", onKey, true))
.src, .src,
.level, .level,
.repeat,
.final { .final {
padding: 0 6px; padding: 0 6px;
border-radius: 4px; border-radius: 4px;
@@ -291,6 +425,30 @@ onUnmounted(() => window.removeEventListener("keydown", onKey, true))
background: var(--wp-html-soft); background: var(--wp-html-soft);
} }
.src-guidance {
color: var(--wp-muted);
background: var(--wp-paper);
}
.round.guide {
border-style: dashed;
background: transparent;
cursor: default;
}
.round.guide:hover {
border-color: var(--wp-line);
}
.round.guide .q {
color: var(--wp-muted);
}
.repeat {
color: var(--wp-warn);
background: var(--wp-warn-soft);
}
.level { .level {
color: var(--wp-ink); color: var(--wp-ink);
background: var(--wp-paper); background: var(--wp-paper);
@@ -130,6 +130,34 @@
</div> </div>
<div v-else class="empty">还没有打过分的作品</div> <div v-else class="empty">还没有打过分的作品</div>
</section> </section>
<!-- 怎么问的 AI -->
<section class="span">
<h4>
怎么问的 AI
<span class="count">每人最新一版 · {{ stats.prompts.with_chain }} 份有提示词记录</span>
</h4>
<div v-if="stats.prompts.with_chain" class="prompt">
<div class="facts">
<div><b>{{ stats.prompts.avg_rounds }}</b>平均几轮</div>
<div><b>{{ pct(stats.prompts.one_round, stats.prompts.with_chain) }}</b>一轮就交</div>
<div><b>{{ pct(stats.prompts.external, stats.prompts.with_chain) }}</b>最后一版用外部 AI</div>
<div><b>{{ pct(stats.prompts.used_guidance, stats.prompts.with_chain) }}</b>问过怎么写提示词</div>
</div>
<div class="hist">
<template v-for="(n, i) in stats.prompts.levels" :key="i">
<span class="hist-label">{{ levelLabel(i + 1) }}</span>
<span class="hist-bar">
<span :style="{ width: pct(n, maxLevel) }"></span>
</span>
<span class="hist-value">{{ n }}</span>
</template>
</div>
</div>
<div v-else class="empty">
{{ stats.submitted_count ? "都是直接交的代码,没有提示词记录" : "还没有人交" }}
</div>
</section>
</div> </div>
</div> </div>
</n-spin> </n-spin>
@@ -150,6 +178,7 @@ import { computed, ref, watch } from "vue"
import { useRouter } from "vue-router" import { useRouter } from "vue-router"
import { Icon } from "../../icons" import { Icon } from "../../icons"
import { Submission } from "../../api" import { Submission } from "../../api"
import { levelLabel } from "../../utils/helper"
import type { TaskStatsOut, TopScoredItem, UserTag } from "../../utils/type" import type { TaskStatsOut, TopScoredItem, UserTag } from "../../utils/type"
// 老师下课前看的这道题的总结:默认看批改页正在看的班 // 老师下课前看的这道题的总结:默认看批改页正在看的班
@@ -200,6 +229,7 @@ const buckets = computed(() => {
] ]
}) })
const maxBucket = computed(() => Math.max(...buckets.value.map((b) => b.value))) const maxBucket = computed(() => Math.max(...buckets.value.map((b) => b.value)))
const maxLevel = computed(() => Math.max(0, ...(stats.value?.prompts.levels ?? [])))
const unsubmittedGroups = computed(() => byClass(stats.value?.unsubmitted_users ?? [])) const unsubmittedGroups = computed(() => byClass(stats.value?.unsubmitted_users ?? []))
const unratedGroups = computed(() => byClass(stats.value?.unrated_users ?? [])) const unratedGroups = computed(() => byClass(stats.value?.unrated_users ?? []))
@@ -540,4 +570,29 @@ h4 {
.go { .go {
color: var(--wp-faint); color: var(--wp-faint);
} }
.span {
grid-column: 1 / -1;
}
.prompt {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
.facts {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px 16px;
align-content: start;
font-size: 12px;
color: var(--wp-muted);
}
.facts b {
display: block;
font: 600 18px/1.3 var(--wp-font-mono);
color: var(--wp-ink);
}
</style> </style>
@@ -5,12 +5,16 @@
title="粘贴外部 AI 生成的代码" title="粘贴外部 AI 生成的代码"
style="width: 640px; max-width: 94vw" style="width: 640px; max-width: 94vw"
> >
<n-form-item label="你在外部 AI 里用的提示词" :show-feedback="false"> <n-form-item
label="你在外部 AI 里说了什么"
:validation-status="promptTooShort ? 'warning' : undefined"
:feedback="promptTooShort ? `再写具体一点:你让 AI 做了什么、改了什么(至少 ${MIN_PROMPT} 个字)` : ''"
>
<n-input <n-input
v-model:value="prompt" v-model:value="prompt"
type="textarea" type="textarea"
:autosize="{ minRows: 2, maxRows: 6 }" :autosize="{ minRows: 2, maxRows: 6 }"
placeholder="把你发给豆包、DeepSeek 等 AI 的话粘贴到这里" placeholder="把你发给豆包、DeepSeek 等 AI 的话粘贴到这里;说了好几轮的,每一轮都贴进来,一轮一行"
/> />
</n-form-item> </n-form-item>
<n-form-item label="完整的网页代码" :show-feedback="false" style="margin-top: 12px"> <n-form-item label="完整的网页代码" :show-feedback="false" style="margin-top: 12px">
@@ -30,7 +34,7 @@
<n-button @click="show = false">取消</n-button> <n-button @click="show = false">取消</n-button>
<n-button <n-button
type="primary" type="primary"
:disabled="!prompt.trim() || !raw.trim()" :disabled="[...prompt.trim()].length < MIN_PROMPT || !raw.trim()"
:loading="saving" :loading="saving"
@click="save" @click="save"
> >
@@ -41,7 +45,7 @@
</n-modal> </n-modal>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref } from "vue" import { computed, ref } from "vue"
import { splitHtml, type Code } from "../../utils/code" import { splitHtml, type Code } from "../../utils/code"
const show = defineModel<boolean>("show", { required: true }) const show = defineModel<boolean>("show", { required: true })
@@ -50,6 +54,12 @@ const props = defineProps<{
}>() }>()
const prompt = ref("") const prompt = ref("")
// 以前四分之一的外部提示词只有“1”“倒计时”这样几个字,看不出学生想了什么
const MIN_PROMPT = 8
const promptTooShort = computed(() => {
const n = [...prompt.value.trim()].length
return n > 0 && n < MIN_PROMPT
})
const raw = ref("") const raw = ref("")
const saving = ref(false) const saving = ref(false)
@@ -0,0 +1,67 @@
<template>
<n-modal
v-model:show="show"
preset="card"
:title="title"
style="width: 520px; max-width: 94vw"
:mask-closable="!saving"
>
<div class="question">
{{ hasEarlier ? "比起第一版,这一版你最满意的改动是什么?为什么这样改?" : "这一版你最满意的地方是什么?为什么?" }}
</div>
<n-input
v-model:value="reflection"
type="textarea"
:autosize="{ minRows: 3, maxRows: 6 }"
:maxlength="500"
placeholder="比如:我把按钮从五个减到三个,因为按钮太多了看不出先点哪个"
/>
<n-text depth="3" class="hint">可以不写,直接交。写了的话,老师批改时能看到。</n-text>
<template #footer>
<n-flex justify="end">
<n-button :disabled="saving" @click="show = false">取消</n-button>
<n-button type="primary" :loading="saving" @click="save">交</n-button>
</n-flex>
</template>
</n-modal>
</template>
<script lang="ts" setup>
import { ref } from "vue"
// 交作品前问一句反思:最满意的改动和理由。不拦着交,只是让学生回头看一眼自己改了什么
const show = defineModel<boolean>("show", { required: true })
const props = defineProps<{
title: string
// 之前还有别的版本,就问“比起第一版”
hasEarlier: boolean
onSubmit: (reflection: string) => Promise<void>
}>()
const reflection = ref("")
const saving = ref(false)
async function save() {
saving.value = true
try {
await props.onSubmit(reflection.value.trim())
reflection.value = ""
show.value = false
} finally {
saving.value = false
}
}
</script>
<style scoped>
.question {
margin-bottom: 10px;
font-size: 14px;
line-height: 1.6;
color: var(--wp-ink);
}
.hint {
display: block;
margin-top: 8px;
font-size: 12px;
}
</style>
+39 -6
View File
@@ -103,6 +103,12 @@
</template> </template>
</n-split> </n-split>
<PasteCodeModal v-model:show="showPaste" :on-save="savePasted" /> <PasteCodeModal v-model:show="showPaste" :on-save="savePasted" />
<SubmitModal
v-model:show="showSubmit"
:title="submitTitle"
:has-earlier="submitHasEarlier"
:on-submit="submitChallenge"
/>
<n-drawer v-model:show="showHistory" :width="420" placement="right"> <n-drawer v-model:show="showHistory" :width="420" placement="right">
<n-drawer-content title="全部历史" :native-scrollbar="false" body-content-style="padding: 0"> <n-drawer-content title="全部历史" :native-scrollbar="false" body-content-style="padding: 0">
<PromptHistoryPanel <PromptHistoryPanel
@@ -128,6 +134,7 @@ import Preview from "../editor/Preview.vue"
import CodeTabs from "./CodeTabs.vue" import CodeTabs from "./CodeTabs.vue"
import VersionBar, { type VersionItem } from "./VersionBar.vue" import VersionBar, { type VersionItem } from "./VersionBar.vue"
import PasteCodeModal from "./PasteCodeModal.vue" import PasteCodeModal from "./PasteCodeModal.vue"
import SubmitModal from "./SubmitModal.vue"
import { Prompt, Submission } from "../../api" import { Prompt, Submission } from "../../api"
import { useTaskCode } from "../../composables/useTaskCode" import { useTaskCode } from "../../composables/useTaskCode"
import { import {
@@ -174,6 +181,7 @@ const selectedId = ref<number | null>(null)
const busy = ref(false) const busy = ref(false)
const briefOpen = ref(true) const briefOpen = ref(true)
const showPaste = ref(false) const showPaste = ref(false)
const showSubmit = ref(false)
const showHistory = ref(false) const showHistory = ref(false)
const historyKey = ref(0) const historyKey = ref(0)
@@ -308,21 +316,46 @@ function openHistory() {
} }
async function submit() { async function submit() {
busy.value = true if (props.kind === "challenge") {
try { showSubmit.value = true
if (props.kind === "creation") {
await props.saveWork?.({ ...code })
message.success("作品已保存")
return return
} }
busy.value = true
try {
await props.saveWork?.({ ...code })
message.success("作品已保存")
} catch (err: any) {
message.error(err.response?.data?.detail ?? "保存失败,请重试")
} finally {
busy.value = false
}
}
const submitTitle = computed(() => {
if (modified.value || !selectedId.value) return "交当前修改"
const n = versions.value.find((v) => v.id === selectedId.value)?.n
return n ? `交 v${n}` : "交这一版"
})
// 要交的这一版之前还有版本(当前修改会存成新的一版)
const submitHasEarlier = computed(() => {
if (modified.value || !selectedId.value) return versions.value.length > 0
return (versions.value.find((v) => v.id === selectedId.value)?.n ?? 1) > 1
})
// 挑战:先在弹框里写一句反思(可以不写)再交;出错时抛出去,弹框不关
async function submitChallenge(reflection: string) {
busy.value = true
try {
const id = const id =
modified.value || !selectedId.value ? await saveAsVersion() : selectedId.value modified.value || !selectedId.value ? await saveAsVersion() : selectedId.value
await Submission.create(props.taskId, { ...code }, id) await Submission.create(props.taskId, { ...code }, id, reflection)
markMessageSubmitted(id) markMessageSubmitted(id)
const n = versions.value.find((v) => v.id === id)?.n const n = versions.value.find((v) => v.id === id)?.n
message.success(n ? `已提交 v${n}` : "已提交") message.success(n ? `已提交 v${n}` : "已提交")
} catch (err: any) { } catch (err: any) {
message.error(err.response?.data?.detail ?? "提交失败,请重试") message.error(err.response?.data?.detail ?? "提交失败,请重试")
throw err
} finally { } finally {
busy.value = false busy.value = false
} }
+2
View File
@@ -4,6 +4,7 @@ import {
ArrowRight, ArrowRight,
Award, Award,
BookOpen, BookOpen,
Bug,
ChartNoAxesColumn, ChartNoAxesColumn,
Check, Check,
ChevronDown, ChevronDown,
@@ -49,6 +50,7 @@ const registry: Record<string, Component> = {
"arrow-right": ArrowRight, "arrow-right": ArrowRight,
award: Award, award: Award,
"book-open": BookOpen, "book-open": BookOpen,
bug: Bug,
"bar-chart-2": ChartNoAxesColumn, "bar-chart-2": ChartNoAxesColumn,
check: Check, check: Check,
"chevron-down": ChevronDown, "chevron-down": ChevronDown,
+3
View File
@@ -19,6 +19,8 @@ export const conversationId = ref<string>("")
export const connected = ref(false) export const connected = ref(false)
export const streaming = ref(false) export const streaming = ref(false)
export const streamingContent = ref("") export const streamingContent = ref("")
// 这次提问发出的时间:AI 先思考,第一个字可能一两分钟后才出来,界面据此显示等了多久
export const streamStartedAt = ref(0)
export const currentTaskId = ref(0) export const currentTaskId = ref(0)
// 新代码交给工作台处理:init 是连上时对话里最新的那一版,complete 是 AI 刚生成的 // 新代码交给工作台处理:init 是连上时对话里最新的那一版,complete 是 AI 刚生成的
let _codeSink: let _codeSink:
@@ -106,6 +108,7 @@ export function disconnectPrompt() {
export function sendPrompt(content: string, model: string = "") { export function sendPrompt(content: string, model: string = "") {
if (!socket.send({ type: "message", content, model })) return if (!socket.send({ type: "message", content, model })) return
streaming.value = true streaming.value = true
streamStartedAt.value = Date.now()
messages.value.push({ role: "user", content }) messages.value.push({ role: "user", content })
} }
+7 -6
View File
@@ -21,17 +21,18 @@ export function goHome(router: any, type: TASK_TYPE, display: number) {
export function sourceLabel(source: string | null | undefined) { export function sourceLabel(source: string | null | undefined) {
if (source === "edit") return "手改" if (source === "edit") return "手改"
if (source === "manual") return "外部 AI" if (source === "manual") return "外部 AI"
if (source === "guidance") return "引导"
return "AI 对话" return "AI 对话"
} }
// 提问的 Bloom 等级(services/classifier.ts 后台打的标签) // 提问的 Bloom 等级(services/classifier.ts 后台打的标签)
export const PROMPT_LEVELS: Record<number, { name: string; desc: string }> = { export const PROMPT_LEVELS: Record<number, { name: string; desc: string }> = {
1: { name: "记忆", desc: "复述或识别知识点" }, 1: { name: "记忆", desc: "只说要做什么或只报结果,没有自己的要求和解释" },
2: { name: "理解", desc: "用自己的话解释概念" }, 2: { name: "理解", desc: "想弄懂原理:问为什么、是什么意思、怎么做到的" },
3: { name: "应用", desc: "把知识用到新情境" }, 3: { name: "应用", desc: "提出具体要求(颜色、布局、功能),照搬题目要求也算" },
4: { name: "分析", desc: "拆解结构、找出规律" }, 4: { name: "分析", desc: "说清在什么操作、哪个位置出了什么问题,或推测原因" },
5: { name: "评价", desc: "按标准作出判断" }, 5: { name: "评价", desc: "带理由评判现有结果,或比较不同做法再选择" },
6: { name: "创造", desc: "整合信息做出新东西" }, 6: { name: "创造", desc: "题目之外自己构思的整体设计:主题、玩法、交互" },
} }
export function levelLabel(level: number | null | undefined) { export function levelLabel(level: number | null | undefined) {
+14
View File
@@ -167,6 +167,8 @@ export interface SubmissionAll {
view_count: number view_count: number
created: Date created: Date
modified: Date modified: Date
// 交的时候写的反思,只有老师和作者本人拿得到
reflection?: string | null
} }
export interface UserTag { export interface UserTag {
@@ -199,6 +201,18 @@ export interface TaskStatsOut {
present_count: number present_count: number
classes: string[] classes: string[]
top_scored: TopScoredItem[] top_scored: TopScoredItem[]
prompts: PromptChainStats
}
// 课堂总结里每人最新一版的提示词链概况
export interface PromptChainStats {
with_chain: number
one_round: number
external: number
used_guidance: number
avg_rounds: number
// L1–L6 各有几次提问
levels: number[]
} }
export type GradebookTaskType = "tutorial" | "challenge" export type GradebookTaskType = "tutorial" | "challenge"
+109
View File
@@ -0,0 +1,109 @@
/**
* 对比某个日期前后,学生和 AI 对话的情况(比如改了 AI 的回复方式以后有没有变化)。
* 日期按北京时间,分界日期那天算“之后”。只读,不改数据。
*
* bun scripts/prompt-stats.ts <分界日期> [--from 日期] [--to 日期]
* bun scripts/prompt-stats.ts 2026-10-28 --from 2026-09-01
*
* 层级是打标签时的标准;分类标准改过以后,先跑 classify-prompts.ts --force 重打,前后才好比。
*/
import { all, toDbTime } from "../src/db"
const args = process.argv.slice(2)
const opt = (name: string) => {
const i = args.indexOf(name)
return i >= 0 ? args[i + 1] : undefined
}
const split = args[0]
if (!split || !/^\d{4}-\d{2}-\d{2}$/.test(split)) {
console.log("用法:bun scripts/prompt-stats.ts <分界日期> [--from 日期] [--to 日期]")
process.exit(1)
}
const day = (d: string) => toDbTime(new Date(`${d}T00:00:00+08:00`))
const nextDay = (d: string) => toDbTime(new Date(new Date(`${d}T00:00:00+08:00`).getTime() + 86_400_000))
const periods = [
{ name: `${opt("--from") ?? "最早"} ~ ${split} 之前`, from: opt("--from") ? day(opt("--from")!) : "", to: day(split) },
{ name: `${split} ~ ${opt("--to") ?? "现在"}`, from: day(split), to: opt("--to") ? nextDay(opt("--to")!) : "9999" },
]
// 和 PromptPanel 里一样:只说“不行”“没反应”的短抱怨;“出问题了”拼出来的句子
const VAGUE =
/不行|不对|没反应|没用|没效果|用不了|不能用|不能玩|动不了|进不去|打不开|没显示|不显示|显示不出|bug|出错|报错|错了|坏了|白屏|空白|有问题/i
const PROBLEM = /^我.+,(想看到.+,)?但实际.+。$/s
type Msg = {
conversation_id: string
source: string
content: string
prompt_level: number | null
created: string
// 在这个对话的 AI 对话里是第几轮(只数 conversation)
round: number | null
}
// 批处理脚本,整表扫一遍没关系
const msgs = all<Msg>(
`SELECT conversation_id, source, content, prompt_level, created,
CASE WHEN source = 'conversation'
THEN ROW_NUMBER() OVER (PARTITION BY conversation_id, source = 'conversation' ORDER BY created, id) END AS round
FROM prompt_message WHERE role = 'user'`,
)
const subs = all<{ created: string; reflected: number }>(
`SELECT s.created, r.submission_id IS NOT NULL AS reflected
FROM submission_submission s JOIN task_task t ON t.id = s.task_id
LEFT JOIN submission_reflection r ON r.submission_id = s.id
WHERE t.task_type = 'challenge'`,
)
const pct = (n: number, d: number) => (d ? `${((n / d) * 100).toFixed(1)}%` : "—")
const chars = (s: string) => [...s.trim()].length
function stats(from: string, to: string) {
const inRange = (t: string) => t >= from && t < to
const ms = msgs.filter((m) => inRange(m.created))
const byConv = new Map<string, Msg[]>()
for (const m of ms) byConv.set(m.conversation_id, [...(byConv.get(m.conversation_id) ?? []), m])
const convs = [...byConv.values()]
const ai = convs.filter((c) => c.some((m) => m.source === "conversation"))
const manualOnly = convs.filter((c) => c.some((m) => m.source === "manual") && !c.some((m) => m.source === "conversation"))
const rounds = ai.map((c) => c.filter((m) => m.source === "conversation").length)
const bucket = (lo: number, hi: number) => rounds.filter((n) => n >= lo && n <= hi).length
const asked = ms.filter((m) => m.source === "conversation")
const levels = [1, 2, 3, 4, 5, 6].map((l) => asked.filter((m) => m.prompt_level === l).length)
const leveled = levels.reduce((a, b) => a + b, 0)
const later = asked.filter((m) => (m.round ?? 1) >= 2 && m.prompt_level)
const vague = asked.filter((m) => chars(m.content) <= 15 && VAGUE.test(m.content))
const problem = asked.filter((m) => PROBLEM.test(m.content.trim()))
const manual = ms.filter((m) => m.source === "manual")
const s = subs.filter((x) => inRange(x.created))
return [
["有对话或版本的作品", `${convs.length}`],
["只粘贴外部代码", `${manualOnly.length}(${pct(manualOnly.length, convs.length)})`],
["和平台 AI 对话的作品", `${ai.length}`],
[" 平均轮数", ai.length ? (rounds.reduce((a, b) => a + b, 0) / ai.length).toFixed(2) : "—"],
[" 1 轮", pct(bucket(1, 1), ai.length)],
[" 2–3 轮", pct(bucket(2, 3), ai.length)],
[" 4–6 轮", pct(bucket(4, 6), ai.length)],
[" 7 轮以上", pct(bucket(7, Infinity), ai.length)],
["提问(AI 对话)", `${asked.length},已分级 ${leveled}`],
...levels.map((n, i) => [` L${i + 1}`, pct(n, leveled)]),
[" L4–L6", pct(levels[3]! + levels[4]! + levels[5]!, leveled)],
[" 第 2 轮起的 L1", pct(later.filter((m) => m.prompt_level === 1).length, later.length)],
[" 只说“不行”的短抱怨", `${vague.length}(${pct(vague.length, asked.length)})`],
[" 用“出问题了”", `${problem.length}(${pct(problem.length, asked.length)})`],
["用了“帮我写清楚”的作品", `${convs.filter((c) => c.some((m) => m.source === "guidance")).length}(占和 AI 对话的 ${pct(ai.filter((c) => c.some((m) => m.source === "guidance")).length, ai.length)})`],
["外部 AI 提示词", `${manual.length},12 字以内 ${pct(manual.filter((m) => chars(m.content) <= 12).length, manual.length)}`],
["挑战提交", `${s.length},写了反思 ${pct(s.filter((x) => x.reflected).length, s.length)}`],
]
}
const [a, b] = periods.map((p) => stats(p.from, p.to))
// 终端里中文占两格
const cols = (k: string) => [...k].reduce((n, ch) => n + (ch.codePointAt(0)! >= 0x2e80 ? 2 : 1), 0)
const width = Math.max(...a!.map(([k]) => cols(k!))) + 2
const pad = (k: string) => k + " ".repeat(width - cols(k))
console.log(`${pad("")}${periods[0]!.name} → ${periods[1]!.name}`)
for (const [i, [k, v]] of a!.entries()) console.log(`${pad(k!)}${v} → ${b![i]![1]}`)
+6
View File
@@ -47,6 +47,12 @@ CREATE INDEX IF NOT EXISTS "prompt_conversation_user_id_ecc418b3" ON "prompt_con
CREATE TABLE IF NOT EXISTS "prompt_message" ("id" integer NOT NULL PRIMARY KEY AUTOINCREMENT, "role" varchar(10) NOT NULL, "content" text NOT NULL, "code_html" text NULL, "code_css" text NULL, "code_js" text NULL, "created" datetime NOT NULL, "conversation_id" char(32) NOT NULL REFERENCES "prompt_conversation" ("id") DEFERRABLE INITIALLY DEFERRED, "prompt_level" integer NULL, "source" varchar(12) NOT NULL, "submission_id" char(32) NULL UNIQUE REFERENCES "submission_submission" ("id") DEFERRABLE INITIALLY DEFERRED); CREATE TABLE IF NOT EXISTS "prompt_message" ("id" integer NOT NULL PRIMARY KEY AUTOINCREMENT, "role" varchar(10) NOT NULL, "content" text NOT NULL, "code_html" text NULL, "code_css" text NULL, "code_js" text NULL, "created" datetime NOT NULL, "conversation_id" char(32) NOT NULL REFERENCES "prompt_conversation" ("id") DEFERRABLE INITIALLY DEFERRED, "prompt_level" integer NULL, "source" varchar(12) NOT NULL, "submission_id" char(32) NULL UNIQUE REFERENCES "submission_submission" ("id") DEFERRABLE INITIALLY DEFERRED);
CREATE INDEX IF NOT EXISTS "prompt_message_conversation_id_af18dd4b" ON "prompt_message" ("conversation_id"); CREATE INDEX IF NOT EXISTS "prompt_message_conversation_id_af18dd4b" ON "prompt_message" ("conversation_id");
CREATE INDEX IF NOT EXISTS "prompt_message_prompt_level_e461b596" ON "prompt_message" ("prompt_level"); CREATE INDEX IF NOT EXISTS "prompt_message_prompt_level_e461b596" ON "prompt_message" ("prompt_level");
-- 课堂总结统计提示词链用的覆盖索引:只读小列,不碰 content / code_*
CREATE INDEX IF NOT EXISTS "prompt_message_chain" ON "prompt_message" ("conversation_id", "created", "id", "role", "source", "prompt_level");
CREATE INDEX IF NOT EXISTS "prompt_message_submission" ON "prompt_message" ("submission_id", "conversation_id", "created", "source") WHERE "submission_id" IS NOT NULL;
-- 学生交作品时写的一句反思(最满意的改动和理由);可以不写。删提交时跟着删
CREATE TABLE IF NOT EXISTS "submission_reflection" ("submission_id" char(32) NOT NULL PRIMARY KEY REFERENCES "submission_submission" ("id") ON DELETE CASCADE, "content" text NOT NULL, "modified" datetime NOT NULL);
-- 登录用 JWT:access token 不落库,refresh token 只存 sha256 -- 登录用 JWT:access token 不落库,refresh token 只存 sha256
DROP TABLE IF EXISTS "auth_session"; DROP TABLE IF EXISTS "auth_session";
+22 -1
View File
@@ -26,6 +26,7 @@ import {
getActiveConversation, getActiveConversation,
getPrecedingUserMessage, getPrecedingUserMessage,
insertMessage, insertMessage,
promptChainStats,
type MessageRow, type MessageRow,
} from "../services/prompt" } from "../services/prompt"
import { pyRound } from "../services/pyround" import { pyRound } from "../services/pyround"
@@ -119,6 +120,7 @@ router.post("/", async (c) => {
js: z.string().nullable().optional(), js: z.string().nullable().optional(),
prompt: z.string().nullable().optional(), prompt: z.string().nullable().optional(),
message_id: z.number().int().nullable().optional(), // 关联的 assistant message message_id: z.number().int().nullable().optional(), // 关联的 assistant message
reflection: z.string().max(1000).nullable().optional(), // 交的时候写的一句反思,可以不写
}), }),
) )
const task = orNotFound( const task = orNotFound(
@@ -130,6 +132,8 @@ router.post("/", async (c) => {
const code = { html: p.html ?? null, css: p.css ?? null, js: p.js ?? null } const code = { html: p.html ?? null, css: p.css ?? null, js: p.js ?? null }
const reflection = p.reflection?.trim() || null
const { submissionId, newUserMsgId } = tx(() => { const { submissionId, newUserMsgId } = tx(() => {
let manualAsstMsgId: number | null = null let manualAsstMsgId: number | null = null
let linkedMsg: MessageRow | null = null let linkedMsg: MessageRow | null = null
@@ -202,6 +206,15 @@ router.post("/", async (c) => {
return { submissionId: id, newUserMsgId } return { submissionId: id, newUserMsgId }
}) })
// 同一版再交时没写就留着上次写的
if (reflection) {
run(
`INSERT INTO submission_reflection (submission_id, content, modified) VALUES ($id, $content, $ts)
ON CONFLICT (submission_id) DO UPDATE SET content = excluded.content, modified = excluded.modified`,
{ id: submissionId, content: reflection, ts: now() },
)
}
// 只对新增的提示词做层级分类 // 只对新增的提示词做层级分类
if ( if (
newUserMsgId !== null && newUserMsgId !== null &&
@@ -473,6 +486,8 @@ router.get("/stats/:task_id", (c) => {
present_count: studentSubs.filter((s) => s.flag === "present").length, present_count: studentSubs.filter((s) => s.flag === "present").length,
classes, classes,
top_scored: topScored, top_scored: topScored,
// 每人最新一版是怎么问出来的
prompts: promptChainStats([...latest.values()].map((s) => s.id)),
}) })
}) })
@@ -537,7 +552,13 @@ router.get("/:id", (c) => {
const id = uuidParam(c, "id") const id = uuidParam(c, "id")
requireView(user, id) requireView(user, id)
const s = orNotFound(get(`${SUBMISSION_SELECT} ${SUBMISSION_FROM} WHERE s.id = $id`, { me: user.id, id })) const s = orNotFound(get(`${SUBMISSION_SELECT} ${SUBMISSION_FROM} WHERE s.id = $id`, { me: user.id, id }))
const out = submissionOut(s) // 反思只给老师和作者本人看
const reflection =
isStaff(user) || s.user_id === user.id
? (get<{ content: string }>(`SELECT content FROM submission_reflection WHERE submission_id = $id`, { id })
?.content ?? null)
: null
const out = { ...submissionOut(s), reflection }
// 和同学作品一样:学生给同学打分之前不告诉作者和得分(作品展里的本来就署名) // 和同学作品一样:学生给同学打分之前不告诉作者和得分(作品展里的本来就署名)
if (!isStaff(user) && s.user_id !== user.id && !out.my_score && !inShowcase(id)) { if (!isStaff(user) && s.user_id !== user.id && !out.my_score && !inShowcase(id)) {
return c.json({ ...out, userid: null, username: null, score: null }) return c.json({ ...out, userid: null, username: null, score: null })
+59 -12
View File
@@ -1,18 +1,32 @@
import { all, get, run } from "../db" import { all, get, run } from "../db"
import { complete, llmConfigured } from "./llm" import { complete, llmConfigured } from "./llm"
import { briefOf } from "./prompt"
const CLASSIFY_SYSTEM_PROMPT = `你是一个教育评估专家。根据布鲁姆认知分类学,分析以下学生在前端学习中发送给AI助手的一条提示词,判断该提示词所体现的认知层级。 // 学生在这里是“指挥 AI 做网页”,看的是这句提问里学生自己想了多少,不是要 AI 做的东西有多大:
// 把题目要求原样贴过去,功能列得再多也只是照着做(L3)
const CLASSIFY_SYSTEM_PROMPT = `你是一个教育评估专家。学生在网页制作课上让 AI 生成或修改网页,下面给出题目要求、学生上一轮的提问和这一轮的提问。请按布鲁姆认知分类学,判断“这一轮提问”体现的学生自己的思考层级。
层级定义: 按下面的顺序判断,命中哪一条就是哪一级:
- L1 记忆:能背诵HTML标签语法(例:"帮我写一个按钮") 1. L1 记忆:没有任何具体要求、解释或问题。只给作品名称、只报结果或只让 AI 修(例:"帮我做一个象棋游戏"、"制作一个吃豆人"、"继续"、"预览代码"、"还是没有显示"、"点击开始游戏进不去"、"帮我修复代码bug")
- L2 理解:能解释flex布局原理(例:"为什么这里不居中?") 2. L2 理解:想弄懂原理、代码或概念(问为什么、是什么意思、怎么做到的),或者用自己的话解释现有代码在做什么(例:"为什么点了按钮没反应?"、"grid 和 flex 有什么区别"、"这段 js 里的 setInterval 是干什么的")
- L3 应用:能独立搭建页面结构(例:"用flex做导航栏,间距16px") 3. L4 分析:说清在哪个操作、哪个位置出了什么具体问题,或者自己推测原因、指出问题出在哪部分(例:"拖动绘制时松开鼠标还在画,是不是没监听 mouseup"、"缩小窗口后网格就不显示了"、"围棋我刚下一颗黑棋就判我赢了")
- L4 分析:能定位跨浏览器兼容性bug(例:"Safari中margin失效,原因?") 4. L5 评价:明确给出判断理由来评价现有结果,或者比较两种做法再选择;必须有“因为……所以……”“A 比 B 好”这样的理由或比较(例:"现在按钮太多,小学生看不懂,改成只留三个主要按钮"、"用 canvas 画比用一堆 div 流畅,改成 canvas")
- L5 评价:能对比并选择方案(例:"对比Grid与Flex方案优劣") 5. L6 创造:在题目要求之外提出自己构思的设计,而且几部分互相配合成一个整体,如原创的主题、玩法、规则或交互(例:"改成星空主题:转盘是星座,抽中稀有奖励时流星划过并解锁对应星座的图鉴")
- L6 创造:能设计并实现原创交互作品(例:"设计夜间/日间切换效果") 6. L3 应用:其余给出具体、可执行要求的,如颜色、风格、布局、要加或要改的功能(例:"方块大一点,旁边加一个橡皮擦和清空按钮"、"页面风格可爱,浅粉加浅蓝的渐变"、"加上撤销和保存为图片")
注意:
- 只看学生自己想出来的部分。照搬或改写题目要求里的功能清单是 L3,要求写得长、功能多不等于层级高。
- 只说想要什么风格、加什么功能,没有理由,是 L3 不是 L5;只列很多功能,没有自己的整体构思,是 L3 不是 L6。
- 只说“没反应”“进不去”“不能玩”“有 bug”,哪怕提到了是哪个按钮,也是 L1;要说出更具体的现象(如“打字速度始终是 0”)或推测原因才是 L4。
- 说明要改成什么样(如“弧线应该对着中圈”“球门要比禁区小”)是 L3,不是 L4。
- 整段贴了题目要求或一长串功能清单,不是 L1,是 L3。
- 结合上一轮看:重复上一轮的提问,层级不高于上一轮。
只返回一个数字(1-6),不要解释。` 只返回一个数字(1-6),不要解释。`
const MIN_PROMPT_CHARS = 4
const PROMPT_CHARS = 1500
const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms)) const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms))
async function callLlm(content: string): Promise<number | null> { async function callLlm(content: string): Promise<number | null> {
@@ -23,7 +37,8 @@ async function callLlm(content: string): Promise<number | null> {
{ role: "system", content: CLASSIFY_SYSTEM_PROMPT }, { role: "system", content: CLASSIFY_SYSTEM_PROMPT },
{ role: "user", content }, { role: "user", content },
], ],
{ maxTokens: 10, timeoutMs: 30_000 }, // 只回一个数字,不用思考;关了思考 temperature 才生效,同一句提示词得到同一个层级
{ thinking: false, maxTokens: 10, temperature: 0, timeoutMs: 30_000 },
) )
const match = /[1-6]/.exec(text) const match = /[1-6]/.exec(text)
if (!match) { if (!match) {
@@ -37,13 +52,45 @@ async function callLlm(content: string): Promise<number | null> {
} }
} }
function clip(text: string) {
return text.length > PROMPT_CHARS ? text.slice(0, PROMPT_CHARS) + "……" : text
}
// 发给模型的:题目要求、同一对话里上一轮的提问(引导对话只和引导对话比)、这一轮的提问
function classifyInput(msg: { id: number; content: string; source: string; conversation_id: string; created: string }) {
const task = get<{ title: string; content: string }>(
`SELECT t.title, t.content FROM prompt_conversation c JOIN task_task t ON t.id = c.task_id WHERE c.id = $conv`,
{ conv: msg.conversation_id },
)
const prev = get<{ content: string }>(
`SELECT content FROM prompt_message
WHERE conversation_id = $conv AND role = 'user' AND source != 'edit'
AND (source = 'guidance') = $guidance
AND (created < $created OR (created = $created AND id < $id))
ORDER BY created DESC, id DESC LIMIT 1`,
{ conv: msg.conversation_id, guidance: msg.source === "guidance", created: msg.created, id: msg.id },
)
return [
`题目:${task?.title ?? "(未知)"}`,
`题目要求:${task ? briefOf(task.content) : "(无)"}`,
`上一轮提问:${prev ? clip(prev.content) : "(这是第一轮)"}`,
`这一轮提问:${clip(msg.content)}`,
].join("\n\n")
}
export async function classifyMessage(messageId: number): Promise<number | null> { export async function classifyMessage(messageId: number): Promise<number | null> {
const msg = get<{ content: string }>( const msg = get<{ id: number; content: string; source: string; conversation_id: string; created: string }>(
`SELECT content FROM prompt_message WHERE id = $id AND role = 'user' AND source != 'edit'`, `SELECT id, content, source, conversation_id, created FROM prompt_message
WHERE id = $id AND role = 'user' AND source != 'edit'`,
{ id: messageId }, { id: messageId },
) )
if (!msg) return null if (!msg) return null
const level = await callLlm(msg.content) // “1”“,”“可以”这类太短,判断不出层级;清掉以前打的标签(--force 重标时)
if ([...msg.content.trim()].length < MIN_PROMPT_CHARS) {
run(`UPDATE prompt_message SET prompt_level = NULL WHERE id = $id`, { id: messageId })
return null
}
const level = await callLlm(classifyInput(msg))
if (level !== null) { if (level !== null) {
run(`UPDATE prompt_message SET prompt_level = $level WHERE id = $id`, { run(`UPDATE prompt_message SET prompt_level = $level WHERE id = $id`, {
level, level,
+70 -34
View File
@@ -1,18 +1,29 @@
import { config } from "../config" import { config } from "../config"
export const SYSTEM_PROMPT = `你是一个网页生成助手。根据用户的需求描述,生成网页代码。 // AI 回复里的说明是学生唯一会读的文字,用它引导学生想下一步:
// “我替你定的”指出学生没说、AI 自己拿的主意,学生看了才会说“不要这样,因为……”;“想一想”只问不答
export const SYSTEM_PROMPT = `你是一个网页生成助手,和学生一起做网页。根据学生的描述生成网页代码。
规则: 规则:
1. 使用一个 \`\`\`html 代码块返回所有代码 1. 生成或修改网页时,使用一个 \`\`\`html 代码块返回所有代码
2. HTML 代码只需要 body 内的内容,不需要完整的 HTML 文档结构 2. HTML 代码只需要 body 内的内容,不需要完整的 HTML 文档结构
3. CSS 样式写在 <style> 标签内,JavaScript 写在 <script> 标签内,都放在代码块里 3. CSS 样式写在 <style> 标签内,JavaScript 写在 <script> 标签内,都放在代码块里
4. 用中文回复,先简要说明你做了什么,然后给出代码 4. 在已有代码基础上修改时,返回完整的修改后代码,不要只返回片段
5. 在已有代码基础上修改时,返回完整的修改后代码,不要只返回片段 5. 由于任何外部链接都被屏蔽,使用纯 HTML、CSS 和 JS 实现功能,不要依赖外部库
6. 由于任何外部链接都被屏蔽,使用纯 HTML、CSS 和 JS 实现功能,不要依赖外部库 6. 用中文回复,对学生称“你”。先写说明,再给代码。说明分下面三项,标题照抄,每项一两句话,不要写长:
- **做了什么**:这次按学生的要求做了哪些改动
- **我替你定的**:学生没说、你自己拿主意的地方,比如配色、布局、规则、数值、文字内容;列 1-3 条,只写在网页上看得到、学生可以要求改的。学生这次已经说清楚、没有需要你拿主意的地方,就省略这一项
- **想一想**:问学生一个问题,帮他想清楚下一步想要什么。问他自己的想法或判断(如“……的时候你希望它怎样?”“这两种你觉得哪个更适合……,为什么?”),不要列一串功能让他挑,也不要替他回答
7. 学生只是在问问题(为什么、是什么意思、怎么做到的),没有要求改网页时,用浅显的话直接回答,不给代码,也不用分三项
8. 学生只说“不行”“有 bug”“没反应”,没说清哪里不对时,照样尽力修好,并在“想一想”里请他下次说清楚:做了什么操作、想看到什么、实际看到了什么
输出格式示例(必须严格遵守,只用一个代码块): 输出格式示例(必须严格遵守,只用一个代码块):
好的,我为你创建了一个点击按钮变色的示例。 **做了什么**:做了一个按钮,点一下会变成红色。
**我替你定的**:按钮放在页面左上角;变色后不会再变回来。
**想一想**:再点一次的时候,你希望它变回原来的颜色,还是换成别的颜色?
\`\`\`html \`\`\`html
<style> <style>
@@ -28,23 +39,36 @@ document.getElementById('btn').onclick = function() {
</script> </script>
\`\`\`` \`\`\``
export const GUIDANCE_SYSTEM_PROMPT = `你是一个提示词写作教练,帮助学生写出清晰、具体的网页需求描述。 // 挑战题目要求只当对照清单:学生没说的不替他做,挑一项放进“想一想”问他打算怎么做,
// 要做成什么样还是学生自己说;整段贴了题目的照做(不拦,拦了只会去用外部 AI)
export const BRIEF_RULES = `下面是这道题的题目要求。它是对照清单,不是让你照着做——这是课堂练习,题目要求要学生自己一步步提出来,这正是这节课要练的:
- 只做学生在对话里说了的内容,做出来要能打开、能用。学生说的话里包含了题目要求(比如整段贴了题目),就照着做
- 题目要求里学生还没提到的功能、规则和细节(如计时方式、对错的颜色、计分、重来按钮),哪怕很常见、顺手就能做,也先不做;也不要照搬题目里的类名、变量名和数据
- 从学生没提到的要求里挑一项最重要的放进“想一想”,问他打算怎么做(如“题目还要求标出打错的字,你希望打错的时候是什么样子?”)
- 学生要的和题目要求冲突时,按学生说的做,在“想一想”里提醒他题目是怎么要求的
- 题目要求都做到了,“想一想”就问他自己的想法,不再提题目`
判断标准——满足以下条件视为"够好": // 判断标准和分类器一致:看学生自己想了什么,照搬题目写得再长也不算清楚
- 有明确主题(例如:登录页、计时器、商品卡片列表) export const GUIDANCE_SYSTEM_PROMPT = `你是一个提示词写作教练。学生在网页制作课上让 AI 生成或修改网页,你帮他把这一次要对 AI 说的话想清楚、说具体。后面会给你题目要求、他之前对 AI 说过的话和 AI 上一次的说明。
- 至少包含以下一项具体描述:颜色/布局/风格、交互行为(按钮点击、动画等)、页面内容(文字、数量、图标)
判断标准——看学生这一次的话,满足下面一条就算"够好":
- 第一次描述作品:除了题目要求,有他自己的想法,至少有一处具体的视觉、交互或内容是他自己定的(如配色风格、玩法规则、页面上放什么)
- 修改已有网页:说清楚要改哪里、改成什么样;或者说清楚出了什么问题——做了什么操作、想看到什么、实际看到了什么
判断为"不够好"的典型情况: 判断为"不够好"的典型情况:
- 目标太泛,如"做一个好看的页面" - 只有作品名称,如"做一个象棋游戏"
- 只有主题,完全没有任何视觉、交互或内容描述 - 照搬或改写题目要求,没有自己的想法——哪怕写得很长、功能很多
- 只说"不行""有 bug""再好看一点",没说是哪里、要怎样
规则: 规则:
1. 如果提示词不够好,用 1-2 个启发性问题引导学生补充细节,不要直接给出答案 1. 如果不够好,用 1-2 个启发性问题引导学生补充,问他自己的想法,不要直接给出答案,也不要列一串功能让他挑
2. 如果提示词已经够好,以 [READY] 开头回复,简短夸奖学生并说明可以生成了 2. 照搬题目要求时,先肯定他读懂了题目,再问题目之外他想让作品有什么不一样
3. 用中文回复,语气鼓励,简洁明了 3. AI 上一次的说明里如果有“我替你定的”,可以问他同不同意这些决定
4. 使用 Markdown 语法高亮关键词,优先突出 **主题**、**视觉**、**交互**、**内容**、**可以生成** 等重点 4. 如果已经够好,以 [READY] 开头回复,简短说明好在哪里,告诉他可以生成了;他还给了理由(为什么这样改)的,特别夸一下
5. 如果回复以 [READY] 开头,[READY] 不要加粗,必须保持原始文本 5. 用中文回复,语气鼓励,简洁明了
6. 不要生成任何代码` 6. 使用 Markdown 语法高亮关键词,优先突出 **视觉**、**交互**、**内容**、**你的想法**、**可以生成** 等重点
7. 如果回复以 [READY] 开头,[READY] 不要加粗,必须保持原始文本
8. 不要生成任何代码`
// 走火山方舟(ARK)接口的模型 // 走火山方舟(ARK)接口的模型
const ARK_MODELS = new Set(["doubao-seed-2-1-lite-260915"]) const ARK_MODELS = new Set(["doubao-seed-2-1-lite-260915"])
@@ -59,10 +83,14 @@ export interface ChatMessage {
content: string content: string
} }
// DeepSeek(deepseek-flash)默认先思考再回答,思考的内容在 reasoning_content 里,也算输出 token;
// 思考模式下 temperature 不起作用。thinking 只发给 DeepSeek,豆包不传
interface CompletionOptions { interface CompletionOptions {
model?: string model?: string
stream: boolean stream: boolean
thinking?: boolean
maxTokens?: number maxTokens?: number
temperature?: number
signal?: AbortSignal signal?: AbortSignal
timeoutMs?: number timeoutMs?: number
} }
@@ -81,7 +109,9 @@ function buildRequest(messages: ChatMessage[], opts: CompletionOptions) {
messages, messages,
stream: opts.stream, stream: opts.stream,
} }
if (!ark && opts.thinking !== undefined) body.thinking = { type: opts.thinking ? "enabled" : "disabled" }
if (opts.maxTokens) body.max_tokens = opts.maxTokens if (opts.maxTokens) body.max_tokens = opts.maxTokens
if (opts.temperature !== undefined) body.temperature = opts.temperature
const apiKey = ark ? config.arkApiKey : config.llmApiKey const apiKey = ark ? config.arkApiKey : config.llmApiKey
if (!apiKey) throw new Error("未配置模型接口密钥") if (!apiKey) throw new Error("未配置模型接口密钥")
const baseUrl = (ark ? config.arkBaseUrl : config.llmBaseUrl).replace(/\/$/, "") const baseUrl = (ark ? config.arkBaseUrl : config.llmBaseUrl).replace(/\/$/, "")
@@ -107,8 +137,7 @@ async function ensureOk(res: Response) {
// 读取 OpenAI 兼容接口的 SSE 流,逐段产出文本 // 读取 OpenAI 兼容接口的 SSE 流,逐段产出文本
async function* streamCompletion( async function* streamCompletion(
messages: ChatMessage[], messages: ChatMessage[],
model?: string, { model, thinking, signal }: { model?: string; thinking?: boolean; signal?: AbortSignal },
signal?: AbortSignal,
): AsyncGenerator<string> { ): AsyncGenerator<string> {
// 带思考的模型生成整页代码可能超过两分钟,只要一直有数据就不该中断 // 带思考的模型生成整页代码可能超过两分钟,只要一直有数据就不该中断
const idle = new AbortController() const idle = new AbortController()
@@ -123,6 +152,7 @@ async function* streamCompletion(
const res = await buildRequest(messages, { const res = await buildRequest(messages, {
model, model,
stream: true, stream: true,
thinking,
signal: AbortSignal.any(signals), signal: AbortSignal.any(signals),
timeoutMs: STREAM_MAX_MS, timeoutMs: STREAM_MAX_MS,
}) })
@@ -139,6 +169,7 @@ async function* streamCompletion(
if (data === "[DONE]") return true if (data === "[DONE]") return true
const json = JSON.parse(data) const json = JSON.parse(data)
if (json.error) throw new Error(json.error.message ?? JSON.stringify(json.error)) if (json.error) throw new Error(json.error.message ?? JSON.stringify(json.error))
// 思考阶段只有 delta.reasoning_content,不发给学生(它也会重置空闲计时)
const content = json.choices?.[0]?.delta?.content const content = json.choices?.[0]?.delta?.content
if (content) yield content if (content) yield content
} }
@@ -158,14 +189,15 @@ async function* streamCompletion(
} }
} }
// 发给模型的对话上下文:只留最近 20 条;除最后一条 AI 回复外,旧回复里的代码块换成占位文字。 // 发给模型的对话上下文:只留最近 20 条;除最后一条带代码的 AI 回复外,旧回复里的代码块换成占位文字。
// 每次回复都是完整代码,模型只需要最新那份;否则对话越长 token 越多,最后会超出上下文长度 // 每次回复都是完整代码,模型只需要最新那份;否则对话越长 token 越多,最后会超出上下文长度。
// 只回答问题的回复没有代码,不能拿它当“最后一条”,不然最新的代码也被省略了
const MAX_HISTORY = 20 const MAX_HISTORY = 20
const CODE_BLOCK = /```[\s\S]*?```/g const CODE_BLOCK = /```[\s\S]*?```/g
export function trimHistory(history: ChatMessage[]): ChatMessage[] { export function trimHistory(history: ChatMessage[]): ChatMessage[] {
const recent = history.slice(-MAX_HISTORY) const recent = history.slice(-MAX_HISTORY)
const last = recent.findLastIndex((m) => m.role === "assistant") const last = recent.findLastIndex((m) => m.role === "assistant" && m.content.includes("```"))
return recent.map((m, i) => return recent.map((m, i) =>
m.role === "assistant" && i !== last m.role === "assistant" && i !== last
? { ...m, content: m.content.replace(CODE_BLOCK, "```\n(旧版本代码已省略)\n```") } ? { ...m, content: m.content.replace(CODE_BLOCK, "```\n(旧版本代码已省略)\n```") }
@@ -185,30 +217,34 @@ export function userFacingError(e: unknown) {
return status ? `AI 服务出错(${status}),请稍后重试` : "AI 服务出错,请稍后重试" return status ? `AI 服务出错(${status}),请稍后重试` : "AI 服务出错,请稍后重试"
} }
export function streamChat(history: ChatMessage[], model?: string, signal?: AbortSignal) { // 生成整页代码:开着思考,质量优先。brief 是挑战的题目要求(见 challengeBrief),自由创作没有
return streamCompletion( export function streamChat(history: ChatMessage[], model?: string, signal?: AbortSignal, brief?: string | null) {
[{ role: "system", content: SYSTEM_PROMPT }, ...trimHistory(history)], const system = brief ? `${SYSTEM_PROMPT}\n\n${BRIEF_RULES}\n\n${brief}` : SYSTEM_PROMPT
chatModel(model), return streamCompletion([{ role: "system", content: system }, ...trimHistory(history)], {
model: chatModel(model),
thinking: true,
signal, signal,
) })
} }
export function streamGuidance(history: ChatMessage[], signal?: AbortSignal) { // 引导只是简短追问,不用思考,回得快。context 是题目和学生之前的对话(见 guidanceContext)
return streamCompletion( export function streamGuidance(history: ChatMessage[], context: string, signal?: AbortSignal) {
[{ role: "system", content: GUIDANCE_SYSTEM_PROMPT }, ...history], return streamCompletion([{ role: "system", content: `${GUIDANCE_SYSTEM_PROMPT}\n\n${context}` }, ...history], {
undefined, thinking: false,
signal, signal,
) })
} }
export async function complete( export async function complete(
messages: ChatMessage[], messages: ChatMessage[],
opts: { model?: string; maxTokens?: number; timeoutMs?: number } = {}, opts: { model?: string; thinking?: boolean; maxTokens?: number; temperature?: number; timeoutMs?: number } = {},
): Promise<string> { ): Promise<string> {
const res = await buildRequest(messages, { const res = await buildRequest(messages, {
model: opts.model ?? config.llmModel, model: opts.model ?? config.llmModel,
stream: false, stream: false,
thinking: opts.thinking,
maxTokens: opts.maxTokens, maxTokens: opts.maxTokens,
temperature: opts.temperature,
timeoutMs: opts.timeoutMs, timeoutMs: opts.timeoutMs,
}) })
await ensureOk(res) await ensureOk(res)
+92
View File
@@ -1,5 +1,6 @@
import { all, get, run, now, newUuidHex } from "../db" import { all, get, run, now, newUuidHex } from "../db"
import { Role, type User } from "../auth" import { Role, type User } from "../auth"
import { pyRound } from "./pyround"
export interface MessageRow { export interface MessageRow {
id: number id: number
@@ -98,6 +99,62 @@ export function codeAsMarkdown(code: {
return "```html\n" + parts.join("\n\n") + "\n```" return "```html\n" + parts.join("\n\n") + "\n```"
} }
// 题目要求去掉图片、压成一段,太长的截掉
const BRIEF_CHARS = 800
export function briefOf(content: string, max = BRIEF_CHARS) {
const text = content
.replace(/!\[[^\]]*\]\([^)]*\)/g, "")
.replace(/\s+/g, " ")
.trim()
return clipTo(text, max)
}
function clipTo(text: string, n: number) {
return text.length > n ? text.slice(0, n) + "……" : text
}
// 挑战的题目要求,给生成网页的 AI 当对照清单(见 llm.ts 的 BRIEF_RULES);要逐条对照,不能截得太短。
// 自由创作的题目是学生自己写的介绍,不用对照,返回 null
export function challengeBrief(taskId: number) {
const task = get<{ title: string; content: string }>(
`SELECT title, content FROM task_task WHERE id = $id AND task_type = 'challenge'`,
{ id: taskId },
)
const brief = task && briefOf(task.content, 4000)
return brief ? `题目:${task.title}\n\n题目要求:${brief}` : null
}
// “帮我写清楚”的教练要知道题目和学生已经做到哪了,才分得清照搬题目和自己的想法:
// 题目要求、学生最近几次对 AI 说的话、AI 上一次的说明(代码去掉)
export function guidanceContext(conversationId: string, taskId: number) {
const task = get<{ title: string; content: string }>(
`SELECT title, content FROM task_task WHERE id = $id`,
{ id: taskId },
)
const asked = all<{ content: string }>(
`SELECT content FROM prompt_message
WHERE conversation_id = $id AND role = 'user' AND source IN ('conversation', 'manual')
ORDER BY created DESC, id DESC LIMIT 5`,
{ id: conversationId },
).reverse()
const reply = get<{ content: string }>(
`SELECT content FROM prompt_message
WHERE conversation_id = $id AND role = 'assistant' AND source = 'conversation'
ORDER BY created DESC, id DESC LIMIT 1`,
{ id: conversationId },
)
const replyText = reply?.content.replace(/```[\s\S]*?(```|$)/g, "").trim()
return [
`题目:${task?.title ?? "(未知)"}`,
`题目要求:${task ? briefOf(task.content) || "(无)" : "(无)"}`,
`学生之前对 AI 说过的话:${
asked.length ? asked.map((m, i) => `\n${i + 1}. ${clipTo(m.content.trim(), 300)}`).join("") : "(还没有,这是第一次描述作品)"
}`,
`AI 上一次的说明:${replyText ? clipTo(replyText, 600) : "(无)"}`,
].join("\n\n")
}
export function getPrecedingUserMessage(asst: Pick<MessageRow, "id" | "conversation_id" | "created">) { export function getPrecedingUserMessage(asst: Pick<MessageRow, "id" | "conversation_id" | "created">) {
return get<MessageRow>( return get<MessageRow>(
`SELECT * FROM prompt_message `SELECT * FROM prompt_message
@@ -141,3 +198,38 @@ export function buildPromptRounds(source: MessageRow) {
} }
return rounds return rounds
} }
// 课堂总结:这些提交各自是怎么问出来的(只走覆盖索引,不读提问和代码)
export function promptChainStats(submissionIds: string[]) {
type Slim = { conversation_id: string; created: string; id: number; role: string; source: string; prompt_level: number | null }
const finals = all<Omit<Slim, "role" | "prompt_level">>(
`SELECT conversation_id, created, id, source FROM prompt_message
WHERE submission_id IN (SELECT value FROM json_each($ids))`,
{ ids: JSON.stringify(submissionIds) },
)
const byConv = new Map<string, Slim[]>()
const msgs = all<Slim>(
`SELECT conversation_id, created, id, role, source, prompt_level FROM prompt_message
WHERE conversation_id IN (SELECT value FROM json_each($convs))`,
{ convs: JSON.stringify([...new Set(finals.map((f) => f.conversation_id))]) },
)
for (const m of msgs) byConv.set(m.conversation_id, [...(byConv.get(m.conversation_id) ?? []), m])
const out = { with_chain: finals.length, one_round: 0, external: 0, used_guidance: 0, avg_rounds: 0 }
const levels = [0, 0, 0, 0, 0, 0]
let rounds = 0
for (const f of finals) {
// 和 buildPromptRounds 一样:只算交的那一版之前的提问
const asked = (byConv.get(f.conversation_id) ?? []).filter(
(m) => m.role === "user" && (m.created < f.created || (m.created === f.created && m.id < f.id)),
)
const code = asked.filter((m) => m.source !== "guidance")
rounds += code.length
if (code.length === 1) out.one_round++
if (f.source === "manual") out.external++
if (code.length < asked.length) out.used_guidance++
for (const m of code) if (m.prompt_level) levels[m.prompt_level - 1]!++
}
out.avg_rounds = finals.length ? pyRound(rounds / finals.length, 1) : 0
return { ...out, levels }
}
+20 -5
View File
@@ -3,8 +3,10 @@ import { all, get, run, iso, uuidOut } from "./db"
import { userFromAccessToken, type User } from "./auth" import { userFromAccessToken, type User } from "./auth"
import { import {
canAccessTask, canAccessTask,
challengeBrief,
codeAsMarkdown, codeAsMarkdown,
getOrCreateActiveConversation, getOrCreateActiveConversation,
guidanceContext,
insertMessage, insertMessage,
} from "./services/prompt" } from "./services/prompt"
import { import {
@@ -15,6 +17,7 @@ import {
userFacingError, userFacingError,
type ChatMessage, type ChatMessage,
} from "./services/llm" } from "./services/llm"
import { classifyMessage, inBackground } from "./services/classifier"
type Kind = "prompt" | "guidance" type Kind = "prompt" | "guidance"
@@ -116,11 +119,12 @@ async function handlePrompt(ws: WS, data: any) {
const model = String(data.model ?? "") const model = String(data.model ?? "")
if (!prompt) return if (!prompt) return
ws.data.pendingUserMessageId = insertMessage({ const userMessageId = insertMessage({
conversation_id: ws.data.conversationId, conversation_id: ws.data.conversationId,
role: "user", role: "user",
content: prompt, content: prompt,
}) })
ws.data.pendingUserMessageId = userMessageId
try { try {
const history: ChatMessage[] = conversationHistory(ws.data.conversationId).map((m) => ({ const history: ChatMessage[] = conversationHistory(ws.data.conversationId).map((m) => ({
role: m.role as ChatMessage["role"], role: m.role as ChatMessage["role"],
@@ -129,7 +133,8 @@ async function handlePrompt(ws: WS, data: any) {
})) }))
let full: string let full: string
try { try {
full = await streamToClient(ws, streamChat(history, model, ws.data.abort.signal)) const brief = challengeBrief(ws.data.taskId)
full = await streamToClient(ws, streamChat(history, model, ws.data.abort.signal, brief))
} catch (e) { } catch (e) {
// 客户端自己断开导致的中止不算出错 // 客户端自己断开导致的中止不算出错
if (!ws.data.closed) send(ws, { type: "error", content: userFacingError(e) }) if (!ws.data.closed) send(ws, { type: "error", content: userFacingError(e) })
@@ -146,8 +151,12 @@ async function handlePrompt(ws: WS, data: any) {
code_css: code.css, code_css: code.css,
code_js: code.js, code_js: code.js,
}) })
// 有了回复,这条提问才留下来;在后台打 L1–L6 层级
inBackground(classifyMessage(userMessageId))
ws.data.pendingUserMessageId = null ws.data.pendingUserMessageId = null
send(ws, { type: "complete", code, message_id: messageId }) // 只回答问题、没给代码的回复不是新版本;发 null,免得工作台把网页清空
const hasCode = !!(code.html || code.css || code.js)
send(ws, { type: "complete", code: hasCode ? code : null, message_id: messageId })
} finally { } finally {
dropPendingUserMessage(ws) dropPendingUserMessage(ws)
} }
@@ -157,17 +166,22 @@ async function handleGuidance(ws: WS, data: any) {
const prompt = String(data.content ?? "").trim() const prompt = String(data.content ?? "").trim()
if (!prompt) return if (!prompt) return
ws.data.pendingUserMessageId = insertMessage({ const userMessageId = insertMessage({
conversation_id: ws.data.conversationId, conversation_id: ws.data.conversationId,
role: "user", role: "user",
content: prompt, content: prompt,
source: "guidance", source: "guidance",
}) })
ws.data.pendingUserMessageId = userMessageId
ws.data.guidanceHistory.push({ role: "user", content: prompt }) ws.data.guidanceHistory.push({ role: "user", content: prompt })
try { try {
let full: string let full: string
try { try {
full = await streamToClient(ws, streamGuidance(ws.data.guidanceHistory, ws.data.abort.signal)) const context = guidanceContext(ws.data.conversationId, ws.data.taskId)
full = await streamToClient(
ws,
streamGuidance(ws.data.guidanceHistory, context, ws.data.abort.signal),
)
} catch (e) { } catch (e) {
// 这条提问没有回复,留在上下文里会出现连续两条用户消息 // 这条提问没有回复,留在上下文里会出现连续两条用户消息
ws.data.guidanceHistory.pop() ws.data.guidanceHistory.pop()
@@ -185,6 +199,7 @@ async function handleGuidance(ws: WS, data: any) {
content: clean, content: clean,
source: "guidance", source: "guidance",
}) })
inBackground(classifyMessage(userMessageId))
ws.data.pendingUserMessageId = null ws.data.pendingUserMessageId = null
send(ws, { type: "complete", message_id: messageId, is_ready: isReady }) send(ws, { type: "complete", message_id: messageId, is_ready: isReady })
} finally { } finally {
+74
View File
@@ -276,6 +276,34 @@ describe("提交与删除", () => {
expect(all(`SELECT COUNT(*) AS n FROM submission_submission WHERE id != $id`, { id: otherSub })).toEqual([{ n: 1 }]) expect(all(`SELECT COUNT(*) AS n FROM submission_submission WHERE id != $id`, { id: otherSub })).toEqual([{ n: 1 }])
}) })
test("交的时候写的反思:再交没写就保留,只有老师和作者能看,删提交时一起删", async () => {
makeUser("stu")
makeUser("mate")
makeUser("teacher", "admin")
const task = makeTask("T")
const stu = await client("stu")
const edit = await stu("POST", "/api/prompt/versions", { task_id: task, html: "<p>1", css: "", js: "" })
const sub = await stu("POST", "/api/submission/", {
task_id: task,
html: "<p>1",
message_id: edit.json.message_id,
reflection: " 按钮改成三个,因为五个太乱 ",
})
const id = sub.json.id
await stu("POST", "/api/submission/", { task_id: task, html: "<p>1!", message_id: edit.json.message_id, reflection: "" })
expect((await stu("GET", `/api/submission/${id}`)).json.reflection).toBe("按钮改成三个,因为五个太乱")
expect((await (await client("teacher"))("GET", `/api/submission/${id}`)).json.reflection).toBe("按钮改成三个,因为五个太乱")
const mate = await client("mate")
await mate("POST", "/api/submission/", { task_id: task, html: "<p>m" })
const peer = await mate("GET", `/api/submission/${id}`)
expect(peer.status).toBe(200)
expect(peer.json.reflection).toBeNull()
expect((await stu("DELETE", `/api/submission/${id}`)).status).toBe(200)
expect(all(`SELECT * FROM submission_reflection`)).toEqual([])
})
test("被评分的提交只有超管能删", async () => { test("被评分的提交只有超管能删", async () => {
const author = makeUser("author") const author = makeUser("author")
const other = makeUser("other") const other = makeUser("other")
@@ -645,4 +673,50 @@ describe("课堂总结", () => {
const all = await adm("GET", `/api/submission/stats/${task}`) const all = await adm("GET", `/api/submission/stats/${task}`)
expect(all.json.top_scored.map((t: any) => t.username)).toEqual(["weba2小李", "weba1小明"]) expect(all.json.top_scored.map((t: any) => t.username)).toEqual(["weba2小李", "weba1小明"])
}) })
test("统计每人最新一版的提示词链", async () => {
const { createConversation, insertMessage } = await import("../src/services/prompt")
makeUser("adm", "admin")
const task = makeTask("挑战")
const say = (conv: string, source: string, level: number | null, submission_id?: string) => {
const id = insertMessage({ conversation_id: conv, role: "user", source, content: "提问" })
run(`UPDATE prompt_message SET prompt_level = $level WHERE id = $id`, { level, id })
insertMessage({ conversation_id: conv, role: "assistant", source, content: "回答", submission_id })
}
// 小明:AI 对话 → 引导 → 外部 AI,交最后这版;交了之后的提问不算
const a = makeUser("weba1小明", "normal", "a1")
const convA = createConversation(a, task)
say(convA, "conversation", 3)
say(convA, "guidance", 2)
say(convA, "manual", 6, makeSubmission(a, task))
say(convA, "conversation", 1)
// 小红:一轮就交
const b = makeUser("weba1小红", "normal", "a1")
say(createConversation(b, task), "conversation", 1, makeSubmission(b, task))
// 小刚:手动交的,没有提示词
makeSubmission(makeUser("weba1小刚", "normal", "a1"), task)
const res = await (await client("adm"))("GET", `/api/submission/stats/${task}`)
expect(res.json.prompts).toEqual({
with_chain: 2,
one_round: 1,
external: 1,
used_guidance: 1,
avg_rounds: 1.5,
levels: [1, 0, 1, 0, 0, 1],
})
})
})
describe("提示词分类", () => {
test("太短的提问不打层级,以前打的也清掉", async () => {
const { classifyMessage } = await import("../src/services/classifier")
const { createConversation, insertMessage } = await import("../src/services/prompt")
const conv = createConversation(makeUser("stu"), makeTask("T"))
const id = insertMessage({ conversation_id: conv, role: "user", content: " 1 " })
run(`UPDATE prompt_message SET prompt_level = 6 WHERE id = $id`, { id })
expect(await classifyMessage(id)).toBeNull()
const row = get<{ prompt_level: number | null }>(`SELECT prompt_level FROM prompt_message WHERE id = $id`, { id })
expect(row!.prompt_level).toBeNull()
})
}) })
+20 -2
View File
@@ -5,6 +5,7 @@ import {
extractCode, extractCode,
parseGuidanceResponse, parseGuidanceResponse,
streamChat, streamChat,
streamGuidance,
trimHistory, trimHistory,
userFacingError, userFacingError,
} from "../src/services/llm" } from "../src/services/llm"
@@ -77,12 +78,13 @@ test("CSV 转义", () => {
}) })
describe("streamChat", () => { describe("streamChat", () => {
test("不认识的模型换成默认模型,最后一行没有换行也能读到", async () => { test("不认识的模型换成默认模型,最后一行没有换行也能读到;生成代码开思考,引导不开", async () => {
let model = "" let model = ""
let thinking: unknown
const server = Bun.serve({ const server = Bun.serve({
port: 0, port: 0,
async fetch(req) { async fetch(req) {
model = ((await req.json()) as any).model ;({ model, thinking } = (await req.json()) as any)
const line = (s: string) => `data: ${JSON.stringify({ choices: [{ delta: { content: s } }] })}` const line = (s: string) => `data: ${JSON.stringify({ choices: [{ delta: { content: s } }] })}`
// 一行拆在两个分块之间,最后一行不带换行 // 一行拆在两个分块之间,最后一行不带换行
const body = `${line("你好")}\n\n${line("世")}\n${line("界")}` const body = `${line("你好")}\n\n${line("世")}\n${line("界")}`
@@ -108,6 +110,9 @@ describe("streamChat", () => {
for await (const s of streamChat([{ role: "user", content: "hi" }], "deepseek-v4-flash-thinking")) out += s for await (const s of streamChat([{ role: "user", content: "hi" }], "deepseek-v4-flash-thinking")) out += s
expect(out).toBe("你好世界") expect(out).toBe("你好世界")
expect(model).toBe(config.llmModel) expect(model).toBe(config.llmModel)
expect(thinking).toEqual({ type: "enabled" })
for await (const _ of streamGuidance([{ role: "user", content: "hi" }], "题目:x"));
expect(thinking).toEqual({ type: "disabled" })
} finally { } finally {
Object.assign(config, saved) Object.assign(config, saved)
server.stop(true) server.stop(true)
@@ -135,6 +140,19 @@ test("trimHistory 只留最近 20 条,旧回复的代码换成占位", () => {
expect(out.filter((m) => m.content.includes("<p>"))).toHaveLength(1) expect(out.filter((m) => m.content.includes("<p>"))).toHaveLength(1)
}) })
test("trimHistory 最后一条回复没有代码时,保留之前最新的那份代码", () => {
const out = trimHistory([
{ role: "user", content: "做个页面" },
{ role: "assistant", content: "第1版\n```html\n<p>1</p>\n```" },
{ role: "user", content: "加个按钮" },
{ role: "assistant", content: "第2版\n```html\n<p>2</p>\n```" },
{ role: "user", content: "为什么按钮是圆的?" },
{ role: "assistant", content: "因为加了 border-radius。" },
])
expect(out[3]!.content).toContain("<p>2</p>")
expect(out[1]!.content).not.toContain("<p>1</p>")
})
test("userFacingError 不透出接口原始返回", () => { test("userFacingError 不透出接口原始返回", () => {
const quiet = console.error const quiet = console.error
console.error = () => {} console.error = () => {}
+89 -5
View File
@@ -2,18 +2,25 @@ import { afterAll, beforeAll, beforeEach, describe, expect, test } from "bun:tes
import type { Server } from "bun" import type { Server } from "bun"
import { app } from "../src/app" import { app } from "../src/app"
import { config } from "../src/config" import { config } from "../src/config"
import { all } from "../src/db" import { all, run } from "../src/db"
import { upgrade, websocket, type WsData } from "../src/ws" import { upgrade, websocket, type WsData } from "../src/ws"
import { client, freshDb, makeTask, makeUser } from "./helpers" import { client, freshDb, makeTask, makeUser } from "./helpers"
// 假的模型接口:每段之间停一下,方便测试中途断开 // 假的模型接口:每段之间停一下,方便测试中途断开
const PIECES = ["好的", "```html\n<p>hi</p>\n```"] const DEFAULT_PIECES = ["好的", "```html\n<p>hi</p>\n```"]
// 最近一次发给模型的请求 let PIECES = DEFAULT_PIECES
// 最近一次发给模型的请求;分类(非流式)单独记,固定回“3”
let lastRequest: any = null let lastRequest: any = null
let lastClassify: any = null
const llm = Bun.serve({ const llm = Bun.serve({
port: 0, port: 0,
async fetch(req) { async fetch(req) {
lastRequest = await req.json() const body: any = await req.json()
if (!body.stream) {
lastClassify = body
return Response.json({ choices: [{ message: { content: "3" } }] })
}
lastRequest = body
const enc = new TextEncoder() const enc = new TextEncoder()
const stream = new ReadableStream({ const stream = new ReadableStream({
async start(ctrl) { async start(ctrl) {
@@ -50,7 +57,10 @@ afterAll(() => {
llm.stop(true) llm.stop(true)
}) })
beforeEach(freshDb) beforeEach(() => {
freshDb()
PIECES = DEFAULT_PIECES
})
interface Conn { interface Conn {
ws: WebSocket ws: WebSocket
@@ -106,6 +116,19 @@ describe("WebSocket 代码生成", () => {
c.ws.close() c.ws.close()
}) })
test("回复完后在后台给提问打层级", async () => {
const { task, token } = await setup()
const c = (await connect(`/ws/prompt/${task}/?token=${token}`))!
await c.next("init")
c.ws.send(JSON.stringify({ type: "message", content: "做个页面" }))
await c.next("complete")
const level = () => all(`SELECT prompt_level FROM prompt_message WHERE role = 'user'`)[0]?.prompt_level
for (let i = 0; i < 50 && level() == null; i++) await Bun.sleep(20)
expect(level()).toBe(3)
expect(lastClassify.thinking).toEqual({ type: "disabled" })
c.ws.close()
})
test("AI 回复中再发消息会被拒绝", async () => { test("AI 回复中再发消息会被拒绝", async () => {
const { task, token } = await setup() const { task, token } = await setup()
const c = (await connect(`/ws/prompt/${task}/?token=${token}`))! const c = (await connect(`/ws/prompt/${task}/?token=${token}`))!
@@ -157,9 +180,70 @@ describe("WebSocket 代码生成", () => {
c.ws.close() c.ws.close()
}) })
test("只回答问题、没给代码时 code 是 null", async () => {
const { task, token } = await setup()
PIECES = ["因为加了 ", "border-radius。"]
const c = (await connect(`/ws/prompt/${task}/?token=${token}`))!
await c.next("init")
c.ws.send(JSON.stringify({ type: "message", content: "为什么按钮是圆的?" }))
const done = await c.next("complete")
expect(done.code).toBeNull()
expect(done.message_id).toBeGreaterThan(0)
c.ws.close()
})
test("挑战的题目要求作为对照清单发给 AI,自由创作不发", async () => {
const { task, token } = await setup()
run(`UPDATE task_task SET content = $c WHERE id = $id`, { c: "做一个计时器,有开始和暂停按钮", id: task })
const c = (await connect(`/ws/prompt/${task}/?token=${token}`))!
await c.next("init")
c.ws.send(JSON.stringify({ type: "message", content: "做个页面" }))
await c.next("complete")
expect(lastRequest.messages[0].content).toContain("它是对照清单")
expect(lastRequest.messages[0].content).toContain("题目要求:做一个计时器,有开始和暂停按钮")
c.ws.close()
const creation = makeTask("我的作品", "creation", 2)
run(`UPDATE task_task SET content = '我想做一个相册' WHERE id = $id`, { id: creation })
const d = (await connect(`/ws/prompt/${creation}/?token=${token}`))!
await d.next("init")
d.ws.send(JSON.stringify({ type: "message", content: "做个页面" }))
await d.next("complete")
expect(lastRequest.messages[0].content).not.toContain("题目要求")
d.ws.close()
})
test("token 无效或任务不存在时握手失败", async () => { test("token 无效或任务不存在时握手失败", async () => {
const { task, token } = await setup() const { task, token } = await setup()
expect(await connect(`/ws/prompt/${task}/?token=bad`)).toBeNull() expect(await connect(`/ws/prompt/${task}/?token=bad`)).toBeNull()
expect(await connect(`/ws/prompt/9999/?token=${token}`)).toBeNull() expect(await connect(`/ws/prompt/9999/?token=${token}`)).toBeNull()
}) })
}) })
describe("WebSocket 帮我写清楚", () => {
test("教练能看到题目要求、之前的提问和 AI 上一次的说明", async () => {
const { task, token } = await setup()
run(`UPDATE task_task SET content = $c WHERE id = $id`, { c: "做一个计时器,![图](a.png) 有开始和暂停按钮", id: task })
const p = (await connect(`/ws/prompt/${task}/?token=${token}`))!
await p.next("init")
p.ws.send(JSON.stringify({ type: "message", content: "做个计时器" }))
await p.next("complete")
p.ws.close()
const g = (await connect(`/ws/guidance/${task}/?token=${token}`))!
await g.next("init")
g.ws.send(JSON.stringify({ type: "message", content: "改成粉色" }))
await g.next("complete")
const system = lastRequest.messages[0]
expect(system.role).toBe("system")
expect(system.content).toContain("题目要求:做一个计时器, 有开始和暂停按钮")
expect(system.content).toContain("1. 做个计时器")
expect(system.content).toContain("AI 上一次的说明:好的")
expect(system.content).not.toContain("<p>hi</p>")
expect(lastRequest.messages.at(-1)).toEqual({ role: "user", content: "改成粉色" })
// 等后台打完层级再结束,不然假接口关了它会报错
const level = () => all(`SELECT prompt_level FROM prompt_message WHERE source = 'guidance' AND role = 'user'`)[0]?.prompt_level
for (let i = 0; i < 50 && level() == null; i++) await Bun.sleep(20)
g.ws.close()
})
})