import React, { forwardRef, useImperativeHandle } from 'react';
import { Card, Form } from 'antd';
import styles from '../supplierTaskManageAdd.less';
import SupplierSelector from '@/components/SupplierSelector';

interface SupplierSelectStepProps {
  formData: any;
  onFormDataChange: (data: any) => void;
}

interface SupplierItem {
  id: string;
  name: string;
  supplierType: string;
  [key: string]: any;
}

const SupplierSelectStep = forwardRef<any, SupplierSelectStepProps>(({ formData, onFormDataChange }, ref) => {
  // 暴露表单方法给父组件
  useImperativeHandle(ref, () => ({
    validateFields: () => {
      // 这里可以添加自定义验证逻辑
      return Promise.resolve();
    },
    getFieldsValue: () => {
      return {
        selectedSuppliers: formData.selectedSuppliers || [],
        supplierIds: (formData.selectedSuppliers || []).map((supplier: SupplierItem) => ({ id: supplier.id }))
      };
    },
    setFieldsValue: (values: any) => {
      if (values.selectedSuppliers) {
        onFormDataChange({
          ...formData,
          selectedSuppliers: values.selectedSuppliers
        });
      }
    },
  }));

  // 处理供应商选择
  const handleSupplierSelect = (suppliers: SupplierItem[]) => {
    onFormDataChange({
      ...formData,
      selectedSuppliers: suppliers,
      supplierIds: suppliers.map(supplier => ({ id: supplier.id }))
    });
  };

  return (
    <div className={styles.supplierSelectStep}>
      <Card title="供应商选择" bordered={false} className="inner-card">
        <SupplierSelector
          onSelect={handleSupplierSelect}
          selectedSuppliers={formData.selectedSuppliers || []}
        />
      </Card>
    </div>
  );
});

export default SupplierSelectStep;