/**
 * 深度分析 Tab 主组件
 *
 * 使用 SubTabContainer 二级导航组件，分为 4 个子 Tab：
 * 1. 战略分析 - 核心定位 + 战略分析 + 竞争地位
 * 2. 业务结构 - 业务结构树 + 业务板块详情
 * 3. 产业链 - 产业链分析（独立，含 Sankey 图）
 * 4. 发展历程 - 关键因素 + 时间线
 */

import React from 'react';
import { Card, CardBody, Center, VStack, Spinner, Text } from '@chakra-ui/react';
import { FaBrain, FaBuilding, FaLink, FaHistory } from 'react-icons/fa';
import SubTabContainer, { type SubTabConfig } from '@components/SubTabContainer';
import { StrategyTab, BusinessTab, ValueChainTab, DevelopmentTab } from './tabs';
import type { DeepAnalysisTabProps } from './types';

// 主题配置（与 BasicInfoTab 保持一致）
const THEME = {
  cardBg: 'gray.900',
  border: 'rgba(212, 175, 55, 0.3)',
};

/**
 * Tab 配置
 */
const DEEP_ANALYSIS_TABS: SubTabConfig[] = [
  { key: 'strategy', name: '战略分析', icon: FaBrain, component: StrategyTab },
  { key: 'business', name: '业务结构', icon: FaBuilding, component: BusinessTab },
  { key: 'valueChain', name: '产业链', icon: FaLink, component: ValueChainTab },
  { key: 'development', name: '发展历程', icon: FaHistory, component: DevelopmentTab },
];

const DeepAnalysisTab: React.FC<DeepAnalysisTabProps> = ({
  comprehensiveData,
  valueChainData,
  keyFactorsData,
  loading,
  cardBg,
  expandedSegments,
  onToggleSegment,
}) => {
  // 加载状态
  if (loading) {
    return (
      <Center h="200px">
        <VStack spacing={4}>
          <Spinner size="xl" color="blue.500" />
          <Text>加载深度分析数据...</Text>
        </VStack>
      </Center>
    );
  }

  return (
    <Card bg={THEME.cardBg} shadow="md" border="1px solid" borderColor={THEME.border}>
      <CardBody p={0}>
        <SubTabContainer
          tabs={DEEP_ANALYSIS_TABS}
          componentProps={{
            comprehensiveData,
            valueChainData,
            keyFactorsData,
            cardBg,
            expandedSegments,
            onToggleSegment,
          }}
          themePreset="blackGold"
        />
      </CardBody>
    </Card>
  );
};

export default DeepAnalysisTab;
