// 供应商评价结果得分明细
import React, { useState, useEffect } from 'react';
import { Button, Typography, Card, Spin, message } from 'antd';
import { ArrowLeftOutlined } from '@ant-design/icons';
import { history, useLocation } from 'umi';
import ScoreEvaluationTable from '@/components/ScoreEvaluationTable';
import styles from './supplierEvaluateResult.less';
import { getSupplierScoreDetail } from '@/servers/api/supplierEvaluate';

const { Title } = Typography;

const SupplierEvaluateResultScoreDetail: React.FC = () => {
  const location = useLocation<{
    record: API.EvaluateSupplierRecord;
    parentRecord: API.EvaluateTaskRecord;
  }>();
  const [loading, setLoading] = useState<boolean>(false);
  const [supplierRecord, setSupplierRecord] = useState<API.EvaluateSupplierRecord | null>(null);
  const [parentRecord, setParentRecord] = useState<API.EvaluateTaskRecord | null>(null);
  const [scoreDetail, setScoreDetail] = useState<API.EvaluateScoreDetailData | null>(null);

  // 获取上级页面传递的数据
  useEffect(() => {
    if (location.state?.record) {
      setSupplierRecord(location.state.record);
    }
    if (location.state?.parentRecord) {
      setParentRecord(location.state.parentRecord);
    }
  }, [location]);

  // 获取得分明细数据
  const fetchScoreDetail = async () => {
    if (!supplierRecord?.id) {
      message.error('缺少必要参数，无法获取数据');
      return;
    }

    setLoading(true);
    try {
      const response = await getSupplierScoreDetail(supplierRecord.id);

      if (response.success && response.data) {
        setScoreDetail(response.data);
      } else {
        message.error(response.message || '获取评价得分明细失败');
      }
    } catch (error) {
      console.error('获取评价得分明细失败:', error);
      message.error('获取评价得分明细失败');
    } finally {
      setLoading(false);
    }
  };

  // 当供应商记录加载完成后，获取得分明细
  useEffect(() => {
    if (supplierRecord?.id) {
      fetchScoreDetail();
    }
  }, [supplierRecord]);

  // 返回上一页
  const handleBack = () => {
    history.goBack();
  };

  // 将API数据转换为ScoreEvaluationTable组件所需的格式
  const formatDataForScoreTable = () => {
    if (!scoreDetail?.taskIndicatorVo) return [];

    return scoreDetail.taskIndicatorVo.map(indicator => {
      return {
        baseIndicator: indicator.baseIndicator,
        descIndicator: indicator.indicatorDesc,
        score: indicator.score,
        indicatorNdList: indicator.subIndicator?.map(subItem => {
          return {
            subIndicator: subItem.subIndicator,
            score: subItem.subScore,
            isStar: subItem.starIndicator,
            id: subItem.id,
            actualScore: subItem.scoreNum || subItem.subScore,
            remark: subItem.remark || ''
          };
        }) || []
      };
    });
  };

  return (
    <div className="common-container">
      <div className={styles.headerRow}>
        <div className={styles.titleSection}>
          <Title level={4} className={styles.pageTitle}>
            {supplierRecord?.supplierName || '供应商'} - 评价得分明细
          </Title>
        </div>
        <div className={styles.actionSection}>
          <Button type="link" icon={<ArrowLeftOutlined />} onClick={handleBack}>
            返回
          </Button>
        </div>
      </div>

      <div className="content-area">
        <Card bordered={false}>
          {loading ? (
            <div className="loading-container" style={{ textAlign: 'center', padding: '50px' }}>
              <Spin tip="加载中..." />
            </div>
          ) : (
            <ScoreEvaluationTable
              value={formatDataForScoreTable()}
              isDetail={true}
              loading={loading}
            />
          )}
        </Card>
      </div>
    </div>
  );
};

export default SupplierEvaluateResultScoreDetail;
