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

import React, { useMemo } from 'react';
import { Card, CardBody } from '@chakra-ui/react';
import { FaBrain, FaBuilding, FaLink, FaHistory } from 'react-icons/fa';
import SubTabContainer, { type SubTabConfig } from '@components/SubTabContainer';
import LoadingState from '../../LoadingState';
import { StrategyTab, BusinessTab, ValueChainTab, DevelopmentTab } from './tabs';
import type { DeepAnalysisTabProps, DeepAnalysisTabKey } 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 },
];

/**
 * Tab key 到 index 的映射
 */
const TAB_KEY_TO_INDEX: Record<DeepAnalysisTabKey, number> = {
  strategy: 0,
  business: 1,
  valueChain: 2,
  development: 3,
};

const DeepAnalysisTab: React.FC<DeepAnalysisTabProps> = ({
  comprehensiveData,
  valueChainData,
  keyFactorsData,
  industryRankData,
  loading,
  cardBg,
  expandedSegments,
  onToggleSegment,
  activeTab,
  onTabChange,
}) => {
  // 计算当前 Tab 索引（受控模式）
  const currentIndex = useMemo(() => {
    if (activeTab) {
      return TAB_KEY_TO_INDEX[activeTab] ?? 0;
    }
    return undefined; // 非受控模式
  }, [activeTab]);

  // 加载状态
  if (loading) {
    return (
      <Card bg={THEME.cardBg} shadow="md" border="1px solid" borderColor={THEME.border}>
        <CardBody p={0}>
          <SubTabContainer
            tabs={DEEP_ANALYSIS_TABS}
            index={currentIndex}
            onTabChange={onTabChange}
            componentProps={{}}
            themePreset="blackGold"
          />
          <LoadingState message="加载数据中..." height="200px" />
        </CardBody>
      </Card>
    );
  }

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

export default DeepAnalysisTab;