- 新增深度分析 Tab(从 CompanyOverview 提取为独立组件) - 新增动态跟踪 Tab(占位组件,后续添加内容) - Tab 顺序:公司概览 | 深度分析 | 股票行情 | 财务全景 | 盈利预测 | 动态跟踪 - 简化 CompanyOverview:移除内部 Tabs,只保留头部卡片 + 基本信息 - DeepAnalysis 组件独立管理深度分析数据加载(3个接口) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
101 lines
2.8 KiB
JavaScript
101 lines
2.8 KiB
JavaScript
// src/views/Company/components/DeepAnalysis/index.js
|
||
// 深度分析 - 独立一级 Tab 组件
|
||
|
||
import React, { useState, useEffect } from "react";
|
||
import { logger } from "@utils/logger";
|
||
import { getApiBase } from "@utils/apiConfig";
|
||
|
||
// 复用原有的展示组件
|
||
import DeepAnalysisTab from "../CompanyOverview/DeepAnalysisTab";
|
||
|
||
const API_BASE_URL = getApiBase();
|
||
|
||
/**
|
||
* 深度分析组件
|
||
*
|
||
* 功能:
|
||
* - 加载深度分析数据(3个接口)
|
||
* - 管理展开状态
|
||
* - 渲染 DeepAnalysisTab 展示组件
|
||
*
|
||
* @param {Object} props
|
||
* @param {string} props.stockCode - 股票代码
|
||
*/
|
||
const DeepAnalysis = ({ stockCode }) => {
|
||
// 数据状态
|
||
const [comprehensiveData, setComprehensiveData] = useState(null);
|
||
const [valueChainData, setValueChainData] = useState(null);
|
||
const [keyFactorsData, setKeyFactorsData] = useState(null);
|
||
const [loading, setLoading] = useState(false);
|
||
|
||
// 业务板块展开状态
|
||
const [expandedSegments, setExpandedSegments] = useState({});
|
||
|
||
// 切换业务板块展开状态
|
||
const toggleSegmentExpansion = (segmentIndex) => {
|
||
setExpandedSegments((prev) => ({
|
||
...prev,
|
||
[segmentIndex]: !prev[segmentIndex],
|
||
}));
|
||
};
|
||
|
||
// 加载深度分析数据(3个接口)
|
||
const loadDeepAnalysisData = async () => {
|
||
if (!stockCode) return;
|
||
|
||
setLoading(true);
|
||
|
||
try {
|
||
const requests = [
|
||
fetch(
|
||
`${API_BASE_URL}/api/company/comprehensive-analysis/${stockCode}`
|
||
).then((r) => r.json()),
|
||
fetch(
|
||
`${API_BASE_URL}/api/company/value-chain-analysis/${stockCode}`
|
||
).then((r) => r.json()),
|
||
fetch(
|
||
`${API_BASE_URL}/api/company/key-factors-timeline/${stockCode}`
|
||
).then((r) => r.json()),
|
||
];
|
||
|
||
const [comprehensiveRes, valueChainRes, keyFactorsRes] =
|
||
await Promise.all(requests);
|
||
|
||
if (comprehensiveRes.success) setComprehensiveData(comprehensiveRes.data);
|
||
if (valueChainRes.success) setValueChainData(valueChainRes.data);
|
||
if (keyFactorsRes.success) setKeyFactorsData(keyFactorsRes.data);
|
||
} catch (err) {
|
||
logger.error("DeepAnalysis", "loadDeepAnalysisData", err, { stockCode });
|
||
} finally {
|
||
setLoading(false);
|
||
}
|
||
};
|
||
|
||
// stockCode 变更时重新加载数据
|
||
useEffect(() => {
|
||
if (stockCode) {
|
||
// 重置数据
|
||
setComprehensiveData(null);
|
||
setValueChainData(null);
|
||
setKeyFactorsData(null);
|
||
setExpandedSegments({});
|
||
// 加载新数据
|
||
loadDeepAnalysisData();
|
||
}
|
||
}, [stockCode]);
|
||
|
||
return (
|
||
<DeepAnalysisTab
|
||
comprehensiveData={comprehensiveData}
|
||
valueChainData={valueChainData}
|
||
keyFactorsData={keyFactorsData}
|
||
loading={loading}
|
||
cardBg="white"
|
||
expandedSegments={expandedSegments}
|
||
onToggleSegment={toggleSegmentExpansion}
|
||
/>
|
||
);
|
||
};
|
||
|
||
export default DeepAnalysis;
|