ssc-refer/lib/refer/ReferList.react.js

React refer component for SSC 3.0

'use strict';

exports.__esModule = true;

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _lodash = require('lodash');

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _List = require('./List.react');

var _List2 = _interopRequireDefault(_List);

var _ListItem = require('./ListItem.react');

var _ListItem2 = _interopRequireDefault(_ListItem);

var _reactBootstrap = require('react-bootstrap');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

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

  /**
   * In addition to the propTypes below, the following props are automatically
   * passed down by `Typeahead`:
   *
   *  - labelKey
   *  - onPaginate
   *  - options
   *  - paginate
   *  - text
   */
  propTypes: {
    /**
     * Provides the ability to specify a prefix before the user-entered text to
     * indicate that the selection will be new. No-op unless `allowNew={true}`.
     */
    newSelectionPrefix: _react.PropTypes.string,
    /**
     * Provides a hook for customized rendering of menu item contents.
     */
    renderMenuItemChildren: _react.PropTypes.func
  },

  getDefaultProps: function getDefaultProps() {
    return {
      newSelectionPrefix: 'New selection: '
    };
  },
  getInitialState: function getInitialState() {
    var options = this.props.options;

    var defaultNav = (0, _lodash.filter)(options, { "isLeaf": "false", pid: "" });
    var defaultContent = (0, _lodash.filter)(options, function (item) {
      return true;
    });

    return {
      navList: defaultNav,
      contentList: defaultContent
    };
  },
  render: function render() {
    var menuProps = (0, _lodash.pick)(this.props, ['align', 'className', 'dropup', 'emptyLabel', 'maxHeight', 'onPaginate', 'paginate', 'paginationText', 'style']);

    return _react2['default'].createElement(
      _List2['default'],
      menuProps,
      this._renderNavBar(this.state.navList),
      this.state.contentList.map(this._renderListItem)
    );
  },
  _renderNavBar: function _renderNavBar(dataList) {
    var _this = this;

    var navBar = _react2['default'].createElement(
      _reactBootstrap.Breadcrumb,
      null,
      dataList.map(function (item) {
        return _react2['default'].createElement(
          _reactBootstrap.Breadcrumb.Item,
          { href: 'javascript:void(0)', onClick: _this._handleChangeStatus },
          item.name
        );
      })
    );

    return navBar;
  },
  _renderListItem: function _renderListItem(option, idx) {
    var _props = this.props,
        labelKey = _props.labelKey,
        renderMenuItemChildren = _props.renderMenuItemChildren;


    var menuItemProps = {
      disabled: option.disabled,
      key: idx,
      option: option,
      position: idx,
      className: 'col-md-6 openLi',
      labelKey: labelKey
    };

    return renderMenuItemChildren ? _react2['default'].createElement(
      _ListItem2['default'],
      menuItemProps,
      renderMenuItemChildren(option, this.props, idx)
    ) : _react2['default'].createElement(
      _ListItem2['default'],
      (0, _extends3['default'])({ changeStatus: this._handleChangeStatus }, menuItemProps),
      option
    );
  },
  _handleChangeStatus: function _handleChangeStatus(option) {
    this._changeNav(option);
    this._changelist(option);
  },
  _changeNav: function _changeNav(option) {
    var navList = this.state.navList;
    navList.push(option);
    this.setState({
      navList: navList
    });
  },
  _changelist: function _changelist(option) {
    var options = this.props.options;

    var currentList = (0, _lodash.filter)(options, function (item) {
      return item.pid === option.id;
    });
    this.setState({
      contentList: currentList
    });
  }
});

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