公屏上课

This commit is contained in:
zdg 2024-12-19 11:14:14 +08:00
parent cebf864b82
commit 45abab7a41
5 changed files with 83 additions and 33 deletions

View File

@ -8,8 +8,15 @@ import * as API_classcourse from '@/api/teaching/classcourse' // 后端api
export default () => { export default () => {
const classcourse = sessionStore.get('curr.classcourse') // 课堂信息 const classcourse = sessionStore.get('curr.classcourse') // 课堂信息
const courseId = classcourse?.id // 课堂id
const timgroupid = classcourse?.timgroupid // 群组id const timgroupid = classcourse?.timgroupid // 群组id
if (!ChatWs.ws) ChatWs.init() if (!ChatWs.ws) ChatWs.init()
// 开课消息
const startCourse = async() => {
// await API_classcourse.updateClasscourse({ id: classcourse.id, status: 'open' })
ChatWs.sendMsg('open', {id: courseId})
return Promise.resolve()
}
// 下课消息 // 下课消息
const exitCourse = async() => { const exitCourse = async() => {
if(!timgroupid) throw new Error('未获取到群组ID') if(!timgroupid) throw new Error('未获取到群组ID')

View File

@ -14,6 +14,7 @@ const slidesStore = useStore.useSlidesStore() // 幻灯片-状态管理
const screenStore = useStore.useScreenStore() // 全屏-状态管理 const screenStore = useStore.useScreenStore() // 全屏-状态管理
const classcourseStore = useStore.useClasscourseStore() // 课堂信息-状态管理 const classcourseStore = useStore.useClasscourseStore() // 课堂信息-状态管理
const classcourse = sessionStore.get('curr.classcourse') // 课堂信息 const classcourse = sessionStore.get('curr.classcourse') // 课堂信息
const isPublic = sessionStore.get('curr.isPublic') // 是否公屏开课
export class Classcourse { export class Classcourse {
msgObj:ElMessageBox = null // 提示消息对象 msgObj:ElMessageBox = null // 提示消息对象
@ -36,8 +37,14 @@ export class Classcourse {
// 如果课堂信息有值则连接socket // 如果课堂信息有值则连接socket
if (isCourse) { if (isCourse) {
// 连接socket // 连接socket
if (!ChatWs.ws) ChatWs.init()
ChatWs.id = classcourse.timgroupid // 群组id ChatWs.id = classcourse.timgroupid // 群组id
if (!ChatWs.ws) {
ChatWs.init().then(_ => {
console.log('socket-加载成功')
isPublic && ChatWs.sendMsg('open', {id: classcourse.id})
isPublic && console.log('socket-开课消息-已发送')
})
}
this.classcourse = classcourse // 课堂信息 this.classcourse = classcourse // 课堂信息
this.id = classcourse.id // 课堂id this.id = classcourse.id // 课堂id
// 如果课堂信息有paging则更新当前页码 // 如果课堂信息有paging则更新当前页码

View File

@ -6,6 +6,8 @@ import { KEYS } from '../../../configs/hotkey'
import { ANIMATION_CLASS_PREFIX } from '../../../configs/animation' import { ANIMATION_CLASS_PREFIX } from '../../../configs/animation'
import message from '../../../utils/message' import message from '../../../utils/message'
import emitter from '@/utils/mitt'; import emitter from '@/utils/mitt';
import ChatWs from '@/plugins/socket' // 聊天socket
import { MsgEnum } from '../../../api/types' // 消息枚举
export default () => { export default () => {
const slidesStore = useSlidesStore() const slidesStore = useSlidesStore()
@ -178,8 +180,7 @@ export default () => {
// 鼠标滚动翻页 // 鼠标滚动翻页
const mousewheelListener = (e: WheelEvent) => { const mousewheelListener = (e: WheelEvent) => {
// console.log('mousewheel', e) // console.log('mousewheel', e)
// 课堂信息存在时,不允许翻页 e.preventDefault() // 阻止默认事件
if (!!classcourseStore.classcourse) e.preventDefault()
mousewheelListenerThrottle(e) mousewheelListenerThrottle(e)
} }
const mousewheelListenerThrottle = throttle(function(e: WheelEvent) { const mousewheelListenerThrottle = throttle(function(e: WheelEvent) {
@ -212,10 +213,15 @@ export default () => {
// 向上翻页/向下翻页 // 向上翻页/向下翻页
const turning = (e, type) => { const turning = (e, type) => {
e.preventDefault() // 阻止默认事件 e.preventDefault() // 阻止默认事件
// 课堂信息存在时,不允许翻页
if (!!classcourseStore.classcourse) return
if (type === 'prev') execPrev() if (type === 'prev') execPrev()
else if (type === 'next') execNext() else if (type === 'next') execNext()
// 发送sokcet消息
const isSend = classcourseStore.classcourse && !!ChatWs.ws && ChatWs.ws.readyState === 1
console.log('isSend', isSend, ChatWs.ws.readyState)
if (isSend) { // 有课堂信息,发送,没有就是编辑状态
// const head = MsgEnum.HEADS.MSG_slideFlapping
// ChatWs.sendMsg(head, {type})
}
} }
// 快捷键翻页 // 快捷键翻页
const keydownListener = (e: KeyboardEvent) => { const keydownListener = (e: KeyboardEvent) => {

View File

@ -62,6 +62,7 @@
<div v-if="myClassActive.filetype=='apt'">开始新的课堂需要点击先创建课堂才能显示手机二维码</div> <div v-if="myClassActive.filetype=='apt'">开始新的课堂需要点击先创建课堂才能显示手机二维码</div>
<div v-else>开始新的课堂需要点击先创建课堂</div> <div v-else>开始新的课堂需要点击先创建课堂</div>
<el-button type="warning" :loading="dt.loading" @click="createClasscourse">创建课堂</el-button> <el-button type="warning" :loading="dt.loading" @click="createClasscourse">创建课堂</el-button>
<el-button type="success" @click="publicScreenClass">公屏上课</el-button>
</div> </div>
</template> </template>
<!-- 故障备用 --> <!-- 故障备用 -->
@ -146,7 +147,7 @@ const open = async (id, classObj) => {
await getAptInfo(id) await getAptInfo(id)
// //
getClassList() getClassList()
console.log('classObj', classObj) // console.log('classObj', classObj)
// //
if (!!classObj) { if (!!classObj) {
dt.ctCourse = classObj dt.ctCourse = classObj
@ -245,8 +246,8 @@ const getClasscourseList = async type => {
} }
} }
} }
// // isPublic
const createClasscourse = async () => { const createClasscourse = async (isPublic = false) => {
const { classid } = classForm.form const { classid } = classForm.form
if (!classid) { if (!classid) {
ElMessage.warning('请选择班级') ElMessage.warning('请选择班级')
@ -255,8 +256,8 @@ const createClasscourse = async () => {
dt.loading = true dt.loading = true
const { entpcourseid, evalid, id, coursetitle } = myClassActive.value // const { entpcourseid, evalid, id, coursetitle } = myClassActive.value //
const curDate = commUtil.getDateNow('yyyy-MM-dd') const curDate = commUtil.getDateNow('yyyy-MM-dd')
const params = { const params = { // status = open
id: 0, coursetype: '', courseverid: 0, coursedesc: '', status: '', id: 0, coursetype: '', courseverid: 0, coursedesc: '', status: isPublic?'open':'',
teacherid: userStore.id, entpcoursefileid: id, classid, teacherid: userStore.id, entpcoursefileid: id, classid,
entpcourseid, evalid, coursetitle, entpcourseid, evalid, coursetitle,
plandate: curDate, opendate: curDate plandate: curDate, opendate: curDate
@ -274,7 +275,7 @@ const createClasscourse = async () => {
setTimeout(async() => { setTimeout(async() => {
msgEl.close() msgEl.close()
const res = await Http_Classcourse.getClasscourse(teacherForm.form.classcourseid) const res = await Http_Classcourse.getClasscourse(teacherForm.form.classcourseid)
openPublicScreen(res.data) openPublicScreen(res.data, isPublic)
}, 2000); }, 2000);
}, 1000); }, 1000);
} }
@ -355,7 +356,7 @@ const getQrUrl = async() => {
} }
// //
const openPublicScreen = (classcourse) => { const openPublicScreen = (classcourse, isPublic) => {
console.log('打开公屏', classcourse) console.log('打开公屏', classcourse)
if (!dt.ctCourse) { // - if (!dt.ctCourse) { // -
// app // app
@ -366,11 +367,14 @@ const openPublicScreen = (classcourse) => {
const resource = toRaw(myClassActive.value) const resource = toRaw(myClassActive.value)
sessionStore.set('curr.resource', resource) // sessionStore.set('curr.resource', resource) //
sessionStore.set('curr.classcourse', classcourse) // sessionStore.set('curr.classcourse', classcourse) //
//
sessionStore.set('curr.isPublic', isPublic) //
createWindow('open-win', { createWindow('open-win', {
url: '/pptist', // url: '/pptist', //
close: () => { close: () => {
sessionStore.set('curr.resource', null) // sessionStore.set('curr.resource', null) //
sessionStore.set('curr.classcourse', null) // sessionStore.set('curr.classcourse', null) //
sessionStore.set('curr.isPublic', null) //
} }
}) })
visible.value = false // visible.value = false //

View File

@ -367,7 +367,8 @@ export default {
this.$refs.calssRef.open(item.fileId, classObj) this.$refs.calssRef.open(item.fileId, classObj)
} }
if(item.fileFlag === 'aippt') { if(item.fileFlag === 'aippt') {
this.$refs.calssRef.open(item.fileId, classObj) if (!!classObj) this.changeClass('continue', classObj) //
else this.$refs.calssRef.open(item.fileId, classObj) //
} }
}, },
// -apt // -apt
@ -375,7 +376,18 @@ export default {
switch(type) { switch(type) {
case 'continue': { // case 'continue': { //
const aptFileId = row.entpcoursefileid const aptFileId = row.entpcoursefileid
this.$refs.calssRef.open(aptFileId, row) const res = await getEntpcoursefile(aptFileId)
if (res.code == 200) {
const resource = res.data
if (resource.filetype != 'aippt') this.$refs.calssRef.open(aptFileId, row)
else {
const msgEl = ElMessage.warning({message:'正在打开公屏,请稍后...',duration: 0})
setTimeout(()=>{
msgEl.close()
this.openPublicScreen('class', resource, row) // -
}, 2000)
}
} else ElMessage.error(res.msg||'获取课件信息失败')
break break
} }
case 'close': { // case 'close': { //
@ -428,16 +440,7 @@ export default {
if (row.fileFlag === 'aippt' && !!row.fileId) { if (row.fileFlag === 'aippt' && !!row.fileId) {
const res = await getEntpcoursefile(row.fileId) const res = await getEntpcoursefile(row.fileId)
if (res && res.code === 200) { if (res && res.code === 200) {
sessionStore.set('curr.resource', res.data) // this.openPublicScreen('edit', res.data, row) // -
sessionStore.set('curr.smarttalk', row) // smarttalk
createWindow('open-win', {
url: '/pptist', //
close: () => {
sessionStore.set('curr.resource', null) //
sessionStore.set('curr.smarttalk', null) //
this.asyncAllFile() //
}
})
} else { } else {
ElMessage.warning(res.msg||'文件获取异常!') ElMessage.warning(res.msg||'文件获取异常!')
} }
@ -462,21 +465,44 @@ export default {
msgEl.close() // msgEl.close() //
const resource = res?.data||{} const resource = res?.data||{}
const classcourse = row const classcourse = row
sessionStore.set('curr.resource', resource) // this.openPublicScreen('class',resource, classcourse) // -
sessionStore.set('curr.classcourse', classcourse) // // sessionStore.set('curr.resource', resource) //
createWindow('open-win', { // sessionStore.set('curr.classcourse', classcourse) //
url: '/pptist', // // createWindow('open-win', {
close: () => { // url: '/pptist', //
sessionStore.set('curr.resource', null) // // close: () => {
sessionStore.set('curr.classcourse', null) // // sessionStore.set('curr.resource', null) //
} // sessionStore.set('curr.classcourse', null) //
}) // }
// })
break break
} }
default: default:
break break
} }
}, },
/**
* description 打开公屏
* @param {string} type 类型 edit 打开 class 上课
* @param {object} resource 资源信息
* @param {object} currData 当前数据 type: edit/class 备课信息 | 课堂信息
*/
openPublicScreen(type, resource, currData) {
sessionStore.set('curr.resource', resource) //
if (type=='edit') sessionStore.set('curr.smarttalk', currData) // smarttalk
else sessionStore.set('curr.classcourse', currData) //
createWindow('open-win', {
url: '/pptist', //
close: () => {
sessionStore.set('curr.resource', null) //
if (type=='edit') {
sessionStore.set('curr.smarttalk', null) //
this.asyncAllFile() //
} else sessionStore.set('curr.classcourse', null) //
}
})
},
closeChange() { // - closeChange() { // -
// console.log('') // console.log('')
// this.activeClass = null // this.activeClass = null