feat: 添加相关概念组件

src/views/Community/components/DynamicNewsDetail/RelatedConceptsSection/TradingDateInfo.js

@@ -0,0 +1,46 @@
+// src/views/Community/components/DynamicNewsDetail/RelatedConceptsSection/TradingDateInfo.js
+// 交易日期信息提示组件
+
+import React from 'react';
+import {
+  Box,
+  HStack,
+  Text,
+  useColorModeValue,
+} from '@chakra-ui/react';
+import { FaCalendarAlt } from 'react-icons/fa';
+import moment from 'moment';
+
+/**
+ * 交易日期信息提示组件
+ * @param {Object} props
+ * @param {string} props.effectiveTradingDate - 有效交易日期（涨跌幅数据日期）
+ * @param {string|Object} props.eventTime - 事件发生时间
+ */
+const TradingDateInfo = ({ effectiveTradingDate, eventTime }) => {
+  const sectionBg = useColorModeValue('gray.50', 'gray.750');
+  const headingColor = useColorModeValue('gray.700', 'gray.200');
+  const stockCountColor = useColorModeValue('gray.500', 'gray.400');
+
+  if (!effectiveTradingDate) {
+    return null;
+  }
+
+  return (
+    <Box mb={4} p={3} bg={sectionBg} borderRadius="md">
+      <HStack spacing={2}>
+        <FaCalendarAlt color="gray" />
+        <Text fontSize="sm" color={headingColor}>
+          涨跌幅数据日期：{effectiveTradingDate}
+          {eventTime && effectiveTradingDate !== moment(eventTime).format('YYYY-MM-DD') && (
+            <Text as="span" ml={2} fontSize="xs" color={stockCountColor}>
+              (事件发生于 {typeof eventTime === 'object' ? moment(eventTime).format('YYYY-MM-DD HH:mm') : moment(eventTime).format('YYYY-MM-DD HH:mm')}，显示下一交易日数据)
+            </Text>
+          )}
+        </Text>
+      </HStack>
+    </Box>
+  );
+};
+
+export default TradingDateInfo;