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 = ({ loading = false }) => { ); + const tabContentCacheRef = useRef>({}); + + const getTabContent = (tabKey: string) => { + if (!tabContentCacheRef.current[tabKey]) { + switch (tabKey) { + case "chats": + tabContentCacheRef.current[tabKey] = ; + break; + case "contracts": + tabContentCacheRef.current[tabKey] = ; + break; + case "friendsCicle": + tabContentCacheRef.current[tabKey] = ; + break; + default: + tabContentCacheRef.current[tabKey] = null; + } + } + return tabContentCacheRef.current[tabKey]; + }; + // 渲染内容部分 const renderContent = () => { // 如果正在切换tab到聊天,显示骨架屏 @@ -200,16 +221,27 @@ const SidebarMenu: React.FC = ({ loading = false }) => { return renderSkeleton(); } - switch (activeTab) { - case "chats": - return ; - case "contracts": - return ; - case "friendsCicle": - return ; - default: - return null; + const availableTabs = ["chats", "contracts"]; + if (currentCustomer && currentCustomer.id !== 0) { + availableTabs.push("friendsCicle"); } + + return ( + <> + {availableTabs.map(tabKey => ( +
+ {getTabContent(tabKey)} +
+ ))} + + ); }; 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 | null = null; /** * 联系人状态管理接口 @@ -171,8 +175,16 @@ export const useContactStore = create()( 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()( 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 });