41da6fa372
- MetricsCategoryTab: 使用共享主题，主组件和 7 个子组件添加 memo - BalanceSheetTab: 添加 memo - IncomeStatementTab: 添加 memo - CashflowTab: 添加 memo - FinancialMetricsTab: 添加 memo - 减少不必要的重渲染 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
FinancialPanorama 组件
财务全景模块，展示公司财务报表和指标分析。
目录结构
FinancialPanorama/
├── index.tsx # 主组件入口
├── types.ts # 类型定义
├── constants.ts # 常量配置
├── README.md # 本文档
│
├── hooks/
│ ├── index.ts # Hooks 导出
│ └── useFinancialData.ts # 财务数据获取
│
├── components/ # 子组件
│ ├── index.ts # 统一导出
│ ├── PeriodSelector.tsx # 期数选择器
│ ├── StockInfoHeader.tsx # 股票信息头部
│ ├── KeyMetricsOverview.tsx # 关键指标概览
│ ├── FinancialOverviewPanel.tsx # 财务概览面板
│ ├── FinancialTable.tsx # 财务表格基础组件
│ ├── IncomeStatementTable.tsx # 利润表
│ ├── BalanceSheetTable.tsx # 资产负债表
│ ├── CashflowTable.tsx # 现金流量表
│ ├── FinancialMetricsTable.tsx # 财务指标表
│ ├── MainBusinessAnalysis.tsx # 主营业务分析
│ ├── IndustryRankingView.tsx # 行业排名视图
│ ├── StockComparison.tsx # 股票对比
│ └── ComparisonAnalysis.tsx # 对比分析
│
├── tabs/ # Tab 页面
│ ├── index.ts # 统一导出
│ ├── IncomeStatementTab.tsx # 利润表 Tab
│ ├── BalanceSheetTab.tsx # 资产负债表 Tab
│ ├── CashflowTab.tsx # 现金流量表 Tab
│ ├── FinancialMetricsTab.tsx # 财务指标 Tab
│ └── MetricsCategoryTab.tsx # 指标分类 Tab
│
└── utils/
├── index.ts # 工具函数导出
├── calculations.ts # 计算函数
└── chartOptions.ts # 图表配置
功能模块
| 模块 | 说明 |
|---|---|
| 利润表 | 营收、利润、费用等损益数据 |
| 资产负债表 | 资产、负债、权益结构 |
| 现金流量表 | 经营、投资、筹资现金流 |
| 财务指标 | ROE、毛利率、周转率等 |
| 主营分析 | 业务构成、地区分布 |
| 行业排名 | 同行业公司对比排名 |
组件层级
FinancialPanorama
├── PeriodSelector # 期数选择
├── SubTabContainer # Tab 容器
│ ├── IncomeStatementTab # 利润表
│ │ └── IncomeStatementTable
│ ├── BalanceSheetTab # 资产负债表
│ │ └── BalanceSheetTable
│ ├── CashflowTab # 现金流量表
│ │ └── CashflowTable
│ └── FinancialMetricsTab # 财务指标
│ └── FinancialMetricsTable
使用示例
import FinancialPanorama from '@views/Company/components/FinancialPanorama';
<FinancialPanorama stockCode="600000" />