全员静音

package.json

@@ -77,7 +77,7 @@
       ]
     },
     "directories": {
-      "output": "aa"
+      "output": "electron"
     },
     "extraResources": []
   }

src/api/Meeting/index.ts

@@ -23,7 +23,7 @@ export const PostRoomFile = (data: any) =>
 export const GetRoomUpFileurl = (roomNum: string, fileSuffix: string) =>
   request({
     url: `/room/up-fileurl?roomNum=${roomNum}&fileSuffix=${fileSuffix}`,
-    method: 'get'
+    method: 'get',
   })
 
 export const GetRoomFileDwUrl = (fileUrl: string, fileId: string) =>

src/page/Meeting/index.tsx

@@ -144,9 +144,11 @@ const Meeting: React.FC = () => {
 
   useEffect(() => {
     roomUserList.forEach((item: any) => {
+      agora.muteLocalAudioStream(item.enableMicr)
+      agora.muteLocalVideoStream(item.enableCamera)
       let dom = document.getElementById(`video-${item.account}`) as HTMLElement
-      if (!dom.getAttribute('load')) {
+      if (!dom.getAttribute('account')) {
-        dom.setAttribute('load', 'true')
+        dom.setAttribute('account', item.account)
         agora.setVideo({
           account: Number(item.account),
           view: dom,
@@ -213,28 +215,24 @@ const Meeting: React.FC = () => {
         footerListTemplate[itemIndex][rowIndex].title = '开启声音'
         footerListTemplate[itemIndex][rowIndex].active = true
         setFooterList(footerListTemplate)
-        agora.muteLocalAudioStream(true)
+        postOpenMicr(false, false)
-        postOpenMicr(false)
         break;
       case '开启声音':
         footerListTemplate[itemIndex][rowIndex].title = '关闭声音'
         footerListTemplate[itemIndex][rowIndex].active = false
         setFooterList(footerListTemplate)
-        agora.muteLocalAudioStream(false)
+        postOpenMicr(true, false)
-        postOpenMicr(true)
         break;
       case '关闭视频':
         footerListTemplate[itemIndex][rowIndex].title = '开启视频'
         footerListTemplate[itemIndex][rowIndex].active = true
         setFooterList(footerListTemplate)
-        agora.muteLocalVideoStream(true)
         postOpenCamera(false)
         break;
       case '开启视频':
         footerListTemplate[itemIndex][rowIndex].title = '关闭视频'
         footerListTemplate[itemIndex][rowIndex].active = false
         setFooterList(footerListTemplate)
-        agora.muteLocalVideoStream(false)
         postOpenCamera(true)
         break;
       case '设置向导':
@@ -359,11 +357,12 @@ const Meeting: React.FC = () => {
   }
 
   // 开关麦克风
-  const postOpenMicr = async (enableMicr: boolean): Promise<void> => {
+  const postOpenMicr = async (enableMicr: boolean, isAll: boolean): Promise<void> => {
     await PostOpenMicr({
       roomNum: state.channelId,
       uid: user.uid,
-      enableMicr
+      enableMicr,
+      isAll,
     }).then(res => {
       getRoomUser()
     })
@@ -440,22 +439,25 @@ const Meeting: React.FC = () => {
                       </div>
                       <Input placeholder="请输入用户名" className='drag' prefix={<SearchOutlined style={{ color: 'white' }} />} />
                       <div className={styles.meetingUserListContent}>
-                        {list.map((item: number) =>
+                        {roomUserList.map((item: any, index: number) =>
-                          <div key={item} className='drag'>
+                          <div key={index} className='drag'>
                             <div>
                               <div><img src={ImageUrl.avatar} alt="" /></div>
-                              <span>潇潇<span style={{ color: '#02B188', marginLeft: '4px' }}>主持人</span></span>
+                              <span>
+                                {item.userName}
+                                {item.roleId === '1' ? <span style={{ color: '#02B188', marginLeft: '4px' }}>主持人</span> : null}
+                              </span>
                             </div>
                             <div>
-                              <img src={ImageUrl.icon22} alt="" />
+                              <img src={item.enableMicr ? ImageUrl.icon22 : ImageUrl.icon22Active} alt="" />
-                              <img src={ImageUrl.icon23} alt="" />
+                              <img src={item.enableCamera ? ImageUrl.icon23 : ImageUrl.icon23Active} alt="" />
                             </div>
                           </div>
                         )}
                       </div>
                       <div className={`${styles.meetingUserListFooter} drag`}>
                         <div>邀请</div>
-                        <div>全员静音</div>
+                        <div onClick={() => postOpenMicr(true, true)}>全员静音</div>
                       </div>
                     </div>
                     :

src/utils/package/agora.ts

@@ -1,7 +1,7 @@
 import { message } from "antd";
-import os from 'os'
+const os = require('os');
 import storage from "./storage";
-const {
+import {
   createAgoraRtcEngine,
   ClientRoleType,
   VideoSourceType,
@@ -11,7 +11,7 @@ const {
   ChannelProfileType,
   MediaRecorderContainerFormat,
   MediaRecorderStreamType
-} = require("agora-electron-sdk");
+} from "agora-electron-sdk";
 const option: any = {
   appId: 'dcfc466a6ecb4a1f972630065dfb1e75',
   token: '',
@@ -221,7 +221,7 @@ const agora = {
       },
     })
     iMediaRecorder.startRecording({
-      storagePath: `${os.homedir()}/${+new Date()}.mp4`, //录音文件在本地保存的绝对路径，需精确到文件名及格式
+      storagePath: `${os.homedir()}/Desktop/${+new Date()}.mp4`, //录音文件在本地保存的绝对路径，需精确到文件名及格式
       containerFormat: MediaRecorderContainerFormat.FormatMp4, //录制文件的格式
       streamType: MediaRecorderStreamType.StreamTypeBoth, //录制内容
       maxDurationMs: 7200000, //maxDurationMs

vite.config.ts

@@ -54,10 +54,26 @@ export default defineConfig({
     resolve({
       'agora-electron-sdk': `
       const {
-        createAgoraRtcEngine
+        createAgoraRtcEngine,
+        ChannelProfileType,
+        ClientRoleType,
+        MediaRecorderContainerFormat,
+        MediaRecorderStreamType,
+        RenderModeType,
+        ScreenCaptureSourceType,
+        VideoSourceType,
+        VideoViewSetupMode
        } = require("agora-electron-sdk")
       export {
         createAgoraRtcEngine,
+        ChannelProfileType,
+        ClientRoleType,
+        MediaRecorderContainerFormat,
+        MediaRecorderStreamType,
+        RenderModeType,
+        ScreenCaptureSourceType,
+        VideoSourceType,
+        VideoViewSetupMode
       }
     `,
     })