import React from 'react';
import { useSupplyChain } from '../../context/SupplyChainContext';

interface SupplyChainIconsProps {
  className?: string;
  width?: number | string;
  height?: number | string;
}

const SupplyChainIcons: React.FC<SupplyChainIconsProps> = ({
  className = "",
  width,
  height
}) => {
  const { currentIndustry } = useSupplyChain();

  // 根据产业类型加载对应的SVG文件
  const getIconPath = (industry: string) => {
    const iconMap: Record<string, string> = {
      "粮食": "/supply-chain/SupplyChainIcons_grain.svg",
      "油脂": "/supply-chain/SupplyChainIcons_oil.svg",
      "种业": "/supply-chain/SupplyChainIcons_seed.svg",
      "果蔬": "/supply-chain/SupplyChainIcons_fruit.svg",
      "畜牧": "/supply-chain/SupplyChainIcons_livestock.svg",
      "水产": "/supply-chain/SupplyChainIcons_aquatic.svg",
      "鲜食": "/supply-chain/SupplyChainIcons_freshfood.svg",
      "泛盐": "/supply-chain/SupplyChainIcons_salt.svg"
    };
    return iconMap[industry] || "/supply-chain/SupplyChainIcons_grain.svg";
  };

  const iconPath = getIconPath(currentIndustry);

  return (
    <img
      src={iconPath}
      alt={`${currentIndustry}产业链图标`}
      className={className}
      width={width}
      height={height}
    />
  );
};

export default SupplyChainIcons;
