From 1b01cff7d7bad1060c1842cb003d4e4ffd5e6a48 Mon Sep 17 00:00:00 2001
From: kyuuseiryuu <kyuuseiryuu@gmail.com>
Date: Mon, 16 Mar 2026 13:46:49 +0900
Subject: [PATCH] refactor: extract club header logic into ClubSummary
 component and simplify ClubEventsPage

- Moved header logic (background, avatar, title, notice button) from ClubEventsPage into a new ClubSummary component.
- Updated ClubEventsPage to use ClubSummary instead of managing layout and state directly.
- Fixed `onClick` handler in ClubSummary to correctly spread the `info.geo` object when passing to `openWebMapRaw`.
- Removed unused imports and state from ClubEventsPage.
---
 src/components/ClubSummary.tsx |  4 +++-
 src/page/ClubEvents.tsx        | 19 +++----------------
 2 files changed, 6 insertions(+), 17 deletions(-)

diff --git a/src/components/ClubSummary.tsx b/src/components/ClubSummary.tsx
index 0547bd1..030afc8 100644
--- a/src/components/ClubSummary.tsx
+++ b/src/components/ClubSummary.tsx
@@ -62,7 +62,9 @@ export const ClubSummary = (props: Props) => {
                   trigger={['click']}
                   menu={{
                     items: mapMenu,
-                    onClick: (e) => openWebMapRaw(e.key as MapType, info.geo!),
+                    onClick: (e) => openWebMapRaw(e.key as MapType, {
+                      ...info.geo!,
+                    }),
                   }}
                 >
                   <Button icon={<PushpinOutlined />}>
diff --git a/src/page/ClubEvents.tsx b/src/page/ClubEvents.tsx
index 688a885..0d76fc3 100644
--- a/src/page/ClubEvents.tsx
+++ b/src/page/ClubEvents.tsx
@@ -1,30 +1,17 @@
-import { Avatar, Button, Drawer, Typography } from "antd";
 import { useLoaderData } from "react-router";
-import type { ClubDetail, IEventInfo } from "../types";
-import { useState } from "react";
-import { ChangeBackground } from "../components/ChangeBackground";
+import type { ClubDetail } from "../types";
 import { ClubEvenList } from "../components/ClubEventList";
+import { ClubSummary } from "../components/ClubSummary";
 
 export const ClubEventsPage = () => {
   const { info } = useLoaderData<{
     info: ClubDetail;
-    events: IEventInfo[];
-    total: number;
   }>();
 
-  const [isArticleOpen, setIsArticleOpen] = useState(false);
   return (
     <div className="app">
-      <ChangeBackground url={info.img} />
-      <Avatar src={info.img} size={80} />
-      <Typography.Title>{info.name}</Typography.Title>
-      <Button onClick={() => setIsArticleOpen(true)}>查看公告</Button>
+      <ClubSummary clubId={info.id} />
       <ClubEvenList clubId={info.id} />
-      <Drawer size={'60vh'} open={isArticleOpen} onClose={() => setIsArticleOpen(false)} placement="bottom">
-        <div style={{ textAlign: 'center' }}>
-          <Typography.Paragraph style={{ whiteSpace: 'pre', textWrap: 'auto' }}>{info.article}</Typography.Paragraph>
-        </div>
-      </Drawer>
     </div>
   );
 }
\ No newline at end of file