ssc-refer/es/VoucherMoreConditions.js

React refer component for SSC 3.0

import _extends from 'babel-runtime/helpers/extends';
import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
import _inherits from 'babel-runtime/helpers/inherits';
/**
 * Created by Tiger on 17/3/14.
 */

import classNames from 'classnames';
import React, { Component, PropTypes } from 'react';

import { Button, Form, FormGroup, ControlLabel } from 'react-bootstrap';
import { Col } from 'react-bootstrap';

// 表单(form)控件(control/widget)
import { FormControl, Checkbox } from 'react-bootstrap';

var VoucherMoreConditions = function (_Component) {
  _inherits(VoucherMoreConditions, _Component);

  function VoucherMoreConditions(props) {
    _classCallCheck(this, VoucherMoreConditions);

    var _this = _possibleConstructorReturn(this, _Component.call(this, props));

    _this.state = {
      formData: _extends({}, _this.props.defaultData),
      fieldsValidationState: {}
    };
    return _this;
  }

  VoucherMoreConditions.prototype.handleChange = function handleChange(fieldId, event, validationState) {
    var _fieldsValidationStat;

    var target = event.target;
    var value = target.type === 'checkbox' ? target.checked : target.value;
    // const name = target.name;

    var newState = {
      formData: this.state.formData
    };
    newState.formData[fieldId] = value;
    this.setState(newState);

    // undefined/null都不代表失败
    this.setState(update(this.state, {
      fieldsValidationState: (_fieldsValidationStat = {}, _fieldsValidationStat[fieldId] = {
        $set: !(validationState === false)
      }, _fieldsValidationStat)
    }));

    if (this.props.onChange) {
      this.props.onChange(fieldId, value, {
        event: event
      });
    }
  };

  VoucherMoreConditions.prototype.handleSubmit = function handleSubmit(event) {
    if (this.props.onSubmit) {
      this.props.onSubmit(event, this.state.formData);
    }
  };

  VoucherMoreConditions.prototype.handleReset = function handleReset(event) {
    if (this.props.onReset) {
      this.props.onReset(event);
    }
  };

  VoucherMoreConditions.prototype.calcAllFieldsValidationState = function calcAllFieldsValidationState(fieldsValidationState) {
    var result = true;
    var fieldId = void 0;
    for (fieldId in fieldsValidationState) {
      if (fieldsValidationState.hasOwnProperty(fieldId)) {
        result = fieldsValidationState[fieldId] && result;
      }
    }
    return result;
  };

  VoucherMoreConditions.prototype.render = function render() {
    var _props = this.props,
        fieldsModel = _props.fieldsModel,
        className = _props.className;

    return React.createElement(
      'form',
      { horizontal: true, className: classNames(className) },
      React.createElement(
        FormGroup,
        null,
        React.createElement(
          Col,
          { sm: 12, className: 'text-center' },
          React.createElement(
            Button,
            { bsStyle: 'info', onClick: this.handleReset.bind(this), type: 'reset' },
            '\u53D6\u6D88'
          ),
          React.createElement(
            Button,
            { bsStyle: 'info', onClick: this.handleSubmit.bind(this),
              type: 'submit', disabled: !this.calcAllFieldsValidationState(this.state.fieldsValidationState)
            },
            '\u5B8C\u6210'
          )
        )
      )
    );
  };

  return VoucherMoreConditions;
}(Component);

VoucherMoreConditions.propTypes = {
  fieldsModel: PropTypes.array.isRequired,
  defaultData: PropTypes.object,
  onChange: PropTypes.func,
  onSubmit: PropTypes.func,
  onReset: PropTypes.func
};
export default VoucherMoreConditions;