diff --git a/pc-fe/.umirc.ts b/pc-fe/.umirc.ts index 2e6dc81..c8d5163 100644 --- a/pc-fe/.umirc.ts +++ b/pc-fe/.umirc.ts @@ -24,18 +24,18 @@ export default defineConfig({ }, // 路由配置 routes: [ - // { - // path: '/', - // component: '@/pages/welcome', - // }, - // { - // path: '/login', - // component: '@/pages/login', - // }, { path: '/', component: '@/pages/components/Layout/index', routes: [ + { + path: '/imagesList', + component: '@/pages/imagesList', + }, + { + path: '/login', + component: '@/pages/login', + }, { path: '/grpc', component: '@/pages/grpc/grpc', @@ -44,10 +44,6 @@ export default defineConfig({ path: '/welcome', component: '@/pages/welcome', }, - { - path: '/login', - component: '@/pages/login', - }, { path: '/configSteps', component: '@/pages/configSteps', diff --git a/pc-fe/src/assets/barIcon.png b/pc-fe/src/assets/barIcon.png new file mode 100644 index 0000000..120620c Binary files /dev/null and b/pc-fe/src/assets/barIcon.png differ diff --git a/pc-fe/src/main/index.ts b/pc-fe/src/main/index.ts index 7a60796..05d80dc 100644 --- a/pc-fe/src/main/index.ts +++ b/pc-fe/src/main/index.ts @@ -1 +1,28 @@ getBrowserWindowRuntime().webContents.openDevTools(); + +// import { BrowserWindow } from 'electron'; +// import path from 'path'; + +// // 修复:添加默认值处理 +// const APP_ROOT = process.env.APP_ROOT || '.'; +// const MAIN_DIST = path.join(APP_ROOT, 'dist-electron'); + +// getBrowserWindowRuntime().webContents.openDevTools(); + +// const createNewWindow = () => { +// const newWindow = new BrowserWindow({ +// width: 200, +// height: 200, +// webPreferences: { +// nodeIntegration: true, +// contextIsolation: false +// } +// }); + +// // 加载页面内容 +// newWindow.loadURL('file:/' + __dirname + '/index.html'); + +// return newWindow; +// }; + +// createNewWindow(); \ No newline at end of file diff --git a/pc-fe/src/main/ipc/platform.ts b/pc-fe/src/main/ipc/platform.ts index 5cc52cb..e16ff7c 100644 --- a/pc-fe/src/main/ipc/platform.ts +++ b/pc-fe/src/main/ipc/platform.ts @@ -12,16 +12,54 @@ const window = getBrowserWindowRuntime(); let currentServerIp: string | undefined; +// 添加处理窗口调整 +ipcMain.handle('adjust-window-for-normal', async (event) => { + try { + const window = BrowserWindow.fromWebContents(event.sender); + if (window) { + // 调整窗口大小和配置 + window.setKiosk(false); // 退出全屏模式 + window.setMinimumSize(1200, 800); + window.setSize(1200, 800); + window.setResizable(true); + window.setMaximizable(true); + window.setMinimizable(true); + // 保持无边框和隐藏标题栏的设置 + window.setFullScreen(false); + } + return { success: true }; + } catch (error) { + console.error('调整窗口失败:', error); + return { success: false, }; + } +}); + +/**拖动窗口 */ +ipcMain.handle('drag-window', (event) => { + const focusedWindow = BrowserWindow.getFocusedWindow(); + if (focusedWindow) { + // 通知渲染进程开始拖拽 + focusedWindow.webContents.send('start-drag'); + } +}); + // 监听渲染进程发送的消息 ipcMain.handle('getPlatform', () => { return `hi, i'm from ${process.platform}`; }); -// 窗口控制:最小化,退出全屏 +// 窗口控制:最小化,退出全屏,关闭, +// 获取窗口最大化状态 +ipcMain.handle('get-window-maximized', (event) => { + const window = BrowserWindow.fromWebContents(event.sender); + return window?.isMaximized() || false; +}); + ipcMain.on('close-app', () => { app.quit(); }); +// 最小化 ipcMain.on('minimize-app', () => { const focusedWindow = BrowserWindow.getFocusedWindow(); if (focusedWindow) { @@ -30,16 +68,39 @@ ipcMain.on('minimize-app', () => { // window?.minimize(); }); -ipcMain.on('exit-kiosk', () => { +// 退出全屏 +ipcMain.on('restore-window', () => { const focusedWindow = BrowserWindow.getFocusedWindow(); if (focusedWindow) { - focusedWindow.setFullScreen(false); + focusedWindow.unmaximize(); } // if (window) { // window.setFullScreen(false); // } }); +// 设置全屏 +ipcMain.on('maximize-window', () => { + const focusedWindow = BrowserWindow.getFocusedWindow(); + if (focusedWindow) { + focusedWindow.maximize(); + } +}) + +// 监听窗口状态变化并通知渲染进程 +ipcMain.on('register-window-state-listeners', (event) => { + const window = BrowserWindow.fromWebContents(event.sender); + if (window) { + window.on('maximize', () => { + event.sender.send('window-maximized'); + }); + + window.on('unmaximize', () => { + event.sender.send('window-unmaximized'); + }); + } +}); + ipcMain.handle('get-device-id',async()=>{ const deviceId = await getDeviceId(); diff --git a/pc-fe/src/main/preload.ts b/pc-fe/src/main/preload.ts index abaca82..7b7ca5c 100644 --- a/pc-fe/src/main/preload.ts +++ b/pc-fe/src/main/preload.ts @@ -7,12 +7,14 @@ contextBridge.exposeInMainWorld('electronAPI', { }, closeApp: () => ipcRenderer.send('close-app'), minimizeApp: () => ipcRenderer.send('minimize-app'), - exitKiosk: () => ipcRenderer.send('exit-kiosk'), + restoreWindow: () => ipcRenderer.send('restore-window'), + maximizeWindow: () => ipcRenderer.send('maximize-window'), + getWindowMaximized: () => ipcRenderer.invoke('get-window-maximized'), + adjustWindowForNormal:() => ipcRenderer.invoke('adjust-window-for-normal'), // 版本更新相关API downloadAndUpdate: (url: string) => ipcRenderer.invoke('download-and-update', url), // 服务器IP获取 getCurrentServerIp: () => ipcRenderer.invoke('get-current-server-ip'), - // 事件监听 onMainProcessMessage: (callback: (data: string) => void) => { ipcRenderer.on('main-process-message', (_, data) => callback(data)); diff --git a/pc-fe/src/pages/components/TitleBar/index.less b/pc-fe/src/pages/components/TitleBar/index.less new file mode 100644 index 0000000..55105cd --- /dev/null +++ b/pc-fe/src/pages/components/TitleBar/index.less @@ -0,0 +1,108 @@ +// src/pages/components/TitleBar/index.less +.title-bar { + margin: 20px 0; + padding: 0 20px; + width: 100%; + height: 34px; + display: flex; + justify-content: space-between; + align-items: center; + -webkit-app-region: drag; // 使整个标题栏可拖动 + user-select: none; + + .title-bar-right { + display: flex; + align-items: center; + -webkit-app-region: no-drag; // 使按钮区域不可拖动 + + .window-control { + width: 18px; + height: 18px; + border: 1.5px solid rgba(34, 34, 34, 1); + margin-left: 10px; + cursor: pointer; + + &.minimize { + // 最小化按钮样式(一条线) + position: relative; + + &::before { + content: ''; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 10px; + height: 1.5px; + background-color: rgba(34, 34, 34, 1); + } + } + + &.restore { + position: relative; + + &::before { + content: ''; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 8px; + height: 8px; + border: 1px solid rgba(34, 34, 34, 1); + } + + &::after { + content: ''; + position: absolute; + top: 30%; + left: 30%; + width: 8px; + height: 8px; + border: 1px solid rgba(34, 34, 34, 1); + background: white; + } + } + + &.maximize { + // 最大化按钮样式(正方形框) + position: relative; + + &::before { + content: ''; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 10px; + height: 10px; + border: 1px solid rgba(34, 34, 34, 1); + } + } + + &.close { + // 关闭按钮样式(×) + position: relative; + + &::before, + &::after { + content: ''; + position: absolute; + top: 50%; + left: 50%; + width: 12px; + height: 1.5px; + background-color: rgba(34, 34, 34, 1); + } + + &::before { + transform: translate(-50%, -50%) rotate(45deg); + } + + &::after { + transform: translate(-50%, -50%) rotate(-45deg); + } + } + } + } +} \ No newline at end of file diff --git a/pc-fe/src/pages/components/TitleBar/index.tsx b/pc-fe/src/pages/components/TitleBar/index.tsx new file mode 100644 index 0000000..2e5a22c --- /dev/null +++ b/pc-fe/src/pages/components/TitleBar/index.tsx @@ -0,0 +1,71 @@ +// src/pages/components/TitleBar/index.tsx +import React,{ useState, useEffect } from 'react'; +import './index.less'; +import BarIcon from '@assets/barIcon.png' + +const TitleBar = () => { + const [isMaximized, setIsMaximized] = useState(false); + + // 监听窗口状态变化 + useEffect(() => { + if (window.electronAPI) { + // 注册窗口状态变化监听器 + window.electronAPI.send('register-window-state-listeners'); + + window.electronAPI.on('window-maximized', () => { + setIsMaximized(true); + }); + + window.electronAPI.on('window-unmaximized', () => { + setIsMaximized(false); + }); + + // 初始化时获取窗口状态 + window.electronAPI.getWindowMaximized().then((maximized: boolean) => { + setIsMaximized(maximized); + }); + } +}, []); + const closeApp = () => { + if (window.electronAPI) { + window.electronAPI.closeApp(); + } + }; + + const minimizeApp = () => { + if (window.electronAPI) { + window.electronAPI.minimizeApp(); + } + }; + + // 区分当前是最小化还是最大化 + const toggleMaximize = () => { + if (window.electronAPI) { + if (isMaximized) { + window.electronAPI.restoreWindow(); + } else { + window.electronAPI.maximizeWindow(); + } + } +}; + + return ( +
提示:用户名 admin,密码 123456