feat:优化屏幕共享、学员监控
Some checks failed
CI / Test (ubuntu-latest) (push) Has been cancelled
CI / Test (windows-latest) (push) Has been cancelled
CI / Lint (ubuntu-latest) (push) Has been cancelled
CI / Lint (windows-latest) (push) Has been cancelled
CI / Check (ubuntu-latest) (push) Has been cancelled
CI / Check (windows-latest) (push) Has been cancelled
CI / CI OK (push) Has been cancelled
CodeQL / Analyze (javascript-typescript) (push) Has been cancelled
Deploy Website on push / Deploy Push Playground Ftp (push) Has been cancelled
Deploy Website on push / Deploy Push Docs Ftp (push) Has been cancelled
Deploy Website on push / Deploy Push Antd Ftp (push) Has been cancelled
Deploy Website on push / Deploy Push Element Ftp (push) Has been cancelled
Deploy Website on push / Deploy Push Naive Ftp (push) Has been cancelled
Deploy Website on push / Rerun on failure (push) Has been cancelled
Release Drafter / update_release_draft (push) Has been cancelled
Lock Threads / action (push) Has been cancelled
Issue Close Require / close-issues (push) Has been cancelled
Close stale issues / stale (push) Has been cancelled

This commit is contained in:
M了个J 2026-05-13 16:26:19 +08:00
parent 18227e29ad
commit ffacb4d300
2 changed files with 84 additions and 17 deletions

View File

@ -8,7 +8,19 @@ interface Window {
teacherApi?: {
startSfu: () => Promise<{ port: number; already?: boolean }>
stopSfu: () => Promise<void>
openScreenShareWindow: () => Promise<void>
/** 可选传入班级学员列表与班级名称;名称用于教师端共享窗口标题「{名称} - 屏幕共享」。 */
openScreenShareWindow: (
classStudentRows?: unknown[],
className?: string,
) => Promise<void>
/** 打开学员屏幕监控独立窗口teacher-electron */
openStudentScreenMonitorWindow?: (
classStudentRows?: unknown[],
className?: string,
) => Promise<void>
setShareClassStudentsListener?: (
cb: ((rows: unknown[]) => void) | null,
) => void
}
}

View File

@ -10,6 +10,7 @@ import type {
import { computed, onBeforeUnmount, onMounted, reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import { classStudentService } from '../../../api/service/org/class-student'
import { classroomMonitorService } from '../../../api/service/org/classroom-monitor'
import hud from '../../../utils/hud'
@ -258,18 +259,57 @@ function formatTime(time?: number | string) {
}
/** teacher-electron 注入:打开独立屏幕共享窗口 */
async function openTeacherScreenShareWindow() {
async function openTeacherScreenShareWindow(item: ClassroomItem) {
const api = window.teacherApi
if (!api?.openScreenShareWindow) {
ElMessage.warning('请在教师端桌面客户端中使用「共享屏幕」')
hud.warning('请在教师端桌面客户端中使用「共享屏幕」')
return
}
try {
await api.openScreenShareWindow()
} catch (e) {
console.error(e)
ElMessage.error('打开屏幕共享窗口失败')
await hud.load({
option: '准备共享屏幕',
task: async () => {
try {
const page = await classStudentService.findPage(1, 999, {
classId: item.id,
})
const rows = (page as any)?.data?.rows ?? page?.rows ?? []
await api.openScreenShareWindow(rows, item.name ?? '')
} catch (e) {
console.error(e)
throw e
}
},
error: async () => {
hud.error('打开屏幕共享窗口失败')
},
})
}
/** teacher-electron学员 JPEG 截屏监控窗口 */
async function openStudentScreenMonitorWindow(item: ClassroomItem) {
const openMon = window.teacherApi?.openStudentScreenMonitorWindow
if (!openMon) {
hud.warning('请在教师端桌面客户端中使用「屏幕监控」')
return
}
await hud.load({
option: '准备屏幕监控',
task: async () => {
try {
const page = await classStudentService.findPage(1, 999, {
classId: item.id,
})
const rows = (page as any)?.data?.rows ?? page?.rows ?? []
await openMon(rows, item.name ?? '')
} catch (e) {
console.error(e)
throw e
}
},
error: async () => {
hud.error('打开屏幕监控窗口失败')
},
})
}
</script>
@ -283,9 +323,6 @@ async function openTeacherScreenShareWindow() {
<div class="page-desc">请选择班级查看当前课堂监控</div>
</div>
<div class="header-actions">
<el-button type="primary" @click="openTeacherScreenShareWindow">
共享屏幕
</el-button>
<el-button
:loading="classLoading"
type="primary"
@ -308,9 +345,23 @@ async function openTeacherScreenShareWindow() {
{{ item.monitorState === 1 ? '监控开启' : '监控关闭' }}
</el-tag>
</div>
<el-button type="primary" @click="handleViewMonitor(item)">
查看监控
</el-button>
<div class="class-row-actions">
<el-button
type="primary"
@click="openTeacherScreenShareWindow(item)"
>
共享屏幕
</el-button>
<el-button
type="primary"
@click="openStudentScreenMonitorWindow(item)"
>
屏幕监控
</el-button>
<el-button type="primary" @click="handleViewMonitor(item)">
查看监控
</el-button>
</div>
</div>
<el-empty
@ -330,9 +381,6 @@ async function openTeacherScreenShareWindow() {
<div class="header-actions">
<el-button @click="backToClassList">返回班级列表</el-button>
<el-button @click="openHistoryMonitor">历史监控</el-button>
<el-button type="primary" @click="openTeacherScreenShareWindow">
共享屏幕
</el-button>
<el-button
:loading="detailLoading || snapshotLoading"
type="primary"
@ -581,6 +629,13 @@ async function openTeacherScreenShareWindow() {
min-width: 0;
}
.class-row-actions {
display: flex;
flex-shrink: 0;
gap: 12px;
align-items: center;
}
.class-name {
font-size: 16px;
font-weight: 500;