feat: 优化窗口最大化和还原交互

src-electron/main/handler.ts

@@ -38,6 +38,14 @@ export async function useHandler(win: BrowserWindow, store: ElectronStore<Settin
         }
     })
 
+    win.on('maximize', () => {
+        win.webContents.send('window:action', 'max')
+    })
+
+    win.on('unmaximize', () => {
+        win.webContents.send('window:action', 'unmax')
+    })
+
     // 设置窗口是否总在最前
     if (store.get('system.alwaysOnTop')) {
         win.setAlwaysOnTop(true)

src/views/main/components/Header.vue

@@ -13,6 +13,7 @@
 
     const isDebug = computed(() => clientStore.system?.debug)
     const isAlwaysOnTop = computed(() => clientStore.system?.alwaysOnTop)
+    const isMaximized = ref<boolean>(false)
     const title = ref<string>($app.description)
     const [aboutRegister, { openModal: openAboutModal }] = useModal()
     const [settingRegister, { openModal: openSettingModal }] = useModal()
@@ -29,9 +30,12 @@
 
         if (action === 'top') {
             clientStore.setAlwaysOnTop(!isAlwaysOnTop.value)
+        } else if (action === 'max') {
+            isMaximized.value = !isMaximized.value
         }
 
         ipc.invoke('window:action', action)
+        getCurrentInstance().proxy.$forceUpdate()
     }
 
     function about() {
@@ -70,6 +74,12 @@
                 }
             },
         )
+
+        ipc.on('window:action', (_, action: 'max' | 'unmax' | string) => {
+            if (action === 'max' || action === 'unmax') {
+                isMaximized.value = action === 'max'
+            }
+        })
     })
 </script>
 
@@ -82,16 +92,16 @@
             <div class="title-text">{{ title }}</div>
         </a-space>
         <a-space class="btns">
-            <a-tooltip title="重新加载" v-if="isDebug">
-                <a-button type="text" primary @click="handleAction('reload')">
-                    <Icon icon="ant-design:reload-outlined" :size="22" />
-                </a-button>
-            </a-tooltip>
             <a-tooltip title="调试" v-if="isDebug">
                 <a-button type="text" primary @click="handleAction('debug')">
                     <Icon icon="ant-design:bug-outlined" :size="22" />
                 </a-button>
             </a-tooltip>
+            <a-tooltip title="重新加载" v-if="isDebug">
+                <a-button type="text" primary @click="handleAction('reload')">
+                    <Icon icon="material-symbols:reopen-window-sharp" :size="22" />
+                </a-button>
+            </a-tooltip>
             <a-tooltip title="应用设置">
                 <a-button type="text" primary @click="setting">
                     <Icon icon="uil:setting" :size="22" />
@@ -113,12 +123,19 @@
             </a-tooltip>
             <a-tooltip title="最小化">
                 <a-button type="text" primary @click="handleAction('min')">
-                    <Icon icon="ant-design:minus-outlined" :size="22" />
+                    <Icon icon="material-symbols:chrome-minimize-sharp" :size="24" />
                 </a-button>
             </a-tooltip>
-            <a-tooltip title="缩放">
-                <a-button type="text" primary @click="handleAction('max')">
-                    <Icon icon="uil:window-maximize" :size="22" />
+            <a-tooltip>
+                <a-button type="text" primary @click="handleAction('max')" :title="isMaximized ? '还原' : '最大化'">
+                    <Icon
+                        :icon="
+                            isMaximized
+                                ? 'material-symbols:chrome-restore-outline-sharp'
+                                : 'material-symbols:chrome-maximize-outline-sharp'
+                        "
+                        :size="24"
+                    />
                 </a-button>
             </a-tooltip>
             <a-tooltip title="关闭应用">