import React, { forwardRef, useImperativeHandle, useEffect, useState } from 'react'; import { Card } from 'antd'; import styles from '../supplierTaskManageAdd.less'; import SupplierSelector from '@/components/SupplierSelector'; import type { SupplierItem } from '@/servers/dao/supplierEvaluateTask'; import type { Dispatch } from 'umi'; import { connect } from 'umi'; import type { SupplierTaskModelState } from '@/models/supplierTaskManage'; interface SupplierSelectStepProps { supplierTaskManage: SupplierTaskModelState; dispatch: Dispatch; innerRef?: any; // 使用 innerRef 作为属性名 } // 定义组件,使用 innerRef 代替直接的 ref const SupplierSelectStepComponent = (props: SupplierSelectStepProps) => { const { supplierTaskManage, dispatch, innerRef } = props; // 从model获取数据 const { taskFormData } = supplierTaskManage; // 内部状态,避免直接操作formData导致循环更新 const [selectedSuppliers, setSelectedSuppliers] = useState([]); // 当taskFormData.selectedSuppliers更新时,同步到本地状态 useEffect(() => { if (taskFormData.selectedSuppliers && taskFormData.selectedSuppliers.length > 0) { setSelectedSuppliers(taskFormData.selectedSuppliers); } }, [taskFormData.selectedSuppliers]); // 只在表单ID变化时更新(编辑模式加载时) // 暴露表单方法给父组件,使用 innerRef useImperativeHandle(innerRef, () => ({ validateFields: () => { // 这里可以添加自定义验证逻辑 return Promise.resolve(); }, getFieldsValue: () => { return { selectedSuppliers, supplierIds: selectedSuppliers.map((supplier: SupplierItem) => ({ id: supplier.id })) }; }, setFieldsValue: (values: any) => { if (values.selectedSuppliers) { setSelectedSuppliers(values.selectedSuppliers); } }, })); // 处理供应商选择 const handleSupplierSelect = (suppliers: SupplierItem[]) => { // 确保每个供应商都有evaluators字段 const suppliersWithEvaluators = suppliers.map(supplier => ({ ...supplier, evaluators: supplier.evaluators || [], // 确保evaluators字段存在,即使是空数组 evaluatorCount: supplier.evaluators?.length || 0 // 计算评价人员数量 })); // 更新本地状态 setSelectedSuppliers(suppliersWithEvaluators); // 通过dispatch更新model数据 dispatch({ type: 'supplierTaskManage/updateFormData', payload: { selectedSuppliers: suppliersWithEvaluators, supplierIds: suppliersWithEvaluators.map(supplier => ({ id: supplier.id })) } }); }; return (
); }; // 连接 Dva model const ConnectedComponent = connect( ({ supplierTaskManage }: { supplierTaskManage: SupplierTaskModelState }) => ({ supplierTaskManage, }) )(SupplierSelectStepComponent); // 外层转发 ref 到 innerRef const SupplierSelectStep = forwardRef((props: any, ref) => ( )); export default SupplierSelectStep;