feat: 添加事件详情面板

src/views/Community/components/DynamicNewsCard.js

@@ -1,7 +1,7 @@
 // src/views/Community/components/DynamicNewsCard.js
 // 横向滚动事件卡片组件（实时要闻·动态追踪）
 
-import React, { forwardRef, useRef, useState } from 'react';
+import React, { forwardRef, useRef, useState, useEffect } from 'react';
 import {
   Card,
   CardHeader,
@@ -20,6 +20,7 @@ import {
 } from '@chakra-ui/react';
 import { ChevronLeftIcon, ChevronRightIcon, TimeIcon } from '@chakra-ui/icons';
 import DynamicNewsEventCard from './EventCard/DynamicNewsEventCard';
+import DynamicNewsDetailPanel from './DynamicNewsDetailPanel';
 
 /**
  * 实时要闻·动态追踪 - 横向滚动卡片组件
@@ -43,6 +44,14 @@ const DynamicNewsCard = forwardRef(({
   const scrollContainerRef = useRef(null);
   const [showLeftArrow, setShowLeftArrow] = useState(false);
   const [showRightArrow, setShowRightArrow] = useState(true);
+  const [selectedEvent, setSelectedEvent] = useState(null);
+
+  // 默认选中第一个事件
+  useEffect(() => {
+    if (events && events.length > 0 && !selectedEvent) {
+      setSelectedEvent(events[0]);
+    }
+  }, [events, selectedEvent]);
 
   // 滚动到左侧
   const scrollLeft = () => {
@@ -214,11 +223,15 @@ const DynamicNewsCard = forwardRef(({
                     index={index}
                     isFollowing={false}
                     followerCount={event.follower_count || 0}
-                    onEventClick={onEventClick}
+                    onEventClick={(clickedEvent) => {
+                      setSelectedEvent(clickedEvent);
+                      if (onEventClick) onEventClick(clickedEvent);
+                    }}
                     onTitleClick={(e) => {
                       e.preventDefault();
                       e.stopPropagation();
-                      onEventClick(event);
+                      setSelectedEvent(event);
+                      if (onEventClick) onEventClick(event);
                     }}
                     onToggleFollow={() => {}}
                     timelineStyle={getTimelineBoxStyle()}
@@ -229,6 +242,13 @@ const DynamicNewsCard = forwardRef(({
             </Flex>
           </Box>
         )}
+
+        {/* 详情面板 */}
+        {!loading && events && events.length > 0 && (
+          <Box mt={6}>
+            <DynamicNewsDetailPanel event={selectedEvent} />
+          </Box>
+        )}
       </CardBody>
     </Card>
   );