// 供应商评价得分表格组件
// 用于展示和填写供应商评价得分，基于EvaluateTemplateTable组件扩展
// 在二级指标中添加了评分列和说明列
import React, { useState, useEffect } from 'react';
import {
  Table,
  Input,
  InputNumber,
  Typography,
  Tooltip,
} from 'antd';
import './ScoreEvaluationTable.less';

const { Text } = Typography;
const { TextArea } = Input;

/**
 * 评分表格组件属性
 */
interface ScoreEvaluationTableProps {
  /**
   * 表格数据，应符合API返回的评价指标数据结构
   */
  value?: any[];
  /**
   * 数据变更回调函数
   */
  onChange?: (value: any[]) => void;
  /**
   * 是否为详情模式（只读）
   */
  isDetail?: boolean;
  /**
   * 表格加载状态
   */
  loading?: boolean;
}

/**
 * 内部使用的表格行数据结构
 */
interface TableRowItem {
  key: string;
  stId?: string; // 一级指标ID
  ndId?: string; // 二级指标ID
  baseIndicator: string; // 一级指标名称
  descIndicator?: string; // 一级指标说明
  stScore: string; // 一级指标分值
  subIndicator: string; // 二级指标名称
  ndScore: string; // 二级指标分值
  isStar?: string; // 是否为星号项
  score?: string | number; // 实际评分
  remark?: string; // 评分说明
}

/**
 * 供应商评价得分表格组件
 * 用于展示和填写供应商评价得分，支持详情模式和编辑模式
 */
const ScoreEvaluationTable: React.FC<ScoreEvaluationTableProps> = ({
  value = [],
  onChange,
  isDetail = false,
  loading = false,
}) => {
  // 表格数据源
  const [dataSource, setDataSource] = useState<TableRowItem[]>([]);

  // 将API数据转换为表格数据
  const convertApiDataToTableData = (apiData: any[]): TableRowItem[] => {
    // 检查数据是否已经是扁平化的表格数据格式
    if (apiData.length > 0 && 'subIndicator' in apiData[0] && !('indicatorNdList' in apiData[0])) {
      return apiData as TableRowItem[];
    }

    // 如果是嵌套结构，需要扁平化处理
    if (apiData.length > 0 && 'indicatorNdList' in apiData[0]) {
      const flattenedData: TableRowItem[] = [];

      apiData.forEach((stItem: any, stIndex: number) => {
        if (!stItem.indicatorNdList || stItem.indicatorNdList.length === 0) {
          // 如果没有二级指标，添加一个空的二级指标行
          flattenedData.push({
            key: `${stItem.id || stIndex}-0`,
            stId: stItem.id,
            baseIndicator: stItem.baseIndicator || '',
            descIndicator: stItem.indicatorDesc || '',
            stScore: stItem.score || '0',
            subIndicator: '',
            ndScore: '0',
            score: stItem.actualScore || '',
            remark: stItem.remark || '',
          });
        } else {
          // 处理二级指标
          stItem.indicatorNdList.forEach((ndItem: any, ndIndex: number) => {
            // 确保ndItem是一个对象，而不是直接渲染
            if (typeof ndItem === 'object' && ndItem !== null) {
              flattenedData.push({
                key: `${stItem.id || stIndex}-${ndItem.id || ndIndex}`,
                stId: stItem.id,
                ndId: ndItem.id,
                baseIndicator: stItem.baseIndicator || '',
                descIndicator: stItem.indicatorDesc || '',
                stScore: stItem.score || '0',
                subIndicator: ndItem.subIndicator || '',
                ndScore: ndItem.subScore || '0',
                isStar: ndItem.starIndicator || '',
                score: ndItem.scoreNum || '',
                remark: ndItem.remark || '',
              });
            }
          });
        }
      });

      return flattenedData;
    }

    return [];
  };

  // 将表格数据转换回API格式
  const convertTableDataToApiData = (tableData: TableRowItem[]): any[] => {
    // 按一级指标分组
    const groupedByLevel1 = tableData.reduce((acc: Record<string, TableRowItem[]>, item: TableRowItem) => {
      const groupKey = item.baseIndicator || `empty-${item.key}`;

      if (!acc[groupKey]) {
        acc[groupKey] = [];
      }
      acc[groupKey].push(item);
      return acc;
    }, {});

    // 转换为API需要的格式
    return Object.keys(groupedByLevel1).map((groupKey, stIndex) => {
      const level1Items = groupedByLevel1[groupKey];
      const firstItem = level1Items[0];

      return {
        id: firstItem.stId || `temp-st-${stIndex}`,
        baseIndicator: firstItem.baseIndicator || '',
        indicatorDesc: firstItem.descIndicator || '',
        score: firstItem.stScore || '0',
        indicatorNdList: level1Items.map((item, ndIndex) => {
          return {
            id: item.ndId || `temp-nd-${stIndex}-${ndIndex}`,
            subIndicator: item.subIndicator || '',
            subScore: item.ndScore || '0',
            starIndicator: item.isStar || '0',
            scoreNum: item.score || '',
            remark: item.remark || ''
          };
        })
      };
    });
  };

  // 单独处理value变化
  useEffect(() => {
    if (value && value.length > 0) {
      const tableData = convertApiDataToTableData(value);
      setDataSource(tableData);
    } else {
      setDataSource([]);
    }
  }, [value]);

  // 更新数据源
  const updateDataSource = (newData: TableRowItem[]) => {
    setDataSource(newData);
    if (onChange) {
      // 转换回API格式再传递给父组件
      const apiData = convertTableDataToApiData(newData);
      onChange(apiData);
    }
  };

  // 处理输入变化
  const handleInputChange = (val: any, record: TableRowItem, field: string) => {
    const newData = [...dataSource];
    const index = newData.findIndex((item) => item.key === record.key);

    if (index > -1) {
      newData[index] = { ...newData[index], [field]: val };
      updateDataSource(newData);
    }
  };

  // 获取一级指标的行数
  const getLevel1RowSpan = (baseIndicator: string) => {
    if (!baseIndicator) return 1;
    return dataSource.filter((item) => item.baseIndicator === baseIndicator).length;
  };

  const columns = [
    {
      title: '一级指标',
      children: [
        {
          title: '序号',
          dataIndex: 'index',
          align: 'center' as const,
          key: 'index',
          width: 50,
          render: (_: any, record: TableRowItem, index: number) => {
            return <>{index + 1}</>;
          },
        },
        {
          title: '基本指标',
          align: 'center' as const,
          dataIndex: 'baseIndicator',
          key: 'baseIndicator',
          width: 150,
          render: (text: string, record: TableRowItem) => {
            if (!record.baseIndicator) return text || '-';

            // 查找相同baseIndicator的所有项
            const level1Items = dataSource.filter((item) => item.baseIndicator === record.baseIndicator);
            const index = level1Items.findIndex((item) => item.key === record.key);

            if (index === 0) {
              return {
                children: text || '-',
                props: { rowSpan: level1Items.length },
              };
            }

            return {
              props: { rowSpan: 0 },
            };
          },
        },
        {
          title: '指标说明',
          align: 'center' as const,
          dataIndex: 'descIndicator',
          key: 'descIndicator',
          width: 200,
          render: (text: string, record: TableRowItem) => {
            if (!record.baseIndicator) return text || '-';

            // 查找相同baseIndicator的所有项
            const level1Items = dataSource.filter((item) => item.baseIndicator === record.baseIndicator);
            const index = level1Items.findIndex((item) => item.key === record.key);

            if (index === 0) {
              return {
                children: text || '-',
                props: { rowSpan: level1Items.length },
              };
            }

            return {
              props: { rowSpan: 0 },
            };
          },
        },
        {
          title: '分值',
          align: 'center' as const,
          dataIndex: 'stScore',
          key: 'stScore',
          width: 80,
          render: (text: string, record: TableRowItem) => {
            if (!record.baseIndicator) return text || '0';

            // 查找相同baseIndicator的所有项
            const level1Items = dataSource.filter((item) => item.baseIndicator === record.baseIndicator);
            const index = level1Items.findIndex((item) => item.key === record.key);

            if (index === 0) {
              return {
                children: text || '0',
                props: { rowSpan: level1Items.length },
              };
            }

            return {
              props: { rowSpan: 0 },
            };
          },
        },
      ],
    },
    {
      title: '二级指标',
      children: [
        {
          title: '细分指标',
          dataIndex: 'subIndicator',
          key: 'subIndicator',
          align: 'center' as const,
          width: 200,
          render: (text: string) => text || '-',
        },
        {
          title: '分值',
          dataIndex: 'ndScore',
          key: 'ndScore',
          width: 80,
          align: 'center' as const,
          render: (text: string) => text || '0',
        },
        {
          title: '评分',
          dataIndex: 'score',
          key: 'score',
          width: 100,
          align: 'center' as const,
          render: (text: string | number, record: TableRowItem) => {
            if (isDetail) {
              return text || '-';
            }
            return (
              <InputNumber
                min={0}
                max={parseFloat(record.ndScore) || 100}
                value={text ? parseFloat(String(text)) : undefined}
                onChange={(val) => handleInputChange(val, record, 'score')}
                style={{ width: '100%' }}
                placeholder="请输入评分"
              />
            );
          },
        },
        {
          title: '评分说明',
          dataIndex: 'remark',
          key: 'remark',
          width: 200,
          render: (text: string, record: TableRowItem) => {
            if (isDetail) {
              return (
                <Tooltip title={text}>
                  <div className="ellipsis-text">{text || '-'}</div>
                </Tooltip>
              );
            }
            return (
              <TextArea
                value={text}
                onChange={(e) => handleInputChange(e.target.value, record, 'remark')}
                placeholder="请输入评分说明"
                autoSize={{ minRows: 1, maxRows: 3 }}
              />
            );
          },
        },
      ],
    },
  ];

  return (
    <div className="score-evaluation-table">
      <Table
        columns={columns}
        dataSource={dataSource}
        pagination={false}
        bordered
        rowKey="key"
        size="middle"
        loading={loading}
        scroll={{ x: 'max-content' }}
        locale={{ emptyText: '无数据' }}
      />
    </div>
  );
};

export default ScoreEvaluationTable;
