This commit is contained in:
parent
e688824be0
commit
adadd234cf
|
|
@ -9,13 +9,14 @@ import Meeting from '@/page/Meeting/index'
|
|||
import NotFound from '@/page/NotFound/index'
|
||||
import { storage } from '@/utils'
|
||||
import { message, Spin } from "antd";
|
||||
import { onInvitation, onInvoke, onReconnected, onStart, startSignalr } from "@/utils/package/signalr";
|
||||
import { onInvitation, onReconnected, onStart, startSignalr } from "@/utils/package/signalr";
|
||||
import JoinMeetingModal from "@/components/JoinMeetingModal";
|
||||
import UpdateModal from "@/components/UpdateModal";
|
||||
import * as CryptoJS from 'crypto-js';
|
||||
import { PostLogin } from "@/api/Login";
|
||||
import agora from "@/utils/package/agora";
|
||||
import QuitTips from "@/components/QuitTips";
|
||||
import { GetLeave } from "@/api/Meeting";
|
||||
const fs = require('fs').promises;
|
||||
const { exec } = require('child_process');
|
||||
const App: React.FC = () => {
|
||||
|
|
@ -132,8 +133,8 @@ const App: React.FC = () => {
|
|||
window.electron.quitAndInstall(async (_e: any) => {
|
||||
if (location.hash.indexOf('/meeting') === 1) {
|
||||
const data = JSON.parse(localStorage.stateInfo);
|
||||
await onInvoke('levelChannel', {
|
||||
roomNum: data.channelId
|
||||
await GetLeave({
|
||||
roomNum: data.channelId,
|
||||
})
|
||||
await agora.leaveChannel()
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,19 +40,19 @@ export const GetRoomUser = (roomNum: string) =>
|
|||
})
|
||||
|
||||
|
||||
export const PostOpenMicr = (data: any) => {
|
||||
let url = '';
|
||||
if (typeof data.isAll === 'boolean') {
|
||||
url = `/room/oper-micr?roomNum=${data.roomNum}&enableMicr=${data.enableMicr}&uid=${data.uid}&isAll=${data.isAll}`;
|
||||
} else {
|
||||
url = `/room/oper-micr?roomNum=${data.roomNum}&enableMicr=${data.enableMicr}&uid=${data.uid}`;
|
||||
}
|
||||
export const PostMuteAll = (data: any) => {
|
||||
return request({
|
||||
url,
|
||||
url: `/room/mute-all?roomNum=${data.roomNum}&enableMicr=${data.enableMicr}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
export const PostOpenMicr = (data: any) => {
|
||||
return request({
|
||||
url: `/room/oper-micr?roomNum=${data.roomNum}&enableMicr=${data.enableMicr}&uid=${data.uid}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
||||
export const PostOpenCamera = (data: any) =>
|
||||
request({
|
||||
|
|
@ -61,18 +61,16 @@ export const PostOpenCamera = (data: any) =>
|
|||
data
|
||||
})
|
||||
|
||||
export const PostRoomManager = (roomId: string, data: any) =>
|
||||
export const PostRoomManager = (roomId: string, roomNum: string) =>
|
||||
request({
|
||||
url: `/room/manager?roomId=${roomId}`,
|
||||
url: `/room/manager?roomId=${roomId}&roomNum=${roomNum}`,
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
|
||||
export const DeleteRoomManager = (roomId: string, data: any) =>
|
||||
export const DeleteRoomManager = (roomId: string, roomNum: string) =>
|
||||
request({
|
||||
url: `/room/manager?roomId=${roomId}`,
|
||||
url: `/room/manager?roomId=${roomId}&roomNum=${roomNum}`,
|
||||
method: 'delete',
|
||||
data
|
||||
})
|
||||
|
||||
export const GetRoomKickout = (roomNum: string, kickUid: string) =>
|
||||
|
|
@ -104,3 +102,13 @@ export const PostShowUser = (roomNum: string, uid: string) =>
|
|||
url: `/room/show-user?roomNum=${roomNum}&uid=${uid}`,
|
||||
method: 'post'
|
||||
})
|
||||
export const GetJoin = (data: any) =>
|
||||
request({
|
||||
url: `/room/join?roomNum=${data.roomNum}&enableMicr=${data.enableMicr}&enableCamera=${data.enableCamera}`,
|
||||
method: 'get'
|
||||
})
|
||||
export const GetLeave = (data: any) =>
|
||||
request({
|
||||
url: `/room/leave?roomNum=${data.roomNum}`,
|
||||
method: 'get'
|
||||
})
|
||||
|
|
@ -8,7 +8,7 @@ import { SearchOutlined } from '@ant-design/icons';
|
|||
import { useLocation, useNavigate } from 'react-router-dom';
|
||||
import { thumbImageBufferToBase64 } from '@/utils/package/base64'
|
||||
import { storage } from '@/utils';
|
||||
import { GetRoomUser, PostOpenMicr, PostOpenCamera, PostRoomManager, DeleteRoomManager, GetRoomKickout, GetShowUser, PostShowUser } from '@/api/Meeting';
|
||||
import { GetRoomUser, PostOpenMicr, PostOpenCamera, PostRoomManager, DeleteRoomManager, GetRoomKickout, GetShowUser, PostShowUser, GetJoin, GetLeave, PostMuteAll } from '@/api/Meeting';
|
||||
import ImageUrl from '@/utils/package/ImageUrl'
|
||||
import agora from '@/utils/package/agora'
|
||||
import { onInvoke, onSignalr, offSignalr, onStart } from '@/utils/package/signalr';
|
||||
|
|
@ -139,12 +139,7 @@ const Meeting: React.FC = () => {
|
|||
agora.registerEventHandler({
|
||||
onJoinChannelSuccess: async (info: any, _elapsed: any) => {
|
||||
if (String(info.localUid).length !== 9) {
|
||||
await onInvoke('joinChannel', {
|
||||
roomNum: info.channelId,
|
||||
enableMicr: true,
|
||||
enableCamera: true
|
||||
})
|
||||
await getRoomUser()
|
||||
await getJoin()
|
||||
setTimeout(async () => {
|
||||
await agora.setupLocalVideo({
|
||||
uid: Number(info.localUid),
|
||||
|
|
@ -160,7 +155,6 @@ const Meeting: React.FC = () => {
|
|||
if (String(remoteUid).length === 9) {
|
||||
setIsShare(remoteUid)
|
||||
} else {
|
||||
await getRoomUser()
|
||||
setTimeout(async () => {
|
||||
await agora.setupRemoteVideoJoin({
|
||||
uid: Number(remoteUid),
|
||||
|
|
@ -185,9 +179,6 @@ const Meeting: React.FC = () => {
|
|||
}
|
||||
return res
|
||||
})
|
||||
setTimeout(() => {
|
||||
getRoomUser()
|
||||
}, 1000);
|
||||
}
|
||||
})
|
||||
agora.startCameraCapture()
|
||||
|
|
@ -254,6 +245,7 @@ const Meeting: React.FC = () => {
|
|||
useEffect(() => {
|
||||
onSignalr(async (item: any) => {
|
||||
switch (item.key) {
|
||||
// 聊天
|
||||
case 'ReceiveMessage':
|
||||
let meetingUserChatDom = document.getElementById('meetingUserChat') as HTMLElement;
|
||||
if (!meetingUserChatDom) {
|
||||
|
|
@ -263,17 +255,7 @@ const Meeting: React.FC = () => {
|
|||
}
|
||||
setChatList((newChatList: any) => [...newChatList, item])
|
||||
break;
|
||||
case 'RefreshUserList':
|
||||
getRoomUser((list: any) => {
|
||||
setCurrentVideoId(res => {
|
||||
let currentVideoUserItem = list.find((item: any) => item.uid === res || item.screenShareId === res)
|
||||
if (currentVideoUserItem) {
|
||||
setCurrentLookUserAccount(currentVideoUserItem)
|
||||
}
|
||||
return res
|
||||
})
|
||||
})
|
||||
break;
|
||||
// 扩展操作
|
||||
case 'Operation':
|
||||
// 1:全员退出会议
|
||||
// 2:设置取消管理员
|
||||
|
|
@ -285,7 +267,7 @@ const Meeting: React.FC = () => {
|
|||
break;
|
||||
case 2:
|
||||
case 3:
|
||||
getRoomUser()
|
||||
|
||||
break;
|
||||
case 4:
|
||||
setIsShare((res: any) => {
|
||||
|
|
@ -299,15 +281,42 @@ const Meeting: React.FC = () => {
|
|||
break;
|
||||
}
|
||||
break;
|
||||
// 全员离开房间
|
||||
case 'ForceExitRoom':
|
||||
leaveChannel()
|
||||
break;
|
||||
// 更新视图模式
|
||||
case 'RefreshView':
|
||||
setMeetingMode(item.type)
|
||||
break;
|
||||
// 全员看他
|
||||
case 'ShowUser':
|
||||
getShowUser()
|
||||
break;
|
||||
// 用户加入频道回调
|
||||
case 'UserJoined':
|
||||
console.log(item, '用户加入频道回调');
|
||||
break;
|
||||
// 用户退出频道回调
|
||||
case 'UserLeave':
|
||||
console.log(item, '用户退出频道回调');
|
||||
break;
|
||||
// 所有用户开闭麦
|
||||
case 'OperAllMicr':
|
||||
console.log(item, '所有用户开闭麦');
|
||||
break;
|
||||
// 用户关闭开启麦克风
|
||||
case 'OperMicr':
|
||||
setAllUserListData(item.user)
|
||||
break;
|
||||
// 用户开启关闭摄像头
|
||||
case 'OperCamera':
|
||||
setAllUserListData(item.user)
|
||||
break;
|
||||
// 管理员用户信息刷新
|
||||
case 'ManagerRefresh':
|
||||
console.log(item, '管理员用户信息刷新');
|
||||
break;
|
||||
}
|
||||
})
|
||||
return () => {
|
||||
|
|
@ -348,18 +357,25 @@ const Meeting: React.FC = () => {
|
|||
};
|
||||
}, [recorder])
|
||||
|
||||
// 替换数据
|
||||
const setAllUserListData = (user: any): void => {
|
||||
setAllUserList((res: any) => {
|
||||
let item = res.find((row: any) => row.uid === user.uid)
|
||||
if (item) {
|
||||
for (const key in user) {
|
||||
item[key] = user[key];
|
||||
}
|
||||
}
|
||||
return res
|
||||
})
|
||||
}
|
||||
// 网络
|
||||
const handleNetworkChange = (): void => {
|
||||
if (navigator.onLine) {
|
||||
message.success('网络已恢复。')
|
||||
setTimeout(async () => {
|
||||
await onStart(async () => {
|
||||
await onInvoke('joinChannel', {
|
||||
roomNum: state.channelId,
|
||||
enableMicr: true,
|
||||
enableCamera: true
|
||||
})
|
||||
await getRoomUser()
|
||||
await getJoin()
|
||||
})
|
||||
}, 1000)
|
||||
} else {
|
||||
|
|
@ -567,9 +583,7 @@ const Meeting: React.FC = () => {
|
|||
const leaveChannel = async (bool?: boolean): Promise<void> => {
|
||||
await stopRecorderMedia()
|
||||
if (!bool) {
|
||||
await onInvoke('levelChannel', {
|
||||
roomNum: state.channelId
|
||||
})
|
||||
await getLeave()
|
||||
}
|
||||
agora.leaveChannel()
|
||||
navigate('/home/index')
|
||||
|
|
@ -627,23 +641,14 @@ const Meeting: React.FC = () => {
|
|||
if (res[0].code === 200 && res[1].code === 200) {
|
||||
res[0].data.forEach((item: any) => {
|
||||
item.isShow = true;
|
||||
item.uid = item.id;
|
||||
})
|
||||
setRoomUserList(res[0].data)
|
||||
res[1].data.items.forEach((item: any) => {
|
||||
item.uid = item.id;
|
||||
const itemUser = res[0].data.find((row: any) => row.id === item.id)
|
||||
if (itemUser) {
|
||||
item.isRoom = true;
|
||||
const itemUser = res[0].data.find((row: any) => row.uid === item.id)
|
||||
item.isRoom = itemUser ? true : false;
|
||||
for (const itemUserKey in itemUser) {
|
||||
for (const key in item) {
|
||||
if (itemUserKey === key) {
|
||||
item[key] = itemUser[itemUserKey];
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
item.isRoom = false;
|
||||
item[itemUserKey] = itemUser[itemUserKey];
|
||||
}
|
||||
});
|
||||
setAllUserList(res[1].data.items);
|
||||
|
|
@ -661,12 +666,7 @@ const Meeting: React.FC = () => {
|
|||
case 'reconnect':
|
||||
if (e.value == true) {
|
||||
storage.setItem('reconnect', false)
|
||||
await onInvoke('joinChannel', {
|
||||
roomNum: state.channelId,
|
||||
enableMicr: true,
|
||||
enableCamera: true
|
||||
})
|
||||
await getRoomUser()
|
||||
await getJoin()
|
||||
}
|
||||
break;
|
||||
}
|
||||
|
|
@ -690,13 +690,19 @@ const Meeting: React.FC = () => {
|
|||
}
|
||||
// 开关麦克风
|
||||
const postOpenMicr = async (enableMicr: boolean, uid: string, isAll?: boolean): Promise<void> => {
|
||||
if (isAll) {
|
||||
await PostMuteAll({
|
||||
roomNum: state.channelId,
|
||||
enableMicr
|
||||
})
|
||||
} else {
|
||||
await PostOpenMicr({
|
||||
roomNum: state.channelId,
|
||||
uid,
|
||||
enableMicr,
|
||||
isAll,
|
||||
enableMicr
|
||||
})
|
||||
}
|
||||
}
|
||||
// 开关视频
|
||||
const postOpenCamera = async (enableCamera: boolean, uid: string): Promise<void> => {
|
||||
await PostOpenCamera({
|
||||
|
|
@ -755,6 +761,21 @@ const Meeting: React.FC = () => {
|
|||
}
|
||||
return ''
|
||||
}
|
||||
// 加入房间
|
||||
const getJoin = async (): Promise<void> => {
|
||||
await GetJoin({
|
||||
roomNum: state.channelId,
|
||||
enableMicr: true,
|
||||
enableCamera: true
|
||||
})
|
||||
await getRoomUser()
|
||||
}
|
||||
// 离开房间
|
||||
const getLeave = async (): Promise<void> => {
|
||||
await GetLeave({
|
||||
roomNum: state.channelId,
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
|
|
@ -950,7 +971,7 @@ const Meeting: React.FC = () => {
|
|||
style={{ marginBottom: '10px', width: '80%' }}
|
||||
size={'small'}
|
||||
onClick={() => {
|
||||
PostRoomManager(state.roomId, [item.id]).then(res => {
|
||||
PostRoomManager(state.roomId, state.roomNum).then(res => {
|
||||
if (res.code === 200) {
|
||||
onInvoke('sendOper', {
|
||||
roomNum: state.channelId,
|
||||
|
|
@ -965,7 +986,7 @@ const Meeting: React.FC = () => {
|
|||
style={{ marginBottom: '10px', width: '80%' }}
|
||||
size={'small'}
|
||||
onClick={() => {
|
||||
DeleteRoomManager(state.roomId, [item.id]).then(res => {
|
||||
DeleteRoomManager(state.roomId, state.roomNum).then(res => {
|
||||
if (res.code === 200) {
|
||||
onInvoke('sendOper', {
|
||||
roomNum: state.channelId,
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@ export const onStart = async (callBack?: Function) => {
|
|||
}
|
||||
export const onReconnected = async (callBack: Function) => {
|
||||
if (connection) {
|
||||
connection.onreconnected(async (newConnectionId: any) => {
|
||||
connection.onreconnected(async (_newConnectionId: any) => {
|
||||
callBack()
|
||||
});
|
||||
}
|
||||
|
|
@ -54,11 +54,6 @@ export const onSignalr = (callBack: Function) => {
|
|||
uid, message, userName
|
||||
})
|
||||
});
|
||||
connection.on("RefreshUserList", () => {
|
||||
callBack({
|
||||
key: 'RefreshUserList'
|
||||
})
|
||||
});
|
||||
// 扩展操作
|
||||
connection.on("Operation", (type: number) => {
|
||||
callBack({
|
||||
|
|
@ -85,25 +80,68 @@ export const onSignalr = (callBack: Function) => {
|
|||
type
|
||||
})
|
||||
});
|
||||
// 用户加入频道回调
|
||||
connection.on("UserJoined", (user: any) => {
|
||||
callBack({
|
||||
key: 'UserJoined',
|
||||
user,
|
||||
})
|
||||
});
|
||||
// 用户退出频道回调
|
||||
connection.on("UserLeave", (uid: string,) => {
|
||||
callBack({
|
||||
key: 'UserLeave',
|
||||
uid,
|
||||
})
|
||||
});
|
||||
// 所有用户开闭麦
|
||||
connection.on("OperAllMicr", (enableMicr: boolean) => {
|
||||
callBack({
|
||||
key: 'OperAllMicr',
|
||||
enableMicr
|
||||
})
|
||||
});
|
||||
// 用户关闭开启麦克风
|
||||
connection.on("OperMicr", (user: any) => {
|
||||
callBack({
|
||||
key: 'OperMicr',
|
||||
user
|
||||
})
|
||||
});
|
||||
// 用户开启关闭摄像头
|
||||
connection.on("OperCamera", (user: any) => {
|
||||
callBack({
|
||||
key: 'OperCamera',
|
||||
user
|
||||
})
|
||||
});
|
||||
// 管理员用户信息刷新
|
||||
connection.on("ManagerRefresh", (user: any) => {
|
||||
callBack({
|
||||
key: 'ManagerRefresh',
|
||||
user
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
export const offSignalr = () => {
|
||||
if (connection) {
|
||||
connection.off('ReceiveMessage');
|
||||
connection.off('RefreshUserList');
|
||||
connection.off('Operation');
|
||||
connection.off('ForceExitRoom');
|
||||
connection.off('ShowUser');
|
||||
connection.off('RefreshView');
|
||||
|
||||
connection.off('UserJoined');
|
||||
connection.off('UserLeave');
|
||||
connection.off('OperAllMicr');
|
||||
connection.off('OperMicr');
|
||||
connection.off('OperCamera');
|
||||
connection.off('ManagerRefresh');
|
||||
}
|
||||
}
|
||||
export const onInvoke = async (str: string, data: any) => {
|
||||
switch (str) {
|
||||
case 'joinChannel':
|
||||
await connection.invoke(str, data.roomNum, data.enableMicr, data.enableCamera)
|
||||
break;
|
||||
case 'levelChannel':
|
||||
await connection.invoke(str, data.roomNum)
|
||||
break;
|
||||
case 'sendChannelMsg':
|
||||
await connection.invoke(str, data.roomNum, data.msg)
|
||||
break;
|
||||
|
|
|
|||
Loading…
Reference in New Issue