From 3a43f75c917cada49730c252650a5f252a738f2d Mon Sep 17 00:00:00 2001 From: yj <1336058017@qq.com> Date: Mon, 10 Mar 2025 14:19:16 +0800 Subject: [PATCH] =?UTF-8?q?=E8=A7=86=E9=A2=91=E7=9B=91=E6=8E=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/JoinSetting/index.tsx | 8 ++-- src/page/Home/Index/index.tsx | 8 ++-- src/page/Meeting/index.module.scss | 32 ------------- src/page/Meeting/index.tsx | 71 +++++++--------------------- src/utils/package/agora.ts | 34 ++++--------- 5 files changed, 33 insertions(+), 120 deletions(-) diff --git a/src/components/JoinSetting/index.tsx b/src/components/JoinSetting/index.tsx index e5e6d22..2e50533 100644 --- a/src/components/JoinSetting/index.tsx +++ b/src/components/JoinSetting/index.tsx @@ -83,11 +83,10 @@ const JoinSetting = forwardRef((_props: any, ref: any) => { }) } const getRoomRtcToken = async (roomNum: string, callBack: Function): Promise => { - Promise.all([GetRoomRtcToken(roomNum), GetRoomRtcToken(roomNum + 'a')]).then(res => { - if (res[0].code === 200 && res[1].code === 200) { + GetRoomRtcToken(roomNum).then(res => { + if (res.code === 200) { callBack({ - token: res[0].data, - tokenA: res[1].data, + token: res.data, }) } else { storage.setItem('loading', false) @@ -213,7 +212,6 @@ const JoinSetting = forwardRef((_props: any, ref: any) => { state: { channelId: roomNumber, token: options.token, - tokenA: options.tokenA, roomId: res.data.id, roomName: res.data.roomName, enableMicr: joinRoomSettingForm[0].active, diff --git a/src/page/Home/Index/index.tsx b/src/page/Home/Index/index.tsx index 7f4bac8..68c1499 100644 --- a/src/page/Home/Index/index.tsx +++ b/src/page/Home/Index/index.tsx @@ -111,11 +111,10 @@ const Index: React.FC = () => { }) } const getRoomRtcToken = async (roomNum: string, callBack: Function): Promise => { - Promise.all([GetRoomRtcToken(roomNum), GetRoomRtcToken(roomNum + 'a')]).then(res => { - if (res[0].code === 200 && res[1].code === 200) { + GetRoomRtcToken(roomNum).then(res => { + if (res.code === 200) { callBack({ - token: res[0].data, - tokenA: res[1].data, + token: res.data, }) } }).finally(() => { @@ -334,7 +333,6 @@ const Index: React.FC = () => { state: { channelId: item.roomNum, token: options.token, - tokenA: options.tokenA, roomId: item.id, roomName: item.roomName, enableMicr: false, diff --git a/src/page/Meeting/index.module.scss b/src/page/Meeting/index.module.scss index 53680e0..8c623a0 100644 --- a/src/page/Meeting/index.module.scss +++ b/src/page/Meeting/index.module.scss @@ -741,38 +741,6 @@ } } - .meetingUserVideoList { - padding: 10px 10px 10px; - box-sizing: border-box; - height: 100%; - background-color: #16191E; - display: flex; - flex-direction: column; - - .meetingUserVideoListTitle { - flex-shrink: 0; - display: flex; - align-items: center; - justify-content: space-between; - margin-bottom: 10px; - - >span { - color: #EEEEEE; - font-size: 18px; - } - - >img { - cursor: pointer; - } - } - - .meetingUserVideoListContent { - flex-grow: 1; - height: 0px; - overflow-y: auto; - box-sizing: border-box; - } - } } } diff --git a/src/page/Meeting/index.tsx b/src/page/Meeting/index.tsx index 0a62747..f20aad3 100644 --- a/src/page/Meeting/index.tsx +++ b/src/page/Meeting/index.tsx @@ -18,7 +18,6 @@ import Avatar from '@/components/Avatar'; import SharedFilesModel from '@/components/SharedFilesModel'; import StupWizard from '@/components/StupWizard'; import EquipmentManagement from '@/components/EquipmentManagement'; -import UserVideo from '@/components/UserVideo'; import { role } from '@/config/role'; import { fixWebmDuration } from "webm-duration-fix-buffer"; import { getKeyOpenChildWindow, setKeyOpenChildWindow } from '@/utils/package/public'; @@ -47,8 +46,7 @@ const Meeting: React.FC = () => { const [isClickedMediaSteam, setIsClickedMediaSteam] = useState(false); const [statusList, setStatusList] = useState({ userList: false, - userChatList: false, - userVideo: false, + userChatList: false }) const [isSharedScreenModal, setIsSharedScreenModal] = useState(false); const [quitMeetingModal, setQuitMeetingModal] = useState(false); @@ -171,6 +169,7 @@ const Meeting: React.FC = () => { const [currentVideoUid, setCurrentVideoUid] = useState('') let [currentSeconds, setCurrentSeconds] = useState(0) const [isNetworkQuality, setIsNetworkQuality] = useState(false) + const [userVideoWindow, _setUserVideoWindow] = useState(false) const [currentEffective, setCurrentEffective] = useState(3) const [networkQuality, setNetworkQuality] = useState({ level: '佳', @@ -797,7 +796,7 @@ const Meeting: React.FC = () => { setAllUserListData('ManagerRefresh', item, async () => { if (item.user.uid === item.uid) { if (item.user.uid === userInfo.uid) { - await agora.allLeaveChannelEx() + await agora.allJoinChannelEx(item.user, false) message.success(`操作成功`) await agora.updateChannelMediaOptions(item.user.isRoomManager) await postOpenMicrApi(item.user.isRoomManager, userInfo.uid, false) @@ -808,9 +807,7 @@ const Meeting: React.FC = () => { } } else { if (item.user.uid === userInfo.uid) { - if (item.user.isRoomManager) { - await agora.allLeaveChannelEx() - } + await agora.allJoinChannelEx(item.user, false) message.success(`管理员${item.user.isRoomManager ? '设置' : '取消'}您为发言人`) await agora.updateChannelMediaOptions(item.user.isRoomManager) setCurrentRequestSpeakType(res => { @@ -846,15 +843,15 @@ const Meeting: React.FC = () => { case 'Watch': if (!role.ID.includes(userInfo.roleId)) { let userId = item.watchUids.find((uid: any) => uid === userInfo.uid) - if (userId) { - GetRoomRtcToken(state.channelId + 'a').then(async res => { - if (res.code === 200) { - await agora.allJoinChannelEx(false, res.data) - } - }) - } else { - await agora.allLeaveChannelEx() - } + setRoomUserList((res: any) => { + let userRow = res.find((row: any) => row.uid === userId) + if (userId) { + agora.allJoinChannelEx(userRow, true) + } else { + agora.allJoinChannelEx(userRow, false) + } + return res + }) } break; // 设备列表 @@ -1832,14 +1829,12 @@ const Meeting: React.FC = () => { setStatusList({ userList: statusList.userList ? false : true, userChatList: false, - userVideo: false, }) break; case '聊天': setStatusList({ userList: false, userChatList: statusList.userChatList ? false : true, - userVideo: false, }) storage.setItem('noViewChatList', 0) setNoViewChatList(0) @@ -2012,22 +2007,7 @@ const Meeting: React.FC = () => { } break; case '会议监控': - if (!statusList.userVideo) { - GetRoomRtcToken(state.channelId + 'a').then(async res => { - if (res.code === 200) { - await agora.allJoinChannelEx(true, res.data) - } - }) - } else { - await agora.allLeaveChannelEx() - } - setStatusList({ - userVideo: statusList.userVideo ? false : true, - userChatList: false, - userList: false, - }) - storage.setItem('noViewChatList', 0) - setNoViewChatList(0) + window.open(`http://localhost:8080?uid=${Number('1' + userInfo.screenShareId)}&channel=${state.channelId}&token=${userInfo.token}`) break; case '签到': singInRef.current.changeModal() @@ -3026,7 +3006,7 @@ const Meeting: React.FC = () => { { - (statusList.userList || statusList.userChatList || statusList.userVideo) ? ( + (statusList.userList || statusList.userChatList) ? (
{statusList.userList ?
@@ -3036,7 +3016,6 @@ const Meeting: React.FC = () => { setStatusList({ userList: false, userChatList: false, - userVideo: false, }) }} />
@@ -3182,7 +3161,6 @@ const Meeting: React.FC = () => { setStatusList({ userList: false, userChatList: false, - userVideo: false, }) }} />
@@ -3345,22 +3323,7 @@ const Meeting: React.FC = () => { : -
-
- 会议监控 - { - await agora.allLeaveChannelEx() - setStatusList({ - userList: false, - userChatList: false, - userVideo: false, - }) - }} /> -
-
- -
-
+ null } ) : null @@ -3466,7 +3429,7 @@ const Meeting: React.FC = () => { onMouseUp={() => changeFooterListSelect(row, itemIndex, rowIndex, false)} onMouseLeave={() => changeFooterListSelect(row, itemIndex, rowIndex, false)} key={rowIndex}> - {statusList.userVideo ? : row.select ? : } + {userVideoWindow ? : row.select ? : } {row.title} } diff --git a/src/utils/package/agora.ts b/src/utils/package/agora.ts index 977fb25..72728c1 100644 --- a/src/utils/package/agora.ts +++ b/src/utils/package/agora.ts @@ -346,34 +346,20 @@ export const agora = { } ); }, - // 所有用户加入的第二个房间 - allJoinChannelEx: async (bool: boolean = false, token: string) => { - const user = await JSON.parse(storage.getItem('user') as string) - await agora.startCameraCapture(true) - await rtcEngine.joinChannelEx( - token, - { channelId: option.channelId + 'a', localUid: Number('1' + option.screenShareId) }, - { - clientRoleType: bool ? ClientRoleType.ClientRoleAudience : ClientRoleType.ClientRoleBroadcaster, //用户角色 ClientRoleBroadcaster 主播 ClientRoleAudience 观众 + // 监控 + allJoinChannelEx: async (user: any, bool: boolean) => { + if (!role.ID.includes(user.roleId) || !user.isRoomManager) { + await rtcEngine.updateChannelMediaOptions({ + clientRoleType: bool ? ClientRoleType.ClientRoleBroadcaster : ClientRoleType.ClientRoleAudience, //用户角色 ClientRoleBroadcaster 主播 ClientRoleAudience 观众 autoSubscribeAudio: false,//设置是否自动订阅所有音频流 - autoSubscribeVideo: role.ID.includes(user.roleId) ? true : false,//设置是否自动订阅所有视频流 + autoSubscribeVideo: false,//设置是否自动订阅所有视频流 publishMicrophoneTrack: false,//设置是否发布麦克风采集到的音频 publishCameraTrack: true,//设置是否发布摄像头采集的视频 publishScreenTrack: false,//设置是否发布屏幕采集的视频 - audienceLatencyLevel: bool ? AudienceLatencyLevelType.AudienceLatencyLevelLowLatency : AudienceLatencyLevelType.AudienceLatencyLevelUltraLowLatency, - } - ); - await rtcEngine.setDualStreamModeEx( - SimulcastStreamMode.EnableSimulcastStream, - { - dimensions: { - width: 320, - height: 180 - }, - framerate: 5, - }, - { channelId: option.channelId + 'a', localUid: Number('1' + option.screenShareId) } - ); + audienceLatencyLevel: bool ? AudienceLatencyLevelType.AudienceLatencyLevelUltraLowLatency : AudienceLatencyLevelType.AudienceLatencyLevelLowLatency, + }) + bool ? agora.startCameraCapture() : agora.stopCameraCapture() + } }, // 退出第二个房间 allLeaveChannelEx: async () => {