From ad6b1e9102d62d175f2496a5f96e1fbe81b53c3d Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期五, 12 七月 2024 11:45:35 +0800
Subject: [PATCH] 会议展示学生在线情况
---
src/api/meet.js | 10 +++
src/views/train/data-list/index.vue | 6 +-
src/views/train/index.vue | 9 +-
src/views/meet/index.vue | 140 +++++++++++++++++++++++++++++++++++++++++++++-
4 files changed, 154 insertions(+), 11 deletions(-)
diff --git a/src/api/meet.js b/src/api/meet.js
index e5db7b1..b8d127a 100644
--- a/src/api/meet.js
+++ b/src/api/meet.js
@@ -58,6 +58,7 @@
data: params
})
}
+
// 娣诲姞浼氳琛�
export const addMeet = (params) => {
return axios({
@@ -66,3 +67,12 @@
data: params
})
}
+
+// 鑾峰彇浼氳瀛︾敓
+export const getStudentList = (id, params) => {
+ return axios({
+ url: "/api/admin/meet/students/" + id,
+ method: "GET",
+ params: params
+ })
+}
diff --git a/src/views/meet/index.vue b/src/views/meet/index.vue
index d186859..01f3959 100644
--- a/src/views/meet/index.vue
+++ b/src/views/meet/index.vue
@@ -1,16 +1,122 @@
<template>
- <div id="meet" ref="meet">
+ <div>
+ <div style="display: flex; flex-direction: row">
+ <div id="meet" ref="meet"/>
+ <div style="padding: 5px">
+ <el-row :gutter="5">
+ <el-col :span="22">
+ <el-input placeholder="鎼滅储" size="small" v-model="searchForm.keyword"/>
+ </el-col>
+ <el-col :span="2">
+ <el-button type="primary" size="small" @click="getRoomInfo">鎼滅储</el-button>
+ </el-col>
+ </el-row>
+ <el-row>
+ <el-tabs v-model="searchForm.onlineStatus" @tab-click="handleTabChange" style="margin-left: 3px">
+ <el-tab-pane label="鍦ㄧ嚎瀛﹀憳" name="1"></el-tab-pane>
+ <el-tab-pane label="绂荤嚎瀛﹀憳" name="0"></el-tab-pane>
+ </el-tabs>
+ </el-row>
+ <el-row :gutter="20" v-for="student in showStudentList" :key="student.id" class="student-row">
+ <el-col :span="18">
+ <div>
+ {{student.realName}}
+ </div>
+ </el-col>
+ <el-col :span="6">
+ <div :class="{online: student.onlineStatus === 1, outline: student.onlineStatus === 0}">
+ {{getStatus(student.onlineStatus)}}
+ </div>
+ </el-col>
+ </el-row>
+ </div>
+ </div>
</div>
</template>
<script>
+import { getStudentList } from '@/api/meet'
+
let jitsiApi = null
export default {
+ data() {
+ return {
+ intervalId: null,
+ meetId: null,
+ roomName: '',
+ joinList: [],
+ searchForm: {
+ keyword: '',
+ // 0 鏈湪绾裤�� 1 鍦ㄧ嚎
+ onlineStatus: 0,
+ },
+ studentList: [],
+ showStudentList: [],
+ }
+ },
+ methods: {
+ getStatus(status) {
+ if (status === 1) {
+ return "鍦ㄧ嚎"
+ } else if (status === 0) {
+ return "绂荤嚎"
+ }
+ },
+ handleTabChange(tab) {
+ let status = parseInt(tab.name)
+ this.showStudentList = this.studentList.filter(student => {
+ return student.onlineStatus === status
+ })
+ },
+ getStudentList () {
+ let params = {
+ keyword: this.keyword
+ }
+ getStudentList(this.meetId, params).then(res => {
+ this.studentList = res.data.data
+ this.showStudentList = this.studentList.filter(student => {
+ return student.onlineStatus === 0
+ })
+ })
+ },
+ getRoomInfo () {
+ jitsiApi.getRoomsInfo().then(rooms => {
+ rooms.rooms.forEach(room => {
+ // 鎴块棿鐨刬d鏄竴涓瓙鍩熷悕锛屼笖@绗﹀墠鐨勪細璁悕绉版槸缁忚繃URL缂栫爜鐨�
+ let encodedPart = room.id.split('@')[0]
+ let decodedPart = decodeURIComponent(encodedPart)
+ if (this.roomName === decodedPart) {
+ room.participants.forEach(user => {
+ // 浣跨敤'_'浣滀负鍒嗛殧绗﹀垎鍓插瓧绗︿覆锛岃幏鍙栧埌userId
+ const parts = user.displayName.split('_')
+ let userId = null
+ if (parts.length > 1) {
+ userId = parseInt(parts[1])
+ // 璁剧疆瀛﹀憳鐘舵�佷负鍦ㄧ嚎
+ this.studentList.forEach(student => {
+ console.log(student.id === userId)
+ if (student.id === userId) {
+ student.onlineStatus = 1
+ }
+ })
+ }
+ })
+ }
+ })
+ this.showStudentList = this.studentList.filter(student => {
+ return student.onlineStatus === parseInt(this.searchForm.onlineStatus)
+ })
+ })
+ }
+ },
mounted () {
- const width = window.innerWidth
+ const width = window.innerWidth * 0.7
const height = window.innerHeight
+ this.meetId = this.$route.query.meetId
+ this.getStudentList()
const domain = this.$route.query.domain
const roomName = this.$route.query.roomName
+ this.roomName = roomName
const userInfoStr = this.$route.query.userInfoStr
const userInfo = userInfoStr ? JSON.parse(userInfoStr) : null
const options = {
@@ -30,11 +136,23 @@
},
toolbarButtons: ['whiteboard']
}
+
jitsiApi = new window.JitsiMeetExternalAPI(domain, options)
+
jitsiApi.addListener('readyToClose', () => {
window.close()
})
-
+ // 姣忎笁绉掓洿瀛﹀憳鍦ㄧ嚎鐘舵��
+ this.intervalId = setInterval(() => {
+ this.getRoomInfo()
+ }, 3000)
+ },
+ beforeDestroy () {
+ // 娓呴櫎瀹氭椂鍣紝閬垮厤鍐呭瓨娉勬紡
+ if (this.intervalId) {
+ clearInterval(this.intervalId)
+ this.intervalId = null
+ }
}
}
@@ -42,7 +160,21 @@
<style lang="scss" scoped>
#meet {
- width: 100%;
height: 100%;
}
+.online {
+ color: #42b983;
+}
+.outline {
+ color: #aa1111;
+}
+.studentWarp {
+ display: flex;
+ flex-display: row;
+}
+.student-row {
+ margin-top: 8px;
+ padding-left: 3px;
+ color: #565b5e;
+}
</style>
diff --git a/src/views/train/data-list/index.vue b/src/views/train/data-list/index.vue
index 8a0c81e..389ca5d 100644
--- a/src/views/train/data-list/index.vue
+++ b/src/views/train/data-list/index.vue
@@ -26,9 +26,9 @@
<div class="info-text">{{ item.endTime }}</div>
</div>
<div class="button-container">
- <el-button v-if="item.status!==2" @click="start(item)">寮�濮嬩笂璇�</el-button>
- <el-button @click="handleUpdate(item)">缂栬緫</el-button>
- <el-button @click="remove(item)">鍒犻櫎</el-button>
+ <el-button v-if="item.status!==2" @click="start(item)" type="primary" size="small">寮�濮嬩笂璇�</el-button>
+ <el-button @click="handleUpdate(item)" type="warning" size="small">缂栬緫</el-button>
+ <el-button @click="remove(item)" type="danger" size="small">鍒犻櫎</el-button>
</div>
</div>
</el-card>
diff --git a/src/views/train/index.vue b/src/views/train/index.vue
index 484207e..954f923 100644
--- a/src/views/train/index.vue
+++ b/src/views/train/index.vue
@@ -8,7 +8,7 @@
<div class="card-wrapper">
<div class="card-header">
<div class="header-tab">
- <el-tabs v-model="activeName" @tab-click="handleClick">
+ <el-tabs v-model="activeName" @tab-click="handleClick" size="small">
<el-tab-pane label="鍏ㄩ儴" name="all"></el-tab-pane>
<el-tab-pane label="鏈紑濮�" name="0"></el-tab-pane>
<el-tab-pane label="杩涜涓�" name="1"></el-tab-pane>
@@ -16,12 +16,12 @@
</el-tabs>
</div>
<div class="header-search">
- <el-input v-model="queryParam.meetName" @input="getList" clearable @clear="getList"
+ <el-input v-model="queryParam.meetName" @input="getList" clearable @clear="getList" size="small"
placeholder="璇疯緭鍏ヨ绋嬪悕绉�"/>
- <el-button type="primary" class="ml-4" @click="getList">鎼滅储</el-button>
+ <el-button type="primary" class="ml-4" style="margin-left: 5px" size="small" @click="getList">鎼滅储</el-button>
</div>
<div>
- <el-button type="primary" @click="handleAdd()">娣诲姞</el-button>
+ <el-button type="primary" @click="handleAdd()" size="small">娣诲姞</el-button>
</div>
</div>
@@ -156,6 +156,7 @@
let routeUrl = this.$router.resolve({
path: '/meet',
query: {
+ meetId: item.id,
domain: 'ycl.easyblog.vip:8443/' + item.id,
roomName: item.meetName,
userInfoStr: JSON.stringify({
--
Gitblit v1.8.0