feat(collab): 教师端弹框补上代码提示,语言跟着学生走
Some checks failed
Deploy / deploy (push) Has been cancelled

教师端的协作编辑器只有高亮和括号匹配,没装 autocompletion —— 老师替学生
写代码时没有下拉补全,只能盲敲。而且语言写死 cpp(),学生写 Python 时老师
看到的是 C 的高亮。

- 求助协议带上语言:help_request 记到 HelpRequest,accept 时写进 Room,
  room_open 发给两端;认不出的语言一律当 C(老客户端不带这个字段,而它
  以前就是写死 C 的)
- 新增 help_language / room_language:学生在排队或协作期间切语言,只更新
  语言,不动队列位置和房间;已开房就把新语言推给老师,弹框的高亮和补全
  实时跟着换
- CollabModal 装上 autocompletion,和学生端用同一套 enhanceCompletion +
  completeAnyWord;语言→高亮扩展的映射抽到 shared/extensions/language.ts
  两端共用,免得再分叉
- 学生端求助按钮合并状态提示:原来按钮旁边还挂一个 n-tag,一行工具栏在
  1280 的机房屏上放不下,改成状态全进 label(已求助 · 待接入 / 已求助 ·
  前面 N 人 / xxx 老师帮你中)

扩展数组变了 vue-codemirror 会整体 reconfigure,但 CM6 对已存在的
compartment 取 `compartments.get() || ext.inner`,collabDoc 那个装 yCollab
的 compartment 内容会被沿用,切语言、切主题都不会把协作弄断 —— 实跑验证过
双向同步、补全下拉、协作中切语言三条路径。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_015APGLsyaCUa7XFMYAaCho4
This commit is contained in:
2026-08-30 10:28:36 -06:00
parent 2f9b6dbf03
commit 38b81881d5
8 changed files with 181 additions and 38 deletions

View File

@@ -64,16 +64,39 @@ const showHelpButton = computed(
!isContestMode.value,
)
/**
* 状态全塞进按钮本身。原来旁边还挂一个 n-tag 说明排队情况,一行工具栏
* (语言 / 提交 / 提交信息 / 课堂统计 / 更多操作 / 求助)在 1280 的机房屏上放不下。
*/
const helpButtonText = computed(() => {
if (collabStore.helpStatus === "active") return "老师正在帮你"
if (collabStore.helpStatus === "pending") return "取消求助"
if (collabStore.helpStatus === "active") {
const name = collabStore.teacherName
return name ? `${name} 老师帮你中` : "老师正在帮你"
}
if (collabStore.helpStatus === "pending") {
return collabStore.queueAhead > 0
? `已求助 · 前面 ${collabStore.queueAhead}`
: "已求助 · 待接入"
}
return "求助"
})
const helpButtonType = computed(() => {
if (collabStore.helpStatus === "active") return "success"
if (collabStore.helpStatus === "pending") return "warning"
return "default"
})
// 排队中点一下就是取消,这句话再挤进 label 就太长了,挂在原生 title 上。
// active 时按钮是 disabled浏览器不会给 disabled 元素显示 title所以不放
const helpButtonTitle = computed(() =>
collabStore.helpStatus === "pending" ? "点击取消求助" : undefined,
)
const toggleHelp = () => {
if (collabStore.helpStatus === "pending") collabStore.cancelHelp()
else if (collabStore.helpStatus === "idle")
collabStore.requestHelp(problem.value!._id)
collabStore.requestHelp(problem.value!._id, codeStore.code.language)
}
const showGoSubmissionButton = computed(() => {
@@ -251,23 +274,16 @@ onMounted(() => {
<n-button :size="buttonSize">更多操作</n-button>
</n-dropdown>
<template v-if="showHelpButton">
<n-button
:size="buttonSize"
:type="collabStore.helpStatus === 'idle' ? 'default' : 'warning'"
:disabled="collabStore.helpStatus === 'active'"
@click="toggleHelp"
>
{{ helpButtonText }}
</n-button>
<n-tag v-if="collabStore.helpStatus === 'pending'" type="info">
已求助{{ collabStore.queueAhead > 0 ? `,前面还有 ${collabStore.queueAhead}` : ",等待老师接入" }}
</n-tag>
<n-tag v-else-if="collabStore.helpStatus === 'active'" type="success">
{{ collabStore.teacherName }} 老师正在帮你
</n-tag>
</template>
<n-button
v-if="showHelpButton"
:size="buttonSize"
:type="helpButtonType"
:disabled="collabStore.helpStatus === 'active'"
:title="helpButtonTitle"
@click="toggleHelp"
>
{{ helpButtonText }}
</n-button>
</n-flex>
<n-modal