From e8633cda532be4320626dc73a3a55d07dedb739a Mon Sep 17 00:00:00 2001 From: "SWX\\10484" <1048449493@qq.com> Date: Thu, 18 Jun 2026 17:15:31 +0800 Subject: [PATCH] =?UTF-8?q?=E8=A7=86=E8=AE=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../realTimeConsultation.vue | 120 +++++++++++------- 1 file changed, 71 insertions(+), 49 deletions(-) diff --git a/src/views/videoCommunication/realTimeConsultation.vue b/src/views/videoCommunication/realTimeConsultation.vue index e7a8a64..7c6aaaa 100644 --- a/src/views/videoCommunication/realTimeConsultation.vue +++ b/src/views/videoCommunication/realTimeConsultation.vue @@ -92,7 +92,7 @@
- {{ stream.userID }} + {{ getUserName(stream.userID) }}
@@ -121,14 +121,14 @@
-
+
麦克风
-
+
@@ -390,6 +390,7 @@ export default { captureCheckTimer: null, isLocalCameraShared: false, // 双击本地摄像头切换到采集卡窗口的状态 sharedStreamId: null, // 当前在主画面显示的流来源: null | 'local' | subscribeID + userNameMap: {}, // userID → userName 映射 // ==================== 设置模块 ==================== settingDialogVisible: false, @@ -771,6 +772,9 @@ export default { if (users && users.length > 0) { this.userList = users; users.forEach((user) => { + // 构建 userID → userName 映射 + const userName = user.userName || user.name || user.userdef || user.userDefined || user.userID; + this.$set(this.userNameMap, user.userID, userName); if (user.streams && user.streams.length > 0) { user.streams.forEach((stream) => { this.subscribe({ @@ -894,14 +898,17 @@ export default { handleSomeoneJoined(userID) { this.userList.push({ userID }); - this.$message({ message: `${userID}进入房间`, type: "info" }); + const userName = this.getUserName(userID); + this.$message({ message: `${userName}进入房间`, type: "info" }); this.updateParticipantCount(); }, handleSomeoneLeft(userID) { this.userList = this.userList.filter((o) => o.userID !== userID); this.remoteStream = this.remoteStream.filter((o) => o.userID !== userID); - this.$message({ message: `${userID}离开房间`, type: "info" }); + this.$delete(this.userNameMap, userID); + const userName = this.getUserName(userID); + this.$message({ message: `${userName}离开房间`, type: "info" }); this.updateParticipantCount(); }, @@ -1185,7 +1192,6 @@ export default { // 如果当前已显示本地摄像头画面 → 取消显示 if (this.isLocalCameraShared && this.sharedStreamId === 'local') { this.cancelMainDisplay(); - this.$message.success('已取消采集卡窗口画面'); return; } @@ -1199,7 +1205,6 @@ export default { const videoEl = this.$refs.shareVideo; if (!videoEl) return; videoEl.srcObject = this.localStream; - this.$message.success('本地摄像头画面已切换到采集卡窗口'); }); }, @@ -1211,7 +1216,6 @@ export default { // 如果当前已显示该远端流 → 取消显示 if (this.sharedStreamId === subscribeID) { this.cancelMainDisplay(); - this.$message.success('已取消采集卡窗口画面'); return; } @@ -1225,7 +1229,6 @@ export default { const mainContainer = this.$refs.mainRemoteContainer; if (!mainContainer) return; mainContainer.appendChild(stream.video); - this.$message.success('远端画面已切换到采集卡窗口'); }); }, @@ -1342,50 +1345,61 @@ export default { // ==================== 【5】屏幕共享 ==================== async toggleShare() { - if (this.isSharing) { - this.stopShare(); - return; - } - try { - this.isLocalCameraShared = false; // 开启屏幕共享时重置本地摄像头共享状态 - this.sharedStreamId = null; - const stream = await navigator.mediaDevices.getDisplayMedia({ - video: true, - audio: true, - }); - - const track = stream.getVideoTracks()[0]; - track.addEventListener('ended', () => { - this.stopShare(); + // 进房后才能推流 + if (!this.isJoined) { + this.$message({ + message: "请进房成功后,再发布", + type: "warning", }); - - this.shareStream = stream; - // 不绑定到本地