cuz/lib/components/IndexGroup/index.js

Front-end modular development kit.

'use strict';

var _extends = require('babel-runtime/helpers/extends')['default'];

var _interopRequireDefault = require('babel-runtime/helpers/interop-require-default')['default'];

exports.__esModule = true;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _Checkbox = require('./Checkbox');

var _Checkbox2 = _interopRequireDefault(_Checkbox);

var _Grid = require('../Grid');

var CheckboxGroup = _react2['default'].createClass({
  displayName: 'CheckboxGroup',

  propTypes: {
    data: _react2['default'].PropTypes.array,
    col: _react2['default'].PropTypes.number,
    max: _react2['default'].PropTypes.number,
    onSelect: _react2['default'].PropTypes.func,
    children: _react2['default'].PropTypes.any
  },

  getDefaultProps: function getDefaultProps() {
    return {
      data: []
    };
  },

  handleChange: function handleChange(item, event) {
    var onSelect = this.props.onSelect;
    var groupNum = item.groupNum;
    var index = item.index;

    var data = this.state === null ? this.props.data.concat() : this.state.data.concat();
    var checkedNum = 0;
    var isMax = false;
    if (this.state === null) {
      data.map(function (group) {
        group.items.map(function (dataitem) {
          if (dataitem.checked === true) checkedNum++;
        });
      });
    } else {
      checkedNum = this.state.checkedNum;
    }
    var checked = event.target.checked;
    var selectedArray = [];
    if (checked) checkedNum++;else checkedNum--;
    if (checkedNum > this.props.max) {
      data[groupNum].items[index].checked = !checked;
      checkedNum--;
      isMax = true;
    } else {
      item.checked = checked;
      data[groupNum].items[index].checked = checked;
    }
    this.setState({
      data: data,
      checkedNum: checkedNum
    });
    data.map(function (group) {
      group.items.map(function (dataitem) {
        if (dataitem.checked === true) selectedArray.push(dataitem);
      });
    });
    if (onSelect) {
      onSelect(item, selectedArray, isMax, data);
    }
  },

  renderCheckboxItem: function renderCheckboxItem(items, groupNum) {
    var _this = this;

    var checkboxItem = [];
    var data = this.state === null ? this.props.data : this.state.data;
    items.map(function (item, index) {
      checkboxItem.push(_react2['default'].createElement(
        _Grid.Col,
        { key: index, sm: _this.props.col },
        _react2['default'].createElement(_Checkbox2['default'], _extends({
          type: 'checkbox'
        }, item, {
          groupNum: groupNum,
          index: index,
          checked: data[groupNum].items[index].checked,
          onSelect: _this.handleChange }))
      ));
    });
    return checkboxItem;
  },

  renderCheckboxGroup: function renderCheckboxGroup() {
    var _this2 = this;

    var data = this.props.data;

    var checkboxGroup = [];
    data.map(function (item, index) {
      checkboxGroup.push(_react2['default'].createElement(
        'div',
        { key: index, className: 'checkbox-group' },
        _react2['default'].createElement(
          'div',
          { className: 'checkbox-group-title' },
          item.type
        ),
        _react2['default'].createElement(
          'div',
          { className: 'checkbox-group-container' },
          _react2['default'].createElement(
            _Grid.Row,
            null,
            _this2.renderCheckboxItem(item.items, index)
          )
        )
      ));
    });
    return checkboxGroup;
  },

  render: function render() {
    return _react2['default'].createElement(
      'div',
      { className: 'checkbox-container' },
      this.renderCheckboxGroup()
    );
  }
});

exports['default'] = CheckboxGroup;
module.exports = exports['default'];