feat: 相关股票添加合规

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

@@ -12,12 +12,14 @@ import {
   IconButton,
   Collapse,
   Tooltip,
+  Badge,
   useColorModeValue,
 } from '@chakra-ui/react';
 import { StarIcon } from '@chakra-ui/icons';
 import MiniTimelineChart from '../StockDetailPanel/components/MiniTimelineChart';
 import MiniKLineChart from './MiniKLineChart';
 import StockChartModal from '../../../../components/StockChart/StockChartModal';
+import CitedContent from '../../../../components/Citation/CitedContent';
 import { getChangeColor } from '../../../../utils/colorUtils';
 
 /**
@@ -104,7 +106,7 @@ const StockListItem = ({
       borderRadius="lg"
       p={3}
       position="relative"
-      overflow="hidden"
+      overflow="visible"
       _before={{
         content: '""',
         position: 'absolute',
@@ -113,6 +115,8 @@ const StockListItem = ({
         right: 0,
         height: '3px',
         bgGradient: 'linear(to-r, blue.400, purple.500, pink.500)',
+        borderTopLeftRadius: 'lg',
+        borderTopRightRadius: 'lg',
       }}
       _hover={{
         boxShadow: 'lg',
@@ -241,55 +245,73 @@ const StockListItem = ({
           />
         </Box>
 
-        {/* 关联描述（单行显示，点击展开）- 占据更多空间 */}
-        {relationText && relationText !== '--' && (
-          <Tooltip
-            label={isDescExpanded ? "点击收起" : "点击展开完整描述"}
-            placement="top"
-            hasArrow
-            bg="gray.600"
-            color="white"
-            fontSize="xs"
-          >
-            <Box
-              flex={1}
-              minW={0}
-              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"
-            >
-              {/* 去掉"关联描述"标题 */}
-              <Collapse in={isDescExpanded} startingHeight={40}>
-                <Text
-                  fontSize="sm"
-                  color={nameColor}
-                  lineHeight="1.6"
+        {/* 关联描述 - 升级和降级处理 */}
+        {stock.relation_desc && (
+          <Box flex={1} minW={0}>
+            {stock.relation_desc?.data ? (
+              // 升级：带引用来源的版本
+              <CitedContent
+                data={stock.relation_desc}
+                title=""
+                showAIBadge={true}
+                containerStyle={{
+                  backgroundColor: useColorModeValue('#f7fafc', 'rgba(45, 55, 72, 0.6)'),
+                  borderRadius: '8px',
+                  padding: '0',
+                }}
+              />
+            ) : (
+              // 降级：纯文本版本（保留展开/收起功能）
+              <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"
                 >
-                  {relationText}
-                </Text>
-              </Collapse>
-              {isDescExpanded && (
-                <Text
-                  fontSize="xs"
-                  color="gray.500"
-                  mt={2}
-                  fontStyle="italic"
-                >
-                  ⚠️ AI生成，仅供参考
-                </Text>
-              )}
-            </Box>
-          </Tooltip>
+                  {/* 去掉"关联描述"标题 */}
+                  <Collapse in={isDescExpanded} startingHeight={40}>
+                    <Text
+                      fontSize="sm"
+                      color={nameColor}
+                      lineHeight="1.6"
+                    >
+                      {relationText}
+                    </Text>
+                  </Collapse>
+
+                  {/* 提示信息 */}
+                  {isDescExpanded && (
+                    <Text
+                      fontSize="xs"
+                      color="gray.500"
+                      mt={2}
+                      fontStyle="italic"
+                    >
+                      ⚠️ AI生成，仅供参考
+                    </Text>
+                  )}
+                </Box>
+              </Tooltip>
+            )}
+          </Box>
         )}
       </HStack>
     </Box>