import React from 'react';
import { Card, Table, Button, message, Tooltip } from 'antd';
import { useIntl, FormattedMessage } from 'umi';
import styles from '../../supplierAnnualTaskManageDetail.less';
import { useSupplierDetailModal } from '@/components/SupplierDetailModalContext/SupplierDetailModalContext';

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

const SupplierInfo: React.FC<SupplierInfoProps> = ({ taskData, onViewEvaluators }) => {
  const intl = useIntl();
  const supplierDetailModal = useSupplierDetailModal();
  // 查看供应商评价人员
  const handleViewSupplierEvaluators = (record: supplierAnnualTaskManage.TaskDetailData) => {
    if (record.userList && record.userList.length > 0) {
      onViewEvaluators({
        ...record,
        userList: record.userList,
      });
    } else {
      message.error(intl.formatMessage({ id: 'supplierAnnualTaskManage.supplierInfo.noEvaluators' }));
    }
  };

  const columns = [
    {
      title: <FormattedMessage id="supplierAnnualTaskManage.supplierInfo.index" />,
      dataIndex: 'index',
      key: 'index',
      render: (_: any, __: any, index: number) => index + 1,
      width: 80,
    },
    {
      title: <FormattedMessage id="supplierAnnualTaskManage.supplierInfo.supplierName" />,
      dataIndex: 'supplierName',
      key: 'supplierName',
      render: (text: string, record: any) => (
        <Tooltip placement="topLeft" title={text}>
          <a onClick={() => supplierDetailModal?.(record.supplierId)}>{text}</a>
        </Tooltip>
      ),
    },
    {
      title: <FormattedMessage id="supplierAnnualTaskManage.supplierInfo.dept" />,
      dataIndex: 'deptName',
      key: 'deptName',
    },
    {
      title: <FormattedMessage id="supplierAnnualTaskManage.supplierInfo.category" />,
      dataIndex: 'categoryName',
      key: 'categoryName',
      render: (text: string) => text || '--',
    },
    {
      title: <FormattedMessage id="supplierAnnualTaskManage.supplierInfo.action" />,
      key: 'action',
      render: (record: any) => (
        <Button type="link" onClick={() => handleViewSupplierEvaluators(record)}>
          <FormattedMessage id="supplierAnnualTaskManage.supplierInfo.viewEvaluators" />
        </Button>
      ),
    },
  ];

  if (!taskData || !taskData.blackSupplierVos || taskData.blackSupplierVos.length === 0) {
    return (
      <div className={styles.emptyData}>
        <FormattedMessage id="supplierAnnualTaskManage.supplierInfo.empty" />
      </div>
    );
  }

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

export default SupplierInfo;