feat(FinancialPanorama): 新增归母净利润趋势图组件

- 新增 NetProfitTrendChart 组件,展示归母净利润季度/年度趋势
- 新增 PeriodFilterDropdown 组件,支持季度/年度筛选
- 新增 useNetProfitData Hook,处理净利润数据和同比计算
- 新增 getNetProfitTrendChartOption 图表配置
- useFinancialData 初始加载时同时获取利润表数据
- 修复 mock 数据 profit 字段单位(添加 *10000)

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
zdl
2025-12-29 15:00:50 +08:00
parent 22a94c98d2
commit d7ae2e9519
10 changed files with 621 additions and 24 deletions

View File

@@ -5,12 +5,10 @@
import React, { useState, useMemo, useCallback } from 'react';
import {
Box,
Container,
VStack,
Card,
CardBody,
Text,
Alert,
AlertIcon,
useDisclosure,
@@ -38,10 +36,10 @@ import { calculateYoYChange, getCellBackground } from './utils';
import {
PeriodSelector,
FinancialOverviewPanel,
MainBusinessAnalysis,
ComparisonAnalysis,
MetricChartModal,
FinancialPanoramaSkeleton,
NetProfitTrendChart,
} from './components';
import {
BalanceSheetTab,
@@ -184,10 +182,11 @@ const FinancialPanorama: React.FC<FinancialPanoramaProps> = ({ stockCode: propSt
return (
<Container maxW="container.xl" py={5}>
<VStack spacing={6} align="stretch">
{/* 财务全景面板(列布局:成长能力、盈利与回报、风险与运营) */}
{/* 财务全景面板(列布局:成长能力、盈利与回报、风险与运营、主营业务按钮 */}
<FinancialOverviewPanel
stockInfo={stockInfo}
financialMetrics={financialMetrics}
mainBusiness={mainBusiness}
/>
{/* 营收与利润趋势 */}
@@ -195,14 +194,12 @@ const FinancialPanorama: React.FC<FinancialPanoramaProps> = ({ stockCode: propSt
<ComparisonAnalysis comparison={comparison} />
)}
{/* 主营业务 */}
{stockInfo && (
<Box>
<Text fontSize="lg" fontWeight="bold" mb={4} color="#D4AF37">
</Text>
<MainBusinessAnalysis mainBusiness={mainBusiness} />
</Box>
{/* 归母净利润趋势分析 */}
{incomeStatement && incomeStatement.length > 0 && (
<NetProfitTrendChart
incomeStatement={incomeStatement}
loading={loadingTab === 'income'}
/>
)}
{/* 三大财务报表 - 使用 SubTabContainer 二级导航 */}