取消关注添加确认弹窗、个人页添加往期球局

src/user_pages/myself/index.scss

@@ -365,4 +365,15 @@
       }
     }
   }
+}
+
+.ended_game_text {
+  font-family: "PingFang SC";
+  font-weight: 600;
+  font-size: 20px;
+  line-height: 1.4em;
+  letter-spacing: 1.9%;
+  color: rgba(0, 0, 0, 0.85);
+  transition: color 0.3s ease;
+  padding: 24px 15px;
 }

src/user_pages/myself/index.tsx

@@ -41,6 +41,8 @@ const MyselfPage: React.FC = () => {
 
   // 球局记录状态
   const [game_records, set_game_records] = useState<TennisMatch[]>([]);
+  // 往期球局
+  const [ended_game_records, setEndedGameRecords] = useState<TennisMatch[]>([]);
   const [loading, set_loading] = useState(true);
 
   // 关注状态
@@ -99,7 +101,26 @@ const MyselfPage: React.FC = () => {
       load_game_data();
     }
   }, [active_tab]);
-
+  // 分类球局数据
+  const classifyGameRecords = (
+    game_records: TennisMatch[]
+  ): { notEndGames: TennisMatch[]; finishedGames: TennisMatch[] } => {
+    const now = new Date().getTime();
+    return game_records.reduce(
+      (result, cur) => {
+        let { end_time } = cur;
+        end_time = end_time.replace(/\s/, "T");
+        new Date(end_time).getTime() > now
+          ? result.notEndGames.push(cur)
+          : result.finishedGames.push(cur);
+        return result;
+      },
+      {
+        notEndGames: [] as TennisMatch[],
+        finishedGames: [] as TennisMatch[],
+      }
+    );
+  };
   // 加载球局数据
   const load_game_data = async () => {
     try {
@@ -109,7 +130,13 @@ const MyselfPage: React.FC = () => {
       } else {
         games_data = await UserService.get_participated_games(user_info.id);
       }
-      set_game_records(games_data);
+      const sorted_games = games_data.sort((a, b) => {
+        return new Date(a.original_start_time.replace(/\s/, 'T')).getTime() - new Date(b.original_start_time.replace(/\s/, 'T')).getTime();
+      });
+      const { notEndGames, finishedGames } = classifyGameRecords(sorted_games);
+      set_game_records(notEndGames);
+      setEndedGameRecords(finishedGames);
+      // set_game_records(games_data);
     } catch (error) {
       console.error("加载球局数据失败:", error);
     }
@@ -225,6 +252,41 @@ const MyselfPage: React.FC = () => {
             />
           </ScrollView>
         </View>
+
+        {/* 往期球局 */}
+        <View className="ended_game_text">往期球局</View>
+        <View className="game_list_section">
+          {/* <View className="date_header">
+            <Text className="date_text">5月29日</Text>
+            <Text className="separator">/</Text>
+            <Text className="weekday_text">星期六</Text>
+          </View> */}
+
+          {/* 球局列表 */}
+          {/* <View className="game_list_section"> */}
+          <ScrollView scrollY>
+            <ListContainer
+              data={ended_game_records}
+              recommendList={[]}
+              loading={loading}
+              error={null}
+              reload={load_game_data}
+              loadMoreMatches={() => { }}
+            />
+          </ScrollView>
+          {/* </View> */}
+
+          {/* 球局卡片 */}
+          {/* <View className="game_cards">
+            {game_records.map((game) => (
+              <GameCard
+                key={game.id}
+                game={game}
+                on_click={handle_game_detail}
+              />
+            ))}
+          </View> */}
+        </View>
       </View>
       <GuideBar currentPage="personal" />
     </View>