From eca55495924fc3c120ddd96ab2f02545cc12056b 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, 14 Nov 2025 16:19:18 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96SidebarMenu=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E7=9A=84=E5=86=85=E5=AE=B9=E6=B8=B2=E6=9F=93=E9=80=BB=E8=BE=91?=
 =?UTF-8?q?=EF=BC=8C=E4=BD=BF=E7=94=A8useRef=E7=BC=93=E5=AD=98=E9=80=89?=
 =?UTF-8?q?=E9=A1=B9=E5=8D=A1=E5=86=85=E5=AE=B9=E4=BB=A5=E6=8F=90=E9=AB=98?=
 =?UTF-8?q?=E6=80=A7=E8=83=BD=E3=80=82=E6=9B=B4=E6=96=B0=E8=81=94=E7=B3=BB?=
 =?UTF-8?q?=E4=BA=BA=E7=8A=B6=E6=80=81=E7=AE=A1=E7=90=86=EF=BC=8C=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E6=90=9C=E7=B4=A2=E5=85=B3=E9=94=AE=E8=AF=8D=E7=9A=84?=
 =?UTF-8?q?=E9=98=B2=E6=8A=96=E5=A4=84=E7=90=86=EF=BC=8C=E7=A1=AE=E4=BF=9D?=
 =?UTF-8?q?=E6=90=9C=E7=B4=A2=E8=AF=B7=E6=B1=82=E4=B8=8D=E4=BC=9A=E9=A2=91?=
 =?UTF-8?q?=E7=B9=81=E8=A7=A6=E5=8F=91=E3=80=82=E5=BC=95=E5=85=A5=E5=BD=93?=
 =?UTF-8?q?=E5=89=8D=E7=94=A8=E6=88=B7ID=E7=9A=84=E6=A3=80=E6=9F=A5?=
 =?UTF-8?q?=E4=BB=A5=E4=BC=98=E5=8C=96=E6=90=9C=E7=B4=A2=E7=BB=93=E6=9E=9C?=
 =?UTF-8?q?=E7=9A=84=E5=A4=84=E7=90=86=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../weChat/components/SidebarMenu/index.tsx   | 52 +++++++++++++++----
 .../src/store/module/weChat/contacts.ts       | 23 +++++++-
 2 files changed, 63 insertions(+), 12 deletions(-)

diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/index.tsx b/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/index.tsx
index 3699b995..cf72b962 100644
--- a/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/index.tsx
+++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/index.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useRef } from "react";
 import { Input, Skeleton, Button, Dropdown, MenuProps } from "antd";
 import {
   SearchOutlined,
@@ -193,6 +193,27 @@ const SidebarMenu: React.FC<SidebarMenuProps> = ({ loading = false }) => {
     </div>
   );
 
+  const tabContentCacheRef = useRef<Record<string, React.ReactNode>>({});
+
+  const getTabContent = (tabKey: string) => {
+    if (!tabContentCacheRef.current[tabKey]) {
+      switch (tabKey) {
+        case "chats":
+          tabContentCacheRef.current[tabKey] = <MessageList />;
+          break;
+        case "contracts":
+          tabContentCacheRef.current[tabKey] = <WechatFriends />;
+          break;
+        case "friendsCicle":
+          tabContentCacheRef.current[tabKey] = <FriendsCircle />;
+          break;
+        default:
+          tabContentCacheRef.current[tabKey] = null;
+      }
+    }
+    return tabContentCacheRef.current[tabKey];
+  };
+
   // 渲染内容部分
   const renderContent = () => {
     // 如果正在切换tab到聊天，显示骨架屏
@@ -200,16 +221,27 @@ const SidebarMenu: React.FC<SidebarMenuProps> = ({ loading = false }) => {
       return renderSkeleton();
     }
 
-    switch (activeTab) {
-      case "chats":
-        return <MessageList />;
-      case "contracts":
-        return <WechatFriends />;
-      case "friendsCicle":
-        return <FriendsCircle />;
-      default:
-        return null;
+    const availableTabs = ["chats", "contracts"];
+    if (currentCustomer && currentCustomer.id !== 0) {
+      availableTabs.push("friendsCicle");
     }
+
+    return (
+      <>
+        {availableTabs.map(tabKey => (
+          <div
+            key={tabKey}
+            style={{
+              display: activeTab === tabKey ? "block" : "none",
+              height: "100%",
+            }}
+            aria-hidden={activeTab !== tabKey}
+          >
+            {getTabContent(tabKey)}
+          </div>
+        ))}
+      </>
+    );
   };
 
   if (loading) {
diff --git a/Touchkebao/src/store/module/weChat/contacts.ts b/Touchkebao/src/store/module/weChat/contacts.ts
index ca875b97..ee8827f2 100644
--- a/Touchkebao/src/store/module/weChat/contacts.ts
+++ b/Touchkebao/src/store/module/weChat/contacts.ts
@@ -3,6 +3,10 @@ import { persist } from "zustand/middleware";
 import { ContactGroupByLabel } from "@/pages/pc/ckbox/data";
 import { Contact } from "@/utils/db";
 import { ContactManager } from "@/utils/dbAction";
+import { useUserStore } from "@/store/module/user";
+
+const SEARCH_DEBOUNCE_DELAY = 300;
+let searchDebounceTimer: ReturnType<typeof setTimeout> | null = null;
 
 /**
  * 联系人状态管理接口
@@ -171,8 +175,16 @@ export const useContactStore = create<ContactState>()(
 
       setSearchKeyword: (keyword: string) => {
         set({ searchKeyword: keyword });
+
+        if (searchDebounceTimer) {
+          clearTimeout(searchDebounceTimer);
+          searchDebounceTimer = null;
+        }
+
         if (keyword.trim()) {
-          get().searchContacts(keyword);
+          searchDebounceTimer = setTimeout(() => {
+            get().searchContacts(keyword);
+          }, SEARCH_DEBOUNCE_DELAY);
         } else {
           set({ isSearchMode: false, searchResults: [] });
         }
@@ -204,8 +216,15 @@ export const useContactStore = create<ContactState>()(
         set({ loading: true, isSearchMode: true });
 
         try {
+          const currentUserId = useUserStore.getState().user?.id;
+
+          if (!currentUserId) {
+            set({ searchResults: [], isSearchMode: false, loading: false });
+            return;
+          }
+
           const results = await ContactManager.searchContacts(
-            get().currentContact?.userId || 0,
+            currentUserId,
             keyword,
           );
           set({ searchResults: results });