Merge pull request 'yangjie' (#48) from yangjie into master

Reviewed-on: #48

main.js

@@ -95,6 +95,7 @@ function createWindow() {
 }
 const additionalData = { myKey: 'myValue' }
 app.on('ready', () => {
+    // const gotTheLock = true
     const gotTheLock = app.requestSingleInstanceLock(additionalData)
     if (gotTheLock) {
         app.getPath('crashDumps')
@@ -159,6 +160,10 @@ app.on('ready', () => {
                 startNumber++
             }
         });
+        // 更新
+        ipcMain.handle('updateHandle', () => {
+            updateHandle()
+        });
         // socket
         ipcMain.handle('startSignalr', (event, user) => {
             startSignalr(user)
@@ -185,6 +190,7 @@ app.on('ready', () => {
                 connection.off('ModifyNickName');
                 connection.off('JoinChannelCallback');
                 connection.off('ExitSharedScreen');
+                connection.off('SetSpeaker');
             }
         });
         ipcMain.handle('onStop', (event) => {
@@ -226,6 +232,10 @@ app.on('ready', () => {
                     // 退出房间
                     await connection.invoke(str, data.roomNum)
                     break;
+                case 'SetSpeakerCallback':
+                    // 发言人设置成功
+                    await connection.invoke(str, data)
+                    break;
             }
         });
         ipcMain.handle('onOtherSignalr', (event) => {
@@ -394,6 +404,13 @@ app.on('ready', () => {
                         key: 'ExitSharedScreen'
                     })
                 });
+                // 设置发言人
+                connection.on("SetSpeaker", (RoomManagerInputDTO) => {
+                    mainWindow.webContents.send('onSignalr', {
+                        key: 'SetSpeaker',
+                        RoomManagerInputDTO
+                    })
+                });
             }
         });
         // 放大缩小退出窗口
@@ -717,9 +734,7 @@ function updateHandle() {
     })
     autoUpdater.on('update-available', function (info) {
         let messageStr = JSON.stringify({ type: '0' })
-        setTimeout(() => {
+        sendUpdateMessage(messageStr)
-            sendUpdateMessage(messageStr)
-        }, 5000)
     })
     autoUpdater.on('update-not-available', function (info) {
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "WGShare.Metting",
   "private": true,
-  "version": "0.6.5",
+  "version": "0.7.1",
   "main": "main.js",
   "authors": "yj",
   "description": "智汇享",

preload.js

@@ -91,6 +91,10 @@ window.electron = {
     setEnv: (str) => {
         ipcRenderer.invoke('setEnv', str)
     },
+    // 更新
+    updateHandle: () => {
+        ipcRenderer.invoke('updateHandle')
+    },
     // 通知下载最新的包
     onDownload: (type) => {
         ipcRenderer.invoke('updateDownload', type)

src/App.tsx

@@ -260,6 +260,12 @@ const App: React.FC = () => {
                 storage.removeItem('user')
                 navigate('/login')
             }
+        } else if (e.key === 'reconnect') {
+            if (e.value == true) {
+                if (location.hash.indexOf('/meeting') === -1) {
+                    window.electron.updateHandle()
+                }
+            }
         }
     };
     return (

src/api/Meeting/index.ts

@@ -71,14 +71,20 @@ export const PostRoomManager = (data: any) =>
   request({
     url: `/room/manager`,
     method: 'post',
-    data
+    data: {
+      ...data,
+      SettingUserId: ''
+    }
   })
 
 export const DeleteRoomManager = (data: any) =>
   request({
     url: `/room/manager`,
     method: 'delete',
-    data
+    data: {
+      ...data,
+      SettingUserId: ''
+    }
   })
 
 export const GetRoomKickout = (roomNum: string, kickUid: string) =>

src/components/Avatar/index.tsx

@@ -1,5 +1,5 @@
 import styles from '@/components/Avatar/index.module.scss'
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { memo, useImperativeHandle, forwardRef } from "react";
 const Avatar = forwardRef((props: any, ref: any) => {
   useImperativeHandle(ref, () => ({
     getData: () => {
@@ -15,4 +15,4 @@ const Avatar = forwardRef((props: any, ref: any) => {
   )
 })
 
-export default Avatar
+export default memo(Avatar)

src/components/EquipmentManagement/index.tsx

@@ -1,7 +1,7 @@
 import styles from '@/components/EquipmentManagement/index.module.scss'
 import { getKeyOpenChildWindow } from '@/utils/package/public';
 import { Button, Modal, Select, Slider, message } from 'antd';
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { useState, useImperativeHandle, forwardRef, memo } from "react";
 const EquipmentManagement = forwardRef((props: any, ref: any) => {
   useImperativeHandle(ref, () => ({
     changeModal: async (uid: string, userName: string) => {
@@ -116,4 +116,4 @@ const EquipmentManagement = forwardRef((props: any, ref: any) => {
   )
 })
 
-export default EquipmentManagement
+export default memo(EquipmentManagement)

src/components/FeedBackModel/index.tsx

@@ -2,7 +2,7 @@ import { PostFeedback } from '@/api/Home/Index';
 import styles from '@/components/FeedBackModel/index.module.scss'
 import { Button, message, Modal, Rate } from 'antd';
 import TextArea from 'antd/es/input/TextArea';
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { useState, useImperativeHandle, forwardRef, memo } from "react";
 const FeedBackModel = forwardRef((_props: any, ref: any) => {
   useImperativeHandle(ref, () => ({
     changeModal: () => {
@@ -135,4 +135,4 @@ const FeedBackModel = forwardRef((_props: any, ref: any) => {
   )
 })
 
-export default FeedBackModel
+export default memo(FeedBackModel)

src/components/InvitingPersonnelModal/index.tsx

@@ -1,6 +1,6 @@
 import styles from '@/components/InvitingPersonnelModal/index.module.scss'
 import { Button, Checkbox, Input, Modal, Pagination, Radio, message } from 'antd';
-import { useState, useImperativeHandle, forwardRef, useEffect } from "react";
+import { useState, useImperativeHandle, forwardRef, useEffect, memo } from "react";
 import { SearchOutlined } from '@ant-design/icons';
 import { GetUserList } from '@/api/Home/User';
 import { useLocation } from 'react-router-dom';
@@ -197,4 +197,4 @@ const InvitingPersonnelModal = forwardRef((props: any, ref: any) => {
 })
 
 
-export default InvitingPersonnelModal
+export default memo(InvitingPersonnelModal)

src/components/JoinMeetingModal/index.tsx

@@ -1,7 +1,7 @@
 import styles from '@/components/JoinMeetingModal/index.module.scss'
 import ImageUrl from '@/utils/package/imageUrl';
 import { Modal, message } from 'antd';
-import { useState, useImperativeHandle, forwardRef, useRef } from "react";
+import { useState, useImperativeHandle, forwardRef, useRef, memo } from "react";
 import Avatar from '@/components/Avatar';
 import JoinSetting from '../JoinSetting';
 const JoinMeetingModal = forwardRef((props: any, ref: any) => {
@@ -55,4 +55,4 @@ const JoinMeetingModal = forwardRef((props: any, ref: any) => {
   )
 })
 
-export default JoinMeetingModal
+export default memo(JoinMeetingModal)

src/components/JoinSetting/index.tsx

@@ -3,7 +3,7 @@ import { storage } from '@/utils';
 import ImageUrl from '@/utils/package/imageUrl';
 import { GetCheckoutRoomNum, GetRoomRtcToken, GetRoomInfo } from '@/api/Home/Index';
 import { Button, Modal, message } from 'antd';
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { useState, useImperativeHandle, forwardRef, memo } from "react";
 import { PostRefresh } from '@/api/Login';
 import Avatar from '@/components/Avatar';
 import { useNavigate } from 'react-router-dom';
@@ -236,4 +236,4 @@ const JoinSetting = forwardRef((_props: any, ref: any) => {
   )
 })
 
-export default JoinSetting
+export default memo(JoinSetting)

src/components/MeetingDisconnected/index.tsx

@@ -1,6 +1,6 @@
 import styles from '@/components/MeetingDisconnected/index.module.scss'
 import { InfoCircleOutlined } from '@ant-design/icons';
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { useState, useImperativeHandle, forwardRef, memo } from "react";
 const MeetingDisconnected = forwardRef((props: any, ref: any) => {
   useImperativeHandle(ref, () => ({
     changeModal: (bool: boolean) => {
@@ -17,4 +17,4 @@ const MeetingDisconnected = forwardRef((props: any, ref: any) => {
   )
 })
 
-export default MeetingDisconnected
+export default memo(MeetingDisconnected)

src/components/Operation/index.tsx

@@ -1,6 +1,6 @@
 import styles from '@/components/Operation/index.module.scss'
 import ImageUrl from '@/utils/package/imageUrl';
-import { useEffect, useState } from "react";
+import { useEffect, useState, memo } from "react";
 type OperationKeyType = 'minimize' | 'quit' | 'maximize' | 'unmaximize' | 'hide' | 'show';
 type OperationType = {
   icon: string;
@@ -100,4 +100,4 @@ const Operation: React.FC = () => {
     </>
   )
 }
-export default Operation
+export default memo(Operation)

src/components/QuitTips/index.tsx

@@ -2,7 +2,7 @@ import styles from '@/components/QuitTips/index.module.scss'
 import { storage } from '@/utils';
 import { InfoCircleOutlined } from '@ant-design/icons';
 import { Button, Checkbox, Modal, Radio } from 'antd';
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { useState, useImperativeHandle, forwardRef, memo } from "react";
 type OperationKeyType = 'minimize' | 'quit' | 'maximize' | 'unmaximize' | 'hide' | 'show';
 const QuitTips = forwardRef((props: any, ref: any) => {
   useImperativeHandle(ref, () => ({
@@ -66,4 +66,4 @@ const QuitTips = forwardRef((props: any, ref: any) => {
   )
 })
 
-export default QuitTips
+export default memo(QuitTips)

src/components/SharedFilesModel/index.tsx

@@ -8,7 +8,7 @@ import {
     VerticalAlignBottomOutlined
 } from '@ant-design/icons';
 import { Button, Input, message, Modal, Pagination, Popconfirm, Progress, Table } from 'antd';
-import { forwardRef, useEffect, useImperativeHandle, useState, useRef } from "react";
+import { forwardRef, useEffect, useImperativeHandle, useState, useRef, memo } from "react";
 import { DeleteRoomFile, GetRoomFile, GetRoomFileDwUrl, GetRoomUpFileurl, GetRoomUserItem, PostRoomFile } from '@/api/Meeting';
 import axios from 'axios';
 import { useLocation } from 'react-router-dom';
@@ -393,4 +393,4 @@ const SharedFilesModel = forwardRef((props: any, ref: any) => {
     )
 })
 
-export default SharedFilesModel
+export default memo(SharedFilesModel)

src/components/SingIn/index.tsx

@@ -2,7 +2,7 @@ import { GetRoomSingnIn, PostRoomSingnIn } from '@/api/Meeting';
 import styles from '@/components/SingIn/index.module.scss'
 import { storage } from '@/utils';
 import { Button, message, Modal } from 'antd';
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { useState, useImperativeHandle, forwardRef, memo } from "react";
 const SingIn = forwardRef((props: any, ref: any) => {
   useImperativeHandle(ref, () => ({
     changeModal: () => {
@@ -85,4 +85,4 @@ const SingIn = forwardRef((props: any, ref: any) => {
   )
 })
 
-export default SingIn
+export default memo(SingIn)

src/components/SpeakerModeModal/index.tsx

@@ -1,6 +1,6 @@
 import styles from '@/components/SpeakerModeModal/index.module.scss'
 import { Checkbox, Modal } from 'antd';
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { useState, useImperativeHandle, forwardRef, memo } from "react";
 import { storage } from '@/utils';
 import { useLocation } from 'react-router-dom';
 import { GetSyncView } from '@/api/Meeting';
@@ -147,4 +147,4 @@ const FourScreenMode: React.FC<Props> = ({ onClick, meetingMode }) => {
   )
 }
 
-export default SpeakerModeModal
+export default memo(SpeakerModeModal)

src/components/StupWizard/index.tsx

@@ -1,7 +1,7 @@
 import styles from '@/components/StupWizard/index.module.scss'
 import ImageUrl from '@/utils/package/imageUrl';
 import { Button, Checkbox, Empty, Input, message, Modal, Popover, Radio, Select, Slider, Space } from 'antd';
-import { forwardRef, useEffect, useImperativeHandle, useState } from "react";
+import { forwardRef, useEffect, useImperativeHandle, useState, memo } from "react";
 import { agora } from '@/utils/package/agora'
 import { CloseOutlined, LoadingOutlined, QuestionCircleOutlined } from '@ant-design/icons';
 import { storage } from '@/utils';
@@ -969,4 +969,4 @@ const FileComponents = () => {
     )
 }
 
-export default StupWizard
+export default memo(StupWizard)

src/components/TldrawView/index.tsx

@@ -1,4 +1,4 @@
-import { useEffect } from "react";
+import { useEffect, memo } from "react";
 import '@/components/TldrawView/index.scss'
 import {
   Tldraw,
@@ -44,4 +44,4 @@ const TldrawView: React.FC = () => {
     </>
   )
 }
-export default TldrawView
+export default memo(TldrawView)

src/components/UpdateModal/index.tsx

@@ -2,7 +2,7 @@ import styles from '@/components/UpdateModal/index.module.scss'
 import ImageUrl from '@/utils/package/imageUrl';
 import { getUpdateUrl } from '@/utils/package/public';
 import { Button, Flex, Modal, Progress } from 'antd';
-import { forwardRef, useImperativeHandle, useState } from "react";
+import { forwardRef, useImperativeHandle, useState, memo } from "react";
 
 const UpdateModal = forwardRef((props: any, ref: any) => {
     useImperativeHandle(ref, () => ({
@@ -87,4 +87,4 @@ const UpdateModal = forwardRef((props: any, ref: any) => {
     )
 })
 
-export default UpdateModal
+export default memo(UpdateModal)

src/components/UserName/index.tsx

@@ -2,7 +2,7 @@ import { PutAlterUname } from '@/api/Meeting';
 import styles from '@/components/UserName/index.module.scss'
 import { storage } from '@/utils';
 import { Button, Input, message, Modal } from 'antd';
-import { useState, useImperativeHandle, forwardRef } from "react";
+import { useState, useImperativeHandle, forwardRef, memo } from "react";
 const UserName = forwardRef((props: any, ref: any) => {
   useImperativeHandle(ref, () => ({
     changeModal: (data: any) => {
@@ -71,4 +71,4 @@ const UserName = forwardRef((props: any, ref: any) => {
   )
 })
 
-export default UserName
+export default memo(UserName)

src/components/UserVideo/index.tsx

@@ -3,7 +3,7 @@ import styles from '@/components/UserVideo/index.module.scss'
 import { GetPolling } from '@/api/Meeting';
 import { agora } from '@/utils/package/agora';
 import { Button, Empty, Select, message } from 'antd';
-import { useEffect, useState } from "react";
+import { useEffect, useState, memo } from "react";
 import { useLocation } from 'react-router';
 import { VideoStreamType } from 'agora-electron-sdk';
 const { setInterval, clearInterval } = require('timers');
@@ -154,4 +154,4 @@ const UserVideo: React.FC = () => {
   )
 }
 
-export default UserVideo
+export default memo(UserVideo)

src/page/Meeting/ShareScreenWindow/index.tsx

@@ -153,10 +153,10 @@ const ShareScreenWindow: React.FC = () => {
     <>
       <div className={styles.shareScreenWindow} style={{ width: isExpand ? '100%' : '100%' }}>
         <div className={styles.shareScreenWindowTitle}>
-          <span>{changeCurrentSeconds(timeStr)} 共享中
+          <span>{changeCurrentSeconds(timeStr)} {!isExpand ? '共享中' : ''}
             {networkIcon(currentEffective)}
             <span style={{ color: 'white', marginLeft: '30px' }}>
-              <span style={{ marginRight: '10px' }}>网络质量：{networkQuality.level}</span>
+              {!isExpand ? <span style={{ marginRight: '10px' }}>网络质量：{networkQuality.level}</span> : ''}
               <span>延迟：{networkOther.lastmileDelay}ms</span>
             </span>
           </span>
@@ -223,7 +223,7 @@ const ShareScreenWindow: React.FC = () => {
         <div className={`${styles.shareScreenWindowExpand} drag`} onClick={() => {
           setIsExpand(!isExpand)
           window.electron.setChildWindow({
-            width: isExpand ? 440 : 440 / 2,
+            width: isExpand ? 440 : 440 / 1.6,
             key: 'shareScreenWindow',
           })
         }}>

src/page/Meeting/index.tsx

@@ -8,7 +8,7 @@ import { SearchOutlined, EllipsisOutlined, ExclamationCircleFilled, FullscreenEx
 import { useLocation, useNavigate } from 'react-router-dom';
 import { thumbImageBufferToBase64 } from '@/utils/package/base64'
 import { storage } from '@/utils';
-import { GetRoomUser, PostOpenMicr, PostOpenCamera, GetLeaveAll, PostRoomManager, DeleteRoomManager, GetRoomKickout, GetShowUser, PostShowUser, PostMuteAll, GetRoomUserItem, GetApplySpeak, PostSharedScreen } from '@/api/Meeting';
+import { GetRoomUser, PostOpenMicr, GetSharedScreen, PostOpenCamera, GetLeaveAll, PostRoomManager, DeleteRoomManager, GetRoomKickout, GetShowUser, PostShowUser, PostMuteAll, GetRoomUserItem, GetApplySpeak, PostSharedScreen } from '@/api/Meeting';
 import ImageUrl from '@/utils/package/imageUrl'
 import { agora } from '@/utils/package/agora'
 import dayjs from 'dayjs';
@@ -162,6 +162,7 @@ const Meeting: React.FC = () => {
   const [_speackUid, setSpeackUid] = useState<any>([])
   const [currentSpeakUser, setCurrentSpeakUser] = useState<any>([])
   const [chatList, setChatList] = useState<any>([])
+  const [applyUserList, setApplyUserList] = useState<any>([])
   const [isExpand, setIsExpand] = useState(false)
   const [currentVideoId, setCurrentVideoId] = useState('')
   const [currentVideoUid, setCurrentVideoUid] = useState('')
@@ -1022,6 +1023,10 @@ const Meeting: React.FC = () => {
             return res
           })
           break;
+        // 共享
+        case 'SetSpeaker':
+          window.electron.onInvoke('SetSpeakerCallback', item.RoomManagerInputDTO)
+          break;
       }
     })
     return () => {
@@ -1177,6 +1182,49 @@ const Meeting: React.FC = () => {
     return () => clearTimeout(timer);
   }, [isClickedMediaSteam]);
 
+  useEffect(() => {
+    let timer: NodeJS.Timeout | undefined;
+    if (timer) {
+      clearInterval(timer)
+      timer = undefined;
+    }
+    if (applyUserList.length) {
+      timer = setInterval(() => {
+        setRoomUserList((list: any) => {
+          let newApplyUserList = [...applyUserList]
+          newApplyUserList.forEach((item: any, index: number) => {
+            const user = list.find((i: any) => i.uid === item.uid)
+            if (user) {
+              if (user.isRoomManager) {
+                newApplyUserList.splice(index, 1)
+              } else {
+                item.status--
+                if (item.status <= 0) {
+                  message.error(`设置${user.userName}发言人失败！`)
+                  newApplyUserList.splice(index, 1)
+                }
+              }
+            } else {
+              newApplyUserList.splice(index, 1)
+            }
+          });
+          if (newApplyUserList.length === 0) {
+            clearInterval(timer)
+            timer = undefined;
+          }
+          setApplyUserList(newApplyUserList)
+          return list
+        })
+      }, 1000);
+    } else {
+      if (timer) {
+        clearInterval(timer)
+        timer = undefined;
+      }
+    }
+    return () => timer ? clearTimeout(timer) : null;
+  }, [applyUserList]);
+
   useEffect(() => {
     const elements = document.querySelectorAll('.intersectionObserver-view');
     if (elements.length && currentVideoId) {
@@ -1681,8 +1729,15 @@ const Meeting: React.FC = () => {
       case '共享屏幕':
         await getUserRoomInfo().then(async (res) => {
           if (res) {
-            getDesktopCapturerVideo()
+            GetSharedScreen(state.channelId).then(req => {
-            setIsSharedScreenModal(true)
+              if (req.code === 200) {
+                if (res.data) {
+                  setIsShare(res.data)
+                }
+                getDesktopCapturerVideo()
+                setIsSharedScreenModal(true)
+              }
+            })
           } else {
             message.error(msgTips)
           }
@@ -1977,6 +2032,13 @@ const Meeting: React.FC = () => {
         roomId: data.roomId,
         roomNum: data.roomNum,
         userId: data.userId
+      }).then(res => {
+        if (res.code === 200) {
+          setApplyUserList((newChatList: any) => [...newChatList, {
+            uid: data.userId,
+            status: 5
+          }])
+        }
       })
     }
   }
@@ -2584,7 +2646,7 @@ const Meeting: React.FC = () => {
               {isAdmin && currentLookUserAccount ? getSettingIcon() : null}
               <div className={getMeetingContentBodyLeftModeClass()} id='videoView' style={meetingMode === 'SpeakerMode' && isVideoFullScreen ? { width: '0' } : {}}>
                 {roomUserList.map((item: any, index: number) => {
-                  return (index <= 19 && item.isRoom && item.isAdmin ? <div
+                  return (item.isRoom && item.isAdmin ? <div
                     id={item.uid}
                     className={`${styles.meetingContentSwiperCard} intersectionObserver-view`}
                     key={index}
@@ -2707,7 +2769,7 @@ const Meeting: React.FC = () => {
                   </div> : null)
                 }
                 )}
-                {roomUserList.length > 6 ? <div>
+                {isAdmin > 6 ? <div>
                   {meetingMode === "StandardMode" ? <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: '20px', top: '66px' }} onClick={() => {
                     const container = document.getElementById('videoView') as HTMLElement;
                     container.scrollLeft -= 100

src/render.d.ts

@@ -25,6 +25,7 @@ export interface IElectronAPI {
     quitAndInstall: (callBack: Function) => void;
     isOpenWindows: (callBack: Function) => void;
     setEnv: (str: string) => any;
+    updateHandle: () => any;
     getVersion: () => Promise<string>;
     isVisible: () => Promise<string>;
     setRegistry: (uuid: string) => any;