对接评价结果接口

src/pages/supplierEvaluateManage/supplierEvaluateScore/supplierEvaluateScore.less

@@ -0,0 +1,21 @@
+// 供应商评价打分页面样式
+.headerRow {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 16px;
+
+  .titleSection {
+    flex: 1;
+
+    .pageTitle {
+      margin-bottom: 0;
+    }
+  }
+
+  .actionSection {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+  }
+}

src/pages/supplierEvaluateManage/supplierEvaluateScore/supplierEvaluateScore.tsx

@@ -1,346 +1,203 @@
+// 供应商评价打分
 import React, { useState, useEffect } from 'react';
-import {
-  Card,
-  Form,
-  Input,
-  Select,
-  Button,
-  Table,
-  Space,
-  Tag,
-  DatePicker,
-  TablePaginationConfig,
-  Tooltip,
-  message,
-} from 'antd';
-import {
-  SearchOutlined,
-  DeleteOutlined,
-  PlusOutlined,
-  EditOutlined,
-  EyeOutlined,
-  FormOutlined,
-} from '@ant-design/icons';
-import { TaskStatus, TaskStatusText, TaskStatusColor } from '@/dicts/supplierTaskDict';
-import moment from 'moment';
+import { Button, Card, Form, message, Typography, Spin, Space } from 'antd';
+import { ArrowLeftOutlined, SaveOutlined } from '@ant-design/icons';
+import { history, useLocation } from 'umi';
+import ScoreEvaluationTable from '@/components/ScoreEvaluationTable';
+import styles from './supplierEvaluateScore.less';
+import { getSupplierScoreDetail, submitEvaluateScore } from '@/servers/api/supplierEvaluate';
 
-const { Option } = Select;
-const { RangePicker } = DatePicker;
-
-// 定义搜索参数接口
-interface ScoreSearchParams {
-  evaluateTitle?: string;
-  supplierName?: string;
-  status?: string;
-}
-
-// 定义打分记录接口
-interface ScoreRecord {
-  id: string;
-  evaluateTitle: string;
-  supplierName: string;
-  category: string;
-  status: string;
-  scoreStatus: string; // 打分状态：未打分、已打分、已提交
-  createTime: string;
-  key: string;
-}
-
-// 打分状态
-const ScoreStatus = {
-  NOT_SCORED: 'not_scored',
-  SCORED: 'scored',
-  SUBMITTED: 'submitted',
-};
-
-const ScoreStatusText = {
-  [ScoreStatus.NOT_SCORED]: '未打分',
-  [ScoreStatus.SCORED]: '已打分',
-  [ScoreStatus.SUBMITTED]: '已提交',
-};
-
-const ScoreStatusColor = {
-  [ScoreStatus.NOT_SCORED]: 'orange',
-  [ScoreStatus.SCORED]: 'blue',
-  [ScoreStatus.SUBMITTED]: 'green',
-};
+const { Title } = Typography;
 
 const SupplierEvaluateScore: React.FC = () => {
-  const [loading, setLoading] = useState<boolean>(false);
   const [form] = Form.useForm();
-  const [scoreData, setScoreData] = useState<ScoreRecord[]>([]);
-  const [pagination, setPagination] = useState<TablePaginationConfig>({
-    current: 1,
-    pageSize: 10,
-    total: 0,
-    showSizeChanger: true,
-    showQuickJumper: true,
-    showTotal: (total) => `共 ${total} 条记录`,
-  });
-  const [searchParams, setSearchParams] = useState<ScoreSearchParams>({});
+  const location = useLocation<{
+    record: API.EvaluateSupplierRecord;
+    parentRecord: API.EvaluateTaskRecord;
+  }>();
+  const [loading, setLoading] = useState<boolean>(false);
+  const [submitting, setSubmitting] = 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);
+  const [scoreData, setScoreData] = useState<any[]>([]);
 
-  // 品类数据
-  const categoryOptions = [
-    { label: '食品', value: '食品' },
-    { label: '电子', value: '电子' },
-    { label: '机械', value: '机械' },
-    { label: '化工', value: '化工' },
-    { label: '医药', value: '医药' },
-  ];
+  // 获取上级页面传递的数据
+  useEffect(() => {
+    if (location.state?.record) {
+      setSupplierRecord(location.state.record);
+    }
+    if (location.state?.parentRecord) {
+      setParentRecord(location.state.parentRecord);
+    }
+  }, [location]);
 
-  // 模拟获取打分列表
-  const fetchScoreList = async (
-    current = 1,
-    pageSize = 10,
-    params: ScoreSearchParams = searchParams,
-  ) => {
-    // 更新搜索参数状态
-    if (params !== searchParams) {
-      setSearchParams(params);
+  // 将API数据转换为ScoreEvaluationTable组件所需的格式
+  const formatDataForScoreTable = (data: API.EvaluateScoreDetailData | null) => {
+    if (!data?.taskIndicatorVo) return [];
+
+    return data.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 || '',
+            remark: subItem.remark || ''
+          };
+        }) || []
+      };
+    });
+  };
+
+  // 获取得分明细数据
+  const fetchScoreDetail = async () => {
+    if (!supplierRecord?.id) {
+      message.error('缺少必要参数，无法获取数据');
+      return;
     }
 
     setLoading(true);
     try {
-      // 模拟API请求
-      setTimeout(() => {
-        // 模拟数据
-        const mockData: ScoreRecord[] = Array.from({ length: 35 }).map((_, index) => {
-          const id = `${index + 1}`;
-          const status = Object.values(TaskStatus)[Math.floor(Math.random() * 3)];
-          const scoreStatus = Object.values(ScoreStatus)[Math.floor(Math.random() * 3)];
+      const response = await getSupplierScoreDetail(supplierRecord.id);
 
-          // 随机选择品类
-          const categoryIndex = Math.floor(Math.random() * categoryOptions.length);
+      if (response.success && response.data) {
+        setScoreDetail(response.data);
 
-          return {
-            id,
-            key: id,
-            evaluateTitle: `供应商评价任务${index + 1}`,
-            supplierName: `供应商${index + 1}`,
-            category: categoryOptions[categoryIndex].value,
-            status,
-            scoreStatus,
-            createTime: moment().subtract(Math.floor(Math.random() * 90), 'days').format('YYYY-MM-DD HH:mm:ss'),
-          };
-        });
-
-        // 根据搜索条件过滤
-        let filteredData = [...mockData];
-        if (params.evaluateTitle) {
-          filteredData = filteredData.filter(item =>
-            item.evaluateTitle.includes(params.evaluateTitle || '')
-          );
-        }
-        if (params.supplierName) {
-          filteredData = filteredData.filter(item =>
-            item.supplierName.includes(params.supplierName || '')
-          );
-        }
-        if (params.status) {
-          filteredData = filteredData.filter(item =>
-            item.scoreStatus === params.status
-          );
-        }
-
-        // 分页
-        const startIndex = (current - 1) * pageSize;
-        const endIndex = startIndex + pageSize;
-        const paginatedData = filteredData.slice(startIndex, endIndex);
-
-        setScoreData(paginatedData);
-        setPagination({
-          ...pagination,
-          current,
-          pageSize,
-          total: filteredData.length,
-        });
-
-        setLoading(false);
-      }, 500);
+        // 转换数据格式
+        const formattedData = formatDataForScoreTable(response.data);
+        setScoreData(formattedData);
+      } else {
+        message.error(response.message || '获取评价得分明细失败');
+      }
     } catch (error) {
-      console.error('获取打分列表失败:', error);
-      message.error('获取打分列表失败');
+      console.error('获取评价得分明细失败:', error);
+      message.error('获取评价得分明细失败');
+    } finally {
       setLoading(false);
     }
   };
 
-  // 首次加载获取数据
+  // 当供应商记录加载完成后，获取得分明细
   useEffect(() => {
-    fetchScoreList(pagination.current, pagination.pageSize, {});
-  }, []);
+    if (supplierRecord?.id) {
+      fetchScoreDetail();
+    }
+  }, [supplierRecord]);
 
-  // 处理表格分页变化
-  const handleTableChange = (newPagination: TablePaginationConfig) => {
-    fetchScoreList(newPagination.current, newPagination.pageSize, searchParams);
+  // 返回上一页
+  const handleBack = () => {
+    history.goBack();
   };
 
-  // 处理搜索
-  const handleSearch = (values: any) => {
-    fetchScoreList(1, pagination.pageSize, values);
+  // 处理评分数据变更
+  const handleScoreDataChange = (newData: any[]) => {
+    setScoreData(newData);
   };
 
-  // 处理重置
-  const handleReset = () => {
-    form.resetFields();
-    fetchScoreList(1, pagination.pageSize, {});
-  };
+  // 提交评分
+  const handleSubmit = async () => {
+    if (!supplierRecord?.id) {
+      message.error('缺少必要参数，无法提交');
+      return;
+    }
 
-  // 处理打分
-  const handleScore = (record: ScoreRecord) => {
-    message.info(`开始为 ${record.supplierName} 打分`);
-  };
+    // 验证所有二级指标是否都已评分
+    const hasEmptyScore = scoreData.some(item =>
+      item.indicatorNdList.some((subItem: any) =>
+        !subItem.actualScore && subItem.actualScore !== 0
+      )
+    );
 
-  // 处理查看
-  const handleView = (record: ScoreRecord) => {
-    message.info(`查看 ${record.supplierName} 的打分情况`);
-  };
+    if (hasEmptyScore) {
+      message.warning('请为所有指标填写评分');
+      return;
+    }
 
-  // 处理提交
-  const handleSubmit = (record: ScoreRecord) => {
-    message.success(`已提交 ${record.supplierName} 的评分`);
-    fetchScoreList(pagination.current, pagination.pageSize, searchParams);
-  };
+    setSubmitting(true);
+    try {
+      // 构建提交数据
+      const submitData = {
+        id: supplierRecord.id,
+        taskIndicatorVo: scoreData.map(item => ({
+          baseIndicator: item.baseIndicator,
+          indicatorDesc: item.descIndicator,
+          score: item.score,
+          subIndicator: item.indicatorNdList.map((subItem: any) => ({
+            id: subItem.id,
+            subIndicator: subItem.subIndicator,
+            subScore: subItem.score,
+            starIndicator: subItem.isStar,
+            scoreNum: subItem.actualScore,
+            remark: subItem.remark
+          }))
+        }))
+      };
 
-  // 获取状态标签
-  const getScoreStatusTag = (status: string) => {
-    const color = ScoreStatusColor[status as keyof typeof ScoreStatusColor] || 'default';
-    const text = ScoreStatusText[status as keyof typeof ScoreStatusText] || '未知状态';
-    return <Tag color={color}>{text}</Tag>;
-  };
+      const response = await submitEvaluateScore(submitData);
 
-  const columns = [
-    {
-      title: '序号',
-      render: (_: any, __: ScoreRecord, index: number) =>
-        (pagination.current! - 1) * pagination.pageSize! + index + 1,
-      width: 80,
-    },
-    {
-      title: '评价主题',
-      dataIndex: 'evaluateTitle',
-      key: 'evaluateTitle',
-      width: 200,
-      ellipsis: {
-        showTitle: false,
-      },
-      render: (evaluateTitle: string) => (
-        <Tooltip placement="topLeft" title={evaluateTitle}>
-          {evaluateTitle}
-        </Tooltip>
-      ),
-    },
-    {
-      title: '供应商名称',
-      dataIndex: 'supplierName',
-      key: 'supplierName',
-      width: 150,
-      ellipsis: {
-        showTitle: false,
-      },
-      render: (supplierName: string) => (
-        <Tooltip placement="topLeft" title={supplierName}>
-          {supplierName}
-        </Tooltip>
-      ),
-    },
-    {
-      title: '品类',
-      dataIndex: 'category',
-      key: 'category',
-      width: 120,
-    },
-    {
-      title: '打分状态',
-      dataIndex: 'scoreStatus',
-      key: 'scoreStatus',
-      width: 100,
-      render: (status: string) => getScoreStatusTag(status),
-    },
-    {
-      title: '创建时间',
-      dataIndex: 'createTime',
-      key: 'createTime',
-      width: 150,
-    },
-    {
-      title: '操作',
-      key: 'action',
-      width: 200,
-      align: 'center' as const,
-      render: (_: unknown, record: ScoreRecord) => (
-        <Space size="middle">
-          {record.scoreStatus === ScoreStatus.NOT_SCORED && (
-            <Button
-              type="link"
-              icon={<FormOutlined />}
-              onClick={() => handleScore(record)}
-            >
-              打分
-            </Button>
-          )}
-          {record.scoreStatus === ScoreStatus.SCORED && (
-            <Button
-              type="link"
-              icon={<EditOutlined />}
-              onClick={() => handleSubmit(record)}
-            >
-              提交
-            </Button>
-          )}
-          <Button
-            type="link"
-            icon={<EyeOutlined />}
-            onClick={() => handleView(record)}
-          >
-            查看
-          </Button>
-        </Space>
-      ),
-    },
-  ];
+      if (response.success) {
+        message.success('评分提交成功');
+        // 提交成功后返回列表页
+        history.goBack();
+      } else {
+        message.error(response.message || '评分提交失败');
+      }
+    } catch (error) {
+      console.error('评分提交失败:', error);
+      message.error('评分提交失败');
+    } finally {
+      setSubmitting(false);
+    }
+  };
 
   return (
     <div className="common-container">
-      <div className="filter-action-row">
-        <Form form={form} layout="inline" onFinish={handleSearch} className="filter-form">
-          <Form.Item name="evaluateTitle" label="评价主题">
-            <Input placeholder="请输入评价主题" allowClear />
-          </Form.Item>
-          <Form.Item name="supplierName" label="供应商名称">
-            <Input placeholder="请输入供应商名称" allowClear />
-          </Form.Item>
-          <Form.Item name="status" label="打分状态">
-            <Select placeholder="请选择状态" allowClear style={{ width: 150 }}>
-              <Option value={ScoreStatus.NOT_SCORED}>{ScoreStatusText[ScoreStatus.NOT_SCORED]}</Option>
-              <Option value={ScoreStatus.SCORED}>{ScoreStatusText[ScoreStatus.SCORED]}</Option>
-              <Option value={ScoreStatus.SUBMITTED}>{ScoreStatusText[ScoreStatus.SUBMITTED]}</Option>
-            </Select>
-          </Form.Item>
-          <Form.Item className="filter-btns">
-            <Button type="primary" icon={<SearchOutlined />} onClick={() => form.submit()}>
-              搜索
+      <div className={styles.headerRow}>
+        <div className={styles.titleSection}>
+          <Title level={4} className={styles.pageTitle}>
+            {supplierRecord?.supplierName || '供应商'} - 评价打分
+          </Title>
+        </div>
+        <div className={styles.actionSection}>
+          <Space>
+            <Button type="link" icon={<ArrowLeftOutlined />} onClick={handleBack}>
+              返回
             </Button>
-            <Button type="primary" danger icon={<DeleteOutlined />} onClick={handleReset}>
-              重置
+            <Button
+              type="primary"
+              icon={<SaveOutlined />}
+              onClick={handleSubmit}
+              loading={submitting}
+            >
+              提交
             </Button>
-          </Form.Item>
-        </Form>
-        <div className="right-buttons">
-          <Button type="primary" ghost icon={<PlusOutlined />} onClick={() => message.info('新增打分任务')}>
-            新增
-          </Button>
+          </Space>
         </div>
       </div>
 
       <div className="content-area">
-        <Table
-          columns={columns}
-          dataSource={scoreData}
-          pagination={pagination}
-          loading={loading}
-          onChange={handleTableChange}
-          scroll={{ x: 1100 }}
-        />
+        <Card bordered={false}>
+          {loading ? (
+            <div className="loading-container" style={{ textAlign: 'center', padding: '50px' }}>
+              <Spin tip="加载中..." />
+            </div>
+          ) : (
+            <Form form={form} layout="vertical">
+              <ScoreEvaluationTable
+                value={scoreData}
+                onChange={handleScoreDataChange}
+                isDetail={false}
+                loading={loading}
+              />
+            </Form>
+          )}
+        </Card>
       </div>
     </div>
   );