From edf7ce3629e82b729c6a95be53dcf3ebf81dccdc Mon Sep 17 00:00:00 2001
From: yj <1336058017@qq.com>
Date: Tue, 10 Sep 2024 11:33:18 +0800
Subject: [PATCH] =?UTF-8?q?=E8=BF=9C=E7=A8=8B=E8=AE=BE=E5=A4=87=E6=8E=A7?=
 =?UTF-8?q?=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../EquipmentManagement/index.module.scss     |  2 +
 src/components/EquipmentManagement/index.tsx  | 55 +++++++++++++++---
 src/page/Meeting/index.tsx                    | 57 +++++++++++++++++--
 src/utils/package/signalr.ts                  | 29 ++++++++--
 4 files changed, 125 insertions(+), 18 deletions(-)

diff --git a/src/components/EquipmentManagement/index.module.scss b/src/components/EquipmentManagement/index.module.scss
index 81c70fe..8cbea9c 100644
--- a/src/components/EquipmentManagement/index.module.scss
+++ b/src/components/EquipmentManagement/index.module.scss
@@ -3,6 +3,7 @@
     >div {
       display: flex;
       align-items: center;
+      margin-bottom: 10px;
 
       >span {
         color: #EEEEEE;
@@ -15,5 +16,6 @@
   >div:nth-child(2) {
     display: flex;
     justify-content: center;
+    margin-top: 20px;
   }
 }
\ No newline at end of file
diff --git a/src/components/EquipmentManagement/index.tsx b/src/components/EquipmentManagement/index.tsx
index 645ae7a..90f235b 100644
--- a/src/components/EquipmentManagement/index.tsx
+++ b/src/components/EquipmentManagement/index.tsx
@@ -1,18 +1,30 @@
 import styles from '@/components/EquipmentManagement/index.module.scss'
-import { Button, Modal } from 'antd';
+import { onInvoke } from '@/utils/package/signalr';
+import { Button, Modal, Select } from 'antd';
 import { useState, useImperativeHandle, forwardRef } from "react";
-// import { agora } from '@/utils/package/agora';
 const EquipmentManagement = forwardRef((_props: any, ref: any) => {
   useImperativeHandle(ref, () => ({
-    changeModal: () => {
+    changeModal: async (uid: string, userName: string) => {
+      setCallerUid(uid)
+      setDeviceInfo({})
+      await onInvoke('getDrivers', {
+        uid
+      })
+      setUserName(userName)
       setEquipmentManagementModal(true)
+    },
+    setData: (data: any) => {
+      setDeviceInfo(data)
     }
   }))
   const [equipmentManagementModal, setEquipmentManagementModal] = useState(false)
+  const [callerUid, setCallerUid] = useState('')
+  const [deviceInfo, setDeviceInfo] = useState<any>({})
+  const [userName, setUserName] = useState<any>({})
   return (
     <>
       <Modal
-        title="设备管理"
+        title={`设备管理(${userName})`}
         open={equipmentManagementModal}
         footer={null}
         centered
@@ -24,20 +36,47 @@ const EquipmentManagement = forwardRef((_props: any, ref: any) => {
           <div>
             <div>
               <span>摄像头</span>
-
+              <Select
+                placeholder={deviceInfo?.videoList?.length ? '请选择设备' : '未检测到摄像头'}
+                options={deviceInfo?.videoList} style={{ flexGrow: 1 }}
+                value={deviceInfo?.videoDeviceId} onChange={async (e) => {
+                  setDeviceInfo({
+                    ...deviceInfo,
+                    videoDeviceId: e
+                  })
+                }} />
             </div>
             <div>
               <span>麦克风</span>
-
+              <Select
+                placeholder={deviceInfo?.ecordingList?.length ? '请选择设备' : '未检测到麦克风'}
+                options={deviceInfo?.ecordingList} style={{ flexGrow: 1 }}
+                value={deviceInfo?.ecordingDeviceId} onChange={async (e) => {
+                  setDeviceInfo({
+                    ...deviceInfo,
+                    ecordingDeviceId: e
+                  })
+                }} />;
             </div>
             <div>
               <span>扬声器</span>
-
+              <Select
+                placeholder={deviceInfo?.playBackList?.length ? '请选择设备' : '未检测到麦克风'}
+                options={deviceInfo?.playBackList} style={{ flexGrow: 1 }}
+                value={deviceInfo?.playBackDeviceId} onChange={async (e) => {
+                  setDeviceInfo({
+                    ...deviceInfo,
+                    playBackDeviceId: e
+                  })
+                }} />;
             </div>
           </div>
           <div>
             <Button type="primary" className='m-ant-btn' onClick={() => {
-
+              onInvoke('setDrivers', {
+                uid: callerUid,
+                driversJsonString: JSON.stringify(deviceInfo)
+              })
             }}>确定</Button>
             <Button type="primary"
               style={{ backgroundColor: '#31353A', marginLeft: '10px' }}
diff --git a/src/page/Meeting/index.tsx b/src/page/Meeting/index.tsx
index f7eb862..678ae0a 100644
--- a/src/page/Meeting/index.tsx
+++ b/src/page/Meeting/index.tsx
@@ -457,11 +457,55 @@ const Meeting: React.FC = () => {
           break;
         // 设备列表
         case 'DriverList':
-          console.log(item);
+          const setting = JSON.parse(storage.getItem('setting') as string)
+          Promise.all([
+            agora.getVideoDeviceManager(),
+            agora.getAudioMediaList(),
+          ]).then((res) => {
+            const data = {
+              videoList: res[0].list.map((row: any) => {
+                return {
+                  value: row.deviceId,
+                  label: row.deviceName
+                }
+              }),
+              videoDeviceId: setting.videoDeviceId,
+              ecordingList: res[1].ecordingList.map((row: any) => {
+                return {
+                  value: row.deviceId,
+                  label: row.deviceName
+                }
+              }),
+              ecordingDeviceId: setting.ecordingDeviceId,
+              playBackList: res[1].playBackList.map((row: any) => {
+                return {
+                  value: row.deviceId,
+                  label: row.deviceName
+                }
+              }),
+              playBackDeviceId: setting.playBackDeviceId,
+            }
+            onInvoke('sendDrivers', {
+              uid: item.callerUid,
+              driversJsonString: JSON.stringify(data)
+            })
+          })
           break;
         // 设置设备
-        case 'SetDriver':
-          console.log(item);
+        case 'SaveDriver':
+          if (item.driver) {
+            const data = JSON.parse(item.driver);
+            await agora.setVideoDeviceManager(data.videoDeviceId)
+            await agora.setRecordingDevice(data.ecordingDeviceId)
+            await agora.setPlaybackDevice(data.playBackDeviceId)
+          }
+          break;
+        // 显示设备列表
+        case 'ShowDriverList':
+          if (item.driversJsonString) {
+            const data = JSON.parse(item.driversJsonString);
+            equipmentManagementRef.current.setData(data)
+          }
           break;
       }
     })
@@ -909,7 +953,8 @@ const Meeting: React.FC = () => {
         await postOpenCamera(true, user.uid)
         break;
       case '设置':
-        stupWizardRef.current.changeModal()
+        equipmentManagementRef.current.changeModal('26', '杨洁')
+        // stupWizardRef.current.changeModal()
         break;
       case '邀请人员':
         await getUserRoomInfo().then(async (res) => {
@@ -1130,8 +1175,8 @@ const Meeting: React.FC = () => {
     }, 0);
   }
   // 设备管理
-  const equipmentManagement = (uid: string, userName: string): void => {
-    equipmentManagementRef.current.changeModal()
+  const equipmentManagement = async (uid: string, userName: string): Promise<void> => {
+    equipmentManagementRef.current.changeModal(uid, userName)
   }
   // 开关麦克风
   const postOpenMicr = async (enableMicr: boolean, uid: string, isAll: boolean = false): Promise<void> => {
diff --git a/src/utils/package/signalr.ts b/src/utils/package/signalr.ts
index 95e99d2..003aca4 100644
--- a/src/utils/package/signalr.ts
+++ b/src/utils/package/signalr.ts
@@ -161,18 +161,26 @@ export const onSignalr = (callBack: Function) => {
       })
     });
     // 设备列表
-    connection.on("DriverList", () => {
+    connection.on("DriverList", (callerUid: string) => {
       callBack({
-        key: 'DriverList'
+        key: 'DriverList',
+        callerUid
       })
     });
     // 设置设备
-    connection.on("SetDriver", (driver:string) => {
+    connection.on("SaveDriver", (driver: string) => {
       callBack({
-        key: 'SetDriver',
+        key: 'SaveDriver',
         driver
       })
     });
+    // 显示设备列表
+    connection.on("ShowDriverList", (driversJsonString: string) => {
+      callBack({
+        key: 'ShowDriverList',
+        driversJsonString
+      })
+    });
   }
 }
 export const offSignalr = () => {
@@ -193,6 +201,7 @@ export const offSignalr = () => {
     connection.off('Watch');
     connection.off('DriverList');
     connection.off('SetDriver');
+    connection.off('ShowDriverList');
   }
 }
 export const onInvoke = async (str: string, data: any) => {
@@ -204,6 +213,18 @@ export const onInvoke = async (str: string, data: any) => {
       // 4:屏幕共享
       await connection.invoke(str, data.roomNum, data.type)
       break;
+    case 'getDrivers':
+      // 获取某个人的设备列表
+      await connection.invoke(str, data.uid)
+      break;
+    case 'sendDrivers':
+      // 发送设备列表给某个人
+      await connection.invoke(str, data.uid, data.driversJsonString)
+      break;
+    case 'setDrivers':
+      // 设置某个人的设备列表
+      await connection.invoke(str, data.uid, data.driversJsonString)
+      break;
   }
 }
 export const onStop = async () => {