import React from 'react';
import { Card, Table, Button, message } from 'antd';
import { TeamOutlined } from '@ant-design/icons';
import styles from '../../supplierAnnualTaskManageDetail.less';
import type { TaskDetailData,User } from '@/servers/types/supplierEvaluateTask';

interface SupplierInfoProps {
  taskData: TaskDetailData;
  onViewEvaluators: (supplier: any) => void;
}

const SupplierInfo: React.FC<SupplierInfoProps> = ({ taskData, onViewEvaluators }) => {
  // 查看供应商评价人员
  const handleViewSupplierEvaluators = (record: TaskDetailData) => {
    if (!taskData || !taskData.supplierIds) {
      message.error('无法获取供应商评价人员信息');
      return;
    }

    // 根据供应商ID查找对应的userIds
    const supplierData = taskData.supplierIds.find((item) => item.id === record.supplierId);
    let userList: User[] = [];
    try {
      userList = taskData.userList.filter((item) => supplierData?.userIds.includes(item.userId));
    } catch (error) {
      console.error('获取供应商评价人员信息失败:', error);
    }

    if (supplierData) {
      onViewEvaluators({
        ...record,
        userIds: supplierData.userIds,
        userList: userList,
      });
    } else {
      message.error('未找到该供应商的评价人员信息');
    }
  };

  const columns = [
    {
      title: '序号',
      dataIndex: 'index',
      key: 'index',
      render: (_: any, __: any, index: number) => index + 1,
      width: 80,
    },
    {
      title: '供应商名称',
      dataIndex: 'supplierName',
      key: 'supplierName',
    },
    {
      title: '部门',
      dataIndex: 'deptName',
      key: 'deptName',
    },
    {
      title: '品类',
      dataIndex: 'categoryName',
      key: 'categoryName',
      render: (text: string) => text || '--',
    },
    {
      title: '操作',
      key: 'action',
      render: (record: any) => (
        <Button
          type="link"
          onClick={() => handleViewSupplierEvaluators(record)}
        >
          查看评价人员
        </Button>
      ),
    },
  ];

  if (!taskData || !taskData.blackSupplierVos || taskData.blackSupplierVos.length === 0) {
    return <div className={styles.emptyData}>暂无供应商数据</div>;
  }

  return (
    <Card className={styles.detailCard}>
      <Table
        columns={columns}
        dataSource={taskData.blackSupplierVos}
        rowKey="supplierId"
        pagination={false}
        className={styles.tableContainer}
      />
    </Card>
  );
};

export default SupplierInfo;