marking
/
WGShare.Client.Electron
18
0
Fork 0
Code Pull Requests 1 Actions Releases 4 Activity

yangjie #51

Open
yangqiang wants to merge 34 commits from yangjie into master
pull from: yangjie
merge into: marking:master
Conversation 0 Commits 34 Files Changed 31 +78 -50
1 changed files with 78 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 1f192ea288 - Show all commits

128
src/page/Meeting/index.tsx
View File

@ -184,6 +184,7 @@ const Meeting: React.FC = () => {
const [isClickLock, setIsClickLock] = useState(false) const [isClickLock, setIsClickLock] = useState(false)
const [open, setOpen] = useState(false) const [open, setOpen] = useState(false)
const [modeOpen, setModeOpen] = useState(false) const [modeOpen, setModeOpen] = useState(false)
const [showCaret, setShowCaret] = useState(false)
const [meetingMode, setMeetingMode] = useState('FreedomMode') const [meetingMode, setMeetingMode] = useState('FreedomMode')
const [userSearchValue, setUserSearchValue] = useState('') const [userSearchValue, setUserSearchValue] = useState('')
const [noViewChatList, setNoViewChatList] = useState(0) const [noViewChatList, setNoViewChatList] = useState(0)
@ -489,7 +490,7 @@ const Meeting: React.FC = () => {
title: '录制' title: '录制'
}, 1, 3) }, 1, 3)
} else { } else {
message.error('当前不在会议室！') handleMessage().error('当前不在会议室！')
} }
showSingIn() showSingIn()
}, },
@ -747,7 +748,7 @@ const Meeting: React.FC = () => {
try { try {
const temp = JSON.parse(item.contentString) const temp = JSON.parse(item.contentString)
if (temp.type === 'mode') { if (temp.type === 'mode') {
temp.msg ? message.success(`管理员已将会议室显示模式更新为${getMeetingContentBodyLeftModeText(temp.mode)}`) : null; temp.msg ? handleMessage().success(`管理员已将会议室显示模式更新为${getMeetingContentBodyLeftModeText(temp.mode)}`) : null;
setIsScreenCapture(isScreenCaptureValue => { setIsScreenCapture(isScreenCaptureValue => {
setMeetingMode(isScreenCaptureValue ? 'SpeakerMode' : temp.mode) setMeetingMode(isScreenCaptureValue ? 'SpeakerMode' : temp.mode)
return isScreenCaptureValue return isScreenCaptureValue
@ -759,12 +760,12 @@ const Meeting: React.FC = () => {
break; break;
// 全员离开房间 // 全员离开房间
case 'AllLeave': case 'AllLeave':
message.success('管理员已结束会议!') handleMessage().success('管理员已结束会议!')
leaveChannel(false) leaveChannel(false)
break; break;
// 移出会议 // 移出会议
case 'ForceExitRoom': case 'ForceExitRoom':
message.success('管理员已将你移出会议!') handleMessage().success('管理员已将你移出会议!')
leaveChannel() leaveChannel()
break; break;
// 更新视图模式 // 更新视图模式
@ -776,9 +777,9 @@ const Meeting: React.FC = () => {
if (item.operUid && item.operUserName) { if (item.operUid && item.operUserName) {
if (item.operUid !== userInfo.uid) { if (item.operUid !== userInfo.uid) {
if (item.uid === userInfo.uid) { if (item.uid === userInfo.uid) {
message.success(`${item.operUserName}设置全员看你`) handleMessage().success(`${item.operUserName}设置全员看你`)
} else { } else {
message.success(`${item.operUserName}设置全员看${item.uname}`) handleMessage().success(`${item.operUserName}设置全员看${item.uname}`)
} }
} }
} }
@ -800,7 +801,7 @@ const Meeting: React.FC = () => {
case 'OperMicr': case 'OperMicr':
if (item.operUid !== userInfo.uid) { if (item.operUid !== userInfo.uid) {
if (item.user.uid === userInfo.uid) { if (item.user.uid === userInfo.uid) {
message.success(item.user.enableMicr ? '管理员已取消你的静音' : '你已被管理员静音') handleMessage().success(item.user.enableMicr ? '管理员已取消你的静音' : '你已被管理员静音')
} }
} }
setAllUserListData('OperMicr', item) setAllUserListData('OperMicr', item)
@ -809,7 +810,7 @@ const Meeting: React.FC = () => {
case 'OperCamera': case 'OperCamera':
if (item.operUid !== userInfo.uid) { if (item.operUid !== userInfo.uid) {
if (item.user.uid === userInfo.uid) { if (item.user.uid === userInfo.uid) {
message.success(item.user.enableCamera ? '管理员已开启你的摄像头' : '管理员已关闭你摄像头') handleMessage().success(item.user.enableCamera ? '管理员已开启你的摄像头' : '管理员已关闭你摄像头')
} }
} }
setAllUserListData('OperCamera', item) setAllUserListData('OperCamera', item)
@ -828,20 +829,20 @@ const Meeting: React.FC = () => {
if (item.user.uid === item.uid) { if (item.user.uid === item.uid) {
if (item.user.uid === userInfo.uid) { if (item.user.uid === userInfo.uid) {
await agora.allLeaveChannelEx() await agora.allLeaveChannelEx()
message.success(`操作成功`) handleMessage().success(`操作成功`)
await agora.updateChannelMediaOptions(item.user.isRoomManager) await agora.updateChannelMediaOptions(item.user.isRoomManager)
await postOpenMicrApi(item.user.isRoomManager, userInfo.uid, false) await postOpenMicrApi(item.user.isRoomManager, userInfo.uid, false)
await postOpenCameraApi(false, userInfo.uid) // 不管身份如何改变都关闭摄像头 await postOpenCameraApi(false, userInfo.uid) // 不管身份如何改变都关闭摄像头
await stopScreenCapture() await stopScreenCapture()
} else { } else {
message.success(`${item.user.userName}已结束发言`) handleMessage().success(`${item.user.userName}已结束发言`)
} }
} else { } else {
if (item.user.uid === userInfo.uid) { if (item.user.uid === userInfo.uid) {
if (item.user.isRoomManager) { if (item.user.isRoomManager) {
await agora.allLeaveChannelEx() await agora.allLeaveChannelEx()
} }
message.success(`管理员${item.user.isRoomManager ? '设置' : '取消'}您为发言人`) handleMessage().success(`管理员${item.user.isRoomManager ? '设置' : '取消'}您为发言人`)
await agora.updateChannelMediaOptions(item.user.isRoomManager) await agora.updateChannelMediaOptions(item.user.isRoomManager)
setCurrentRequestSpeakType(res => { setCurrentRequestSpeakType(res => {
if (res === 'video') { if (res === 'video') {
@ -856,7 +857,7 @@ const Meeting: React.FC = () => {
}) })
await stopScreenCapture() await stopScreenCapture()
} else { } else {
message.success(`管理员${item.user.isRoomManager ? '设置' : '取消'}${item.user.userName}为发言人`) handleMessage().success(`管理员${item.user.isRoomManager ? '设置' : '取消'}${item.user.userName}为发言人`)
} }
} }
}) })
@ -1046,7 +1047,7 @@ const Meeting: React.FC = () => {
if (recorder) { if (recorder) {
recorder.start() recorder.start()
recorder.onstart = async () => { recorder.onstart = async () => {
message.success('开始录制') handleMessage().success('开始录制')
} }
recorder.onerror = async () => { recorder.onerror = async () => {
setRecorder('') setRecorder('')
@ -1055,7 +1056,7 @@ const Meeting: React.FC = () => {
changeStatusList({ changeStatusList({
title: '录制中' title: '录制中'
}, 1, 3) }, 1, 3)
message.error('录制失败，请重新录制！') handleMessage().error('录制失败，请重新录制！')
} }
recorder.onstop = async () => { recorder.onstop = async () => {
@ -1213,7 +1214,7 @@ const Meeting: React.FC = () => {
// GetApplySpeak(state.channelId).then(res => { // GetApplySpeak(state.channelId).then(res => {
// if (res.code === 200) { // if (res.code === 200) {
// setIsClicked(true); // setIsClicked(true);
// message.success('申请发言成功') // handleMessage().success('申请发言成功')
// } // }
// }) // })
// }, // },
@ -1257,7 +1258,7 @@ const Meeting: React.FC = () => {
} else { } else {
item.status-- item.status--
if (item.status <= 0) { if (item.status <= 0) {
message.error(`设置${user.userName}发言人失败！`) handleMessage().error(`设置${user.userName}发言人失败！`)
newApplyUserList.splice(index, 1) newApplyUserList.splice(index, 1)
} }
} }
@ -1483,7 +1484,7 @@ const Meeting: React.FC = () => {
return bool return bool
}) })
} else if (reason === 3 || reason === 4) { } else if (reason === 3 || reason === 4) {
message.error({ handleMessage().error({
content: <div>检查摄像头是否正常、未被占用，或尝试重新加入频道。<span style={{ color: '#606fc7', cursor: 'pointer' }} onClick={() => { content: <div>检查摄像头是否正常、未被占用，或尝试重新加入频道。<span style={{ color: '#606fc7', cursor: 'pointer' }} onClick={() => {
stupWizardRef.current.changeModal(1); stupWizardRef.current.changeModal(1);
}}>前往修改摄像头</span></div>, }}>前往修改摄像头</span></div>,
@ -1497,7 +1498,7 @@ const Meeting: React.FC = () => {
uid: userInfo.uid, uid: userInfo.uid,
enableCamera: false enableCamera: false
}) })
message.error({ handleMessage().error({
content: <div>检查摄像头是否正常、未被占用，或尝试重新加入频道。<span style={{ color: '#606fc7', cursor: 'pointer' }} onClick={() => { content: <div>检查摄像头是否正常、未被占用，或尝试重新加入频道。<span style={{ color: '#606fc7', cursor: 'pointer' }} onClick={() => {
stupWizardRef.current.changeModal(1); stupWizardRef.current.changeModal(1);
}}>前往修改摄像头</span></div>, }}>前往修改摄像头</span></div>,
@ -1840,7 +1841,7 @@ const Meeting: React.FC = () => {
GetApplySpeak(state.channelId).then(res => { GetApplySpeak(state.channelId).then(res => {
if (res.code === 200) { if (res.code === 200) {
setIsClicked(true); setIsClicked(true);
message.success('申请发言成功') handleMessage().success('申请发言成功')
} }
}) })
}, },
@ -1884,7 +1885,7 @@ const Meeting: React.FC = () => {
} }
}) })
} else { } else {
message.error(msgTips) handleMessage().error(msgTips)
} }
}) })
break; break;
@ -1894,7 +1895,7 @@ const Meeting: React.FC = () => {
if (res) { if (res) {
await stopScreenCapture() await stopScreenCapture()
} else { } else {
message.error(msgTips) handleMessage().error(msgTips)
} }
}) })
if (row.title === '停止共享') { if (row.title === '停止共享') {
@ -1913,7 +1914,7 @@ const Meeting: React.FC = () => {
setCurrentRequestSpeakType('audio') setCurrentRequestSpeakType('audio')
requestSpeak() requestSpeak()
} else { } else {
message.error('申请太频繁了，请稍后重试！'); handleMessage().error('申请太频繁了，请稍后重试！');
} }
} }
}) })
@ -1930,7 +1931,7 @@ const Meeting: React.FC = () => {
setCurrentRequestSpeakType('video') setCurrentRequestSpeakType('video')
requestSpeak() requestSpeak()
} else { } else {
message.error('申请太频繁了，请稍后重试！'); handleMessage().error('申请太频繁了，请稍后重试！');
} }
} }
}) })
@ -1945,7 +1946,7 @@ const Meeting: React.FC = () => {
if (res) { if (res) {
invitingPersonnelRef.current.changeInvitingPersonnelModal() invitingPersonnelRef.current.changeInvitingPersonnelModal()
} else { } else {
message.error(msgTips) handleMessage().error(msgTips)
} }
}) })
break; break;
@ -2001,25 +2002,25 @@ const Meeting: React.FC = () => {
setRecorder(mediaRecorder); setRecorder(mediaRecorder);
}); });
} else { } else {
message.error('录制太频繁了，请稍后重试！'); handleMessage().error('录制太频繁了，请稍后重试！');
} }
} catch (error: any) { } catch (error: any) {
if (error.code === 'ENOENT') { if (error.code === 'ENOENT') {
message.error({ handleMessage().error({
content: <div>文件夹不存在 <span style={{ color: '#606fc7', cursor: 'pointer' }} onClick={() => { content: <div>文件夹不存在 <span style={{ color: '#606fc7', cursor: 'pointer' }} onClick={() => {
stupWizardRef.current.changeModal(3); stupWizardRef.current.changeModal(3);
}}>前往设置</span></div> }}>前往设置</span></div>
}); });
return; return;
} else { } else {
message.error(error); handleMessage().error(error);
} }
} }
break; break;
case '录制中': case '录制中':
if (isClickedMediaSteam) { if (isClickedMediaSteam) {
message.error('录制时长不足3秒，请稍后重试！'); handleMessage().error('录制时长不足3秒，请稍后重试！');
} else { } else {
footerListTemplate[itemIndex][rowIndex].title = '录制' footerListTemplate[itemIndex][rowIndex].title = '录制'
footerListTemplate[itemIndex][rowIndex].active = false footerListTemplate[itemIndex][rowIndex].active = false
@ -2034,7 +2035,7 @@ const Meeting: React.FC = () => {
if (!isClicked) { if (!isClicked) {
requestSpeak() requestSpeak()
} else { } else {
message.error('申请太频繁了，请稍后重试！'); handleMessage().error('申请太频繁了，请稍后重试！');
} }
break; break;
case '会议监控': case '会议监控':
@ -2183,7 +2184,7 @@ const Meeting: React.FC = () => {
// 设置发言人 // 设置发言人
const postRoomManager = async (data: any): Promise<void> => { const postRoomManager = async (data: any): Promise<void> => {
if (isAdmin >= 20) { if (isAdmin >= 20) {
message.error('设置失败，已达最大发言人20个！') handleMessage().error('设置失败，已达最大发言人20个！')
} else { } else {
await PostRoomManager({ await PostRoomManager({
roomId: data.roomId, roomId: data.roomId,
@ -2282,7 +2283,7 @@ const Meeting: React.FC = () => {
break; break;
case 'reconnect': case 'reconnect':
if (e.value == true) { if (e.value == true) {
message.success('网络已连接。') handleMessage().success('网络已连接。')
meetingDisconnectedRef.current.changeModal(false) meetingDisconnectedRef.current.changeModal(false)
setIsAgoraDisconnected(false) setIsAgoraDisconnected(false)
async function setUserStatus(res: any) { async function setUserStatus(res: any) {
@ -2348,7 +2349,7 @@ const Meeting: React.FC = () => {
return res return res
}) })
} else { } else {
message.error('请输入内容！') handleMessage().error('请输入内容！')
} }
} }
// 聊天框滚动到底部 // 聊天框滚动到底部
@ -2378,19 +2379,20 @@ const Meeting: React.FC = () => {
}) })
} }
if (msg) { if (msg) {
message.error(msg) handleMessage().error(msg)
return return
} }
} }
if (enableMicr) { if (enableMicr) {
const enableMicrLenght = roomUserList.filter((item: any) => item.enableMicr).length const enableMicrLenght = roomUserList.filter((item: any) => item.enableMicr).length
if (enableMicrLenght >= 20) { if (enableMicrLenght >= 20) {
return message.error('房间内最多20个开启麦克风') handleMessage().error('房间内最多20个开启麦克风')
return
} }
} }
await postOpenMicrApi(enableMicr, uid, isAll, true) await postOpenMicrApi(enableMicr, uid, isAll, true)
} else { } else {
message.error(msgTips) handleMessage().error(msgTips)
} }
}) })
} }
@ -2418,7 +2420,7 @@ const Meeting: React.FC = () => {
// }) // })
} }
if (isMessage) { if (isMessage) {
// message.success('操作成功') // handleMessage().success('操作成功')
} }
} }
// 开关视频 // 开关视频
@ -2434,18 +2436,19 @@ const Meeting: React.FC = () => {
}) })
} }
if (msg) { if (msg) {
message.error(msg) handleMessage().error(msg)
return return
} }
if (enableCamera) { if (enableCamera) {
const enableCameraLenght = roomUserList.filter((item: any) => item.enableCamera).length const enableCameraLenght = roomUserList.filter((item: any) => item.enableCamera).length
if (enableCameraLenght >= 20) { if (enableCameraLenght >= 20) {
return message.error('房间内最多20个开启摄像头') handleMessage().error('房间内最多20个开启摄像头')
return
} }
} }
await postOpenCameraApi(enableCamera, uid, true) await postOpenCameraApi(enableCamera, uid, true)
} else { } else {
message.error(msgTips) handleMessage().error(msgTips)
} }
}) })
} }
@ -2471,7 +2474,7 @@ const Meeting: React.FC = () => {
// enableCamera // enableCamera
// }) // })
if (isMessage) { if (isMessage) {
// message.success('操作成功') // handleMessage().success('操作成功')
} }
} }
// 演讲者模式 // 演讲者模式
@ -2637,21 +2640,24 @@ const Meeting: React.FC = () => {
} else { } else {
await allUserLook(item.uid, item.userName) await allUserLook(item.uid, item.userName)
} }
message.success('操作成功') handleMessage().success('操作成功')
} }
// 设置模式 // 设置模式
const setSyncView = (mode: string) => { const setSyncView = (mode: string) => {
if (meetingMode === mode) { if (meetingMode === mode) {
setModeOpen(false) setModeOpen(false)
return message.error(`${getMeetingContentBodyLeftModeText(mode)}已开启，请勿重复操作!`) handleMessage().error(`${getMeetingContentBodyLeftModeText(mode)}已开启，请勿重复操作!`)
return
} }
if (isAdmin > 6 && mode === 'FreedomMode') { if (isAdmin > 6 && mode === 'FreedomMode') {
setModeOpen(false) setModeOpen(false)
return message.error('发言人数超过6人,无法使用宫格模式!') handleMessage().error('发言人数超过6人,无法使用宫格模式!')
return
} }
if (isShare && mode === 'FreedomMode') { if (isShare && mode === 'FreedomMode') {
setModeOpen(false) setModeOpen(false)
return message.error('共享中，无法切换模式') handleMessage().error('共享中，无法切换模式')
return
} }
window.electron.onInvoke('sendOper', { window.electron.onInvoke('sendOper', {
roomNum: state.channelId, roomNum: state.channelId,
@ -2683,12 +2689,30 @@ const Meeting: React.FC = () => {
cancelText: '取消', cancelText: '取消',
async onOk() { async onOk() {
await GetRoomKickout(channelId, uid) await GetRoomKickout(channelId, uid)
message.success('操作成功') handleMessage().success('操作成功')
}, },
onCancel() { onCancel() {
}, },
}); });
} }
const handleMessage = () => {
const displayMessage = (
fn: (msg: any) => void,
msg: any
) => {
setIsScreenCapture(bool => {
if (!bool) {
fn(msg);
}
return bool;
});
};
return {
error: (msg: any) => displayMessage(message.error, msg),
success: (msg: any) => displayMessage(message.success, msg)
};
};
return ( return (
<> <>
<div className={styles.meeting} onClick={() => { <div className={styles.meeting} onClick={() => {
@ -2703,7 +2727,7 @@ const Meeting: React.FC = () => {
<div style={{ bottom: '0px', borderRadius: '0 0 10px 10px' }} className={`${styles.meetingAbsoluteText}`} onClick={() => { <div style={{ bottom: '0px', borderRadius: '0 0 10px 10px' }} className={`${styles.meetingAbsoluteText}`} onClick={() => {
setIsExpand(!isExpand) setIsExpand(!isExpand)
window.electron.setChildWindow({ window.electron.setChildWindow({
height: !isExpand ? 160 * 4 : 200, height: !isExpand ? 160 * 4 + 20 : 200,
width: 250, width: 250,
key: 'main' key: 'main'
}) })
@ -2911,7 +2935,11 @@ const Meeting: React.FC = () => {
</div>} </div>}
<div className={styles.meetingContent}> <div className={styles.meetingContent}>
<div className={styles.meetingContentBody}> <div className={styles.meetingContentBody}>
<div className={`${styles.meetingContentBodyLeft} drag`} style={{ marginTop: isScreenCapture ? '20px' : '0' }}> <div className={`${styles.meetingContentBodyLeft} drag`} style={{
marginTop: isScreenCapture ? '20px' : '0',
paddingBottom: isScreenCapture ? '40px' : '0'
}} onMouseEnter={() => setShowCaret(true)}
onMouseLeave={() => setShowCaret(false)}>
{isAdmin && currentLookUserAccount && !isScreenCapture ? getSettingIcon() : null} {isAdmin && currentLookUserAccount && !isScreenCapture ? getSettingIcon() : null}
<div className={getMeetingContentBodyLeftModeClass(isAdmin)} id='videoView' style={meetingMode === 'SpeakerMode' && isVideoFullScreen ? { width: '0' } : {}}> <div className={getMeetingContentBodyLeftModeClass(isAdmin)} id='videoView' style={meetingMode === 'SpeakerMode' && isVideoFullScreen ? { width: '0' } : {}}>
{roomUserList.map((item: any, index: number) => { {roomUserList.map((item: any, index: number) => {
@ -3050,13 +3078,13 @@ const Meeting: React.FC = () => {
</div> </div>
</div> </div>
</div> */} </div> */}
{meetingMode !== "FreedomMode" && hasScrollbar() ? <div> {meetingMode !== "FreedomMode" && hasScrollbar() && showCaret ? <div>
{meetingMode === "StandardMode" ? <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: '20px', top: '66px' }} onClick={() => { {meetingMode === "StandardMode" ? <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: '20px', top: '66px' }} onClick={() => {
const container = document.getElementById('videoView') as HTMLElement; const container = document.getElementById('videoView') as HTMLElement;
container.scrollLeft -= 100 container.scrollLeft -= 100
}}> }}>
<CaretLeftOutlined /> <CaretLeftOutlined />
</div> : <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: isScreenCapture ? '120px' : '115px', top: '20px' }} onClick={() => { </div> : <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: '115px', top: '20px' }} onClick={() => {
const container = document.getElementById('videoView') as HTMLElement; const container = document.getElementById('videoView') as HTMLElement;
container.scrollTop -= 100 container.scrollTop -= 100
}}> }}>
@ -3067,7 +3095,7 @@ const Meeting: React.FC = () => {
container.scrollLeft += 100 container.scrollLeft += 100
}}> }}>
<CaretRightOutlined /> <CaretRightOutlined />
</div> : <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: isScreenCapture ? '120px' : '115px', bottom: '20px' }} onClick={() => { </div> : <div className={`${styles.meetingContentSwiperCaret}`} style={{ left: '115px', bottom: isScreenCapture ? '50px' : '20px' }} onClick={() => {
const container = document.getElementById('videoView') as HTMLElement; const container = document.getElementById('videoView') as HTMLElement;
container.scrollTop += 100 container.scrollTop += 100
}}> }}>