content: /*
   *
   * ModelManageEditForm
   *
   */
  
  import React from 'react';
  import { connect } from 'react-redux';
  import moment from 'moment';
  import selectModelManageEditForm from './selectors';
  import { Modal, Form, Input, Row, Col, Button, Select } from 'antd';
  import {
    initEditFormAction,
    setSubmitAction,
    submitEditFormAction,
  } from './actions';
  
  const createForm = Form.create;
  const FormItem = Form.Item;
  
  export class ModelManageEditForm extends React.Component { // eslint-disable-line react/prefer-stateless-function
  
    componentWillReceiveProps(nextProps) {
      if (nextProps.visible && this.props.visible === false && nextProps.modelId) {
        this.props.dispatch(initEditFormAction(nextProps.modelId, nextProps.tenantId));
      }
    }
  
    getFormValues = () => {
  
      const editForm = this.props.form.getFieldsValue();
      if (editForm.create_date) {
        editForm.create_date = moment(editForm.create_date).format('YYYY-MM-DD HH:mm:ss');
      }
  
      if (editForm.update_date) {
        editForm.update_date = moment(editForm.update_date).format('YYYY-MM-DD HH:mm:ss');
      }
  
      return editForm;
    }
  
    submitEditForm = (isConfig) => {
      const { getFormValues, submit } = this;
  
      this.props.form.validateFields((errors, values) => {
        if (errors) {
        } else {
          submit(getFormValues(), isConfig);
        }
      });
    }
  
    submit = (form, isConfig) => {
      this.props.dispatch(submitEditFormAction(form, isConfig));
    }
  
    render() {
      const { getFieldDecorator, getFieldError, isFieldValidating } = this.props.form;
  
      const formItemLayout = {
        labelCol: { span: 4 },
        wrapperCol: { span: 12 },
      };
  
      // console.log('ModelManageEditForm:', this.props);
  
      const Option = Select.Option;
  
      return (
        <Modal title="修改模型" visible={this.props.visible} width={'90%'} style={{ minWidth: '760px' }} onCancel={this.props.onCancel}
          footer={(<div>
            <Button onClick={this.props.onCancel}>取消</Button>
            <Button onClick={this.submitEditForm.bind(this, false)} type="primary">确认并返回</Button>
            <Button onClick={this.submitEditForm.bind(this, true)} type="primary">确认并配置</Button>
          </div>)} >
          <Form ref="form" horizontal >
            <div style={{ display: 'none' }}>
              {getFieldDecorator('id')(<Input />)}
            </div>
            <Row gutter={2}>
              <Col span={12}>
                <FormItem
                  {...formItemLayout}
                  label="模型key"
                >
                  {
                    getFieldDecorator('key',
                      { validate: [{
                          rules: [
                            { required: true },
                          ],
                        }],
                      })(<Input disabled />)
                  }
                </FormItem>
              </Col>
              <Col span={12}>
                <FormItem
                  {...formItemLayout}
                  label="模型名称"
                  hasFeedback
                >
                  {
                    getFieldDecorator('name',
                      { validate: [{
                          rules: [
                            { required: true },
                          ],
                        }],
                      })(<Input />)
                  }
                </FormItem>
              </Col>
            </Row>
            <Row gutter={2}>
              <Col span={12}>
                <FormItem
                  {...formItemLayout}
                  label="模型描述"
                  hasFeedback
                >
                  {
                    getFieldDecorator('description',
                      {})(<Input />)
                  }
                </FormItem>
              </Col>
              <Col span={12}>
                <FormItem
                  {...formItemLayout}
                  label="租户"
                >
                  {
                    getFieldDecorator('tenantId',
                      { validate: [{
                          rules: [
                            { required: true },
                          ],
                        }],
                      })(<Select disabled>
                        {
                          this.props.tenant ? this.props.tenant.map((x) => (<Option key={x.id} value={x.code}>{x.code}</Option>)) : []
                        }
                      </Select>)
                  }
                </FormItem>
              </Col>
            </Row>
            <Row gutter={2}>
              <Col span={12}>
                <FormItem
                  {...formItemLayout}
                  label="流程分类"
                  hasFeedback
                >
                  {
                    getFieldDecorator('processTypeId',
                      {})(<Select disabled={ (this.props.submit.tenantId && this.props.submit.tenantId.value) ? false : true }>
                        {
                          this.props.processType.map((x) => (<Option key={x.id} value={x.id}>{x.name}</Option>))
                        }
                      </Select>)
                  }
                </FormItem>
              </Col>
            </Row>
          </Form>
        </Modal>
      );
    }
  }
  
  const mapStateToProps = selectModelManageEditForm();
  
  function mapDispatchToProps(dispatch) {
    return {
      dispatch,
    };
  }
  
  export default connect(mapStateToProps, mapDispatchToProps)(createForm({
    mapPropsToFields(props) {
      return props.submit;
    },
    onFieldsChange(props, fields) {
      props.dispatch(setSubmitAction(fields));
    },
  })(ModelManageEditForm));
  