@@ -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;
- // 不绑定到本地