From f08ef19fbe4c02eba2609d1372e0752414ee42dd Mon Sep 17 00:00:00 2001 From: yj <1336058017@qq.com> Date: Wed, 16 Oct 2024 16:44:15 +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 | 13 +++++++- preload.js | 4 +++ .../Meeting/ChatSmallWindow/index.module.scss | 8 +++-- src/page/Meeting/ChatSmallWindow/index.tsx | 5 ++- .../Meeting/CurrentSpeakUserWindow/index.tsx | 2 +- .../ShareScreenWindow/index.module.scss | 18 ++++++++--- src/page/Meeting/ShareScreenWindow/index.tsx | 31 ++++++++++++------- src/page/Meeting/index.module.scss | 7 +++-- src/page/Meeting/index.tsx | 6 ++-- src/render.d.ts | 1 + 10 files changed, 67 insertions(+), 28 deletions(-) diff --git a/main.js b/main.js index 85fe4a4..832fda1 100644 --- a/main.js +++ b/main.js @@ -320,7 +320,7 @@ app.on('ready', () => { childWindow[config.key] = child child.once('ready-to-show', () => { childWindow[config.key].show() - childWindow[config.key].setAlwaysOnTop(true) + childWindow[config.key].setAlwaysOnTop(true, 'pop-up-menu') windowOperation(config) }) child.webContents.on('before-input-event', (event, input) => { @@ -346,6 +346,17 @@ app.on('ready', () => { childWindow[key] = "" } }); + // 设置子窗口 + ipcMain.handle('setChildWindow', (event, config) => { + const child = childWindow[config.key]; + const display = screen.getDisplayMatching({ ...child.getBounds() }); + const { width, height } = display.size + let x, y; + if (config.key === 'shareScreenWindow') { + x = Math.round((width - config.width) / 2); + childWindow[config.key].setBounds({ width: config.width }) + } + }); // 隐藏主窗口 ipcMain.handle('mainWindowHide', () => { mainWindowHide() diff --git a/preload.js b/preload.js index 73210bf..b68956c 100644 --- a/preload.js +++ b/preload.js @@ -81,6 +81,10 @@ window.electron = { closeChildWindow: (key) => { ipcRenderer.invoke('closeChildWindow', key) }, + // 设置子窗口 + setChildWindow: (config) => { + ipcRenderer.invoke('setChildWindow', config) + }, // 隐藏主窗口 mainWindowHide: () => { ipcRenderer.invoke('mainWindowHide') diff --git a/src/page/Meeting/ChatSmallWindow/index.module.scss b/src/page/Meeting/ChatSmallWindow/index.module.scss index c5626e8..369294c 100644 --- a/src/page/Meeting/ChatSmallWindow/index.module.scss +++ b/src/page/Meeting/ChatSmallWindow/index.module.scss @@ -20,8 +20,7 @@ align-items: flex-start; >div { - background-color: #5574f25d; - color: black; + background-color: #1e232baf; padding: 4px; box-sizing: border-box; border-radius: 0 15px 15px 15px; @@ -31,6 +30,11 @@ >span:nth-child(1) { white-space: nowrap; + color: #ff970f; + } + + >span:nth-child(2) { + color: #fff; } } } diff --git a/src/page/Meeting/ChatSmallWindow/index.tsx b/src/page/Meeting/ChatSmallWindow/index.tsx index 1e99b01..6370a9f 100644 --- a/src/page/Meeting/ChatSmallWindow/index.tsx +++ b/src/page/Meeting/ChatSmallWindow/index.tsx @@ -30,10 +30,9 @@ const ChatSmallWindow: React.FC = () => {
{chatLists.map((item: any) => -
+
- {item.userName} - ： + {item.userName}： {item.message}
diff --git a/src/page/Meeting/CurrentSpeakUserWindow/index.tsx b/src/page/Meeting/CurrentSpeakUserWindow/index.tsx index b3b42c9..3187d09 100644 --- a/src/page/Meeting/CurrentSpeakUserWindow/index.tsx +++ b/src/page/Meeting/CurrentSpeakUserWindow/index.tsx @@ -22,7 +22,7 @@ const CurrentSpeakUserWindow: React.FC = () => { return ( <>
-
+
{inputValue ? `正在说话:${inputValue}` : '无人说话'}
diff --git a/src/page/Meeting/ShareScreenWindow/index.module.scss b/src/page/Meeting/ShareScreenWindow/index.module.scss index 7f5136c..6bdae31 100644 --- a/src/page/Meeting/ShareScreenWindow/index.module.scss +++ b/src/page/Meeting/ShareScreenWindow/index.module.scss @@ -28,14 +28,9 @@ flex-grow: 1; align-items: center; justify-content: space-between; - opacity: 0; background-color: #07090B; display: flex; - &:hover { - opacity: 1 !important; - } - .shareScreenWindowContentList { display: flex; flex-grow: 1; @@ -74,4 +69,17 @@ } } } + + .shareScreenWindowExpand { + display: flex; + align-items: center; + margin: 0 auto; + background-color: lighten(#07090B, 4%); + padding: 0 6px; + cursor: pointer; + + >span { + font-size: 12px; + } + } } \ No newline at end of file diff --git a/src/page/Meeting/ShareScreenWindow/index.tsx b/src/page/Meeting/ShareScreenWindow/index.tsx index 8e8aa13..8e93a31 100644 --- a/src/page/Meeting/ShareScreenWindow/index.tsx +++ b/src/page/Meeting/ShareScreenWindow/index.tsx @@ -4,6 +4,7 @@ import styles from '@/page/Meeting/ShareScreenWindow/index.module.scss' import { storage } from '@/utils'; import ImageUrl from '@/utils/package/imageUrl'; import { getKeyOpenChildWindow, setKeyOpenChildWindow } from '@/utils/package/public'; +import { CaretDownOutlined, CaretUpOutlined } from '@ant-design/icons'; import { Button } from 'antd'; import { useEffect, useState } from "react"; const ShareScreenWindow: React.FC = () => { @@ -23,7 +24,7 @@ const ShareScreenWindow: React.FC = () => { select: false, }, { - title: '成员列表', + title: '成员', icon: ImageUrl.icon30, iconSelect: ImageUrl.icon30Select, active: false, @@ -46,7 +47,7 @@ const ShareScreenWindow: React.FC = () => { }, ]) const [time, setTime] = useState('') - const [isHover, setIsHover] = useState(true) + const [isExpand, setIsExpand] = useState(false) const [roomUserLists, setRoomUserLists] = useState([]) const channel = new BroadcastChannel('meeting_channel'); const userInfo = JSON.parse(storage.getItem('user') as string) @@ -109,19 +110,16 @@ const ShareScreenWindow: React.FC = () => { } return ( <> -
+
{time} 共享中 - {isHover ? { + {isExpand ? { channel.postMessage({ type: 'shareScreenWindowClose' }); - }}>结束共享 : null} + }}>结束共享 : 结束共享}
-
setIsHover(false)} - onMouseLeave={() => setIsHover(true)} - > + {isExpand ? null :
{footerLists.map((item: any, index: number) => { return ( @@ -174,18 +172,29 @@ const ShareScreenWindow: React.FC = () => {
: ''} {item.select ? : }
- {item.title}{item.title === '成员列表' ? `(${roomUserLists.filter((item: any) => item.isRoom).length})` : ''} + {item.title}{item.title === '成员' ? `(${roomUserLists.filter((item: any) => item.isRoom).length})` : ''}
) })}
- +
} +
{ + setIsExpand(!isExpand) + window.electron.setChildWindow({ + width: isExpand ? 440 : 440 / 2, + height: 80, + key: 'shareScreenWindow', + }) + }}> + {isExpand ? '展开' : '收起'} + {isExpand ? : }
diff --git a/src/page/Meeting/index.module.scss b/src/page/Meeting/index.module.scss index 262c256..cbb972d 100644 --- a/src/page/Meeting/index.module.scss +++ b/src/page/Meeting/index.module.scss @@ -937,6 +937,7 @@ width: 144px; height: 94px; box-sizing: border-box; + border: 5px solid transparent; >img { width: 100%; @@ -953,14 +954,16 @@ &:hover { >div { - border: 1px solid #EBEBEB; + border: 5px solid yellow; + box-sizing: border-box; } } } .active { >div { - border: 1px solid #EBEBEB; + border: 5px solid yellow; + box-sizing: border-box; } } } diff --git a/src/page/Meeting/index.tsx b/src/page/Meeting/index.tsx index 917c431..84247ed 100644 --- a/src/page/Meeting/index.tsx +++ b/src/page/Meeting/index.tsx @@ -1512,14 +1512,14 @@ const Meeting: React.FC = () => { if (!isOpen) { window.electron.createChildWindow({ url: location.origin + `/#/shareScreenWindow`, - width: 540, - height: 70, + width: 400, + height: 80, key: 'shareScreenWindow', }) window.electron.createChildWindow({ url: location.origin + `/#/chatSmallWindow`, width: 200, - height: 300, + height: 150, key: 'chatSmallWindow', }) window.electron.createChildWindow({ diff --git a/src/render.d.ts b/src/render.d.ts index 7c85640..71555a0 100644 --- a/src/render.d.ts +++ b/src/render.d.ts @@ -19,6 +19,7 @@ export interface IElectronAPI { setRegistry: (uuid: string) => any; getRegistry: () => any; createChildWindow: (config: any) => void; + setChildWindow: (config: any) => void; closeChildWindow: (key: string) => void; mainWindowCenter: () => any; mainWindowHide: () => any;