This commit is contained in:
yj 2024-08-12 15:49:15 +08:00
parent cd71405ccc
commit 65f7fd9548
1 changed files with 60 additions and 48 deletions

View File

@ -120,7 +120,7 @@ const Meeting: React.FC = () => {
const [isShare, setIsShare] = useState<any>(null) const [isShare, setIsShare] = useState<any>(null)
const [isSharePopConfirm, setIsSharePopConfirm] = useState<any>(false) const [isSharePopConfirm, setIsSharePopConfirm] = useState<any>(false)
const [isShareUser, setIsShareUser] = useState<any>(null) const [isShareUser, setIsShareUser] = useState<any>(null)
const [currentLookUserStatus, setCurrentLookUserStatus] = useState<1 | 2 | 3 | 4>(1) const [currentLookUserStatus, setCurrentLookUserStatus] = useState<0 | 1 | 2 | 3 | 4>(1)
let userInfo = JSON.parse(storage.getItem('user') as string) let userInfo = JSON.parse(storage.getItem('user') as string)
useEffect(() => { useEffect(() => {
let time = null as any; let time = null as any;
@ -411,53 +411,56 @@ const Meeting: React.FC = () => {
} }
// 渲染视频 // 渲染视频
const renderVideo = async (uid: string | number): Promise<void> => { const renderVideo = async (uid: string | number): Promise<void> => {
if (uid === userInfo.uid || uid === userInfo.screenShareId) { setCurrentLookUserStatus(0)
if (String(uid).length === 9) { setTimeout(() => {
// 共享屏幕 if (uid === userInfo.uid || uid === userInfo.screenShareId) {
setCurrentLookUserStatus(2) if (String(uid).length === 9) {
setTimeout(() => { // 共享屏幕
agora.setupLocalVideo({ setCurrentLookUserStatus(2)
uid: Number(uid), setTimeout(() => {
view: document.getElementById(`video-source-screen`) as HTMLElement, agora.setupLocalVideo({
channelId: state.channelId, uid: Number(uid),
sourceType: VideoSourceType.VideoSourceScreen, view: document.getElementById(`video-source-screen`) as HTMLElement,
}) channelId: state.channelId,
}, 1000); sourceType: VideoSourceType.VideoSourceScreen,
})
}, 1000);
} else {
// 摄像头
setCurrentLookUserStatus(1)
setTimeout(() => {
agora.setupLocalVideo({
uid: Number(uid),
view: document.getElementById(`video-source-camera-primary`) as HTMLElement,
channelId: state.channelId,
sourceType: VideoSourceType.VideoSourceCameraPrimary,
})
}, 1000);
}
} else { } else {
setCurrentLookUserStatus(1) if (String(uid).length === 9) {
// 摄像头 // 摄像头
setTimeout(() => { setCurrentLookUserStatus(3)
agora.setupLocalVideo({ setTimeout(() => {
uid: Number(uid), agora.setupRemoteVideoJoin({
view: document.getElementById(`video-source-camera-primary`) as HTMLElement, uid: Number(uid),
channelId: state.channelId, view: document.getElementById(`video-source-remote-camera`) as HTMLElement,
sourceType: VideoSourceType.VideoSourceCameraPrimary, channelId: state.channelId,
}) })
}, 1000); }, 1000);
} else {
// 共享屏幕
setCurrentLookUserStatus(4)
setTimeout(() => {
agora.setupRemoteVideoJoin({
uid: Number(uid),
view: document.getElementById(`video-source-remote-screen`) as HTMLElement,
channelId: state.channelId,
})
}, 1000);
}
} }
} else { }, 500)
if (String(uid).length === 9) {
// 摄像头
setCurrentLookUserStatus(3)
setTimeout(() => {
agora.setupRemoteVideoJoin({
uid: Number(uid),
view: document.getElementById(`video-source-remote-camera`) as HTMLElement,
channelId: state.channelId,
})
}, 1000);
} else {
// 共享屏幕
setCurrentLookUserStatus(4)
setTimeout(() => {
agora.setupRemoteVideoJoin({
uid: Number(uid),
view: document.getElementById(`video-source-remote-screen`) as HTMLElement,
channelId: state.channelId,
})
}, 1000);
}
}
} }
// 全员观看 // 全员观看
const getShowUser = async (): Promise<void> => { const getShowUser = async (): Promise<void> => {
@ -873,6 +876,15 @@ const Meeting: React.FC = () => {
</div> </div>
} }
)} )}
{currentLookUserStatus === 0 && currentLookUserAccount ?
<div className={`${styles.meetingContentSwiperCard} ${setMeetingContentSwiperCardClass()}`}>
<div className={`${styles.meetingContentSwiperCardVdeio}`} id='video-source-camera-primary'>
{<div className={styles.meetingContentSwiperCardVdeioLoading}>
<Avatar name={currentLookUserAccount.userName} />
</div>}
</div>
{meetingContentUser(currentLookUserAccount)}
</div> : null}
{currentLookUserStatus === 1 && currentLookUserAccount ? {currentLookUserStatus === 1 && currentLookUserAccount ?
<div className={`${styles.meetingContentSwiperCard} ${setMeetingContentSwiperCardClass()}`}> <div className={`${styles.meetingContentSwiperCard} ${setMeetingContentSwiperCardClass()}`}>
<div className={`${styles.meetingContentSwiperCardVdeio}`} id='video-source-camera-primary'> <div className={`${styles.meetingContentSwiperCardVdeio}`} id='video-source-camera-primary'>
@ -1035,10 +1047,10 @@ const Meeting: React.FC = () => {
<div> <div>
<img src={item.enableMicr ? ImageUrl.icon22 : ImageUrl.icon22Active} alt="" onClick={() => { <img src={item.enableMicr ? ImageUrl.icon22 : ImageUrl.icon22Active} alt="" onClick={() => {
postOpenMicr(!item.enableMicr, item.uid) postOpenMicr(!item.enableMicr, item.uid)
}} title={item.enableMicr ? '静音' : '打开声音'} /> }} title={item.enableMicr ? '静音' : '解除声音'} />
<img src={item.enableCamera ? ImageUrl.icon23 : ImageUrl.icon23Active} alt="" onClick={() => { <img src={item.enableCamera ? ImageUrl.icon23 : ImageUrl.icon23Active} alt="" onClick={() => {
postOpenCamera(!item.enableCamera, item.uid) postOpenCamera(!item.enableCamera, item.uid)
}} title={item.enableCamera ? '关闭视频' : '开视频'} /> }} title={item.enableCamera ? '关闭视频' : '视频'} />
</div> </div>
{item.uid !== user.uid && user.roleId === '1' ? <div className='drag'> {item.uid !== user.uid && user.roleId === '1' ? <div className='drag'>
{!item.isRoomManager ? <Button {!item.isRoomManager ? <Button