community增加事件详情

src/views/Community/components/HeroPanel.js

@@ -264,8 +264,9 @@ TrendIcon.displayName = 'TrendIcon';
 
 /**
  * 日历单元格 - 显示涨停数和事件数（加大尺寸）
+ * 新增：连续概念连接展示（connectLeft/connectRight 表示与左右格子是否同一概念）
  */
-const CalendarCell = memo(({ date, ztData, eventCount, previousZtData, isSelected, isToday, isWeekend, onClick }) => {
+const CalendarCell = memo(({ date, ztData, eventCount, previousZtData, isSelected, isToday, isWeekend, onClick, connectLeft, connectRight }) => {
   if (!date) {
     return <Box minH="75px" />;
   }
@@ -276,6 +277,9 @@ const CalendarCell = memo(({ date, ztData, eventCount, previousZtData, isSelecte
   const heatColors = getHeatColor(ztCount);
   const topSector = ztData?.top_sector || '';
 
+  // 是否有连接线（连续概念）
+  const hasConnection = connectLeft || connectRight;
+
   // 周末无数据显示"休市"
   if (isWeekend && !hasZtData && !hasEventData) {
     return (
@@ -394,11 +398,48 @@ const CalendarCell = memo(({ date, ztData, eventCount, previousZtData, isSelecte
             </HStack>
           )}
 
-          {/* 主要板块 */}
+          {/* 主要板块 - 连续概念用连接样式 */}
           {hasZtData && topSector && (
-            <Text fontSize="xs" color={textColors.secondary} noOfLines={1} maxW="70px">
+            <Box position="relative" w="full" display="flex" justifyContent="center" alignItems="center">
+              {/* 左连接线 */}
+              {connectLeft && (
+                <Box
+                  position="absolute"
+                  left="-12px"
+                  top="50%"
+                  transform="translateY(-50%)"
+                  w="12px"
+                  h="2px"
+                  bgGradient="linear(to-r, rgba(212,175,55,0.6), rgba(212,175,55,0.3))"
+                />
+              )}
+              <Text
+                fontSize="xs"
+                color={hasConnection ? goldColors.primary : textColors.secondary}
+                fontWeight={hasConnection ? 'bold' : 'normal'}
+                noOfLines={1}
+                maxW="70px"
+                bg={hasConnection ? 'rgba(212,175,55,0.15)' : 'transparent'}
+                px={hasConnection ? 1.5 : 0}
+                py={hasConnection ? 0.5 : 0}
+                borderRadius={hasConnection ? 'full' : 'none'}
+                border={hasConnection ? '1px solid rgba(212,175,55,0.3)' : 'none'}
+              >
                 {topSector}
               </Text>
+              {/* 右连接线 */}
+              {connectRight && (
+                <Box
+                  position="absolute"
+                  right="-12px"
+                  top="50%"
+                  transform="translateY(-50%)"
+                  w="12px"
+                  h="2px"
+                  bgGradient="linear(to-l, rgba(212,175,55,0.6), rgba(212,175,55,0.3))"
+                />
+              )}
+            </Box>
           )}
         </VStack>
       </Box>
@@ -2251,7 +2292,7 @@ const DetailModal = ({ isOpen, onClose, selectedDate, ztDetail, events, loading
                     rowKey="scode"
                     size="small"
                     pagination={false}
-                    scroll={{ y: 400 }}
+                    scroll={{ x: 650, y: 400 }}
                   />
                 </Box>
               </VStack>
@@ -2416,15 +2457,16 @@ const CombinedCalendar = () => {
     return result;
   }, [currentMonth]);
 
-  // 预计算日历格子数据
+  // 预计算日历格子数据（含连续概念检测）
   const calendarCellsData = useMemo(() => {
     const today = new Date();
     const todayStr = today.toDateString();
     const selectedDateStr = selectedDate?.toDateString();
 
-    return days.map((date, index) => {
+    // 第一遍：构建基础数据
+    const baseData = days.map((date, index) => {
       if (!date) {
-        return { key: `empty-${index}`, date: null };
+        return { key: `empty-${index}`, date: null, topSector: null };
       }
 
       const ztDateStr = formatDateStr(date);
@@ -2446,8 +2488,37 @@ const CombinedCalendar = () => {
         isSelected: date.toDateString() === selectedDateStr,
         isToday: date.toDateString() === todayStr,
         isWeekend: dayOfWeek === 0 || dayOfWeek === 6,
+        topSector: ztData?.top_sector || null,
+        dayOfWeek,
       };
     });
+
+    // 第二遍：检测连续概念（同一行内，排除周末和跨行）
+    return baseData.map((cellData, index) => {
+      if (!cellData.date || !cellData.topSector) {
+        return { ...cellData, connectLeft: false, connectRight: false };
+      }
+
+      // 检查左边（前一格）
+      let connectLeft = false;
+      if (index > 0 && cellData.dayOfWeek !== 0) { // 不是周日（行首）
+        const prevCell = baseData[index - 1];
+        if (prevCell?.date && prevCell.topSector === cellData.topSector && !prevCell.isWeekend) {
+          connectLeft = true;
+        }
+      }
+
+      // 检查右边（后一格）
+      let connectRight = false;
+      if (index < baseData.length - 1 && cellData.dayOfWeek !== 6) { // 不是周六（行尾）
+        const nextCell = baseData[index + 1];
+        if (nextCell?.date && nextCell.topSector === cellData.topSector && !nextCell.isWeekend) {
+          connectRight = true;
+        }
+      }
+
+      return { ...cellData, connectLeft, connectRight };
+    });
   }, [days, ztDataMap, eventCountMap, selectedDate]);
 
   // 处理日期点击 - 打开弹窗
@@ -2592,6 +2663,8 @@ const CombinedCalendar = () => {
                 isToday={cellData.isToday}
                 isWeekend={cellData.isWeekend}
                 onClick={handleDateClick}
+                connectLeft={cellData.connectLeft}
+                connectRight={cellData.connectRight}
               />
             ))}
           </SimpleGrid>