import React, { FC } from 'react';
import { useForm } from '@alitajs/dform';
import {
  Store,
  ValidateErrorEntity,
  FormInstance,
} from 'rc-field-form/es/interface';
import { bcmcMockData } from './mock';
import styles from './index.less';
import PageGenerator, { bcmcDformStates, bcmcUtils } from 'pageGenerator';

const Page: FC = (props: any) => {
  const { dispatch, businessManagement = {}, location = {} } = props;
  // const { oppId } = location.query;
  const {
    formsValues = {},
    changeForm,
    optionObjs,
    proData = [],
    addProData = {},
    custInfo = {},
    oppOverViews,
    oppCompetitors,
    linkHandleInfo,
    operatorsInfo,
    draftData,
    involvedProduct,
    oppFilesObj,
    bcmcData = {},
    firstNodeObj = {}, //首环节信息
  } = businessManagement;
  const [form] = useForm();

  const dFormListeners = {
    dFormItemChange: ({ value, key, content }: any) => {
      console.log('dFormItemChange-value：', value);
      console.log('dFormItemChange-key：', key);
      console.log('dFormItemChange-content：', content);
    },
    dFormItemBlur: ({ value, key, content }: any) => {
      console.log('onItemBlur-value：', value);
      console.log('onItemBlur-key：', key);
      console.log('onItemBlur-content：', content);
    },
    dFormItemClick: ({ key, content }: any) => {
      console.log('onItemClick-key：', key);
      console.log('onItemBlur-content：', content);
    },
    dFormitemOnChangeLevel: ({ value, key, content }: any) => {
      console.log('dFormitemOnChangeLevel-value：', value);
      console.log('dFormitemOnChangeLevel-key：', key);
      console.log('dFormitemOnChangeLevel-content：', content);
    },
    onImagePickerChange: ({
      key,
      value,
      index,
      type,
      fileCon,
      fileName,
      content,
    }: any) => {
      console.log('onImagePickerChange-value：', value);
      console.log('onImagePickerChange-key：', key);
      console.log('onImagePickerChange-content：', index);
      console.log('onImagePickerChange-value：', type);
      console.log('onImagePickerChange-key：', fileCon);
      console.log('onImagePickerChange-value：', fileName);
      console.log('onImagePickerChange-content：', content);
    },
    uploadImg: (e: any) => {
      console.log('附件上传');
    },
  };
  const onFinish = (values: Store) => {
    console.log('onFinish', values);
  };
  const onFinishFailed = (errorInfo: ValidateErrorEntity) => {
    console.log('onFinishFailed', errorInfo);
  };
  const pGProps = {
    ...dFormListeners,
    data: bcmcUtils.initBcmcData({
      isEdit: true,
      bcmcData: bcmcMockData,
      bcmcFooterBtnProps: {
        onRightClick: () => {
          console.log('onRightClick');
          form.submit();
        },
        onLeftClick: () => {
          console.log('onLeftClick');
          form.submit();
        },
      },
      blockObj: {
        ProdAndOfferList: {
          blockKey: 'bcmcProjectInfo',
          blockProps: {
            onAddProd: () => {
              console.log('新增产品');
            },
            onDeleteProd: (index: number) => {
              console.log('删除产品：', index);
            },
          },
        },
        SaleOppHLJ_fileList: {
          blockKey: 'bcmcEnclosure',
        },
        DealTacheSelectBscDefault: {
          blockKey: 'bcmcDefaultLinkInfo',
          blockProps: {},
        },
      },
    }),
    form,
    formsValues,
    onFinish,
    onFinishFailed,
  };
  console.log('pGProps', pGProps);
  return (
    <div style={{ background: '#f5f5f5' }}>
      <PageGenerator {...pGProps} />
    </div>
  );
};

export default Page;