feat: 优化平铺模式的无限滚动触发机制

问题描述:
- 平铺模式下，当容器高度为 800px 但首页内容不足 800px 时
- 无法生成滚动条，导致无限滚动条件永远无法触发
- 用户需要手动翻页才能看到第二页内容

优化方案:
1. 降低滚动触发阈值
   - 从 80% 降低到 60%，更早触发下一页加载
   - 提升用户滚动体验，减少等待时间

2. 新增主动内容检测机制
   - 延迟 500ms 检测虚拟滚动渲染完成后的实际内容高度
   - 如果内容高度 ≤ 容器高度（无滚动条），自动加载下一页
   - 使用 isLoadingMore ref 防止重复触发

技术实现:
- VirtualizedFourRowGrid.js
  - 修改滚动阈值: scrollPercentage > 0.6 (line 78)
  - 新增 useEffect 监听 events.length 变化 (lines 90-117)
  - 条件判断: scrollHeight <= clientHeight 时主动加载

影响范围:
- 平铺模式 (four-row mode)

测试建议:
1. 切换到平铺模式
2. 观察首页数据少于 6 条时，是否自动加载第二页
3. 验证有足够数据时，滚动到 60% 是否正常触发加载

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

Co-Authored-By: Claude <noreply@anthropic.com>

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

@@ -74,8 +74,8 @@ const VirtualizedFourRowGrid = ({
       const { scrollTop, scrollHeight, clientHeight } = scrollElement;
       const scrollPercentage = (scrollTop + clientHeight) / scrollHeight;
 
-      // 滚动到 80% 时开始加载下一页
-      if (scrollPercentage > 0.8) {
+      // 滚动到 60% 时开始加载下一页（降低阈值，更早触发）
+      if (scrollPercentage > 0.6) {
         console.log('%c📜 [无限滚动] 到达底部，加载下一页', 'color: #8B5CF6; font-weight: bold;');
         isLoadingMore.current = true;
         await loadNextPage();
@@ -87,6 +87,35 @@ const VirtualizedFourRowGrid = ({
     return () => scrollElement.removeEventListener('scroll', handleScroll);
   }, [loadNextPage, hasMore, loading]);
 
+  // 主动检测内容高度 - 如果内容不足以填满容器，主动加载下一页
+  useEffect(() => {
+    const scrollElement = parentRef.current;
+    if (!scrollElement || !loadNextPage) return;
+
+    // 延迟检查，确保虚拟滚动已渲染
+    const timer = setTimeout(() => {
+      // 防止重复触发
+      if (isLoadingMore.current || !hasMore || loading) return;
+
+      const { scrollHeight, clientHeight } = scrollElement;
+
+      // 如果内容高度不足以填满容器（没有滚动条），主动加载下一页
+      if (scrollHeight <= clientHeight) {
+        console.log('%c📜 [无限滚动] 内容不足以填满容器，主动加载下一页', 'color: #8B5CF6; font-weight: bold;', {
+          scrollHeight,
+          clientHeight,
+          eventsCount: events.length
+        });
+        isLoadingMore.current = true;
+        loadNextPage().finally(() => {
+          isLoadingMore.current = false;
+        });
+      }
+    }, 500);
+
+    return () => clearTimeout(timer);
+  }, [events.length, hasMore, loading, loadNextPage]);
+
   // 底部加载指示器
   const renderLoadingIndicator = () => {
     if (!hasMore) {
@@ -118,13 +147,13 @@ const VirtualizedFourRowGrid = ({
       ref={parentRef}
       overflowY="auto"
       overflowX="hidden"
-      maxH="600px"
+      maxH="800px"
       w="100%"
       position="relative"
       css={{
         // 滚动条样式
         '&::-webkit-scrollbar': {
-          width: '8px',
+          width: '4px',
         },
         '&::-webkit-scrollbar-track': {
           background: scrollbarTrackBg,