优化

src/components/UserVideo/index.tsx

@@ -18,7 +18,7 @@ const UserVideo: React.FC = () => {
     viewPeople: [
       { value: 6, label: '6人' },
       { value: 12, label: '12人' },
-      { value: 20, label: '20人' },
+      // { value: 20, label: '20人' },
     ],
     viewPeopleValue: 6,
   })

src/page/Meeting/index.module.scss

@@ -160,6 +160,7 @@
         height: 100%;
         box-sizing: border-box;
         position: relative;
+        overflow: hidden;
 
         .standardModeIcon {
           position: absolute;
@@ -658,7 +659,6 @@
         }
 
         .meetingUserVideoList {
-          width: 500px;
           padding: 10px 10px 10px;
           box-sizing: border-box;
           height: 100%;

src/page/Meeting/index.tsx

@@ -175,7 +175,7 @@ const Meeting: React.FC = () => {
   const msgTips = '您不是管理员或发言人，无法开启此功能！'
   useEffect(() => {
     let time: NodeJS.Timeout;
-    let getDesktopCapturerVideoTime: NodeJS.Timeout;
+    // let getDesktopCapturerVideoTime: NodeJS.Timeout;
     setUser(userInfo)
     setTimeout(() => {
       if (location.hash.indexOf('/login') === -1) {
@@ -197,30 +197,30 @@ const Meeting: React.FC = () => {
     time = setInterval(() => {
       setCurrentSeconds(currentSeconds++)
     }, 1000)
-    getDesktopCapturerVideoTime = setInterval(() => {
-      setSharedScreenItem((i: any) => {
-        if (i && i.type === 0) {
-          agora.getDesktopCapturerVideo({ width: 0, height: 0 }, { width: 0, height: 0 }, false).then(res => {
-            if (res.length) {
-              let row = res.find((item: any) => item.sourceId === i.sourceId)
-              if (!row) {
-                stopScreenCapture()
-                setSharedScreenItem('')
-                allUserLook(userInfo.uid, userInfo.userName)
-              }
-            }
-          })
-        }
-        return i
-      })
-    }, 3000)
+    // getDesktopCapturerVideoTime = setInterval(() => {
+    //   setSharedScreenItem((i: any) => {
+    //     if (i && i.type === 0) {
+    //       agora.getDesktopCapturerVideo({ width: 0, height: 0 }, { width: 0, height: 0 }, false).then(res => {
+    //         if (res.length) {
+    //           let row = res.find((item: any) => item.sourceId === i.sourceId)
+    //           if (!row) {
+    //             stopScreenCapture()
+    //             setSharedScreenItem('')
+    //             allUserLook(userInfo.uid, userInfo.userName)
+    //           }
+    //         }
+    //       })
+    //     }
+    //     return i
+    //   })
+    // }, 3000)
     return () => {
       window.removeEventListener('customStorageChange', handleCustomStorageChange);
       window.removeEventListener('online', handleNetworkChange);
       window.removeEventListener('offline', handleNetworkChange);
       window.removeEventListener('wheel', handleWheelChange);
       clearInterval(time)
-      clearInterval(getDesktopCapturerVideoTime)
+      // clearInterval(getDesktopCapturerVideoTime)
     };
   }, []);
 
@@ -1403,7 +1403,7 @@ const Meeting: React.FC = () => {
           <div className={styles.meetingContentBody}>
             <div className={`${styles.meetingContentBodyLeft} drag`}>
               {isAdmin && currentLookUserAccount ? getSettingIcon() : null}
-              <div className={getMeetingContentBodyLeftModeClass()} id='videoView' style={meetingMode === 'SpeakerMode' && isVideoFullScreen ? {width: '0'} : {}}>
+              <div className={getMeetingContentBodyLeftModeClass()} id='videoView' style={meetingMode === 'SpeakerMode' && isVideoFullScreen ? { width: '0' } : {}}>
                 {roomUserList.map((item: any, index: number) => {
                   return (index <= 19 && item.isRoom && item.isAdmin ? <div
                     id={item.uid}
@@ -1834,7 +1834,7 @@ const Meeting: React.FC = () => {
                         </div>
                       </div>
                       :
-                      <div className={styles.meetingUserVideoList}>
+                      <div className={styles.meetingUserVideoList} style={{ width: statusList.userVideo ? '100vw' : '500px' }}>
                         <div className={styles.meetingUserVideoListTitle}>
                           <span>会议监控</span>
                           <img src={ImageUrl.icon18} alt="" onClick={() => {

src/utils/package/agora.ts

@@ -239,7 +239,7 @@ export const agora = {
   },
   // 所有用户加入的第二个房间
   allJoinChannelEx: async (bool: boolean = false) => {
-    await agora.startCameraCapture()
+    await agora.startCameraCapture(true)
     await rtcEngine.joinChannelEx(
       option.tokenA,
       { channelId: option.channelId + 'a', localUid: Number('1' + option.screenShareId) },
@@ -283,11 +283,11 @@ export const agora = {
     await rtcEngine.muteLocalVideoStream(mute)
   },
   // 摄像头采集
-  startCameraCapture: async () => {
+  startCameraCapture: async (bool: boolean = false) => {
     await rtcEngine.startCameraCapture(VideoSourceType.VideoSourceCamera, {
       format: {
-        width: 1280,
-        height: 720,
+        width: bool ? 120 : 1280,
+        height: bool ? 120 : 1280,
         fps: 15,
       }
     })
@@ -307,7 +307,7 @@ export const agora = {
   },
   // 桌面捕获音频和视频的媒体源的信息
   getDesktopCapturerVideo: async (thumbSize: any, iconSize: any, includeScreen: boolean) => {
-    return await rtcEngine.getScreenCaptureSources(thumbSize, iconSize, includeScreen);
+    return await rtcEngine.getScreenCaptureSources(thumbSize, iconSize, includeScreen).filter((item: any) => item.type === 1)
   },
   // 共享屏幕采集
   setDesktopCapturerVideo: async (targetSource: any, isComputerAudio: boolean, isFluencyPriority: boolean) => {