优化

src/components/JoinSetting/index.tsx

@@ -16,14 +16,12 @@ const JoinSetting = forwardRef((_props: any, ref: any) => {
       setUser(userInfo)
       setJoinRoomSettingModal(true)
       setJoinRoomSettingForm((res: any) => {
-        res.list.forEach((item: any) => {
+        res.forEach((item: any) => {
           item.active = false
         });
-        return {
+        return res
-          ...res,
-          roomNum: roomNum
-        }
       })
+      setRoomNumber(roomNum)
       if (location.hash.indexOf('/meeting') === -1) {
         agora.init()
       }
@@ -32,43 +30,35 @@ const JoinSetting = forwardRef((_props: any, ref: any) => {
   }))
   const navigate = useNavigate();
   const [user, setUser] = useState<any>({});
+  const [roomNumber, setRoomNumber] = useState('')
   const [joinRoomSettingModal, setJoinRoomSettingModal] = useState(false)
-  const [joinRoomSettingForm, setJoinRoomSettingForm] = useState({
+  const [joinRoomSettingForm, setJoinRoomSettingForm] = useState(
-    list: [
+    [{
-      {
+      title: '静音',
-        title: '静音',
+      icon: ImageUrl.icon22,
-        icon: ImageUrl.icon22,
+      iconActive: ImageUrl.icon22Active,
-        iconActive: ImageUrl.icon22Active,
+      active: false,
-        active: false,
+    },
-      },
+    {
-      {
+      title: '关闭视频',
-        title: '关闭视频',
+      icon: ImageUrl.icon23,
-        icon: ImageUrl.icon23,
+      iconActive: ImageUrl.icon23Active,
-        iconActive: ImageUrl.icon23Active,
+      active: false,
-        active: false,
+    },]
-      },
+  )
-    ],
-    roomNum: '',
-  })
   const getDeviceList = (): void => {
     time = setInterval(async () => {
-      const list = [...joinRoomSettingForm.list]
+      const list = [...joinRoomSettingForm]
       await agora.getAudioMediaList().then(res => {
         if (!res.ecordingList.length) {
           list[0].active = false
-          setJoinRoomSettingForm({
+          setJoinRoomSettingForm(list)
-            ...joinRoomSettingForm,
-            list
-          })
         }
       })
       await agora.getVideoDeviceManager().then(res => {
         if (!res.list.length) {
           list[1].active = false
-          setJoinRoomSettingForm({
+          setJoinRoomSettingForm(list)
-            ...joinRoomSettingForm,
-            list
-          })
         }
       })
     }, 1000)
@@ -112,29 +102,26 @@ const JoinSetting = forwardRef((_props: any, ref: any) => {
             <span>请输入会议号</span>
             <input
               type="text"
-              value={joinRoomSettingForm.roomNum}
+              value={roomNumber}
               maxLength={8}
               onChange={(e) => {
                 const regex = /^[0-9]*$/;
                 if (regex.test(e.target.value)) {
-                  setJoinRoomSettingForm({
+                  setRoomNumber(e.target.value);
-                    ...joinRoomSettingForm,
-                    roomNum: e.target.value
-                  })
                 }
               }}
             />
           </div>
           <div>
             <Avatar name={user.userName} />
-            {joinRoomSettingForm.list[1].active ? <div id='videoPreview'>
+            {joinRoomSettingForm[1].active ? <div id='videoPreview'>
 
             </div> : null}
           </div>
           <div>
             <div>
               {
-                joinRoomSettingForm.list.map((item, index) => {
+                joinRoomSettingForm.map((item, index) => {
                   return <div key={index} onClick={async () => {
                     let msg = '';
                     if (index === 0) {
@@ -154,12 +141,9 @@ const JoinSetting = forwardRef((_props: any, ref: any) => {
                       message.error('未检测到麦克风!')
                       return
                     }
-                    const list = [...joinRoomSettingForm.list]
+                    const list = [...joinRoomSettingForm]
                     list[index].active = !list[index].active
-                    setJoinRoomSettingForm({
+                    setJoinRoomSettingForm(list)
-                      ...joinRoomSettingForm,
-                      list
-                    })
                     if (index === 1) {
                       if (list[index].active) {
                         agora.startPreview('videoPreview', Number(user.account))
@@ -175,28 +159,28 @@ const JoinSetting = forwardRef((_props: any, ref: any) => {
             <div>
               <Button type="primary"
                 onClick={() => {
-                  if (!joinRoomSettingForm.roomNum) {
+                  if (!roomNumber) {
                     message.error('请输入会议号！')
                     return
                   }
-                  isGetCheckoutRoomNum(joinRoomSettingForm.roomNum, (bool: boolean) => {
+                  isGetCheckoutRoomNum(roomNumber, (bool: boolean) => {
                     if (bool) {
-                      getRoomRtcToken(joinRoomSettingForm.roomNum, (token: string) => {
+                      getRoomRtcToken(roomNumber, (token: string) => {
                         if (token) {
                           postRefresh(() => {
                             clearInterval(time)
                             setJoinRoomSettingModal(false)
-                            GetRoomInfo(joinRoomSettingForm.roomNum).then(async (res) => {
+                            GetRoomInfo(roomNumber).then(async (res) => {
                               if (res.code === 200) {
                                 await agora.release()
                                 navigate(`/meeting`, {
                                   state: {
-                                    channelId: joinRoomSettingForm.roomNum,
+                                    channelId: roomNumber,
                                     token,
                                     roomId: res.data.id,
                                     roomName: res.data.roomName,
-                                    enableMicr: joinRoomSettingForm.list[0].active,
+                                    enableMicr: joinRoomSettingForm[0].active,
-                                    enableCamera: joinRoomSettingForm.list[1].active,
+                                    enableCamera: joinRoomSettingForm[1].active,
                                   }
                                 })
                               }

src/page/Meeting/index.tsx

@@ -710,6 +710,18 @@ const Meeting: React.FC = () => {
         enableMicr
       })
     } else {
+      let msg = '';
+      if (uid === user.uid) {
+        await agora.getAudioMediaList().then(res => {
+          if (!res.ecordingList.length) {
+            msg = '未检测到麦克风!'
+          }
+        })
+      }
+      if (msg) {
+        message.error(msg)
+        return
+      }
       await PostOpenMicr({
         roomNum: state.channelId,
         uid,
@@ -719,6 +731,18 @@ const Meeting: React.FC = () => {
   }
   // 开关视频
   const postOpenCamera = async (enableCamera: boolean, uid: string): Promise<void> => {
+    let msg = '';
+    if (uid === user.uid) {
+      await agora.getVideoDeviceManager().then(res => {
+        if (!res.list.length) {
+          msg = '未检测到摄像头!'
+        }
+      })
+    }
+    if (msg) {
+      message.error(msg)
+      return
+    }
     if (enableCamera) {
       await agora.startCameraCapture()
     } else {