import DepartmentSankey from './DepartmentSankey';

import services from '@/services';
import { useRequest } from 'ahooks';
import { Spin } from 'antd';
import { useState } from 'react';

const PointsAgainst = ({ indexId }: { indexId: string }) => {
  const [sankeyData, setSankeyData] = useState<any>({ nodes: [], links: [] });
  const { data, loading } = useRequest(
    () => services.Physicalsign.getIndexSystem(indexId),
    {
      onSuccess: (result) => {
        if (result && result.data) {
          const processedData = processData(result.data as any);
          setSankeyData(processedData);
        }
      },
    },
  );

  const nodes: any[] = [];
  const processData = (data: PhysicalsignApi.IndexSystemVO) => {
    const links: any[] = [];

    const processNode = (
      node: PhysicalsignApi.IndexSystemVO,
      depth: number,
    ) => {
      if (node.lostScore !== 0) {
        nodes.push({
          name: node.name,
          value: Math.abs(node.lostScore),
          depth: depth,
        });
      }

      if (node.children && node.children.length > 0) {
        node.children.forEach((child) => {
          processNode(child, depth + 1);
          if (child.lostScore !== 0) {
            links.push({
              source: node.name,
              target: child.name,
              value: Math.abs(child.lostScore),
            });
          }
        });
      }
    };

    processNode(data, 0);

    return { nodes, links };
  };
  console.log(sankeyData?.nodes);

  return (
    <>
      {sankeyData?.nodes?.length ? (
        <DepartmentSankey
          style={{ height: 660, width: '100%' }}
          sankeyData={sankeyData}
        />
      ) : (
        <div
          style={{
            width: '100%',
            height: 630,
            display: 'flex',
            justifyContent: 'center',
            alignItems: 'center',
          }}
        >
          {loading ?<Spin/>  :<span>暂无数据</span>}
        </div>
      )}
    </>
  );
};
export default PointsAgainst;
