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

优化

This commit is contained in:
yj 2024-08-06 17:18:39 +08:00
parent cad0931c87
commit 9be4e89302
2 changed files with 40 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -161,10 +161,10 @@ const Meeting: React.FC = () => {
agora.setCameraCapture()
agora.setJoinChannel({
channelId: state.channelId,
userid: userInfo.account,
uid: userInfo.uid,
token: state.token,
})
setCurrentVideoId(userInfo.account)
setCurrentVideoId(userInfo.uid)
storage.setItem('noViewChatList', 0)
window.addEventListener('customStorageChange', handleCustomStorageChange);
window.addEventListener('online', handleNetworkChange);
@ -183,7 +183,7 @@ const Meeting: React.FC = () => {
useEffect(() => {
roomUserList.forEach((item: any) => {
if (item.account === user.account) {
if (item.uid === user.uid) {
const footerListTemplate = [...footerList]
footerListTemplate[0][0].title = item.enableMicr ? '关闭声音' : '开启声音'
footerListTemplate[0][0].active = !item.enableMicr
@ -253,18 +253,18 @@ const Meeting: React.FC = () => {
}, [currentVideoId])
useEffect(() => {
const userItem = allUserList.find((item: any) => item.account === currentLookUserAccount)
const userItem = allUserList.find((item: any) => item.uid === currentLookUserAccount)
if (userItem) {
if (userItem.account === user.account) {
if (userItem.uid === user.uid) {
// agora.setupLocalVideo({
// account: Number(userItem.account),
// account: Number(userItem.uid),
// view: document.getElementById(`look-video`) as HTMLElement,
// channelId: state.channelId,
// sourceType: VideoSourceType.VideoSourceCameraPrimary,
// })
} else {
// agora.setupRemoteVideoJoin({
// account: Number(userItem.account),
// account: Number(userItem.uid),
// view: document.getElementById(`look-video`) as HTMLElement,
// channelId: state.channelId,
// sourceType: VideoSourceType.VideoSourceCameraPrimary,
@ -371,7 +371,7 @@ const Meeting: React.FC = () => {
break;
case '录制':
const setting = await JSON.parse(storage.getItem('setting') as string)
if (currentVideoId === user.account) {
if (currentVideoId === user.uid) {
message.error('请勿自己录制自己！')
} else {
try {
@ -454,12 +454,14 @@ const Meeting: React.FC = () => {
if (res[0].code === 200 && res[1].code === 200) {
setRoomUserList(res[0].data.map((item: any) => {
return {
...item,
isShow: true,
...item
uid: item.id,
}
}))
res[1].data.items.forEach((item: any) => {
const itemUser = res[0].data.find((row: any) => row.account === item.account)
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) {
@ -570,8 +572,8 @@ const Meeting: React.FC = () => {
return ''
}
// 设置单个视频样式
const setMeetingContentSwiperCardClass = (account: string, bool: boolean = false): string => {
if ((bool || currentVideoId === account) && (meetingMode === 'StandardMode' || meetingMode === 'SpeakerMode')) {
const setMeetingContentSwiperCardClass = (uid: string, bool: boolean = false): string => {
if ((bool || currentVideoId === uid) && (meetingMode === 'StandardMode' || meetingMode === 'SpeakerMode')) {
switch (meetingMode) {
case 'StandardMode':
return styles.meetingContentSwiperCardStandardMode
@ -601,7 +603,7 @@ const Meeting: React.FC = () => {
<div className={styles.meetingContentBody}>
<div className={`${styles.meetingContentBodyLeft} drag`}>
<div className={getMeetingContentBodyLeftModeClass()} >
{/* ${setMeetingContentSwiperCardClass(item.account)} */}
{/* ${setMeetingContentSwiperCardClass(item.uid)} */}
{allUserList.map((item: any, index: number) => {
return (
item.isRoom ?
@ -612,10 +614,10 @@ const Meeting: React.FC = () => {
if (footerList[1][3].active) {
return message.error('视频录制中请勿切换，或结束录制再切换！')
}
setCurrentVideoId(item.account)
setCurrentVideoId(item.uid)
}}
>
<div className={`${styles.meetingContentSwiperCardVdeio} ${currentVideoId === item.account ? styles.active : ''}`} id={`video-${item.account}`}>
<div className={`${styles.meetingContentSwiperCardVdeio} ${currentVideoId === item.uid ? styles.active : ''}`} id={`video-${item.uid}`}>
<div className={styles.meetingContentSwiperCardVdeioLoading}>
<Avatar name={item.userName} />
</div>
@ -626,19 +628,11 @@ const Meeting: React.FC = () => {
)
}
)}
{currentLookUserAccount ?
<div className={`${styles.meetingContentSwiperCard} ${setMeetingContentSwiperCardClass(currentLookUserAccount)}`}>
<div className={`${styles.meetingContentSwiperCardVdeio}`} id={`look-video`}>
</div>
</div>
:
<div className={`${styles.meetingContentSwiperCard} ${setMeetingContentSwiperCardClass(currentLookUserAccount, true)}`}>
<div className={`${styles.meetingContentSwiperCardVdeio}`} style={{ color: 'white', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
暂无视频
<div className={`${styles.meetingContentSwiperCardVdeio}`} id='look-video'>
<span style={{ color: 'white', position: 'absolute', transform: 'translate(-50%,-50%)', left: '50%', top: '50%' }}>暂无视频</span>
</div>
</div>
}
</div>
</div>
{
@ -702,7 +696,7 @@ const Meeting: React.FC = () => {
postOpenCamera(!item.enableCamera, item.id)
}} title={item.enableCamera ? '关闭视频' : '打开视频'} />
</div>
{item.account !== user.account && user.roleId === '1' ? <div className='drag'>
{item.uid !== user.uid && user.roleId === '1' ? <div className='drag'>
{!item.isManager ? <Button
type="primary"
className='m-ant-btn'
@ -898,7 +892,7 @@ const meetingContentUser = (item: any) => {
const meetingContentError = (currentVideoId: any, item: any) => {
return (
<>
<div className={`${styles.meetingContentError} ${currentVideoId === item.account ? styles.active : ''}`}>
<div className={`${styles.meetingContentError} ${currentVideoId === item.uid ? styles.active : ''}`}>
<Avatar name={item.userName} />
</div>
</>

33
src/utils/package/agora.ts
View File

@ -16,7 +16,7 @@ const option: any = {
appId: 'dcfc466a6ecb4a1f972630065dfb1e75',
token: '',
channelId: '',
userid: '',
uid: ''
}
let iMediaRecorder: any = '';
let rtcEngine: any = '';
@ -80,7 +80,7 @@ const agora = {
await rtcEngine.setupLocalVideo({
renderMode: RenderModeType.RenderModeFit,
sourceType: item.sourceType,
uid: item.account,
uid: item.uid,
view: item.view,
setupMode: VideoViewSetupMode.VideoViewSetupAdd,
});
@ -91,7 +91,7 @@ const agora = {
{
renderMode: RenderModeType.RenderModeFit,
sourceType: VideoSourceType.VideoSourceRemote,
uid: item.account,
uid: item.uid,
view: item.view,
setupMode: VideoViewSetupMode.VideoViewSetupAdd,
},
@ -104,7 +104,7 @@ const agora = {
{
renderMode: RenderModeType.RenderModeFit,
sourceType: VideoSourceType.VideoSourceRemote,
uid: item.account,
uid: item.uid,
view: item.view,
setupMode: VideoViewSetupMode.VideoViewSetupRemove,
},
@ -126,7 +126,7 @@ const agora = {
},
// 加入频道
joinChannel: () => {
rtcEngine.joinChannel(option.token, option.channelId, option.userid, {
rtcEngine.joinChannel(option.token, option.channelId, option.uid, {
autoSubscribeAudio: true,
autoSubscribeVideo: true,
publishMicrophoneTrack: true,
@ -152,8 +152,8 @@ const agora = {
agora.stopScreenCapture()
// rtcEngine.destroyRendererByConfig(option.sourceType, option.channelId, option.account)
agora.setupLocalVideo({
account: Number(option.userid),
view: document.getElementById(`video-${option.userid}`),
account: Number(option.uid),
view: document.getElementById(`video-${option.uid}`),
channelId: option.channelId,
sourceType: VideoSourceType.VideoSourceCameraPrimary,
})
@ -163,7 +163,7 @@ const agora = {
setJoinChannel: async (data: any) => {
option.token = data.token;
option.channelId = data.channelId;
option.userid = Number(data.userid);
option.uid = Number(data.uid);
agora.joinChannel()
},
// 桌面捕获音频和视频的媒体源的信息
@ -174,16 +174,10 @@ const agora = {
setDesktopCapturerVideo: async (targetSource: any) => {
// await rtcEngine.stopCameraCapture(option.sourceType)
// rtcEngine.destroyRendererByConfig(option.sourceType, option.channelId, option.account)
await agora.setupLocalVideo({
account: Number(option.userid),
view: document.getElementById(`look-video`),
channelId: option.channelId,
sourceType: VideoSourceType.VideoSourceScreen,
})
agora.stopScreenCapture();
const user = JSON.parse(storage.getItem('user') as string)
rtcEngine.joinChannelEx(
option.token,
{ channelId: option.channelId, localUid: option.account },
{ channelId: option.channelId, localUid: Number(user.uid) },
{
autoSubscribeAudio: false,
autoSubscribeVideo: false,
@ -193,6 +187,13 @@ const agora = {
publishScreenTrack: true,
}
);
await agora.setupLocalVideo({
account: Number(user.uid),
view: document.getElementById(`look-video`),
channelId: option.channelId,
sourceType: VideoSourceType.VideoSourceScreen,
})
agora.stopScreenCapture();
if (
targetSource.type ===
ScreenCaptureSourceType.ScreencapturesourcetypeScreen