diff --git a/src/views/Community/components/HeroPanel.js b/src/views/Community/components/HeroPanel.js index 7c8e7835..c8dca173 100644 --- a/src/views/Community/components/HeroPanel.js +++ b/src/views/Community/components/HeroPanel.js @@ -418,6 +418,7 @@ const DetailModal = ({ isOpen, onClose, selectedDate, ztDetail, events, loading const [detailDrawerVisible, setDetailDrawerVisible] = useState(false); const [selectedContent, setSelectedContent] = useState(null); const [ztViewMode, setZtViewMode] = useState('sector'); // 'sector' | 'stock' + const [expandedSectors, setExpandedSectors] = useState({}); // 跟踪展开的板块 const [stocksDrawerVisible, setStocksDrawerVisible] = useState(false); const [selectedEventStocks, setSelectedEventStocks] = useState([]); const [selectedEventTime, setSelectedEventTime] = useState(null); @@ -442,13 +443,25 @@ const DetailModal = ({ isOpen, onClose, selectedDate, ztDetail, events, loading }, [ztDetail]); // 股票详情数据处理 - 支持两种字段名:stocks 和 stock_infos + // 按连板天数降序排列(高连板在前) const stockList = useMemo(() => { const stocksData = ztDetail?.stocks || ztDetail?.stock_infos; if (!stocksData) return []; - return stocksData.map(stock => ({ - ...stock, - key: stock.scode, - })); + + // 解析连板天数的辅助函数 + const parseContinuousDays = (text) => { + if (!text || text === '首板') return 1; + const match = text.match(/(\d+)/); + return match ? parseInt(match[1]) : 1; + }; + + return stocksData + .map(stock => ({ + ...stock, + key: stock.scode, + _continuousDays: parseContinuousDays(stock.continuous_days), // 用于排序 + })) + .sort((a, b) => b._continuousDays - a._continuousDays); // 降序排列 }, [ztDetail]); // 热门关键词 @@ -942,65 +955,90 @@ const DetailModal = ({ isOpen, onClose, selectedDate, ztDetail, events, loading title: '涨停股票', dataIndex: 'stocks', key: 'stocks', - render: (stocks) => { + render: (stocks, record) => { // 根据股票代码查找股票详情 const getStockInfo = (code) => { const stockInfo = stockList.find(s => s.scode === code); return stockInfo || { sname: code, scode: code }; }; + + const sectorName = record.name; + const isExpanded = expandedSectors[sectorName]; + const displayStocks = isExpanded ? stocks : stocks.slice(0, 5); + const hasMore = stocks.length > 5; + + const toggleExpand = (e) => { + e.stopPropagation(); + setExpandedSectors(prev => ({ + ...prev, + [sectorName]: !prev[sectorName] + })); + }; + return ( - - {stocks.slice(0, 5).map((code) => { - const info = getStockInfo(code); - return ( - - {info.sname} - {code} - {info.core_sectors && ( - - {info.core_sectors.slice(0, 2).join(' · ')} - - )} - - } - placement="top" - > - + + {displayStocks.map((code) => { + const info = getStockInfo(code); + return ( + + {info.sname} + {code} + {info.core_sectors && ( + + {info.core_sectors.slice(0, 2).join(' · ')} + + )} + {info.continuous_days && ( + + {info.continuous_days} + + )} + + } + placement="top" > - - {info.sname} - - - - ); - })} - {stocks.length > 5 && ( - - +{stocks.length - 5} - + + {info.sname} + + + + ); + })} + + {hasMore && ( + + {isExpanded ? '收起 ▲' : `展开全部 ${stocks.length} 只 ▼`} + )} - + ); }, },