import React, { Fragment } from 'react';
import { Button, Card, Col, DatePicker, Form, Input, InputNumber, message, Row } from 'antd';
import { connect } from 'dva';
import PageHeaderWrapper from './PageHeaderWrapper';
import router from 'umi/router';
import { getFormArrayConfig } from './config/index';
import FormArray from '../../App/ButtonDiy/FormArray';
import ButtonDiy from '../../App/ButtonDiy/ButtonDiy';
import Shell from './Shell';

@connect(({ formEdit, formList,loading }) => ({
  formEdit,formList,
}))
@Form.create()
class FormEdit extends React.Component {
  state = {
    modalVisible: false,
    formData: {},
    formItem: [],
    isAdd: this.props.location.state.isAdd,
    objId: this.props.location.state.id,
    recordId: this.props.location.state.recordId,
    recordKey: this.props.location.state.recordKey,
    options:{},
    isView:this.props.location.state.isView
  };
  columns = [];

  //渲染值
  componentDidMount() {
    const { dispatch } = this.props;
    const { objId, recordKey, recordId } = this.state;
    dispatch({
      type: 'formList/getHead',
      payload: { dataObjId: objId },
      callback: dates => {
        if (dates) {
          this.state.formItem = dates;
          const refIds=[]
          for (let t in dates) {

            if (dates[t].referenceObjId != null&&this.state.options[this.state.formItem[t].id+""]==null) {
              refIds.push(dates[t].id)
            }

        }

          if (refIds.length > 0) {
            dispatch({
              type: 'formList/getBatchOptions',
              payload: { ids: refIds },
              callback: (options) => {

                this.setState({options})
              }
            });
          }
        }
      },
    });
    //渲染表单字段
    if (recordId != null) {
      dispatch({
        type: 'formList/getDetail',
        payload: {
          dataObjId: objId,
          key: recordKey,
          value: recordId,
        },
        callback: date => {
          if (date) {
            this.state.formData = date;
          }
        },
      });

    }
  }

  onSubmit = () => {
    const { isAdd, objId, formData } = this.state;
    let payload = {
      params: { ...formData },
      objId,
      isAdd,
      isSelf: true,
    };
    this.props.dispatch({
      type: 'formList/add',
      payload,
      callback: () => {
        message.success('操作成功');
        router.goBack();
      },
    });
  };

  goBack = () => {
    router.goBack();
  };

  changeFormData = (value, key) => {
    let oldValue = this.state.formData;
    oldValue[key] = value;
    this.setState({
      formData: oldValue,
    });
  };

  render() {
    const { getFieldDecorator } = this.props.form;

    const { formItem, formData, isAdd ,options,isView} = this.state;

    return (
      <PageHeaderWrapper title="">
        <Shell>
          <Row>
            <FormArray
              config={getFormArrayConfig(formItem,isAdd,options)}
              nameSpan={{ big: 10, small: 12 }}
              fileSpan={{ big: 4, small: 3 }}
              value={formData}
              changeValue={this.changeFormData}
            />
            <Col
              span={24}
              style={{ textAlign: 'center', paddingTop: '200px', paddingBottom: '50px' }}
            >
              {!isView?<ButtonDiy className={'primaryBlue'} handleClick={this.onSubmit} name={'保存'} />:''}
              <ButtonDiy className={'defaultRed'} handleClick={this.goBack} name={'返回'} />
            </Col>
          </Row>
        </Shell>
      </PageHeaderWrapper>
    );
  }
}

export default FormEdit;
