feat(StockChangeIndicators): 添加 iconMode 紧凑模式

- 新增 iconMode prop 支持图标+数字的紧凑显示
- iconMode 时使用 TbArrowBigUpFilled/TbArrowBigDownFilled 图标
- 保持原有标签+数字模式作为默认

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

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

src/components/StockChangeIndicators.js

@@ -4,6 +4,7 @@
 import React from 'react';
 import { Flex, Box, Text, useColorModeValue } from '@chakra-ui/react';
 import { ChevronUp, ChevronDown } from 'lucide-react';
+import { TbArrowBigUpFilled, TbArrowBigDownFilled } from 'react-icons/tb';
 import { getChangeColor } from '../utils/colorUtils';
 
 /**
@@ -13,12 +14,14 @@ import { getChangeColor } from '../utils/colorUtils';
  * @param {number} props.maxChange - 最大超额涨幅
  * @param {number} props.expectationScore - 超预期得分（0-100）
  * @param {'default'|'comfortable'|'large'} props.size - 尺寸模式：default=紧凑，comfortable=舒适（事件列表），large=大卡片（详情面板）
+ * @param {boolean} props.iconMode - 图标模式：用 ↗/↘ 图标替代文字标签
  */
 const StockChangeIndicators = ({
     avgChange,
     maxChange,
     expectationScore,
     size = 'default',
+    iconMode = false,
 }) => {
     const isLarge = size === 'large';
     const isComfortable = size === 'comfortable';
@@ -96,6 +99,20 @@ const StockChangeIndicators = ({
                 flex="0 1 auto"
                 minW="0"
             >
+                {/* iconMode 时只显示图标 + 数字 */}
+                {iconMode ? (
+                    <Flex align="center" gap={1}>
+                        {value >= 0 ? (
+                            <TbArrowBigUpFilled size={14} style={{ color: numberColor }} />
+                        ) : (
+                            <TbArrowBigDownFilled size={14} style={{ color: numberColor }} />
+                        )}
+                        <Text fontSize="sm" fontWeight="bold" color={numberColor}>
+                            {sign}{numStr}%
+                        </Text>
+                    </Flex>
+                ) : (
+                    <>
                         {/* Large 和 Default 模式：标签单独一行 */}
                         {(isLarge || isDefault) && (
                             <Text fontSize={isLarge ? "sm" : "xs"} color={labelColor} fontWeight="medium">
@@ -138,6 +155,8 @@ const StockChangeIndicators = ({
                                 <Text as="span" fontWeight="medium" fontSize="sm">%</Text>
                             </Text>
                         </Flex>
+                    </>
+                )}
             </Box>
         );
     };