事件中心有引用的相关详情样式调整

src/views/Community/components/DynamicNewsCard/VirtualizedFourRowGrid.js

@@ -73,7 +73,7 @@ const VirtualizedFourRowGrid = ({
    * 【核心逻辑1】无限滚动 + 顶部刷新 - 监听滚动事件，根据滚动位置自动加载数据或刷新
    *
    * 工作原理：
-   * 1. 向下滚动到 60% 位置时，触发 loadNextPage()
+   * 1. 向下滚动到 90% 位置时，触发 loadNextPage()
    *    - 调用 usePagination.loadNextPage()
    *    - 内部执行 handlePageChange(currentPage + 1)
    *    - dispatch(fetchDynamicNews({ page: nextPage }))
@@ -87,7 +87,7 @@ const VirtualizedFourRowGrid = ({
    *    - 与5分钟定时刷新协同工作
    *
    * 设计要点：
-   * - 60% 触发点：提前加载，避免滚动到底部时才出现加载状态
+   * - 90% 触发点：接近底部才加载，避免过早触发影响用户体验
    * - 防抖机制：isLoadingMore.current 防止重复触发
    * - 两层缓存：
    *   - Redux 缓存（HTTP层）：fourRowEvents 数组存储已加载数据，避免重复请求
@@ -107,9 +107,9 @@ const VirtualizedFourRowGrid = ({
       const { scrollTop, scrollHeight, clientHeight } = scrollElement;
       const scrollPercentage = (scrollTop + clientHeight) / scrollHeight;
 
-      // 向下滚动：滚动到 60% 时开始加载下一页
+      // 向下滚动：滚动到 90% 时开始加载下一页（更接近底部，避免过早触发）
-      if (loadNextPage && hasMore && scrollPercentage > 0.6) {
+      if (loadNextPage && hasMore && scrollPercentage > 0.9) {
-        console.log('%c📜 [无限滚动] 到达底部，加载下一页', 'color: #8B5CF6; font-weight: bold;');
+        console.log('%c📜 [无限滚动] 接近底部，加载下一页', 'color: #8B5CF6; font-weight: bold;');
         isLoadingMore.current = true;
         await loadNextPage();
         isLoadingMore.current = false;

src/views/Community/components/DynamicNewsDetail/StockListItem.js

@@ -125,7 +125,7 @@ const StockListItem = ({
       transition="all 0.2s"
     >
       {/* 单行紧凑布局：名称+涨跌幅 | 分时图 | K线图 | 关联描述 */}
-      <HStack spacing={3} align="stretch">
+      <HStack spacing={3} align="stretch" flexWrap="wrap">
         {/* 左侧：股票代码 + 名称 + 涨跌幅（垂直排列） - 收窄 */}
         <VStack
           align="stretch"
@@ -189,9 +189,11 @@ const StockListItem = ({
           </HStack>
         </VStack>
 
-        {/* 分时图 - 固定宽度 */}
+        {/* 分时图 - 响应式宽度 */}
         <Box
-          w="160px"
+          minW="140px"
+          maxW="160px"
+          flex="1"
           maxH="50px"
           h="auto"
           borderWidth="1px"
@@ -204,8 +206,9 @@ const StockListItem = ({
             setIsModalOpen(true);
           }}
           cursor="pointer"
-          flexShrink={0}
+          flexShrink={1}
           alignSelf="center"
+          overflow="hidden"
           _hover={{
             borderColor: useColorModeValue('blue.300', 'blue.500'),
             boxShadow: 'sm'
@@ -217,18 +220,23 @@ const StockListItem = ({
             color={useColorModeValue('blue.700', 'blue.200')}
             mb={1}
             fontWeight="semibold"
+            whiteSpace="nowrap"
           >
             📈 分时
           </Text>
+          <Box overflow="hidden">
             <MiniTimelineChart
               stockCode={stock.stock_code}
               eventTime={eventTime}
             />
           </Box>
+        </Box>
 
-        {/* K线图 - 固定宽度 */}
+        {/* K线图 - 响应式宽度 */}
         <Box
-          w="160px"
+          minW="140px"
+          maxW="160px"
+          flex="1"
           maxH="50px"
           h="auto"
           borderWidth="1px"
@@ -241,8 +249,9 @@ const StockListItem = ({
             setIsModalOpen(true);
           }}
           cursor="pointer"
-          flexShrink={0}
+          flexShrink={1}
           alignSelf="center"
+          overflow="hidden"
           _hover={{
             borderColor: useColorModeValue('purple.300', 'purple.500'),
             boxShadow: 'sm'
@@ -254,30 +263,61 @@ const StockListItem = ({
             color={useColorModeValue('purple.700', 'purple.200')}
             mb={1}
             fontWeight="semibold"
+            whiteSpace="nowrap"
           >
             📊 日线
           </Text>
+          <Box overflow="hidden">
             <MiniKLineChart
               stockCode={stock.stock_code}
               eventTime={eventTime}
             />
           </Box>
+        </Box>
 
         {/* 关联描述 - 升级和降级处理 */}
         {stock.relation_desc && (
           <Box flex={1} minW={0}>
             {stock.relation_desc?.data ? (
-              // 升级：带引用来源的版本
+              // 升级：带引用来源的版本 - 添加折叠功能
+              <Tooltip
+                label={isDescExpanded ? "点击收起" : "点击展开完整描述"}
+                placement="top"
+                hasArrow
+                bg="gray.600"
+                color="white"
+                fontSize="xs"
+              >
+                <Box
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setIsDescExpanded(!isDescExpanded);
+                  }}
+                  cursor="pointer"
+                  px={3}
+                  py={2}
+                  bg={useColorModeValue('gray.50', 'gray.700')}
+                  borderRadius="md"
+                  _hover={{
+                    bg: useColorModeValue('gray.100', 'gray.600'),
+                  }}
+                  transition="background 0.2s"
+                  position="relative"
+                >
+                  <Collapse in={isDescExpanded} startingHeight={40}>
                     <CitedContent
                       data={stock.relation_desc}
                       title=""
                       showAIBadge={true}
                       containerStyle={{
-                  backgroundColor: useColorModeValue('#f7fafc', 'rgba(45, 55, 72, 0.6)'),
+                        backgroundColor: 'transparent',
-                  borderRadius: '8px',
+                        borderRadius: '0',
                         padding: '0',
                       }}
                     />
+                  </Collapse>
+                </Box>
+              </Tooltip>
             ) : (
               // 降级：纯文本版本（保留展开/收起功能）
               <Tooltip