How to use the redux-form.reduxForm function in redux-form

import { injectIntl, intlShape } from 'react-intl';
import { reduxForm } from 'redux-form';
import { FieldErrorHint } from 'components/fields/fieldErrorHint';
import { FieldProvider } from 'components/fields/fieldProvider';
import { Input } from 'components/inputs/input';
import { validate, bindMessageToValidator, validateAsync } from 'common/utils';
import { ModalLayout, withModal, ModalField } from 'components/main/modal';
import { SectionHeader } from 'components/main/sectionHeader';
import { COMMON_LOCALE_KEYS } from 'common/constants/localization';
import { messages } from './../messages';

const LABEL_WIDTH = 105;

@withModal('addProjectModal')
@injectIntl
@reduxForm({
  form: 'addProjectForm',
  validate: ({ projectName }) => ({
    projectName: bindMessageToValidator(validate.projectName, 'projectNameLengthHint')(projectName),
  }),
  asyncValidate: ({ projectName }) => validateAsync.projectNameUnique(projectName),
  asyncChangeFields: ['projectName'],
  asyncBlurFields: ['projectName'], // validate on blur in case of copy-paste value
})
export class AddProjectModal extends Component {
  static propTypes = {
    intl: intlShape.isRequired,
    data: PropTypes.object,
    dirty: PropTypes.bool,
    handleSubmit: PropTypes.func,
    change: PropTypes.func,
  };

UserPermissionsForm.propTypes = {
  // from compositional chain
  intl: PropTypes.object.isRequired,
  renderCheckbox: PropTypes.func.isRequired,
  initialValues: PropTypes.object,
};

const reduxFormConfig = {
  form: 'userForm',
};

export default
injectIntl(
  withIntlForm(
    reduxForm(reduxFormConfig)(
      UserPermissionsForm
    )
  )
);

/>
      <h4>Exchange wallet</h4>
      
      <button>Submit</button>
    
  
);

export default compose(
  withApollo,
  withWallets,
  filterWallets,
  reduxForm({
    form: 'addCoin',
    initialValues: {
      localWallet: 'new',
      exchangeWallet: 'new'
    }
  })
)(AddCoinDialog);

import { reduxForm } from 'redux-form';
import { Modal, Button, ControlLabel, FormControl, FormGroup, HelpBlock } from 'react-bootstrap';
import { notify } from 'react-notify-toast';
import _ from 'lodash';

const img = require('../../../assets/images/loading.gif');

const validate = (values, props) => {
  const errors = {};
  if (!values.send_auth_pwd) {
    errors.send_auth_pwd = '必填';
  }
  return errors;
};

@reduxForm({
  form: 'sysetting',
  fields: ['send_auth_pwd'],
  validate
})
export default class ResetPwdModal extends Component {
  constructor(props) {
    super(props);
    this.state = { ecode: 0 };
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleCancel = this.handleCancel.bind(this);
  }

  static propTypes = {
    i18n: PropTypes.object.isRequired,
    submitting: PropTypes.bool,
    invalid: PropTypes.bool,

import FieldInput from 'components/reduxForm/FieldInput';
import { CheckboxGroup } from 'components/reduxForm/FieldCheckboxGroup';
import FiledSelect from 'components/reduxForm/FieldSelect';

import Button from 'components/Button';
import Line from 'components/Line';
import { H3 } from 'components/Title';

import ConfirmFormChanges from 'containers/blocks/ConfirmFormChanges';

import { reduxFormValidate } from 'react-nebo15-validate';

import styles from './styles.scss';

@withStyles(styles)
@reduxForm({
  form: 'api-form',
  initialValues: {
    request: {
      scheme: 'http',
    },
  },
  validate: reduxFormValidate({
    name: {
      required: true,
    },
    'request.host': {
      required: true,
    },
    'request.path': {
      required: true,
    },

value: DESCRIPTION_LEAVE,
    label: formatMessage(messages.descriptionLeaveLabel),
  },
  {
    value: DESCRIPTION_UPDATE,
    label: formatMessage(messages.descriptionAddLabel),
  },
  {
    value: DESCRIPTION_CREATE,
    label: formatMessage(messages.descriptionReplaceLabel),
  },
];

@withModal('editItemsModal')
@injectIntl
@reduxForm({
  form: 'editItemsForm',
  validate: ({ commonAttributes }) => ({
    commonAttributes: !validate.attributesArray(commonAttributes),
  }),
})
@formValues('descriptionAction', 'uniqueAttributes')
@connect(
  (state) => ({
    currentProject: activeProjectSelector(state),
  }),
  {
    showNotification,
    showDefaultErrorNotification,
  },
)
export class EditItemsModal extends Component {

if (values.expect_start_time && values.expect_complete_time) {
    if (values.expect_start_time > values.expect_complete_time) {
      errors.expect_start_time = '开始时间要早于结束时间';
    }
  }

  if (props.mode == 'progress' && values.progress) {
    if (isNaN(values.progress) || values.progress < 0) {
      errors.progress = '格式错误';
    }
  }

  return errors;
};

@reduxForm({
  form: 'ganttedit',
  fields: [ 'expect_start_time', 'expect_complete_time', 'progress' ],
  validate
})
export default class EditModal extends Component {
  constructor(props) {
    super(props);
    this.state = { ecode: 0 };
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleCancel = this.handleCancel.bind(this);
  }

  static propTypes = {
    i18n: PropTypes.object.isRequired,
    mode: PropTypes.string.isRequired,
    submitting: PropTypes.bool,

import React from 'react';
import withStyles from 'nebo15-isomorphic-style-loader/lib/withStyles';
import { reduxForm, Field, FormSection } from 'redux-form';

import FieldInput from 'components/reduxForm/FieldInput';
import FieldCheckbox from 'components/reduxForm/FieldCheckbox';
import FiledSelect from 'components/reduxForm/FieldSelect';

import Line from 'components/Line';

import { reduxFormValidate } from 'react-nebo15-validate';

import styles from './styles.scss';

@reduxForm({
  form: 'plugin-settings-form',
  initialValues: {
    settings: {
      scheme: 'http',
    },
  },
  validate: reduxFormValidate({
    'settings.host': {
      required: true,
    },
    'settings.port': {
      required: true,
    },
    'settings.path': {
      required: true,
    },

import React, { PropTypes, Component } from 'react';
import { reduxForm } from 'redux-form';
import { Modal, Button, ControlLabel, FormControl, FormGroup } from 'react-bootstrap';
import Select from 'react-select';
import { Checkbox, CheckboxGroup } from 'react-checkbox-group';
import _ from 'lodash';

const validate = (values) => {
  const errors = {};
  if (!values.actions) {
    errors.actions = 'Required';
  }
  return errors;
};

@reduxForm({
  form: 'delAction',
  fields: [ 'actions' ],
  validate
})
export default class DelActionModal extends Component {
  constructor(props) {
    super(props);
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleCancel = this.handleCancel.bind(this);
  }

  static propTypes = {
    data: PropTypes.object,
    stepData: PropTypes.object,
    submitting: PropTypes.bool,
    invalid: PropTypes.bool,

import { reduxForm } from 'redux-form';
import { Modal, Button, ControlLabel, FormControl, FormGroup, HelpBlock } from 'react-bootstrap';
import _ from 'lodash';
import { notify } from 'react-notify-toast';

const img = require('../../assets/images/loading.gif');

const validate = (values, props) => {
  const errors = {};
  if (!values.name) {
    errors.name = '必填';
  } 
  return errors;
};

@reduxForm({
  form: 'group',
  fields: [ 'id', 'name', 'description' ],
  validate
})
export default class CreateModal extends Component {
  constructor(props) {
    super(props);
    this.state = { ecode: 0 };
    this.handleSubmit = this.handleSubmit.bind(this);
    this.handleCancel = this.handleCancel.bind(this);
  }

  static propTypes = {
    i18n: PropTypes.object.isRequired,
    submitting: PropTypes.bool,
    invalid: PropTypes.bool,