From d05f84426c3b6a32a2ca61ba65c8fd65df2cbc76 Mon Sep 17 00:00:00 2001
From: zdl <3489966805@qq.com>
Date: Thu, 15 Jan 2026 15:03:38 +0800
Subject: [PATCH] =?UTF-8?q?feat(HeroPanel):=20=E8=B4=A2=E7=BB=8F=E6=97=A5?=
 =?UTF-8?q?=E5=8E=86=E4=BA=A4=E4=BA=92=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- CombinedCalendar: 点击概念条打开概念详情页
- DetailModal: 日期点击弹窗恢复为居中 Modal
- DetailModal: 事件背景/推演详情改为右侧抽屉(500px)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 .../HeroPanel/components/CombinedCalendar.js  | 12 +++++++++
 .../components/DetailModal/DetailModal.js     | 26 +++++++------------
 2 files changed, 22 insertions(+), 16 deletions(-)

diff --git a/src/views/Community/components/HeroPanel/components/CombinedCalendar.js b/src/views/Community/components/HeroPanel/components/CombinedCalendar.js
index b925b58f..f58ddcd8 100644
--- a/src/views/Community/components/HeroPanel/components/CombinedCalendar.js
+++ b/src/views/Community/components/HeroPanel/components/CombinedCalendar.js
@@ -14,6 +14,7 @@ import dayjs from "dayjs";
 import { GLASS_BLUR } from "@/constants/glassConfig";
 import { eventService } from "@services/eventService";
 import { getApiBase } from "@utils/apiConfig";
+import { getConceptHtmlUrl } from "@utils/textUtils";
 import { textColors } from "../constants";
 import { formatDateStr } from "../utils";
 
@@ -132,6 +133,16 @@ const CombinedCalendar = ({ DetailModal }) => {
     setCurrentMonth(new Date(year, month - 1, 1));
   }, []);
 
+  // 处理概念条点击 - 打开概念详情页
+  const handleEventClick = useCallback((event) => {
+    // event.title 格式: "概念名 (N天)" 或 "概念名"
+    const conceptName = event.title.replace(/\s*\(\d+天\)$/, "");
+    const url = getConceptHtmlUrl(conceptName);
+    if (url) {
+      window.open(url, "_blank");
+    }
+  }, []);
+
   return (
     <>
       <Box
@@ -241,6 +252,7 @@ const CombinedCalendar = ({ DetailModal }) => {
             currentMonth={currentMonth}
             onDateClick={handleDateClick}
             onMonthChange={handleMonthChange}
+            onEventClick={handleEventClick}
           />
         </Suspense>
       </Box>
diff --git a/src/views/Community/components/HeroPanel/components/DetailModal/DetailModal.js b/src/views/Community/components/HeroPanel/components/DetailModal/DetailModal.js
index fb82f6e5..e415150e 100644
--- a/src/views/Community/components/HeroPanel/components/DetailModal/DetailModal.js
+++ b/src/views/Community/components/HeroPanel/components/DetailModal/DetailModal.js
@@ -14,6 +14,7 @@ import {
   Typography,
   message,
   Modal as AntModal,
+  Drawer,
   ConfigProvider,
   theme,
 } from "antd";
@@ -439,7 +440,7 @@ const DetailModal = ({
           open={isOpen}
           onCancel={onClose}
           footer={null}
-          width={1300}
+          width={1000}
           centered
           title={
             <div style={{ display: "flex", alignItems: "center", gap: "16px" }}>
@@ -891,7 +892,7 @@ const DetailModal = ({
         </AntModal>
       </ConfigProvider>
 
-      {/* 内容详情弹窗 - 页面居中 */}
+      {/* 内容详情抽屉 - 右侧滑入 */}
       <ConfigProvider
         theme={{
           algorithm: theme.darkAlgorithm,
@@ -901,33 +902,27 @@ const DetailModal = ({
           },
         }}
       >
-        <AntModal
+        <Drawer
           title={selectedContent?.title}
           open={detailDrawerVisible}
-          onCancel={() => setDetailDrawerVisible(false)}
-          footer={null}
-          width={700}
-          centered
+          onClose={() => setDetailDrawerVisible(false)}
+          placement="right"
+          width={500}
           zIndex={1500}
           styles={{
             header: {
               background: "rgba(25,25,50,0.98)",
               borderBottom: "1px solid rgba(255,215,0,0.2)",
               padding: "16px 24px",
-              marginBottom: 0,
             },
             body: {
               background:
                 "linear-gradient(135deg, rgba(15,15,30,0.98) 0%, rgba(25,25,50,0.98) 100%)",
               padding: "24px",
-              maxHeight: "70vh",
-              overflowY: "auto",
             },
-            content: {
+            wrapper: {
               background:
                 "linear-gradient(135deg, rgba(15,15,30,0.98) 0%, rgba(25,25,50,0.98) 100%)",
-              borderRadius: "12px",
-              border: "1px solid rgba(255,215,0,0.2)",
             },
             mask: {
               background: "rgba(0,0,0,0.6)",
@@ -936,8 +931,7 @@ const DetailModal = ({
         >
           <div
             style={{
-              height: "500px",
-              overflowY: "auto",
+              height: "100%",
             }}
           >
             <div
@@ -969,7 +963,7 @@ const DetailModal = ({
               </p>
             </div>
           </div>
-        </AntModal>
+        </Drawer>
       </ConfigProvider>
 
       {/* 相关股票弹窗 */}