import BaseForm from '@/components/BaseForm';
import { useIntl } from '@umijs/max';
import { Form, FormProps } from 'antd';
import { useEffect } from 'react';
type DeptChangeFormType = {
  initialValues?: {
    [key: string]: any;
  };
  onSave: (values: any) => void;
  submitDept: number;
  treeData:any
};

const DeptChangeForm = ({
  onSave,
  initialValues,
  submitDept,
  treeData,
}: DeptChangeFormType) => {
  const [form] = Form.useForm();
  const intl = useIntl();
  const config: FormProps = {
    form: form,
    layout: 'vertical',
    initialValues: { ...initialValues },
  };
  let itemColumn = [
    {
      type: 'treeSelect',
      itemProps: {
        name: 'deptId',
        rules: [{ required: true }],
        label:intl.formatMessage({
          id: 'userMange.label.DeptName',
          defaultMessage: '所属部门',
        }),
      },
      elementProps: {
        fieldNames: {
            label: 'deptName',
            value: 'deptId',
            children: 'children',
          },
        treeData:treeData,
        filterTreeNode:(inputValue:any, treeNode:any) =>
          treeNode.deptName?.toLowerCase()?.includes(inputValue.toLowerCase())
      },
    },
  ];
  useEffect(() => {
    // 校验表单，成功提交表单的数据给onSave
    if (submitDept) {
      form
        .validateFields()
        .then((values) => {
          console.log(values, 'values');
          onSave(values);
        }); 
    } 
    else {
      form.resetFields();
    }
  }, [submitDept]);

  return <BaseForm config={config} itemColumn={itemColumn} />;
};

export default DeptChangeForm;