refactor(electron+vue): 优化窗口拖拽和激活逻辑

1. 为提交窗口标题栏添加拖拽支持，同时关闭关闭按钮的拖拽区域
2. 重构窗口激活显示逻辑为复用函数showAndFocusMainWindow
3. 修复窗口实例管理和托盘图标点击的逻辑问题

electron/main/index.ts

@@ -256,8 +256,22 @@ const requestApplicationExit = (): void => {
   app.quit();
 };
 
+const showAndFocusMainWindow = (): void => {
+  if (!win || win.isDestroyed()) {
+    createWindow();
+    return;
+  }
+
+  if (win.isMinimized()) {
+    win.restore();
+  }
+  win.show();
+  win.setSkipTaskbar(false);
+  win.focus();
+};
+
 async function createWindow() {
-  win = new BrowserWindow({
+  const mainWindow = new BrowserWindow({
     title: "星火应用商店",
     width: 1366,
     height: 768,
@@ -274,30 +288,40 @@ async function createWindow() {
       // contextIsolation: false,
     },
   });
+  win = mainWindow;
 
   if (VITE_DEV_SERVER_URL) {
     // #298
-    win.loadURL(VITE_DEV_SERVER_URL);
+    mainWindow.loadURL(VITE_DEV_SERVER_URL);
     // Open devTool if the app is not packaged
-    win.webContents.openDevTools({ mode: "detach" });
+    mainWindow.webContents.openDevTools({ mode: "detach" });
   } else {
-    win.loadFile(indexHtml);
+    mainWindow.loadFile(indexHtml);
   }
 
   // Test actively push message to the Electron-Renderer
-  win.webContents.on("did-finish-load", () => {
+  mainWindow.webContents.on("did-finish-load", () => {
-    win?.webContents.send("main-process-message", new Date().toLocaleString());
+    mainWindow.webContents.send(
+      "main-process-message",
+      new Date().toLocaleString(),
+    );
     logger.info("Renderer process is ready.");
   });
 
   // Make all links open with the browser, not with the application
-  win.webContents.setWindowOpenHandler(({ url }) => {
+  mainWindow.webContents.setWindowOpenHandler(({ url }) => {
     if (url.startsWith("https:")) shell.openExternal(url);
     return { action: "deny" };
   });
   // win.webContents.on('will-navigate', (event, url) => { }) #344
 
-  win.on("close", (event) => {
+  mainWindow.on("closed", () => {
+    if (win === mainWindow) {
+      win = null;
+    }
+  });
+
+  mainWindow.on("close", (event) => {
     if (allowAppExit) {
       return;
     }
@@ -476,20 +500,11 @@ app.on("window-all-closed", () => {
 });
 
 app.on("second-instance", () => {
-  if (win) {
+  showAndFocusMainWindow();
-    // Focus on the main window if the user tried to open another
-    if (win.isMinimized()) win.restore();
-    win.focus();
-  }
 });
 
 app.on("activate", () => {
-  const allWindows = BrowserWindow.getAllWindows();
+  showAndFocusMainWindow();
-  if (allWindows.length) {
-    allWindows[0].focus();
-  } else {
-    createWindow();
-  }
 });
 
 app.on("will-quit", () => {
@@ -542,7 +557,7 @@ app.whenReady().then(() => {
     {
       label: "显示主界面",
       click: () => {
-        win.show();
+        showAndFocusMainWindow();
       },
     },
     {
@@ -557,12 +572,11 @@ app.whenReady().then(() => {
   // 双击触发
   tray.on("click", () => {
     // 双击通知区图标实现应用的显示或隐藏
-    if (win.isVisible()) {
+    if (win && !win.isDestroyed() && win.isVisible()) {
       win.hide();
       win.setSkipTaskbar(true);
     } else {
-      win.show();
+      showAndFocusMainWindow();
-      win.setSkipTaskbar(false);
     }
   });
 });

src/components/SubmitterWindow.vue

@@ -3,7 +3,7 @@
     class="h-screen overflow-y-auto bg-slate-50 dark:bg-slate-950 text-slate-900 dark:text-slate-100"
   >
     <div
-      class="sticky top-0 z-30 border-b border-slate-200/70 bg-white px-4 py-3 dark:border-slate-800/70 dark:bg-slate-900"
+      class="submitter-titlebar sticky top-0 z-30 border-b border-slate-200/70 bg-white px-4 py-3 dark:border-slate-800/70 dark:bg-slate-900"
     >
       <div class="flex items-center justify-between">
         <div class="flex items-center gap-3">
@@ -16,7 +16,7 @@
         </div>
         <button
           type="button"
-          class="inline-flex h-8 w-8 items-center justify-center rounded-lg text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-800"
+          class="submitter-close-button inline-flex h-8 w-8 items-center justify-center rounded-lg text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-800"
           @click="closeWindow"
         >
           <i class="fas fa-times"></i>
@@ -1734,3 +1734,13 @@ onMounted(async () => {
   await getGitEmail();
 });
 </script>
+
+<style scoped>
+.submitter-titlebar {
+  -webkit-app-region: drag;
+}
+
+.submitter-close-button {
+  -webkit-app-region: no-drag;
+}
+</style>