From caef9d7d46b58ae8ebbc08ce84341f19d7aa8f5c 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: Tue, 18 Nov 2025 14:22:42 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=BC=BATwoColumnSelection=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=EF=BC=8C=E6=B7=BB=E5=8A=A0=E5=8A=A0=E8=BD=BD=E6=9B=B4?=
 =?UTF-8?q?=E5=A4=9A=E5=8A=9F=E8=83=BD=E5=92=8C=E7=8A=B6=E6=80=81=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=EF=BC=8C=E4=BC=98=E5=8C=96=E5=A5=BD=E5=8F=8B=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=E7=9A=84=E5=88=86=E9=A1=B5=E9=80=BB=E8=BE=91=E3=80=82?=
 =?UTF-8?q?=E9=87=8D=E6=9E=84=E8=81=94=E7=B3=BB=E4=BA=BA=E6=95=B0=E6=8D=AE?=
 =?UTF-8?q?=E8=8E=B7=E5=8F=96=E9=80=BB=E8=BE=91=EF=BC=8C=E7=A7=BB=E9=99=A4?=
 =?UTF-8?q?=E4=B8=8D=E5=86=8D=E4=BD=BF=E7=94=A8=E7=9A=84=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=EF=BC=8C=E7=A1=AE=E4=BF=9D=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E6=80=A7=E8=83=BD=E5=92=8C=E7=94=A8=E6=88=B7=E4=BD=93=E9=AA=8C?=
 =?UTF-8?q?=E3=80=82=E6=9B=B4=E6=96=B0ProfileCard=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E4=BB=A5=E6=94=AF=E6=8C=81=E6=96=B0=E7=9A=84=E8=81=94=E7=B3=BB?=
 =?UTF-8?q?=E4=BA=BA=E5=8A=A0=E8=BD=BD=E6=96=B9=E5=BC=8F=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../TwoColumnSelection/TwoColumnSelection.tsx | 69 ++++---------------
 1 file changed, 12 insertions(+), 57 deletions(-)

diff --git a/Touchkebao/src/components/TwoColumnSelection/TwoColumnSelection.tsx b/Touchkebao/src/components/TwoColumnSelection/TwoColumnSelection.tsx
index 6ba96274..e1475cdc 100644
--- a/Touchkebao/src/components/TwoColumnSelection/TwoColumnSelection.tsx
+++ b/Touchkebao/src/components/TwoColumnSelection/TwoColumnSelection.tsx
@@ -65,8 +65,6 @@ const TwoColumnSelection: React.FC<TwoColumnSelectionProps> = ({
   );
   const [searchQuery, setSearchQuery] = useState("");
   const [isLoading, setIsLoading] = useState(false);
-  const [currentPage, setCurrentPage] = useState(1);
-  const [totalPages, setTotalPages] = useState(1);
 
   // 使用 useMemo 缓存过滤结果，避免每次渲染都重新计算
   const filteredFriends = useMemo(() => {
@@ -83,17 +81,8 @@ const TwoColumnSelection: React.FC<TwoColumnSelectionProps> = ({
     );
   }, [dataSource, rawFriends, searchQuery]);
 
-  // 分页显示好友列表，避免一次性渲染太多项目
-  const ITEMS_PER_PAGE = 50;
-  const [displayPage, setDisplayPage] = useState(1);
-
-  const friends = useMemo(() => {
-    // 直接使用完整的过滤列表，不再进行本地分页
-    // 因为我们已经在外部进行了分页加载
-    return filteredFriends;
-  }, [filteredFriends]);
-
-  const hasMoreFriends = filteredFriends.length > friends.length;
+  // 好友列表直接使用过滤后的结果
+  const friends = filteredFriends;
 
   // 使用 useMemo 缓存选中状态映射，避免每次渲染都重新计算
   const selectedFriendsMap = useMemo(() => {
@@ -126,7 +115,6 @@ const TwoColumnSelection: React.FC<TwoColumnSelectionProps> = ({
 
         if (response.success) {
           setRawFriends(response.data.list || []);
-          setTotalPages(Math.ceil((response.data.total || 0) / 20));
         } else {
           setRawFriends([]);
           message.error(response.message || "获取好友列表失败");
@@ -146,7 +134,6 @@ const TwoColumnSelection: React.FC<TwoColumnSelectionProps> = ({
     if (visible && !dataSource) {
       // 只有在没有外部数据源时才调用 API
       fetchFriends(1);
-      setCurrentPage(1);
     }
   }, [visible, dataSource, fetchFriends]);
 
@@ -160,44 +147,18 @@ const TwoColumnSelection: React.FC<TwoColumnSelectionProps> = ({
   }, [visible]);
 
   // 防抖搜索处理
-  const handleSearch = useCallback(() => {
-    let timeoutId: NodeJS.Timeout;
-    return (value: string) => {
-      clearTimeout(timeoutId);
-      timeoutId = setTimeout(() => {
-        setDisplayPage(1); // 重置分页
-        if (!dataSource) {
-          fetchFriends(1, value);
-        }
-      }, 300);
-    };
-  }, [dataSource, fetchFriends])();
-
-  // API搜索处理（当没有外部数据源时）
-  const handleApiSearch = useCallback(
-    async (keyword: string) => {
+  const handleSearch = useCallback(
+    (value: string) => {
       if (!dataSource) {
-        await fetchFriends(1, keyword);
+        const timer = setTimeout(() => {
+          fetchFriends(1, value);
+        }, 300);
+        return () => clearTimeout(timer);
       }
     },
     [dataSource, fetchFriends],
   );
 
-  // 加载更多好友
-  const handleLoadMore = useCallback(() => {
-    setDisplayPage(prev => prev + 1);
-  }, []);
-
-  // 防抖搜索
-  useEffect(() => {
-    if (!dataSource && searchQuery.trim()) {
-      const timer = setTimeout(() => {
-        handleApiSearch(searchQuery);
-      }, 300);
-      return () => clearTimeout(timer);
-    }
-  }, [searchQuery, dataSource, handleApiSearch]);
-
   // 选择好友 - 使用 useCallback 优化性能
   const handleSelectFriend = useCallback((friend: FriendSelectionItem) => {
     setSelectedFriends(prev => {
@@ -223,10 +184,8 @@ const TwoColumnSelection: React.FC<TwoColumnSelectionProps> = ({
     setSearchQuery("");
   }, [selectedFriends, onConfirm]);
 
-  // 取消选择 - 使用 useCallback 优化性能
+  // 取消选择
   const handleCancel = useCallback(() => {
-    setSelectedFriends([]);
-    setSearchQuery("");
     onCancel();
   }, [onCancel]);
 
@@ -255,8 +214,8 @@ const TwoColumnSelection: React.FC<TwoColumnSelectionProps> = ({
               value={searchQuery}
               onChange={e => {
                 const value = e.target.value;
-                setSearchQuery(value); // 立即更新显示
-                handleSearch(value); // 防抖处理搜索
+                setSearchQuery(value);
+                handleSearch(value);
               }}
               prefix={<SearchOutlined />}
               allowClear
@@ -290,11 +249,7 @@ const TwoColumnSelection: React.FC<TwoColumnSelectionProps> = ({
             {/* 使用外部传入的加载更多 */}
             {hasMore && (
               <div className={styles.loadMoreWrapper}>
-                <Button
-                  type="link"
-                  onClick={() => (onLoadMore ? onLoadMore() : handleLoadMore())}
-                  loading={loading}
-                >
+                <Button type="link" onClick={onLoadMore} loading={loading}>
                   加载更多
                 </Button>
               </div>