优化

2024-07-26 15:57:06 +08:00 · 2024-07-26 15:57:06 +08:00 · e285e9f22c
parent c37edce16d
commit e285e9f22c
4 changed files with 116 additions and 43 deletions
--- a/src/App.tsx
+++ b/src/App.tsx
@ -130,10 +130,10 @@ const App: React.FC = () => {
                playBackDeviceId: "", //输出设备id
                ecordingVolume: '', //输入音量
                playBackVolume: '', //输出音量
-                autoEcordingVolume: false, //是否自动调整麦克风音量
+                autoEcordingVolume: true, //是否自动调整麦克风音量
                recordingFilesPath: '', //本地录制保存路径
                shareFilesPath: '', //共享文件保存路径
-                isShareSavePath: false, //是否下载钱询问每个文件保存的位置
+                isShareSavePath: true, //是否下载钱询问每个文件保存的位置
            }))
        }
    }, [])
--- a/src/components/StupWizard/index.tsx
+++ b/src/components/StupWizard/index.tsx
@ -5,6 +5,7 @@ import { useState, useImperativeHandle, forwardRef, useEffect } from "react";
 import agora from '@/utils/package/agora'
 import { CloseOutlined, LoadingOutlined } from '@ant-design/icons';
 import { storage } from '@/utils';
+const os = require('os')
 let userInfo = JSON.parse(storage.getItem('user') as string)
 const StupWizard = forwardRef((props: any, ref: any) => {
  useImperativeHandle(ref, () => ({
@ -178,10 +179,11 @@ const AudioComponents = () => {
    ecordingList: [],
    playBackItem: null,
    ecordingItem: null,
-    playBackVolume: 127,
+    playBackVolume: 0,
    playBackActive: false,
    ecordingActive: false,
    ecordingVolume: 0,
+    autoEcordingVolume: true,
  });
  useEffect(() => {
    getAudioMediaList()
@ -194,8 +196,28 @@ const AudioComponents = () => {
      }
    })
  }, []);
-  const getAudioMediaList = (): void => {
-    const { playBackList, ecordingList, playBackItem, ecordingItem, ecordingVolume } = agora.getAudioMediaList();
+  const getAudioMediaList = async (): Promise<void> => {
+    const { playBackList, ecordingList, playBackItem, ecordingItem, ecordingVolume } = await agora.getAudioMediaList();
+    const setting = await JSON.parse(storage.getItem('setting') as string)
+    if ((!setting.ecordingDeviceId && ecordingItem.deviceId) || (!(ecordingList.find((item: any) => item.deviceId === setting.ecordingDeviceId)) && ecordingItem.deviceId)) {
+      setting.ecordingDeviceId = ecordingItem.deviceId
+    }
+    if ((!setting.playBackDeviceId && playBackItem.deviceId) || (!(playBackList.find((item: any) => item.deviceId === setting.playBackDeviceId)) && playBackItem.deviceId)) {
+      setting.playBackDeviceId = playBackItem.deviceId
+    }
+    if (!ecordingList.length) {
+      setting.ecordingDeviceId = ''
+    }
+    if (!playBackList.length) {
+      setting.playBackDeviceId = ''
+    }
+    if (!setting.ecordingVolume) {
+      setting.ecordingVolume = ecordingVolume;
+    }
+    if (!setting.playBackVolume) {
+      setting.playBackVolume = 127;
+    }
+    storage.setItem('setting', JSON.stringify(setting))
    setAudioDeviceManager({
      ...audioDeviceManager,
      playBackList: playBackList.map((row: any) => {
@ -210,9 +232,11 @@ const AudioComponents = () => {
          label: row.deviceName
        }
      }),
-      playBackItem: playBackItem.deviceId ? playBackItem.deviceId : null,
-      ecordingItem: ecordingItem.deviceId ? ecordingItem.deviceId : null,
-      ecordingVolume,
+      playBackItem: setting.playBackDeviceId ? setting.playBackDeviceId : playBackItem.deviceId || null,
+      ecordingItem: setting.ecordingDeviceId ? setting.ecordingDeviceId : ecordingItem.deviceId || null,
+      ecordingVolume: setting.ecordingVolume,
+      playBackVolume: setting.playBackVolume,
+      autoEcordingVolume: setting.autoEcordingVolume
    })
  }
  return (
@ -226,7 +250,10 @@ const AudioComponents = () => {
              <Select
                placeholder={audioDeviceManager.ecordingList.length ? '请选择设备' : '未检测到麦克风'}
                options={audioDeviceManager.ecordingList} style={{ flexGrow: 1 }}
-                value={audioDeviceManager.ecordingItem} onChange={(e) => {
+                value={audioDeviceManager.ecordingItem} onChange={async (e) => {
+                  const setting = await JSON.parse(storage.getItem('setting') as string)
+                  setting.ecordingDeviceId = e;
+                  storage.setItem('setting', JSON.stringify(setting))
                  setAudioDeviceManager({
                    ...audioDeviceManager,
                    ecordingItem: e
@ -261,8 +288,11 @@ const AudioComponents = () => {
            </div> : null}
            <div className={styles.audioComponentsSlider}>
              <span>输入音量：</span>
-              <Slider value={audioDeviceManager.ecordingVolume} style={{ flexGrow: 1 }} max={255} onChange={(e) => {
-                agora.setRecordingDeviceVolume(e)
+              <Slider value={audioDeviceManager.ecordingVolume} style={{ flexGrow: 1 }} max={255} onChange={async (e) => {
+                const setting = await JSON.parse(storage.getItem('setting') as string)
+                setting.ecordingVolume = e;
+                storage.setItem('setting', JSON.stringify(setting))
+                await agora.setRecordingDeviceVolume(e)
                setAudioDeviceManager({
                  ...audioDeviceManager,
                  ecordingVolume: e,
@ -270,9 +300,15 @@ const AudioComponents = () => {
              }} disabled={!audioDeviceManager.ecordingItem} />
            </div>
            <div>
-              <Checkbox onChange={() => {
-
-              }}>自动调整麦克风音量</Checkbox>
+              <Checkbox onChange={async (e) => {
+                const setting = await JSON.parse(storage.getItem('setting') as string)
+                setting.autoEcordingVolume = e.target.checked;
+                storage.setItem('setting', JSON.stringify(setting))
+                setAudioDeviceManager({
+                  ...audioDeviceManager,
+                  autoEcordingVolume: e.target.checked
+                })
+              }} checked={audioDeviceManager.autoEcordingVolume}>自动调整麦克风音量</Checkbox>
            </div>
          </div>
          <div>
@ -281,7 +317,10 @@ const AudioComponents = () => {
              <Select
                placeholder={audioDeviceManager.playBackList.length ? '请选择设备' : '未检测到麦克风'}
                options={audioDeviceManager.playBackList} style={{ flexGrow: 1 }}
-                value={audioDeviceManager.playBackItem} onChange={(e) => {
+                value={audioDeviceManager.playBackItem} onChange={async (e) => {
+                  const setting = await JSON.parse(storage.getItem('setting') as string)
+                  setting.playBackDeviceId = e;
+                  storage.setItem('setting', JSON.stringify(setting))
                  setAudioDeviceManager({
                    ...audioDeviceManager,
                    playBackItem: e
@ -316,7 +355,10 @@ const AudioComponents = () => {
            </div> : null}
            <div className={styles.audioComponentsSlider}>
              <span>输出音量：</span>
-              <Slider value={audioDeviceManager.playBackVolume} style={{ flexGrow: 1 }} max={255} onChange={(e) => {
+              <Slider value={audioDeviceManager.playBackVolume} style={{ flexGrow: 1 }} max={255} onChange={async (e) => {
+                const setting = await JSON.parse(storage.getItem('setting') as string)
+                setting.playBackVolume = e;
+                storage.setItem('setting', JSON.stringify(setting))
                agora.setPlaybackDeviceVolume(e)
                setAudioDeviceManager({
                  ...audioDeviceManager,
@ -332,6 +374,16 @@ const AudioComponents = () => {
 }
 const RecordingComponents = () => {
  const [filePath, setFilePath] = useState('')
+  useEffect(() => {
+    const setting = JSON.parse(storage.getItem('setting') as string)
+    if (!setting.recordingFilesPath) {
+      setting.recordingFilesPath = `${os.homedir()}\\Desktop\\`
+      setFilePath(setting.recordingFilesPath)
+      storage.setItem('setting', JSON.stringify(setting))
+    } else {
+      setFilePath(setting.recordingFilesPath);
+    }
+  }, [])
  return (
    <>
      <div>
@ -344,7 +396,10 @@ const RecordingComponents = () => {
              placeholder="请填入文件路径"
              style={{ margin: '0 14px', flexGrow: 1 }}
              value={filePath}
-              onChange={(e) => {
+              onChange={async (e) => {
+                const setting = await JSON.parse(storage.getItem('setting') as string)
+                setting.recordingFilesPath = e.target.value;
+                storage.setItem('setting', JSON.stringify(setting))
                setFilePath(e.target.value)
              }}
            />
@ -357,6 +412,18 @@ const RecordingComponents = () => {
 }
 const FileComponents = () => {
  const [filePath, setFilePath] = useState('')
+  const [isShareSavePath, setIsShareSavePath] = useState(true)
+  useEffect(() => {
+    const setting = JSON.parse(storage.getItem('setting') as string)
+    if (!setting.shareFilesPath) {
+      setting.shareFilesPath = `${os.homedir()}\\Desktop\\`
+      setFilePath(setting.shareFilesPath)
+      storage.setItem('setting', JSON.stringify(setting))
+    } else {
+      setFilePath(setting.shareFilesPath);
+    }
+    setIsShareSavePath(setting.isShareSavePath)
+  }, [])
  return (
    <>
      <div>
@ -369,16 +436,22 @@ const FileComponents = () => {
              placeholder="请填入保存目录"
              style={{ margin: '0 14px', flexGrow: 1 }}
              value={filePath}
-              onChange={(e) => {
+              onChange={async (e) => {
+                const setting = await JSON.parse(storage.getItem('setting') as string)
+                setting.shareFilesPath = e.target.value;
+                storage.setItem('setting', JSON.stringify(setting))
                setFilePath(e.target.value)
              }}
            />
            <Button type="primary" onClick={() => { }} style={{ backgroundColor: '#31353A' }}>选择保存目录</Button>
          </div>
          <div>
-            <Checkbox onChange={() => {
-
-            }}>下载前询问每个文件保存位置</Checkbox>
+            <Checkbox onChange={async (e) => {
+              const setting = await JSON.parse(storage.getItem('setting') as string)
+              setting.isShareSavePath = e.target.checked;
+              storage.setItem('setting', JSON.stringify(setting))
+              setIsShareSavePath(e.target.checked)
+            }} checked={isShareSavePath}>下载前询问每个文件保存位置</Checkbox>
          </div>
        </div>
      </div>
--- a/src/page/Meeting/index.tsx
+++ b/src/page/Meeting/index.tsx
@ -800,10 +800,9 @@ const Meeting: React.FC = () => {
            })}
          </div>
          <div>
-            <div></div>
-            {/* <Checkbox onChange={() => {
+            <Checkbox onChange={() => {

-            }}>共享电脑音频</Checkbox> */}
+            }}>共享电脑音频</Checkbox>
            <div>
              <Button type="primary" onClick={() => { setIsSharedScreenModal(false) }} style={{ backgroundColor: '#31353A', marginRight: '14px' }}>取消</Button>
              <Button type="primary" className='m-ant-btn' onClick={() => clickSharedScreen()}>共享</Button>
--- a/src/utils/package/agora.ts
+++ b/src/utils/package/agora.ts
@ -1,5 +1,4 @@
 import { message } from "antd";
-const os = require('os');
 import {
  createAgoraRtcEngine,
  ClientRoleType,
@ -12,6 +11,7 @@ import {
  MediaRecorderStreamType
 } from "agora-electron-sdk";
 import { GetRoomRtcToken } from "@/api/Home/Index";
+import { storage } from '@/utils';
 const option: any = {
  appId: 'dcfc466a6ecb4a1f972630065dfb1e75',
  token: '',
@ -259,8 +259,9 @@ const agora = {
        message.success(`文件已保存至${info.fileName}`)
      },
    })
+    const setting = JSON.parse(storage.getItem('setting') as string)
    iMediaRecorder.startRecording({
-      storagePath: `${os.homedir()}/Desktop/${+new Date()}.mp4`, //录音文件在本地保存的绝对路径，需精确到文件名及格式
+      storagePath: `${setting.recordingFilesPath}${+new Date()}.mp4`, //录音文件在本地保存的绝对路径，需精确到文件名及格式
      containerFormat: MediaRecorderContainerFormat.FormatMp4, //录制文件的格式
      streamType: MediaRecorderStreamType.StreamTypeBoth, //录制内容
      maxDurationMs: 7200000, //maxDurationMs
@ -299,7 +300,7 @@ const agora = {
    })
  },
  // 获取输入输出设备列表
-  getAudioMediaList: () => {
+  getAudioMediaList: async () => {
    return {
      playBackList: rtcEngine.getAudioDeviceManager().enumeratePlaybackDevices(),
      ecordingList: rtcEngine.getAudioDeviceManager().enumerateRecordingDevices(),
@ -309,36 +310,36 @@ const agora = {
    }
  },
  // 启动音频播放设备测试。
-  startPlaybackDeviceTest: () => {
-    rtcEngine.getAudioDeviceManager().startPlaybackDeviceTest('https://wgshare.oss-cn-chengdu.aliyuncs.com/TestAudio.mp3')
+  startPlaybackDeviceTest: async () => {
+    await rtcEngine.getAudioDeviceManager().startPlaybackDeviceTest('https://wgshare.oss-cn-chengdu.aliyuncs.com/TestAudio.mp3')
  },
  // 	停止音频播放设备测试。
-  stopPlaybackDeviceTest: () => {
-    rtcEngine.getAudioDeviceManager().stopPlaybackDeviceTest()
+  stopPlaybackDeviceTest: async () => {
+    await rtcEngine.getAudioDeviceManager().stopPlaybackDeviceTest()
  },
  // 设置播放设备音量
-  setPlaybackDeviceVolume: (volume: number) => {
-    rtcEngine.getAudioDeviceManager().setPlaybackDeviceVolume(volume)
+  setPlaybackDeviceVolume: async (volume: number) => {
+    await rtcEngine.getAudioDeviceManager().setPlaybackDeviceVolume(volume)
  },
  // 指定播放设备
-  setPlaybackDevice: (deviceId: string) => {
-    rtcEngine.getAudioDeviceManager().setPlaybackDevice(deviceId)
+  setPlaybackDevice: async (deviceId: string) => {
+    await rtcEngine.getAudioDeviceManager().setPlaybackDevice(deviceId)
  },
  // 启动音频采集设备测试
-  startRecordingDeviceTest: (indicationInterval: number) => {
-    rtcEngine.getAudioDeviceManager().startRecordingDeviceTest(indicationInterval)
+  startRecordingDeviceTest: async (indicationInterval: number) => {
+    await rtcEngine.getAudioDeviceManager().startRecordingDeviceTest(indicationInterval)
  },
  // 设置音频设备音量
-  setRecordingDeviceVolume: (volume: number) => {
-    rtcEngine.getAudioDeviceManager().setRecordingDeviceVolume(volume)
+  setRecordingDeviceVolume: async (volume: number) => {
+    await rtcEngine.getAudioDeviceManager().setRecordingDeviceVolume(volume)
  },
  // 设置音频采集设备
-  setRecordingDevice: (deviceId: string) => {
-    rtcEngine.getAudioDeviceManager().setRecordingDevice(deviceId)
+  setRecordingDevice: async (deviceId: string) => {
+    await rtcEngine.getAudioDeviceManager().setRecordingDevice(deviceId)
  },
  // 停止音频采集设备测试
-  stopRecordingDeviceTest: () => {
-    rtcEngine.getAudioDeviceManager().stopRecordingDeviceTest()
+  stopRecordingDeviceTest: async () => {
+    await rtcEngine.getAudioDeviceManager().stopRecordingDeviceTest()
  },

 }