This commit is contained in:
yj 2024-08-09 17:27:02 +08:00
parent e688824be0
commit adadd234cf
4 changed files with 157 additions and 89 deletions

View File

@ -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()
}

View File

@ -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) =>
@ -103,4 +101,14 @@ export const PostShowUser = (roomNum: string, uid: string) =>
request({
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'
})

View File

@ -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;
for (const itemUserKey in itemUser) {
for (const key in item) {
if (itemUserKey === key) {
item[key] = itemUser[itemUserKey];
}
}
}
} else {
item.isRoom = false;
const itemUser = res[0].data.find((row: any) => row.uid === item.id)
item.isRoom = itemUser ? true : false;
for (const itemUserKey in itemUser) {
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,12 +690,18 @@ const Meeting: React.FC = () => {
}
// 开关麦克风
const postOpenMicr = async (enableMicr: boolean, uid: string, isAll?: boolean): Promise<void> => {
await PostOpenMicr({
roomNum: state.channelId,
uid,
enableMicr,
isAll,
})
if (isAll) {
await PostMuteAll({
roomNum: state.channelId,
enableMicr
})
} else {
await PostOpenMicr({
roomNum: state.channelId,
uid,
enableMicr
})
}
}
// 开关视频
const postOpenCamera = async (enableCamera: boolean, uid: string): Promise<void> => {
@ -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,

View File

@ -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;