qm-ui/lib/GalleryUI.js

千米公有云管理端UI基础组件库

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = undefined;

var _row = require('antd/lib/row');

var _row2 = _interopRequireDefault(_row);

var _col = require('antd/lib/col');

var _col2 = _interopRequireDefault(_col);

var _icon = require('antd/lib/icon');

var _icon2 = _interopRequireDefault(_icon);

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _class, _temp; /**
                    * @author gcy[of1518]
                    * @date 16/10/11
                    *
                    * @description GalleryUI
                    */


var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _immutable = require('immutable');

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

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }

function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }

var noop = function noop() {
  return undefined;
};

var GalleryUI = (_temp = _class = function (_Component) {
  _inherits(GalleryUI, _Component);

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

    return _possibleConstructorReturn(this, (GalleryUI.__proto__ || Object.getPrototypeOf(GalleryUI)).call(this, props));
  }

  _createClass(GalleryUI, [{
    key: 'onDataItemChange',
    value: function onDataItemChange(v, data) {
      this.props.onDataItemChange([v], data ? data.toJS ? data : (0, _immutable.fromJS)(data) : data);
      this.forceUpdate();
    }
  }, {
    key: 'render',
    value: function render() {
      var _this2 = this;

      var _props = this.props,
          itemKey = _props.itemKey,
          dataSource = _props.dataSource,
          children = _props.children,
          onRefresh = _props.onRefresh,
          onCellSelect = _props.onCellSelect,
          cellSelected = _props.cellSelected,
          elementOnChange = _props.elementOnChange,
          onFormReset = _props.onFormReset;


      if ((dataSource.toJS ? dataSource.size : dataSource.length) == 0) {
        return _react2.default.createElement(
          'div',
          { className: 'empty-tips' },
          _react2.default.createElement(
            'p',
            { className: 'content' },
            _react2.default.createElement(_icon2.default, { type: 'exclamation-circle' }),
            this.props.emptyTip || '没有搜索到您想要的数据'
          )
        );
      }

      var childrenNode = [];

      dataSource.forEach(function (v, k) {
        var result = null;
        var _v = v.toJS ? v : (0, _immutable.fromJS)(v);
        var onDataItemChange = _this2.onDataItemChange.bind(_this2, k);
        if (typeof children === 'function') {
          result = _react2.default.createElement(
            _col2.default,
            {
              key: !!itemKey ? _v.get(itemKey) : _v.hashCode(),
              span: String(_this2.props.span),
              className: _this2.props.itemClass },
            children({ value: v, onRefresh: onRefresh, onCellSelect: onCellSelect, cellSelected: cellSelected, onDataItemChange: onDataItemChange })
          );
        } else if (_react2.default.isValidElement(children)) {
          result = _react2.default.createElement(
            _col2.default,
            {
              key: !!itemKey ? _v.get(itemKey) : _v.hashCode(),
              span: String(_this2.props.span),
              className: _this2.props.itemClass },
            _react2.default.cloneElement(children, {
              value: v,
              onRefresh: onRefresh,
              onCellSelect: onCellSelect,
              cellSelected: cellSelected,
              onFormReset: onFormReset,
              elementOnChange: elementOnChange,
              onDataItemChange: onDataItemChange
            })
          );
        }
        childrenNode.push(result);
      });
      this.props.requestData(this.props.dataSource);

      return _react2.default.createElement(
        _row2.default,
        { className: this.props.className },
        childrenNode
      );
    }
  }]);

  return GalleryUI;
}(_react.Component), _class.defaultProps = {
  loading: false, //是否加载动画效果

  itemNode: '', //React.element
  dataSource: (0, _immutable.fromJS)([]), //数据数组	Array

  rowKey: '', //行操作主键，若为空则不做选择
  selectType: 'checkout', //行旋转方式，checkout:多选；radio:单选
  cellSelected: (0, _immutable.fromJS)({}), //行选择集合
  cellSelectLimit: (0, _immutable.fromJS)([]), //行操作限制选择列 ，若为Function;则做计算过滤。

  onRefresh: noop, //
  onCellSelect: noop, //
  onDataItemChange: noop,
  requestData: function requestData(itemData) {}
}, _temp);
exports.default = GalleryUI;