main.js

@@ -551,9 +551,7 @@ app.on('ready', () => {
                         childWindow[k] = ""
                     }
                 }
-                mainWindow.setSkipTaskbar(false)
+                mainWindowCenter()
-                mainWindow.setResizable(true)
-                mainWindow.setAlwaysOnTop(false)
             } else {
                 childWindow[key].close()
                 childWindow[key] = ""
@@ -571,11 +569,6 @@ app.on('ready', () => {
                 case 'noticeWindow':
                     childWindow[config.key].setBounds({ width: config.width, height: config.height })
                     break;
-                default:
-                    mainWindow.setMinimumSize(250, config.height);
-                    mainWindow.setMaximumSize(250, config.height);
-                    mainWindow.setSize(250, config.height)
-                    break;
             }
         });
         // 隐藏显示子窗口
@@ -596,18 +589,13 @@ app.on('ready', () => {
                 }
             }
         });
-        // 定位主窗口
+        // 隐藏主窗口
-        ipcMain.handle('setPosition', (event, data) => {
+        ipcMain.handle('mainWindowHide', () => {
-            const display = screen.getDisplayMatching({ ...mainWindow.getBounds() });
+            mainWindowHide()
-            const { width, height } = display.size
+        });
-            switch (data) {
+        // 居中主窗口
-                case 'right':
+        ipcMain.handle('mainWindowCenter', () => {
-                    x = width - mainWindow.getSize()[0];
+            mainWindowCenter()
-                    mainWindow.setPosition(x - 40, 40);
-                    break;
-                default:
-                    break;
-            }
         });
         // 窗口通信
         ipcMain.handle('windowHandleMessage', (event, data) => {
@@ -694,14 +682,16 @@ function windowOperation(config) {
         case 'shareScreenWindow':
             x = Math.round((display.workArea.width - child.getSize()[0]) / 2);
             child.setPosition(x, 0);
-            mainWindow.setSkipTaskbar(true)
+            mainWindowHide()
-            mainWindow.setResizable(false)
-            mainWindow.setAlwaysOnTop(true, 'screen-saver')
             break;
         case 'chatSmallWindow':
             y = height - child.getSize()[1];
             child.setPosition(40, y - 200);
             break;
+        case 'currentSpeakUserWindow':
+            x = width - child.getSize()[0];
+            child.setPosition(x - 40, 40);
+            break;
         case 'noticeWindow':
             x = width - child.getSize()[0];
             y = height - child.getSize()[1];
@@ -716,6 +706,10 @@ function mainWindowCenter() {
     const y = Math.round((display.workArea.height - mainWindow.getSize()[1]) / 2);
     mainWindow.setPosition(x, y);
 }
+// 主窗口隐藏
+function mainWindowHide() {
+    mainWindow.setPosition(-999999, -999999);
+}
 
 const startSignalr = async (user) => {
     connection = new signalR.HubConnectionBuilder()

preload.js

@@ -127,9 +127,13 @@ window.electron = {
     setChildWindowShow: (config) => {
         ipcRenderer.invoke('setChildWindowShow', config)
     },
-    // 定位主窗口
+    // 隐藏主窗口
-    setPosition: (data) => {
+    mainWindowHide: () => {
-        ipcRenderer.invoke('setPosition', data)
+        ipcRenderer.invoke('mainWindowHide')
+    },
+    // 居中主窗口
+    mainWindowCenter: () => {
+        ipcRenderer.invoke('mainWindowCenter')
     },
     // 窗口通信传参
     windowHandleMessage: (data) => {

src/App.tsx

@@ -16,10 +16,12 @@ import { PostLogin } from "@/api/Login";
 import { agora } from "@/utils/package/agora";
 import QuitTips from "@/components/QuitTips";
 import { GetLeave } from "@/api/Meeting";
+import path from "path";
 import ShareScreenWindow from "@/page/Meeting/ShareScreenWindow";
 import UserListWindow from "@/page/Meeting/UserListWindow";
 import ChatSmallWindow from "@/page/Meeting/ChatSmallWindow";
 import ChatBigWindow from "@/page/Meeting/ChatBigWindow";
+import CurrentSpeakUserWindow from "@/page/Meeting/CurrentSpeakUserWindow";
 import NoticeWindow from "@/page/Meeting/NoticeWindow";
 import { getKeyOpenChildWindow, setKeyOpenChildWindow, storageSeeting } from "./utils/package/public";
 const fs = require('fs').promises;
@@ -36,7 +38,7 @@ const App: React.FC = () => {
     });
     const [spinning, setSpinning] = useState(false);
     const [isState, setIsState] = useState(true);
-    const urlHashArr = ['#/userListWindow', '#/shareScreenWindow', '#/chatSmallWindow', '#/chatBigWindow', '#/noticeWindow']
+    const urlHashArr = ['#/userListWindow', '#/shareScreenWindow', '#/chatSmallWindow', '#/chatBigWindow', '#/currentSpeakUserWindow', '#/noticeWindow']
     if (urlHashArr.indexOf(location.hash) == -1) {
         useEffect(() => {
             let userInfo = JSON.parse(storage.getItem('user') as string)
@@ -163,7 +165,6 @@ const App: React.FC = () => {
             if (location.href.indexOf('/login') !== -1) {
                 window.electron.onStop()
             }
-            message.destroy('cameraTemporarily')
         }, [navigate])
     }
     useEffect(() => {
@@ -275,6 +276,7 @@ const App: React.FC = () => {
                 <Route path='/userListWindow' element={<UserListWindow />} />
                 <Route path='/chatSmallWindow' element={<ChatSmallWindow />} />
                 <Route path='/chatBigWindow' element={<ChatBigWindow />} />
+                <Route path='/currentSpeakUserWindow' element={<CurrentSpeakUserWindow />} />
                 <Route path='/noticeWindow' element={<NoticeWindow />} />
                 <Route path='*' element={<NotFound />} />
             </Routes>

src/page/Meeting/CurrentSpeakUserWindow/index.module.scss

@@ -0,0 +1,19 @@
+.currentSpeakUserWindow {
+  color: white;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  background-color: #16191E;
+  padding: 4px;
+  box-sizing: border-box;
+
+  >div {
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+    max-width: 100%;
+    width: fit-content;
+    font-size: 14px;
+  }
+}

src/page/Meeting/CurrentSpeakUserWindow/index.tsx

@@ -0,0 +1,36 @@
+import styles from '@/page/Meeting/CurrentSpeakUserWindow/index.module.scss'
+import { useEffect, useState } from "react";
+const CurrentSpeakUserWindow: React.FC = () => {
+  const [inputValue, setInputValue] = useState('')
+  const channel = new BroadcastChannel('meeting_channel');
+  useEffect(() => {
+    let time: NodeJS.Timeout;
+    time = setInterval(() => {
+      channel.postMessage({
+        type: 'currentSpeakUserWindowGetUserName'
+      })
+    }, 1000)
+    window.electron.windowHandleMessageCallBack((_e: any, data: any) => {
+      if (data.parmes.currentSpeakUser.length) {
+        setInputValue(data.parmes.currentSpeakUser.join(';'))
+      } else {
+        setInputValue('')
+      }
+    })
+    return () => {
+      clearInterval(time)
+    }
+  }, []);
+
+  return (
+    <>
+      <div className={styles.currentSpeakUserWindow}>
+        <div title={`正在说话: ${inputValue}`}>
+          {`正在说话: ${inputValue}`}
+        </div>
+      </div >
+    </>
+  )
+}
+
+export default CurrentSpeakUserWindow

src/page/Meeting/index.module.scss

@@ -94,45 +94,6 @@
   background-color: #1F2022;
   display: flex;
   flex-direction: column;
-  position: relative;
-
-  .meetingAbsolute {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    background-color: #1F2022;
-    left: 0;
-    top: 0;
-    z-index: 3000;
-
-    .meetingAbsoluteLoading {
-      background: black;
-      position: absolute;
-      left: 0;
-      top: 0;
-      width: 100%;
-      height: 100%;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      z-index: 1;
-    }
-
-    .meetingAbsoluteText {
-      position: absolute;
-      width: 100%;
-      left: 0;
-      color: white;
-      text-align: center;
-      z-index: 2;
-      background-color: rgba(0, 0, 0, 0.5);
-      cursor: pointer;
-      font-size: 14px;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-      overflow: hidden;
-    }
-  }
 
   .meetingHeader {
     display: flex;
@@ -636,6 +597,8 @@
                   color: #F3F3F5;
                   margin-left: 4px;
                 }
+
+                >div {}
               }
 
               >div:nth-child(2) {

src/page/Meeting/index.tsx

@@ -146,9 +146,7 @@ const Meeting: React.FC = () => {
   });
   const [roomUserList, setRoomUserList] = useState<any>([])
   const [_speackUid, setSpeackUid] = useState<any>([])
-  const [currentSpeakUser, setCurrentSpeakUser] = useState<any>([])
   const [chatList, setChatList] = useState<any>([])
-  const [isExpand, setIsExpand] = useState(false)
   const [currentVideoId, setCurrentVideoId] = useState('')
   let [currentSeconds, setCurrentSeconds] = useState(0)
   const [currentEffective, setCurrentEffective] = useState(4)
@@ -158,7 +156,7 @@ const Meeting: React.FC = () => {
   })
   const [networkOther, setNetworkOther] = useState<RtcStats>({})
   const [isComputerAudio, setIsComputerAudio] = useState(false)
-  const [isScreenCapture, setIsScreenCapture] = useState(false)
+  const [_isScreenCapture, setIsScreenCapture] = useState(false)
   const [isFluencyPriority, setIsFluencyPriority] = useState(false)
   const [open, setOpen] = useState(false)
   const [modeOpen, setModeOpen] = useState(false)
@@ -381,26 +379,33 @@ const Meeting: React.FC = () => {
             userId: noticeWindowPostRoomManager.uid
           })
           break;
+        case 'currentSpeakUserWindowGetUserName':
+          setSpeackUid((uids: any) => {
+            const usernames: string[] = [];
+            setRoomUserList((res: any) => {
+              uids.forEach((uid: any) => {
+                const user = res.find((item: any) => item.uid == uid);
+                if (user) {
+                  usernames.push(user.userName);
+                }
+              })
+              window.electron.windowHandleMessage({
+                key: 'currentSpeakUserWindow',
+                parmes: {
+                  currentSpeakUser: usernames,
+                }
+              })
+              return res
+            });
+            return []
+          })
+          break;
       }
     }
     time = setInterval(() => {
       setCurrentSeconds(currentSeconds => {
         return currentSeconds += 1
       })
-      setSpeackUid((uids: any) => {
-        const usernames: string[] = [];
-        setRoomUserList((res: any) => {
-          uids.forEach((uid: any) => {
-            const user = res.find((item: any) => item.uid == uid);
-            if (user) {
-              usernames.push(user.userName);
-            }
-          })
-          setCurrentSpeakUser(usernames)
-          return res
-        });
-        return []
-      })
     }, 1000)
     // 首次加载图标更新
     const firstFooterList = [...footerList]
@@ -412,32 +417,27 @@ const Meeting: React.FC = () => {
     setTimeout(async () => {
       const setting = await JSON.parse(storage.getItem('setting') as string);
       const stateInfo = await JSON.parse(storage.getItem('stateInfo') as string);
-      if (stateInfo && setting.isRecordingTips) {
+      if (stateInfo && setting.isRecordingTips && !recorder) {
         setRecorder((data: any) => {
           if (!data) {
-            setIsScreenCapture(bool => {
+            confirm({
-              if (!bool) {
+              title: '提示',
-                confirm({
+              icon: <ExclamationCircleFilled />,
-                  title: '提示',
+              content: `是否录制本次会议？`,
-                  icon: <ExclamationCircleFilled />,
+              centered: true,
-                  content: `是否录制本次会议？`,
+              okText: '确定',
-                  centered: true,
+              cancelText: '取消',
-                  okText: '确定',
+              async onOk() {
-                  cancelText: '取消',
+                if (stateInfo) {
-                  async onOk() {
+                  changeStatusList({
-                    if (stateInfo) {
+                    title: '录制'
-                      changeStatusList({
+                  }, 1, 3)
-                        title: '录制'
+                } else {
-                      }, 1, 3)
+                  message.error('当前不在会议室！')
-                    } else {
+                }
-                      message.error('当前不在会议室！')
+              },
-                    }
+              onCancel() {
-                  },
-                  onCancel() {
-                  }
-                })
               }
-              return bool
             })
           }
           return data
@@ -989,11 +989,9 @@ const Meeting: React.FC = () => {
               const percentage = (item.volume / 255) * 100
               dom.style.height = `${percentage}%`
             }
-            if (!item.uid) {
+            if (domMe && !item.uid) {
               const percentage = (item.volume / 255) * 100
-              if (domMe) {
+              domMe.style.height = `${percentage}%`
-                domMe.style.height = `${percentage}%`
-              }
               window.electron.windowHandleMessage({
                 key: 'shareScreenWindow',
                 parmes: {
@@ -1061,14 +1059,6 @@ const Meeting: React.FC = () => {
             }
             return bool
           })
-        } else if (reason === 3 || reason === 4) {
-          message.error({
-            content: <div>请检查摄像头是否正常工作，检查摄像头是否被其他应用占用，或者尝试重新加入频道，<span style={{ color: '#606fc7', cursor: 'pointer' }} onClick={() => {
-              stupWizardRef.current.changeModal(1);
-            }}>前往修改摄像头</span></div>,
-            duration: 60,
-            key: 'cameraTemporarily'
-          });
         }
       }
     })
@@ -1607,6 +1597,7 @@ const Meeting: React.FC = () => {
       await allUserLook(user.screenShareId, user.userName)
       const isOpen = await getKeyOpenChildWindow('shareScreenWindow')
       setIsScreenCapture(true)
+      window.electron.setViewStatus('hide')
       if (!isOpen) {
         window.electron.createChildWindow({
           url: location.origin + `/#/noticeWindow`,
@@ -1629,6 +1620,13 @@ const Meeting: React.FC = () => {
           key: 'chatSmallWindow',
           show: true,
         })
+        window.electron.createChildWindow({
+          url: location.origin + `/#/currentSpeakUserWindow`,
+          width: 200,
+          height: 30,
+          key: 'currentSpeakUserWindow',
+          show: true,
+        })
         window.electron.createChildWindow({
           url: location.origin + `/#/chatBigWindow`,
           width: 540,
@@ -1642,20 +1640,6 @@ const Meeting: React.FC = () => {
           key: 'userListWindow',
         })
         setKeyOpenChildWindow('shareScreenWindow', true)
-        window.electron.setMainWindowSize({
-          width: 250,
-          height: 160,
-        })
-        window.electron.setPosition('right')
-        setTimeout(() => {
-          agora.setupLocalVideo({
-            uid: Number(user.uid),
-            view: document.getElementById(`meetingAbsoluteVideo`) as HTMLElement,
-            channelId: state.channelId,
-            sourceType: VideoSourceType.VideoSourceCameraPrimary,
-            type: true
-          })
-        }, 1500);
       }
     } else {
       message.error('请选择应用!')
@@ -2083,23 +2067,10 @@ const Meeting: React.FC = () => {
   return (
     <>
       <div className={styles.meeting}>
-        {isScreenCapture ? <div className={`${styles.meetingAbsolute}`} id='meetingAbsoluteVideo'>
-          <div style={{ top: '0px' }} className={`${styles.meetingAbsoluteText}`}>{currentSpeakUser.length ? '正在说话:' + currentSpeakUser.join(';') : '正在说话:'}</div>
-          {footerList[0][1].active ? <div className={styles.meetingAbsoluteLoading}>
-            <Avatar name={user.userName} />
-          </div> : null}
-          <div style={{ bottom: '0px' }} className={`${styles.meetingAbsoluteText} drag`} onClick={() => {
-            setIsExpand(!isExpand)
-            window.electron.setChildWindow({
-              height: isExpand ? 160 : 40,
-              key: 'main'
-            })
-          }}><span>{isExpand ? '展开' : '收起'}</span></div>
-        </div> : null}
         {contextHolder}
         <div className={styles.meetingHeader}>
           <div>
-            {isScreenCapture ? null : <Popover
+            <Popover
               content={
                 <div style={{ color: 'white' }}>
                   <div>
@@ -2143,7 +2114,7 @@ const Meeting: React.FC = () => {
                 {networkIcon(currentEffective)}
                 <span>详情</span>
               </div>
-            </Popover>}
+            </Popover>
             <div>{changeCurrentSeconds()}</div>
           </div>
           <div>会议号：{state.channelId} 会议名称：{state.roomName}</div>
@@ -2658,7 +2629,7 @@ const Meeting: React.FC = () => {
               ) : null
             }
           </div>
-          {isScreenCapture ? null : <div className={styles.meetingContentFooter}>
+          <div className={styles.meetingContentFooter}>
             {footerList.map((item: any, itemIndex: number) => {
               return (
                 <div key={itemIndex}>
@@ -2811,7 +2782,7 @@ const Meeting: React.FC = () => {
                 </div>
               )
             })}
-          </div>}
+          </div>
         </div>
       </div>
       <Modal title="共享屏幕" open={isSharedScreenModal} footer={null} closable={false} centered width={'800px'}>

src/render.d.ts

@@ -32,7 +32,8 @@ export interface IElectronAPI {
     setChildWindow: (config: any) => void;
     setChildWindowShow: (config: any) => void;
     closeChildWindow: (key: string) => void;
-    setPosition: (data: ang) => void;
+    mainWindowCenter: () => any;
+    mainWindowHide: () => any;
     windowHandleMessage: (data: any) => {}
     windowHandleMessageCallBack: (callBack: Function) => void;
 }