docs(FinancialPanorama): 更新组件文档

- 更新目录结构说明
- 新增性能优化章节（memo、共享主题、组件提取等）
- 更新组件层级图
- 新增数据流图
- 新增懒加载策略说明

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

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

src/views/Company/components/FinancialPanorama/README.md

@@ -8,12 +8,12 @@
 FinancialPanorama/
 ├── index.tsx                 # 主组件入口
 ├── types.ts                  # 类型定义
-├── constants.ts              # 常量配置
+├── constants.ts              # 常量配置（指标定义、颜色等）
 ├── README.md                 # 本文档
 │
 ├── hooks/
 │   ├── index.ts              # Hooks 导出
-│   └── useFinancialData.ts   # 财务数据获取
+│   └── useFinancialData.ts   # 财务数据获取 Hook
 │
 ├── components/               # 子组件
 │   ├── index.ts              # 统一导出
@@ -21,55 +21,94 @@ FinancialPanorama/
 │   ├── StockInfoHeader.tsx   # 股票信息头部
 │   ├── KeyMetricsOverview.tsx # 关键指标概览
 │   ├── FinancialOverviewPanel.tsx # 财务概览面板
-│   ├── FinancialTable.tsx    # 财务表格基础组件
-│   ├── IncomeStatementTable.tsx # 利润表
-│   ├── BalanceSheetTable.tsx # 资产负债表
-│   ├── CashflowTable.tsx     # 现金流量表
+│   ├── IncomeStatementTable.tsx # 利润表（memo 优化）
+│   ├── BalanceSheetTable.tsx # 资产负债表（memo 优化）
+│   ├── CashflowTable.tsx     # 现金流量表（memo 优化）
 │   ├── FinancialMetricsTable.tsx # 财务指标表
+│   ├── MetricChartModal.tsx  # 指标图表弹窗（新增）
 │   ├── MainBusinessAnalysis.tsx # 主营业务分析
 │   ├── IndustryRankingView.tsx # 行业排名视图
 │   ├── StockComparison.tsx   # 股票对比
 │   └── ComparisonAnalysis.tsx # 对比分析
 │
-├── tabs/                     # Tab 页面
+├── tabs/                     # Tab 页面（全部 memo 优化）
 │   ├── index.ts              # 统一导出
-│   ├── IncomeStatementTab.tsx # 利润表 Tab
+│   ├── MetricsCategoryTab.tsx # 指标分类 Tab（含 7 个分类子组件）
 │   ├── BalanceSheetTab.tsx   # 资产负债表 Tab
+│   ├── IncomeStatementTab.tsx # 利润表 Tab
 │   ├── CashflowTab.tsx       # 现金流量表 Tab
-│   ├── FinancialMetricsTab.tsx # 财务指标 Tab
-│   └── MetricsCategoryTab.tsx # 指标分类 Tab
+│   └── FinancialMetricsTab.tsx # 财务指标 Tab
 │
 └── utils/
     ├── index.ts              # 工具函数导出
     ├── calculations.ts       # 计算函数
-    └── chartOptions.ts       # 图表配置
+    ├── chartOptions.ts       # 图表配置
+    └── tableTheme.ts         # 共享表格主题（新增）
 ```
 
 ## 功能模块
 
 | 模块 | 说明 |
 |------|------|
-| 利润表 | 营收、利润、费用等损益数据 |
+| 盈利能力 | ROE、ROA、毛利率、净利率等 |
+| 每股指标 | EPS、每股净资产、每股现金流等 |
+| 成长能力 | 营收增速、利润增速等 |
+| 运营效率 | 周转率、应收账款周转等 |
+| 偿债能力 | 资产负债率、流动比率等 |
+| 费用率 | 销售费用率、管理费用率等 |
+| 现金流指标 | 现金流比率、自由现金流等 |
 | 资产负债表 | 资产、负债、权益结构 |
+| 利润表 | 营收、利润、费用等损益数据 |
 | 现金流量表 | 经营、投资、筹资现金流 |
-| 财务指标 | ROE、毛利率、周转率等 |
-| 主营分析 | 业务构成、地区分布 |
-| 行业排名 | 同行业公司对比排名 |
+
+## 性能优化（2024-12）
+
+### 1. React.memo 优化
+- 所有 Tab 组件已使用 `memo` 包装，避免不必要的重渲染
+- 表格组件（BalanceSheetTable、IncomeStatementTable、CashflowTable）已使用 `memo`
+- MetricsCategoryTab 的 7 个子组件都已 memo 化
+
+### 2. 共享主题配置
+- 提取 `utils/tableTheme.ts` 共享 Ant Design 黑金主题
+- `BLACK_GOLD_TABLE_THEME`: ConfigProvider 主题配置
+- `getTableStyles()`: CSS 样式工厂函数
+- `calculateYoY()`: 同比计算共享函数
+
+### 3. 组件提取
+- `MetricChartModal`: 从 index.tsx 提取的独立指标图表弹窗
+- 减少主组件约 100 行代码
+
+### 4. Props 传递优化
+- componentProps 使用 `useMemo` 缓存
+- 颜色常量直接展开，不在依赖数组中
+- showMetricChart 使用 `useCallback` 优化
+
+### 5. Hook 简化
+- 移除未使用的 `forecast` 和 `industryRank` 状态
+- 简化返回值类型定义
 
 ## 组件层级
 
 ```
 FinancialPanorama
-├── PeriodSelector            # 期数选择
-├── SubTabContainer           # Tab 容器
-│   ├── IncomeStatementTab    # 利润表
-│   │   └── IncomeStatementTable
+├── FinancialOverviewPanel    # 财务概览（三列布局）
+├── ComparisonAnalysis        # 营收与利润趋势
+├── MainBusinessAnalysis      # 主营业务分析
+├── SubTabContainer           # Tab 容器（10 个 Tab）
+│   ├── ProfitabilityTab      # 盈利能力
+│   ├── PerShareTab           # 每股指标
+│   ├── GrowthTab             # 成长能力
+│   ├── OperationalTab        # 运营效率
+│   ├── SolvencyTab           # 偿债能力
+│   ├── ExpenseTab            # 费用率
+│   ├── CashflowMetricsTab    # 现金流指标
 │   ├── BalanceSheetTab       # 资产负债表
 │   │   └── BalanceSheetTable
-│   ├── CashflowTab           # 现金流量表
-│   │   └── CashflowTable
-│   └── FinancialMetricsTab   # 财务指标
-│       └── FinancialMetricsTable
+│   ├── IncomeStatementTab    # 利润表
+│   │   └── IncomeStatementTable
+│   └── CashflowTab           # 现金流量表
+│       └── CashflowTable
+└── MetricChartModal          # 指标图表弹窗
 ```
 
 ## 使用示例
@@ -79,3 +118,28 @@ import FinancialPanorama from '@views/Company/components/FinancialPanorama';
 
 <FinancialPanorama stockCode="600000" />
 ```
+
+## 数据流
+
+```
+stockCode (props)
+    ↓
+useFinancialData (Hook)
+    ├── stockInfo (基本信息)
+    ├── financialMetrics (财务指标)
+    ├── comparison (营收利润对比)
+    ├── mainBusiness (主营业务)
+    ├── balanceSheet (资产负债表)
+    ├── incomeStatement (利润表)
+    └── cashflow (现金流量表)
+    ↓
+componentProps (useMemo)
+    ↓
+SubTabContainer → Tab 组件 → Table 组件
+```
+
+## 懒加载策略
+
+- 初始加载：stockInfo + financialMetrics + comparison + mainBusiness
+- Tab 切换时按需加载：balance/income/cashflow 数据
+- 使用 `isLazy` 配置 SubTabContainer 实现懒加载