From 289fb4f7e285c84f406bf25957c4ce87c23ac102 Mon Sep 17 00:00:00 2001
From: root <root@sker>
Date: Thu, 10 Jul 2025 10:28:46 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E7=AA=97=E5=8F=A3?=
 =?UTF-8?q?=E6=8E=A7=E5=88=B6=E6=8C=89=E9=92=AE=E9=9C=80=E8=A6=81=E5=8F=8C?=
 =?UTF-8?q?=E5=87=BB=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

🔧 问题修复：
- 修复最小化/最大化/关闭按钮需要双击才能工作的问题
- 原因：整个标题栏的 onMouseDown 事件拦截了按钮的点击事件

🛠️ 技术改进：
- 将拖拽事件处理器从整个标题栏移动到左侧标题区域
- 为所有按钮添加 e.stopPropagation() 阻止事件冒泡
- 保持拖拽功能正常工作的同时确保按钮单击响应

✨ 修复后功能：
- ✅ 拖拽：点击标题文字区域可拖拽窗口
- ✅ 双击最大化：双击标题文字区域切换最大化
- ✅ 最小化按钮：单击即可最小化窗口
- ✅ 最大化按钮：单击即可切换最大化状态
- ✅ 关闭按钮：单击即可关闭应用程序

现在所有窗口控制功能都应该正常工作了！
---
 src/components/TitleBar.tsx | 27 ++++++++++++++++++---------
 1 file changed, 18 insertions(+), 9 deletions(-)

diff --git a/src/components/TitleBar.tsx b/src/components/TitleBar.tsx
index c7f11ef..9ee6184 100644
--- a/src/components/TitleBar.tsx
+++ b/src/components/TitleBar.tsx
@@ -94,32 +94,41 @@ const TitleBar: React.FC = () => {
   }
 
   return (
-    <div
-      className="h-8 bg-secondary-800 text-white flex items-center justify-between px-4 select-none"
-      onMouseDown={handleTitlebarMouseDown}
-    >
-      <div className="flex items-center space-x-2">
+    <div className="h-8 bg-secondary-800 text-white flex items-center justify-between px-4 select-none">
+      <div
+        className="flex items-center space-x-2 flex-1"
+        onMouseDown={handleTitlebarMouseDown}
+      >
         <div className="w-4 h-4 bg-primary-500 rounded-full flex items-center justify-center">
           <span className="text-xs font-bold">M</span>
         </div>
         <span className="text-sm font-medium">MixVideo V2</span>
       </div>
-      
+
       <div className="flex items-center space-x-1">
         <button
-          onClick={handleMinimize}
+          onClick={(e) => {
+            e.stopPropagation()
+            handleMinimize()
+          }}
           className="w-6 h-6 flex items-center justify-center hover:bg-secondary-700 rounded transition-colors"
         >
           <Minimize2 size={12} />
         </button>
         <button
-          onClick={handleMaximize}
+          onClick={(e) => {
+            e.stopPropagation()
+            handleMaximize()
+          }}
           className="w-6 h-6 flex items-center justify-center hover:bg-secondary-700 rounded transition-colors"
         >
           {isMaximized ? <Square size={12} /> : <Maximize2 size={12} />}
         </button>
         <button
-          onClick={handleClose}
+          onClick={(e) => {
+            e.stopPropagation()
+            handleClose()
+          }}
           className="w-6 h-6 flex items-center justify-center hover:bg-red-600 rounded transition-colors"
         >
           <X size={12} />