diff --git a/src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js b/src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js index 9e712c2d..cfdf34b7 100644 --- a/src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js +++ b/src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js @@ -1,17 +1,20 @@ // src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js // 动态新闻详情面板主组件(组装所有子组件) -import React, { useState, useMemo, useCallback } from 'react'; +import React, { useState, useCallback } from 'react'; import { Card, CardBody, VStack, Text, + Spinner, + Center, useColorModeValue, useToast, } from '@chakra-ui/react'; import { getImportanceConfig } from '../../../../constants/importanceLevels'; import { eventService } from '../../../../services/eventService'; +import { useEventStocks } from '../StockDetailPanel/hooks/useEventStocks'; import EventHeaderInfo from './EventHeaderInfo'; import EventDescriptionSection from './EventDescriptionSection'; import RelatedConceptsSection from './RelatedConceptsSection'; @@ -31,6 +34,16 @@ const DynamicNewsDetailPanel = ({ event }) => { const textColor = useColorModeValue('gray.600', 'gray.400'); const toast = useToast(); + // 使用 Hook 获取实时数据 + const { + stocks, + quotes, + eventDetail, + historicalEvents, + expectationScore, + loading + } = useEventStocks(event?.id, event?.created_at); + // 折叠状态管理 const [isStocksOpen, setIsStocksOpen] = useState(true); const [isHistoricalOpen, setIsHistoricalOpen] = useState(false); @@ -50,26 +63,6 @@ const DynamicNewsDetailPanel = ({ event }) => { } }); - // 生成模拟行情数据 - const quotes = useMemo(() => { - if (!event?.related_stocks) return {}; - - const quotesData = {}; - event.related_stocks.forEach(stock => { - // 优先使用 stock.daily_change,否则生成随机涨跌幅 - const change = stock.daily_change - ? parseFloat(stock.daily_change) - : (Math.random() * 10 - 3); // -3% ~ +7% - - quotesData[stock.stock_code] = { - change: change, - price: 10 + Math.random() * 90 // 模拟价格 10-100 - }; - }); - - return quotesData; - }, [event?.related_stocks]); - // 切换关注状态 const handleToggleFollow = async () => { try { @@ -165,26 +158,40 @@ const DynamicNewsDetailPanel = ({ event }) => { /> {/* 相关股票(可折叠) */} - setIsStocksOpen(!isStocksOpen)} - onWatchlistToggle={handleWatchlistToggle} - /> + {loading.stocks || loading.quotes ? ( +
+ + 加载股票数据中... +
+ ) : ( + setIsStocksOpen(!isStocksOpen)} + onWatchlistToggle={handleWatchlistToggle} + /> + )} {/* 历史事件对比(可折叠) */} setIsHistoricalOpen(!isHistoricalOpen)} - count={event.historical_events?.length || 0} + count={historicalEvents?.length || 0} > - + {loading.historicalEvents ? ( +
+ + 加载历史事件... +
+ ) : ( + + )}
{/* 传导链分析(可折叠) */}