From ca1eefb90677234957d8d32c1b1093e5e6cf62a3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B6=85=E7=BA=A7=E8=80=81=E7=99=BD=E5=85=94?=
 <fsmecx@gmail.com>
Date: Fri, 12 Sep 2025 18:05:18 +0800
Subject: [PATCH] =?UTF-8?q?feat(NavCommon):=20=E6=B7=BB=E5=8A=A0=E5=85=B3?=
 =?UTF-8?q?=E9=97=AD=E6=8C=89=E9=92=AE=E5=B9=B6=E8=B0=83=E6=95=B4=E6=8A=BD?=
 =?UTF-8?q?=E5=B1=89=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 在抽屉头部添加关闭按钮，提升用户体验
- 重构抽屉样式结构，分离头部和内容样式
- 调整图标大小和布局，保持视觉一致性
---
 .../components/NavCommon/index.module.scss    | 91 ++++++++++---------
 .../pc/ckbox/components/NavCommon/index.tsx   |  7 +-
 2 files changed, 54 insertions(+), 44 deletions(-)

diff --git a/Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss b/Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss
index 1e9b197c..06c20939 100644
--- a/Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss
+++ b/Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.module.scss
@@ -177,6 +177,54 @@
   :global(.ant-drawer-body) {
     padding: 0;
   }
+  // 抽屉头部
+  .drawerHeader {
+    padding: 20px;
+    background: #fff;
+    border-bottom: none;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .logoSection {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+
+      .logoIcon {
+        width: 40px;
+        height: 40px;
+        background: linear-gradient(135deg, #3b81f6 0%, #9035ea 100%);
+        border-radius: 12px;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-size: 24px;
+        color: white;
+      }
+
+      .logoText {
+        display: flex;
+        flex-direction: column;
+
+        .appName {
+          font-size: 16px;
+          font-weight: 600;
+          color: #333;
+          margin: 0;
+        }
+
+        .appDesc {
+          font-size: 12px;
+          color: #999;
+          margin: 2px 0 0 0;
+        }
+      }
+    }
+    .anticon {
+      cursor: pointer;
+    }
+  }
 
   // 抽屉内容容器
   .drawerContent {
@@ -185,49 +233,6 @@
     flex-direction: column;
     background: #f8f9fa;
 
-    // 抽屉头部
-    .drawerHeader {
-      padding: 20px;
-      background: #fff;
-      border-bottom: none;
-
-      .logoSection {
-        display: flex;
-        align-items: center;
-        gap: 12px;
-
-        .logoIcon {
-          width: 48px;
-          height: 48px;
-          background: linear-gradient(135deg, #3b81f6 0%, #9035ea 100%);
-          border-radius: 12px;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          font-size: 24px;
-          color: white;
-        }
-
-        .logoText {
-          display: flex;
-          flex-direction: column;
-
-          .appName {
-            font-size: 18px;
-            font-weight: 600;
-            color: #333;
-            margin: 0;
-          }
-
-          .appDesc {
-            font-size: 12px;
-            color: #999;
-            margin: 2px 0 0 0;
-          }
-        }
-      }
-    }
-
     // 抽屉主体内容
     .drawerBody {
       flex: 1;
diff --git a/Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx b/Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx
index aefdc2fa..99cdacf8 100644
--- a/Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/components/NavCommon/index.tsx
@@ -4,8 +4,9 @@ import {
   MenuOutlined,
   UserOutlined,
   BellOutlined,
-  UserSwitchOutlined,
+  CloseOutlined,
   LogoutOutlined,
+  UserSwitchOutlined,
 } from "@ant-design/icons";
 
 import { useUserStore } from "@/store/module/user";
@@ -104,6 +105,9 @@ const NavCommon: React.FC<NavCommonProps> = ({
             </div>
           </div>
         </div>
+        <span className={styles.anticon} onClick={handleDrawerClose}>
+          <CloseOutlined />
+        </span>
       </div>
       <div className={styles.drawerBody}>
         <div className={styles.menuSection}>
@@ -194,6 +198,7 @@ const NavCommon: React.FC<NavCommonProps> = ({
         open={drawerVisible}
         width={300}
         className={styles.drawer}
+        closable={false}
       >
         {defaultDrawerContent}
       </Drawer>