From 27de14f752d48008086596ee71c9b3187630d1b0 Mon Sep 17 00:00:00 2001
From: Chen Gu <guchen@MBKPro.lan>
Date: Sat, 9 May 2026 14:32:04 +0800
Subject: [PATCH] fix: unified nav - TopHud back btn + window controls + login
 close

---
 src/components/layout/TopHud.tsx | 42 +++++++++++++++++++++++++++++---
 src/pages/Login.tsx              | 21 ++++++++++------
 src/pages/SchemeDetail.tsx       |  2 +-
 src/router.tsx                   |  6 ++++-
 4 files changed, 57 insertions(+), 14 deletions(-)

diff --git a/src/components/layout/TopHud.tsx b/src/components/layout/TopHud.tsx
index ec71491..9a47400 100644
--- a/src/components/layout/TopHud.tsx
+++ b/src/components/layout/TopHud.tsx
@@ -4,12 +4,26 @@ interface TopHudProps {
   title?: string;
   subtitle?: string;
   sections?: { label: string; value: string }[];
+  onBack?: () => void;
 }
 
-export default function TopHud({ title = '码枪堂 2.0', subtitle, sections = [] }: TopHudProps) {
+function callElectron(method: string) {
+  try { (window as any).electronAPI?.[method](); } catch {}
+}
+
+export default function TopHud({ title = '码枪堂 2.0', subtitle, sections = [], onBack }: TopHudProps) {
   return (
-    <div className="flex items-center justify-between border-b border-[#333] bg-[#1a1a1a] px-3 py-1">
+    <div className="flex items-center justify-between border-b border-[#333] bg-[#1a1a1a] px-3 py-1 select-none">
       <div className="flex items-center gap-2">
+        {/* Back button */}
+        {onBack && (
+          <button
+            onClick={onBack}
+            className="text-[#555] hover:text-[#e0e0e0] text-[10px] px-1 py-0.5 border border-[#333] hover:border-[#555] transition-colors duration-75"
+          >
+            ←
+          </button>
+        )}
         <span className="text-[#ff4500] text-[8px]">◆</span>
         <h1 className="text-[9px] font-bold tracking-[0.15em] uppercase text-[#e0e0e0]">{title}</h1>
         {subtitle && (
@@ -19,7 +33,7 @@ export default function TopHud({ title = '码枪堂 2.0', subtitle, sections = [
           </>
         )}
       </div>
-      <div className="flex items-center gap-3">
+      <div className="flex items-center gap-2">
         {sections.map((s, i) => (
           <span key={i} className="flex items-center gap-1">
             <span className="text-[7px] tracking-[0.15em] uppercase text-[#555]">{s.label}</span>
@@ -27,7 +41,27 @@ export default function TopHud({ title = '码枪堂 2.0', subtitle, sections = [
           </span>
         ))}
         <span className="w-[1px] h-3 bg-[#333]" />
-        <span className="text-[8px] font-mono text-[#444]">V0.2.1</span>
+
+        {/* Window controls */}
+        <button
+          onClick={() => callElectron('minimizeWindow')}
+          className="text-[#555] hover:text-[#e0e0e0] text-[14px] leading-none px-1 transition-colors duration-75"
+        >
+          ─
+        </button>
+        <button
+          onClick={() => callElectron('maximizeWindow')}
+          className="text-[#555] hover:text-[#e0e0e0] text-[10px] leading-none px-1 transition-colors duration-75"
+        >
+          ☐
+        </button>
+        <button
+          onClick={() => callElectron('closeWindow')}
+          className="text-[#555] hover:text-[#cc3300] text-[12px] leading-none px-1 transition-colors duration-75"
+        >
+          ✕
+        </button>
+        <span className="text-[8px] font-mono text-[#444] ml-1">V0.2.1</span>
       </div>
     </div>
   );
diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx
index 5fad043..d58db6e 100644
--- a/src/pages/Login.tsx
+++ b/src/pages/Login.tsx
@@ -7,6 +7,10 @@ import { useAuth } from '../hooks/useAuth';
 import { useAuthStore } from '../stores/authStore';
 import { getVipStatus, activateVip } from '../services/auth.api';
 
+function callElectron(method: string) {
+  try { (window as any).electronAPI?.[method](); } catch {}
+}
+
 export default function Login() {
   const navigate = useNavigate();
   const { login } = useAuth();
@@ -50,15 +54,20 @@ export default function Login() {
 
   return (
     <div className="h-screen bg-[#1a1a1a] flex flex-col items-center justify-center p-6">
-      {/* 品牌 */}
+      {/* 关闭按钮 */}
+      <button
+        onClick={() => callElectron('closeWindow')}
+        className="absolute top-3 right-3 text-[#555] hover:text-[#cc3300] text-[14px] px-2 py-1 border border-[#333] hover:border-[#cc3300] transition-colors duration-75"
+      >
+        ✕
+      </button>
+
       <div className="text-center mb-6">
         <h1 className="text-[14px] font-bold tracking-[0.2em] uppercase text-[#e0e0e0]">码枪堂 2.0</h1>
         <p className="text-[8px] font-mono text-[#555] mt-1">用户认证系统</p>
       </div>
 
-      {/* 认证卡片 */}
       <Card className="w-full max-w-xs" serial="AUTH-01">
-        {/* 标签页 */}
         <div className="flex border-b border-[#333]">
           {(['login', 'register', 'vip'] as const).map(t => (
             <button
@@ -73,7 +82,6 @@ export default function Login() {
           ))}
         </div>
 
-        {/* 表单 */}
         <div className="p-3 space-y-2.5">
           {tab === 'vip' ? (
             <>
@@ -122,13 +130,10 @@ export default function Login() {
             </p>
           )}
 
-          <p className="text-[7px] font-mono text-[#444] text-center">
-            SYS-AUTH v1.0
-          </p>
+          <p className="text-[7px] font-mono text-[#444] text-center">SYS-AUTH v1.0</p>
         </div>
       </Card>
 
-      {/* 返回 */}
       <button
         onClick={() => navigate('/')}
         className="mt-4 text-[8px] font-mono text-[#555] hover:text-[#888] transition-colors duration-75"
diff --git a/src/pages/SchemeDetail.tsx b/src/pages/SchemeDetail.tsx
index 0184225..57fc94d 100644
--- a/src/pages/SchemeDetail.tsx
+++ b/src/pages/SchemeDetail.tsx
@@ -81,7 +81,7 @@ export default function SchemeDetail() {
     <div className="flex flex-col gap-3 p-3  flex-1">
       <div className="flex items-center justify-between border-b border-[#333] pb-2">
         <div className="flex items-center gap-2">
-          <button onClick={() => navigate(-1)} className="text-[#555] hover:text-[#e0e0e0] text-[10px] transition-colors duration-75">←</button>
+          
           <h1 className="text-[11px] font-bold tracking-[0.15em] uppercase">方案详情</h1>
         </div>
         {scheme.isOfficial && <span className="text-[7px] font-semibold tracking-[0.1em] uppercase text-[#ff4500] border border-[#ff4500]/30 px-1 py-0.5">官方</span>}
diff --git a/src/router.tsx b/src/router.tsx
index 6a61fc9..3d9bc64 100644
--- a/src/router.tsx
+++ b/src/router.tsx
@@ -1,5 +1,5 @@
 import React, { Suspense, lazy } from 'react';
-import { Routes, Route } from 'react-router-dom';
+import { Routes, Route, useNavigate } from 'react-router-dom';
 import PageContainer from './components/layout/PageContainer';
 import TopHud from './components/layout/TopHud';
 
@@ -30,6 +30,9 @@ const pageTitles: Record<string, string> = {
 };
 
 function PageShell({ children, currentPage }: { children: React.ReactNode; currentPage: string }) {
+  const navigate = useNavigate();
+  const isHome = currentPage === 'home';
+
   return (
     <div className="h-screen bg-[#1a1a1a] text-[#e0e0e0] antialiased overflow-hidden flex flex-col" style={{ fontFamily: 'Inter, sans-serif' }}>
       <TopHud
@@ -39,6 +42,7 @@ function PageShell({ children, currentPage }: { children: React.ReactNode; curre
           { label: '状态', value: '在线' },
           { label: '模式', value: '本地' },
         ]}
+        onBack={isHome ? undefined : () => navigate(-1)}
       />
       <PageContainer>
         <Suspense fallback={<LoadingFallback />}>