From 7cae77f94645b043226681ab0358209bb3a9238a Mon Sep 17 00:00:00 2001 From: yj <1336058017@qq.com> Date: Mon, 21 Oct 2024 13:44:12 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- main.js | 1 + src/page/Meeting/ChatBigWindow/index.tsx | 20 ++-- src/page/Meeting/ChatSmallWindow/index.tsx | 33 +++--- .../Meeting/CurrentSpeakUserWindow/index.tsx | 22 +--- src/page/Meeting/ShareScreenWindow/index.tsx | 44 ++++---- src/page/Meeting/UserListWindow/index.tsx | 12 +- src/page/Meeting/index.tsx | 103 +++++++++++------- 7 files changed, 125 insertions(+), 110 deletions(-) diff --git a/main.js b/main.js index d921379..a81f6e2 100644 --- a/main.js +++ b/main.js @@ -367,6 +367,7 @@ app.on('ready', () => { ipcMain.handle('mainWindowCenter', () => { mainWindowCenter() }); + // 窗口通信 ipcMain.handle('windowHandleMessage', (event, data) => { if (childWindow[data.key]) { childWindow[data.key].webContents.send('windowHandleMessageCallBack', data) diff --git a/src/page/Meeting/ChatBigWindow/index.tsx b/src/page/Meeting/ChatBigWindow/index.tsx index 37ebcd3..c350841 100644 --- a/src/page/Meeting/ChatBigWindow/index.tsx +++ b/src/page/Meeting/ChatBigWindow/index.tsx @@ -29,22 +29,22 @@ const ChatBigWindow: React.FC = () => { useEffect(() => { setUser(userInfo) channel.onmessage = function (event) { - const { type, chatList, showDriverList } = event.data; + const { type, showDriverList } = event.data; switch (type) { - case 'chatList': - setChatLists(chatList) - setTimeout(() => { - const chatBigWindowView = document.getElementById('chatBigWindowView') as HTMLElement; - if (chatBigWindowView) { - chatBigWindowView.scrollTop = chatBigWindowView.scrollHeight; - } - }, 100) - break; case 'showDriverList': equipmentManagementRef.current.setData(showDriverList) break; } } + window.electron.windowHandleMessageCallBack((_e: any, data: any) => { + setChatLists(data.parmes.chatList) + setTimeout(() => { + const chatBigWindowView = document.getElementById('chatBigWindowView') as HTMLElement; + if (chatBigWindowView) { + chatBigWindowView.scrollTop = chatBigWindowView.scrollHeight; + } + }, 100) + }) channel.postMessage({ type: 'chatBigWindowSendChannelMsg', chatBigWindowSendChannelMsg: { diff --git a/src/page/Meeting/ChatSmallWindow/index.tsx b/src/page/Meeting/ChatSmallWindow/index.tsx index c228217..bcc2c50 100644 --- a/src/page/Meeting/ChatSmallWindow/index.tsx +++ b/src/page/Meeting/ChatSmallWindow/index.tsx @@ -8,25 +8,20 @@ const ChatSmallWindow: React.FC = () => { const [isExpand, setIsExpand] = useState(false) const channel = new BroadcastChannel('meeting_channel'); useEffect(() => { - channel.onmessage = function (event) { - const { type, chatListIten } = event.data; - switch (type) { - case 'chatListIten': - setChatLists((newChatList: any) => { - chatListIten.timer = setTimeout(() => { - removeItemByIndex(); - }, 3000); - return [chatListIten, ...newChatList] - }) - setTimeout(() => { - const chatSmallWindowView = document.getElementById('chatSmallWindowView') as HTMLElement; - if (chatSmallWindowView) { - chatSmallWindowView.scrollTop = chatSmallWindowView.scrollHeight; - } - }, 100) - break; - } - } + window.electron.windowHandleMessageCallBack((_e: any, data: any) => { + setChatLists((newChatList: any) => { + data.parmes.chatListIten.timer = setTimeout(() => { + removeItemByIndex(); + }, 3000); + return [data.parmes.chatListIten, ...newChatList] + }) + setTimeout(() => { + const chatSmallWindowView = document.getElementById('chatSmallWindowView') as HTMLElement; + if (chatSmallWindowView) { + chatSmallWindowView.scrollTop = chatSmallWindowView.scrollHeight; + } + }, 100) + }) return () => { channel.close(); } diff --git a/src/page/Meeting/CurrentSpeakUserWindow/index.tsx b/src/page/Meeting/CurrentSpeakUserWindow/index.tsx index f0647ba..e86c258 100644 --- a/src/page/Meeting/CurrentSpeakUserWindow/index.tsx +++ b/src/page/Meeting/CurrentSpeakUserWindow/index.tsx @@ -2,26 +2,16 @@ import styles from '@/page/Meeting/CurrentSpeakUserWindow/index.module.scss' import { useEffect, useState } from "react"; const CurrentSpeakUserWindow: React.FC = () => { const [inputValue, setInputValue] = useState('') - const channel = new BroadcastChannel('meeting_channel'); useEffect(() => { - channel.onmessage = function (event) { - const { type, currentSpeakUser } = event.data; - switch (type) { - case 'currentSpeakUser': - if (currentSpeakUser.length) { - setInputValue(currentSpeakUser.join(';')) - } else { - setInputValue('') - } - break; + window.electron.windowHandleMessageCallBack((_e: any, data: any) => { + if (data.parmes.currentSpeakUser.length) { + setInputValue(data.parmes.currentSpeakUser.join(';')) + } else { + setInputValue('') } - } - return () => { - channel.close(); - } + }) }, []); - return ( <>
diff --git a/src/page/Meeting/ShareScreenWindow/index.tsx b/src/page/Meeting/ShareScreenWindow/index.tsx index c9b0c01..1863674 100644 --- a/src/page/Meeting/ShareScreenWindow/index.tsx +++ b/src/page/Meeting/ShareScreenWindow/index.tsx @@ -56,8 +56,7 @@ const ShareScreenWindow: React.FC = () => { useEffect(() => { getRoomUser() channel.onmessage = function (event) { - let { type, time, roomUserList, footerList, currentSpeakUserMe } = event.data; - const footerListTemplate = [...footerLists]; + let { type, time } = event.data; switch (type) { case 'time': setTimeStr(time) @@ -65,33 +64,32 @@ const ShareScreenWindow: React.FC = () => { setTimeStr(time++) }, 1000) break; - case 'roomUserList': - setRoomUserLists(roomUserList) - break; - case 'footerList': - footerListTemplate[0].title = footerList[0][0].active ? '解除静音' : '静音'; - footerListTemplate[0].active = footerList[0][0].active; - footerListTemplate[1].title = footerList[0][1].active ? '开启视频' : '关闭视频'; - footerListTemplate[1].active = footerList[0][1].active; - footerListTemplate[4].title = footerList[1][3].active ? '录制中' : '录制'; - footerListTemplate[4].active = footerList[1][3].active; - setFooterLists(footerListTemplate) - break; - case 'currentSpeakUserMe': - let domMe = document.getElementById(`micr-item-${userInfo.uid}`) as HTMLDivElement; - if (domMe) { - domMe.style.height = `${currentSpeakUserMe}%` - } - break; } } channel.postMessage({ type: 'shareScreenWindowGetTime' }); window.electron.windowHandleMessageCallBack((_e: any, data: any) => { - let domMe = document.getElementById(`micr-item-${userInfo.uid}`) as HTMLDivElement; - if (domMe) { - domMe.style.height = `${data.parmes.currentSpeakUserMe}%` + switch (data.parmes.type) { + case 'currentSpeakUserMe': + let domMe = document.getElementById(`micr-item-${userInfo.uid}`) as HTMLDivElement; + if (domMe) { + domMe.style.height = `${data.parmes.currentSpeakUserMe}%` + } + break; + case 'footerList': + const footerListTemplate = [...footerLists]; + footerListTemplate[0].title = data.parmes.footerList[0][0].active ? '解除静音' : '静音'; + footerListTemplate[0].active = data.parmes.footerList[0][0].active; + footerListTemplate[1].title = data.parmes.footerList[0][1].active ? '开启视频' : '关闭视频'; + footerListTemplate[1].active = data.parmes.footerList[0][1].active; + footerListTemplate[4].title = data.parmes.footerList[1][3].active ? '录制中' : '录制'; + footerListTemplate[4].active = data.parmes.footerList[1][3].active; + setFooterLists(footerListTemplate) + break; + case 'roomUserList': + setRoomUserLists(data.parmes.roomUserList) + break; } }) return () => { diff --git a/src/page/Meeting/UserListWindow/index.tsx b/src/page/Meeting/UserListWindow/index.tsx index 7facfa6..1c75e2f 100644 --- a/src/page/Meeting/UserListWindow/index.tsx +++ b/src/page/Meeting/UserListWindow/index.tsx @@ -20,11 +20,8 @@ const UserListWindow: React.FC = () => { useEffect(() => { setUser(userInfo) channel.onmessage = function (event) { - const { type, roomUserList, showDriverList } = event.data; + const { type, showDriverList } = event.data; switch (type) { - case 'roomUserList': - setRoomUserList(roomUserList) - break; case 'showDriverList': equipmentManagementRef.current.setData(showDriverList) break; @@ -33,6 +30,13 @@ const UserListWindow: React.FC = () => { channel.postMessage({ type: 'userListWindowGetRoomUserList' }); + window.electron.windowHandleMessageCallBack((_e: any, data: any) => { + switch (data.parmes.type) { + case 'roomUserList': + setRoomUserList(data.parmes.roomUserList) + break; + } + }) return () => { channel.close(); } diff --git a/src/page/Meeting/index.tsx b/src/page/Meeting/index.tsx index 4dbe7c0..c743f61 100644 --- a/src/page/Meeting/index.tsx +++ b/src/page/Meeting/index.tsx @@ -263,10 +263,13 @@ const Meeting: React.FC = () => { break; case 'shareScreenWindowGetFooterLists': setFooterList((res: any) => { - channel.postMessage({ - type: 'footerList', - footerList: res, - }); + window.electron.windowHandleMessage({ + key: 'shareScreenWindow', + parmes: { + footerList: res, + type: 'footerList' + } + }) return res }) break; @@ -303,10 +306,13 @@ const Meeting: React.FC = () => { break; case 'userListWindowGetRoomUserList': setRoomUserList(((res: any) => { - channel.postMessage({ - type: 'roomUserList', - roomUserList: res, - }); + window.electron.windowHandleMessage({ + key: 'userListWindow', + parmes: { + roomUserList: res, + type: 'roomUserList' + } + }) return res })) break; @@ -351,9 +357,11 @@ const Meeting: React.FC = () => { sendMsg(chatBigWindowSendChannelMsg.msg) } else[ setChatList((res: any) => { - channel.postMessage({ - type: 'chatList', - chatList: res, + window.electron.windowHandleMessage({ + key: 'chatBigWindow', + parmes: { + chatList: res, + } }) return res }) @@ -379,7 +387,12 @@ const Meeting: React.FC = () => { usernames.push(user.userName); } }) - storage.setItem('currentSpeakUser', JSON.stringify(usernames)) + window.electron.windowHandleMessage({ + key: 'currentSpeakUserWindow', + parmes: { + currentSpeakUser: usernames, + } + }) return res }); @@ -469,10 +482,12 @@ const Meeting: React.FC = () => { useEffect(() => { if (chatList.length) { - channel.postMessage({ - type: 'chatList', - chatList, - }); + window.electron.windowHandleMessage({ + key: 'chatBigWindow', + parmes: { + chatList, + } + }) } }, [chatList]); @@ -526,10 +541,12 @@ const Meeting: React.FC = () => { setNoViewChatList(storageNoViewChatList) } setChatList((newChatList: any) => [...newChatList, item]) - channel.postMessage({ - type: 'chatListIten', - chatListIten: item, - }); + window.electron.windowHandleMessage({ + key: 'chatSmallWindow', + parmes: { + chatListIten: item, + } + }) setStatusList((res: any) => { if (!res.userChatList) { api.open({ @@ -876,14 +893,27 @@ const Meeting: React.FC = () => { observerObject.observe(element); }); } - channel.postMessage({ - type: 'roomUserList', - roomUserList, - }); - channel.postMessage({ - type: 'footerList', - footerList, - }); + window.electron.windowHandleMessage({ + key: 'shareScreenWindow', + parmes: { + footerList, + type: 'footerList' + } + }) + window.electron.windowHandleMessage({ + key: 'shareScreenWindow', + parmes: { + roomUserList, + type: 'roomUserList' + } + }) + window.electron.windowHandleMessage({ + key: 'userListWindow', + parmes: { + roomUserList, + type: 'roomUserList' + } + }) return () => { elements.forEach(element => { observer?.unobserve(element); @@ -964,6 +994,7 @@ const Meeting: React.FC = () => { key: 'shareScreenWindow', parmes: { currentSpeakUserMe: percentage, + type: 'currentSpeakUserMe' } }) } @@ -1644,12 +1675,6 @@ const Meeting: React.FC = () => { case 'meetingMode': setMeetingMode(e.value) break; - case 'currentSpeakUser': - channel.postMessage({ - type: 'currentSpeakUser', - currentSpeakUser: JSON.parse(e.value), - }); - break; case 'quitMeeting': if (e.value) { setQuitMeetingModal(true) @@ -1694,10 +1719,12 @@ const Meeting: React.FC = () => { timestamp: +new Date() } setChatList((newChatList: any) => [...newChatList, item]) - channel.postMessage({ - type: 'chatListIten', - chatListIten: item, - }); + window.electron.windowHandleMessage({ + key: 'chatSmallWindow', + parmes: { + chatListIten: item, + } + }) setTextMsg(''); chatScrollBotton() } else {