vf_react/src/views/Company/components/CompanyOverview/index.tsx

// src/views/Company/components/CompanyOverview/index.tsx
// 公司概览 - 主组件（组合层）
// 懒加载优化：只加载头部卡片数据，BasicInfoTab 内部懒加载各 Tab 数据

import React from "react";
import { VStack, Spinner, Center, Text } from "@chakra-ui/react";

import { useBasicInfo } from "./hooks/useBasicInfo";
import CompanyHeaderCard from "./CompanyHeaderCard";
import type { CompanyOverviewProps } from "./types";

// 子组件（暂保持 JS）
import BasicInfoTab from "./BasicInfoTab";

/**
 * 公司概览组件
 *
 * 功能：
 * - 显示公司头部信息卡片（useBasicInfo）
 * - 显示基本信息 Tab（内部懒加载各子 Tab 数据）
 *
 * 懒加载策略：
 * - 主组件只加载 basicInfo（1 个 API）
 * - BasicInfoTab 内部根据 Tab 切换懒加载其他数据
 */
const CompanyOverview: React.FC<CompanyOverviewProps> = ({ stockCode }) => {
  const { basicInfo, loading, error } = useBasicInfo(stockCode);

  // 加载状态
  if (loading && !basicInfo) {
    return (
      <Center h="300px">
        <VStack spacing={4}>
          <Spinner size="xl" color="blue.500" thickness="4px" />
          <Text>正在加载公司概览数据...</Text>
        </VStack>
      </Center>
    );
  }

  // 错误状态
  if (error && !basicInfo) {
    return (
      <Center h="300px">
        <Text color="red.500">{error}</Text>
      </Center>
    );
  }

  return (
    <VStack spacing={6} align="stretch">
      {/* 公司头部信息卡片 */}
      {basicInfo && <CompanyHeaderCard basicInfo={basicInfo} />}

      {/* 基本信息内容 - 传入 stockCode，内部懒加载各 Tab 数据 */}
      <BasicInfoTab
        stockCode={stockCode}
        basicInfo={basicInfo}
      />
    </VStack>
  );
};

export default CompanyOverview;