src/page/Meeting/index.module.scss

@@ -104,6 +104,44 @@
     left: 0;
     top: 0;
 
+    .meetingAbsoluteHeader {
+      position: absolute;
+      width: 100%;
+      left: 0;
+      z-index: 3;
+      display: flex;
+      flex-direction: column;
+      background-color: rgba(0, 0, 0, 0.5);
+
+      >div {
+        width: 100%;
+        padding: 2px 10px;
+        box-sizing: border-box;
+        display: flex;
+        align-items: flex-start;
+
+        >span {
+          display: flex;
+          align-items: center;
+
+          >img {
+            height: 24px;
+          }
+        }
+      }
+
+      >span {
+        font-size: 14px;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        color: white;
+        width: 100%;
+        padding: 0 10px;
+        box-sizing: border-box;
+      }
+    }
+
     .meetingAbsoluteText {
       position: absolute;
       width: 100%;
@@ -409,12 +447,15 @@
             height: 160px;
           }
         }
+
         .meetingContentBodyLeftSpeakerModeNoScrollbar {
           width: 246px !important;
+
           &::-webkit-scrollbar {
             display: none;
           }
         }
+
         // 单画面模式
         .meetingContentBodyLeftSingleScreenMode {
           width: 100%;

src/page/Meeting/index.tsx

@@ -2141,7 +2141,7 @@ const Meeting: React.FC = () => {
           setKeyOpenChildWindow('shareScreenWindow', true)
           window.electron.setMainWindowSize({
             width: 250,
-            height: 200,
+            height: 230,
           })
           window.electron.setPosition('right')
         }
@@ -2723,15 +2723,30 @@ const Meeting: React.FC = () => {
         setIsNetworkQuality(false)
       }}>
         {isScreenCapture ? <div className={`${styles.meetingAbsolute}`}>
-          <div style={{ top: '0px', borderRadius: '10px 10px 0 0' }} className={`${styles.meetingAbsoluteText}`}>{currentSpeakUser.length ? '正在说话:' + currentSpeakUser.join(';') : '正在说话:'}</div>
-          <div style={{ bottom: '0px', borderRadius: '0 0 10px 10px' }} className={`${styles.meetingAbsoluteText}`} onClick={() => {
+          <div style={{ top: '0px', borderRadius: '10px 10px 0 0' }} className={`${styles.meetingAbsoluteHeader}`}>
+            <div>
+              <span className='drag' onClick={() => {
                 setIsExpand(!isExpand)
                 window.electron.setChildWindow({
-              height: !isExpand ? 160 * 4 + 20 : 200,
+                  height: !isExpand ? 160 * 4 + 20 : 230,
                   width: 250,
                   key: 'main'
                 })
-          }}><span className='drag'>{isExpand ? '收起' : '查看参会者'}</span></div>
+              }}>
+                <img src={isExpand ? ImageUrl.icon61 : ImageUrl.icon61Active} alt="" />
+                <img src={!isExpand ? ImageUrl.icon60 : ImageUrl.icon60Active} alt="" style={{ marginLeft: '10px' }} />
+              </span>
+            </div>
+            <span>{currentSpeakUser.length ? '正在说话:' + currentSpeakUser.join(';') : '正在说话:'}</span>
+          </div>
+          <div style={{ bottom: '0px', borderRadius: '0 0 10px 10px' }} className={`${styles.meetingAbsoluteText}`} onClick={() => {
+            setIsExpand(!isExpand)
+            window.electron.setChildWindow({
+              height: !isExpand ? 160 * 4 + 20 : 230,
+              width: 250,
+              key: 'main'
+            })
+          }}><span>{isExpand ? '收起' : '查看参会者'}</span></div>
         </div> : null}
         {contextMenu ? <div className={styles.meetingContentSwiperCardPopover} style={
           {
@@ -2936,8 +2951,8 @@ const Meeting: React.FC = () => {
         <div className={styles.meetingContent}>
           <div className={styles.meetingContentBody}>
             <div className={`${styles.meetingContentBodyLeft} drag`} style={{
-              marginTop: isScreenCapture ? '20px' : '0',
-              paddingBottom: isScreenCapture ? '40px' : '0'
+              marginTop: isScreenCapture ? '46px' : '0',
+              paddingBottom: isScreenCapture ? '66px' : '0'
             }} onMouseEnter={() => setShowCaret(true)}
               onMouseLeave={() => setShowCaret(false)}>
               {isAdmin && currentLookUserAccount && !isScreenCapture ? getSettingIcon() : null}
@@ -3095,7 +3110,7 @@ const Meeting: React.FC = () => {
                     container.scrollLeft += 100
                   }}>
                     <CaretRightOutlined />
-                  </div> : <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: '115px', bottom: isScreenCapture ? '50px' : '20px' }} onClick={() => {
+                  </div> : <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: '115px', bottom: isScreenCapture ? '70px' : '20px' }} onClick={() => {
                     const container = document.getElementById('videoView') as HTMLElement;
                     container.scrollTop += 100
                   }}>

src/utils/package/imageUrl.ts

@@ -89,6 +89,10 @@ import icon56Active from '@/assets/icon56-active.png'
 import icon57 from '@/assets/icon57.png'
 import icon58 from '@/assets/icon58.png'
 import icon59 from '@/assets/icon59.png'
+import icon60 from '@/assets/icon60.png'
+import icon61 from '@/assets/icon61.png'
+import icon60Active from '@/assets/icon60-active.png'
+import icon61Active from '@/assets/icon61-active.png'
 export default {
   loading,
   icon,
@@ -181,4 +185,8 @@ export default {
   icon57,
   icon58,
   icon59,
+  icon60,
+  icon61,
+  icon60Active,
+  icon61Active,
 }