diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/WechatFriends/com.module.scss b/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/WechatFriends/com.module.scss index 75a67032..70630da1 100644 --- a/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/WechatFriends/com.module.scss +++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/WechatFriends/com.module.scss @@ -157,24 +157,18 @@ padding: 10px; } - // 加载更多按钮 - .loadMoreBtn { - background: #fff; - border: 1px solid #d9d9d9; - border-radius: 4px; - padding: 6px 15px; + // 加载更多文字 + .loadMoreText { + text-align: center; + padding: 10px 15px; font-size: 14px; + color: #1890ff; cursor: pointer; transition: all 0.3s; - &:hover:not(:disabled) { - color: #1890ff; - border-color: #1890ff; - } - - &:disabled { - cursor: not-allowed; - opacity: 0.6; + &:hover { + color: #40a9ff; + background-color: #f5f5f5; } } } diff --git a/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/WechatFriends/index.tsx b/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/WechatFriends/index.tsx index 3987775e..22b4c34b 100644 --- a/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/WechatFriends/index.tsx +++ b/Touchkebao/src/pages/pc/ckbox/weChat/components/SidebarMenu/WechatFriends/index.tsx @@ -26,6 +26,7 @@ const ContactListSimple: React.FC = ({ const [contactGroups, setContactGroups] = useState([]); const [labels, setLabels] = useState([]); const [loading, setLoading] = useState(false); + const [initializing, setInitializing] = useState(true); // 初始化状态 const [activeKey, setActiveKey] = useState([]); // 分页相关状态(合并为对象,减少状态数量) @@ -119,14 +120,36 @@ const ContactListSimple: React.FC = ({ if (!currentUser?.id || labels.length === 0) return; try { - const groupStats = await getGroupStatistics( + // 先检查本地数据库是否有数据 + const localContacts = await ContactManager.getUserContacts( currentUser.id, - labels, - currentCustomer?.id, ); - setContactGroups(groupStats); + + if (localContacts && localContacts.length > 0) { + // 有本地数据,直接加载分组统计(不显示骨架屏) + const groupStats = await getGroupStatistics( + currentUser.id, + labels, + currentCustomer?.id, + ); + setContactGroups(groupStats); + setInitializing(false); // 初始化完成 + } else { + // 没有本地数据,显示骨架屏 + setLoading(true); + const groupStats = await getGroupStatistics( + currentUser.id, + labels, + currentCustomer?.id, + ); + setContactGroups(groupStats); + setLoading(false); + setInitializing(false); // 初始化完成 + } } catch (error) { console.error("获取分组统计失败:", error); + setLoading(false); + setInitializing(false); // 即使失败也标记为完成 } }; @@ -358,21 +381,18 @@ const ContactListSimple: React.FC = ({ setActiveKey(newKeys); }; - // 渲染加载更多按钮 + // 渲染加载更多文字 const renderLoadMoreButton = (groupKey: string) => { if (!groupData.hasMore[groupKey]) { return
没有更多了
; } return ( -
- +
!groupData.loading[groupKey] && handleLoadMore(groupKey)} + > + {groupData.loading[groupKey] ? "加载中..." : "加载更多"}
); }; @@ -433,8 +453,8 @@ const ContactListSimple: React.FC = ({ return (
- {loading ? ( - // 加载状态:显示骨架屏(只在首次无本地数据时显示) + {loading || initializing ? ( + // 加载状态:显示骨架屏(初始化或首次无本地数据时显示) renderSkeleton() ) : isSearchMode ? ( // 搜索模式:直接显示搜索结果列表