choerodon-ui/pro/es/tree/index.js

An enterprise-class UI design language and React-based implementation

import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _inherits from "@babel/runtime/helpers/inherits";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";

function _createSuper(Derived) {
  function isNativeReflectConstruct() {
    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
    if (Reflect.construct.sham) return false;
    if (typeof Proxy === "function") return true;

    try {
      Date.prototype.toString.call(Reflect.construct(Date, [], function () {}));
      return true;
    } catch (e) {
      return false;
    }
  }

  return function () {
    var Super = _getPrototypeOf(Derived),
        result;

    if (isNativeReflectConstruct()) {
      var NewTarget = _getPrototypeOf(this).constructor;

      result = Reflect.construct(Super, arguments, NewTarget);
    } else {
      result = Super.apply(this, arguments);
    }

    return _possibleConstructorReturn(this, result);
  };
}

import { __decorate } from "tslib";
import Set from 'core-js/library/fn/set';
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { observer } from 'mobx-react';
import { action, computed, observable, runInAction } from 'mobx';
import noop from 'lodash/noop';
import C7NTree, { TreeNode } from '../../../es/tree';
import autobind from '../_util/autobind';
import { getKey, getTreeNodes } from './util';
import { BooleanValue, DataSetSelection } from '../data-set/enum';
import Spin from '../spin';
export function defaultRenderer(_ref) {
  var text = _ref.text;
  return text;
}

function defaultNodeCover() {
  return {};
}

var keyPropType = PropTypes.oneOfType([PropTypes.string, PropTypes.number]);

var Tree =
/*#__PURE__*/
function (_Component) {
  _inherits(Tree, _Component);

  var _super = _createSuper(Tree);

  function Tree(props, context) {
    var _this;

    _classCallCheck(this, Tree);

    _this = _super.call(this, props, context);
    _this.stateForceRenderKeys = [];
    runInAction(function () {
      _this.stateCheckedKeys = [];
      _this.stateExpandedKeys = [];
    });
    return _this;
  }

  _createClass(Tree, [{
    key: "componentWillMount",
    value: function componentWillMount() {
      this.handleDataSetLoad();
      this.processDataSetListener(true);
    }
  }, {
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps) {
      var _this$props = this.props,
          defaultExpandAll = _this$props.defaultExpandAll,
          defaultSelectedKeys = _this$props.defaultSelectedKeys,
          defaultExpandedKeys = _this$props.defaultExpandedKeys,
          defaultCheckedKeys = _this$props.defaultCheckedKeys;

      if (defaultExpandAll !== nextProps.defaultExpandAll || defaultExpandedKeys !== nextProps.defaultExpandedKeys || defaultCheckedKeys !== nextProps.defaultCheckKeys || defaultSelectedKeys !== nextProps.defaultSelectedKeys) {
        this.processDataSetListener(false);
        this.processDataSetListener(true);
      }
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      this.processDataSetListener(false);
    }
  }, {
    key: "processDataSetListener",
    value: function processDataSetListener(flag) {
      var dataSet = this.props.dataSet;

      if (dataSet) {
        var handler = flag ? dataSet.addEventListener : dataSet.removeEventListener;
        handler.call(dataSet, 'load', this.handleDataSetLoad);
      }
    }
  }, {
    key: "handleDataSetLoad",
    value: function handleDataSetLoad() {
      this.initDefaultExpandedRows();
      this.initDefaultCheckRows();
      this.initDefaultSelectRows();
    }
  }, {
    key: "initDefaultExpandedRows",
    value: function initDefaultExpandedRows() {
      var _this$props2 = this.props,
          defaultExpandAll = _this$props2.defaultExpandAll,
          dataSet = _this$props2.dataSet,
          defaultExpandedKeys = _this$props2.defaultExpandedKeys;
      this.stateExpandedKeys = this.dealDefalutCheckExpand(dataSet, defaultExpandedKeys, defaultExpandAll);
    }
  }, {
    key: "initDefaultCheckRows",
    value: function initDefaultCheckRows() {
      var _this$props3 = this.props,
          dataSet = _this$props3.dataSet,
          defaultCheckedKeys = _this$props3.defaultCheckedKeys;
      this.stateCheckedKeys = this.dealDefalutCheckExpand(dataSet, defaultCheckedKeys);
    }
  }, {
    key: "initDefaultSelectRows",
    value: function initDefaultSelectRows() {
      var _this$props4 = this.props,
          dataSet = _this$props4.dataSet,
          defaultSelectedKeys = _this$props4.defaultSelectedKeys;

      if (dataSet && defaultSelectedKeys) {
        var idField = dataSet.props.idField;
        defaultSelectedKeys.map(function (selectKey) {
          var found = dataSet.find(function (record) {
            return selectKey === String(idField ? record.get(idField) : record.id);
          });

          if (found) {
            dataSet.select(found);
          }

          return null;
        });
      }
    }
    /**
     * 处理tree的props expand check的默认事件
     * @param dataSet
     * @param defalutAll
     * @param defalutKeys
     */

  }, {
    key: "dealDefalutCheckExpand",
    value: function dealDefalutCheckExpand(dataSet, defalutKeys, defalutAll) {
      var defalutStateKeys = [];

      if (dataSet) {
        var _dataSet$props = dataSet.props,
            idField = _dataSet$props.idField,
            expandField = _dataSet$props.expandField;

        if (defalutAll && !expandField) {
          defalutStateKeys = dataSet.reduce(function (array, record) {
            if (record.children) {
              array.push(getKey(record, idField));
            }

            return array;
          }, []);
        } else if (defalutKeys && !expandField) {
          defalutStateKeys = dataSet.reduce(function (array, record) {
            defalutKeys.map(function (key) {
              if (getKey(record, idField) === key) {
                array.push(key);
              }

              return null;
            });
            return array;
          }, []);
        }
      }

      return defalutStateKeys;
    }
  }, {
    key: "setExpand",
    value: function setExpand(eventObj) {
      var dataSet = this.props.dataSet;

      if (dataSet) {
        var _dataSet$props2 = dataSet.props,
            expandField = _dataSet$props2.expandField,
            idField = _dataSet$props2.idField;

        if (expandField) {
          var node = eventObj.node,
              expanded = eventObj.expanded;
          var eventKey = node.eventKey;
          var found = dataSet.find(function (record) {
            return eventKey === getKey(record, idField);
          });

          if (found) {
            found.isExpanded = !!expanded;
            return false;
          }
        }
      }

      return true;
    }
  }, {
    key: "setCheck",
    value: function setCheck(eventObj) {
      var dataSet = this.props.dataSet;

      if (dataSet) {
        var _dataSet$props3 = dataSet.props,
            checkField = _dataSet$props3.checkField,
            idField = _dataSet$props3.idField;

        if (checkField) {
          var node = eventObj.node,
              checked = eventObj.checked;
          var eventKey = node.eventKey;
          var found = dataSet.find(function (record) {
            return eventKey === String(idField ? record.get(idField) : record.id);
          });

          if (found) {
            var field = found.getField(checkField);
            found.set(checkField, field ? checked ? field.get(BooleanValue.trueValue) : field.get(BooleanValue.falseValue) : checked);
            return false;
          }
        }
      }

      return true;
    }
  }, {
    key: "handleExpand",
    value: function handleExpand(expandedKeys, eventObj) {
      var _this2 = this;

      if (this.setExpand(eventObj)) {
        runInAction(function () {
          _this2.stateExpandedKeys = expandedKeys;
        });
      }

      var _this$props$onExpand = this.props.onExpand,
          onExpand = _this$props$onExpand === void 0 ? noop : _this$props$onExpand; // @ts-ignore

      onExpand(expandedKeys, eventObj);
    }
  }, {
    key: "handleCheck",
    value: function handleCheck(checkedKeys, eventObj) {
      var _this3 = this;

      if (this.setCheck(eventObj)) {
        runInAction(function () {
          _this3.stateCheckedKeys = checkedKeys;
        });
      }

      var _this$props$onCheck = this.props.onCheck,
          onCheck = _this$props$onCheck === void 0 ? noop : _this$props$onCheck;
      onCheck(checkedKeys, eventObj);
    }
  }, {
    key: "handleSelect",
    value: function handleSelect(selectedKeys, eventObj) {
      var _this$props5 = this.props,
          dataSet = _this$props5.dataSet,
          _this$props5$onSelect = _this$props5.onSelect,
          onSelect = _this$props5$onSelect === void 0 ? noop : _this$props5$onSelect;

      if (dataSet) {
        var idField = dataSet.props.idField;
        var node = eventObj.node,
            selected = eventObj.selected;
        var eventKey = node.eventKey;
        var found = dataSet.find(function (record) {
          return eventKey === String(idField ? record.get(idField) : record.id);
        });

        if (found) {
          if (selected) {
            dataSet.select(found);
          } else {
            dataSet.unSelect(found);
          }
        }

        onSelect(selectedKeys, eventObj);
      }
    }
  }, {
    key: "handleLoadData",
    value: function handleLoadData(event) {
      var _this$props6 = this.props,
          dataSet = _this$props6.dataSet,
          loadData = _this$props6.loadData;
      var promises = [];

      if (dataSet) {
        var _dataSet$props4 = dataSet.props,
            idField = _dataSet$props4.idField,
            parentField = _dataSet$props4.parentField;
        var record = event.props.record;

        if (idField && parentField && record && !record.children) {
          var id = record.get(idField);
          promises.push(dataSet.queryMore(-1, _defineProperty({}, parentField, id)));
        }
      }

      if (loadData) {
        promises.push(loadData(event));
      }

      return Promise.all(promises);
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props7 = this.props,
          dataSet = _this$props7.dataSet,
          _this$props7$renderer = _this$props7.renderer,
          renderer = _this$props7$renderer === void 0 ? defaultRenderer : _this$props7$renderer,
          titleField = _this$props7.titleField,
          treeNodeRenderer = _this$props7.treeNodeRenderer,
          onTreeNode = _this$props7.onTreeNode,
          loadData = _this$props7.loadData,
          async = _this$props7.async,
          otherProps = _objectWithoutProperties(_this$props7, ["dataSet", "renderer", "titleField", "treeNodeRenderer", "onTreeNode", "loadData", "async"]);

      if (dataSet) {
        var defaultExpandAll = otherProps.defaultExpandAll;
        var props = {};
        props.treeData = getTreeNodes(dataSet, dataSet.treeData, defaultExpandAll ? [] : this.forceRenderKeys, renderer, // @ts-ignore
        onTreeNode || treeNodeRenderer || defaultNodeCover, async || !!loadData, titleField, defaultExpandAll) || []; // @ts-ignore

        props.onExpand = this.handleExpand; // @ts-ignore

        props.onCheck = this.handleCheck; // @ts-ignore

        props.onSelect = this.handleSelect;

        if (async) {
          props.loadData = this.handleLoadData;
        } else {
          props.loadData = loadData;
        }

        props.expandedKeys = this.expandedKeys.slice();

        if (!('checkedKeys' in otherProps)) {
          props.checkedKeys = this.checkedKeys.slice();
        }

        if (!('multiple' in otherProps)) {
          props.multiple = dataSet.props.selection === DataSetSelection.multiple;
        }

        if (!('selectedKeys' in otherProps)) {
          props.selectedKeys = this.selectedKeys.slice();
        }

        return React.createElement(Spin, {
          dataSet: dataSet
        }, React.createElement(C7NTree, _extends({}, otherProps, props)));
      }

      return React.createElement(C7NTree, _extends({}, otherProps));
    }
  }, {
    key: "forceRenderKeys",
    get: function get() {
      return this.stateForceRenderKeys = _toConsumableArray(new Set([].concat(_toConsumableArray(this.stateForceRenderKeys), _toConsumableArray(this.expandedKeys))));
    }
  }, {
    key: "expandedKeys",
    get: function get() {
      var dataSet = this.props.dataSet;

      if (dataSet) {
        var _dataSet$props5 = dataSet.props,
            expandField = _dataSet$props5.expandField,
            idField = _dataSet$props5.idField;

        if (expandField) {
          var keys = [];
          dataSet.forEach(function (record) {
            if (record.isExpanded) {
              keys.push(getKey(record, idField));
            }
          });
          return keys;
        }
      }

      return this.stateExpandedKeys;
    }
  }, {
    key: "checkedKeys",
    get: function get() {
      var dataSet = this.props.dataSet;

      if (dataSet) {
        var _dataSet$props6 = dataSet.props,
            checkField = _dataSet$props6.checkField,
            idField = _dataSet$props6.idField;

        if (checkField) {
          var keys = [];
          dataSet.forEach(function (record) {
            var field = record.getField(checkField);

            if (record.get(checkField) === (field ? field.get(BooleanValue.trueValue) : true)) {
              keys.push(getKey(record, idField));
            }
          });
          return keys;
        }
      }

      return this.stateCheckedKeys;
    }
  }, {
    key: "selectedKeys",
    get: function get() {
      var dataSet = this.props.dataSet;

      if (dataSet) {
        var idField = dataSet.props.idField;
        return dataSet.selected.map(function (record) {
          return getKey(record, idField);
        });
      }

      return [];
    }
  }]);

  return Tree;
}(Component);

Tree.displayName = 'Tree<PRO>';
Tree.propTypes = {
  prefixCls: PropTypes.string,
  className: PropTypes.string,
  style: PropTypes.object,
  tabIndex: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
  children: PropTypes.any,
  treeData: PropTypes.array,
  showLine: PropTypes.bool,
  showIcon: PropTypes.bool,
  icon: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
  selectable: PropTypes.bool,
  disabled: PropTypes.bool,
  multiple: PropTypes.bool,
  checkable: PropTypes.oneOfType([PropTypes.bool, PropTypes.node]),
  checkStrictly: PropTypes.bool,
  draggable: PropTypes.bool,
  defaultExpandParent: PropTypes.bool,
  autoExpandParent: PropTypes.bool,
  defaultExpandAll: PropTypes.bool,
  defaultExpandedKeys: PropTypes.arrayOf(keyPropType),
  expandedKeys: PropTypes.arrayOf(keyPropType),
  defaultCheckedKeys: PropTypes.arrayOf(keyPropType),
  checkedKeys: PropTypes.oneOfType([PropTypes.arrayOf(keyPropType), PropTypes.object]),
  defaultSelectedKeys: PropTypes.arrayOf(keyPropType),
  selectedKeys: PropTypes.arrayOf(keyPropType),
  onClick: PropTypes.func,
  onDoubleClick: PropTypes.func,
  onExpand: PropTypes.func,
  onCheck: PropTypes.func,
  onSelect: PropTypes.func,
  onLoad: PropTypes.func,
  loadData: PropTypes.func,
  loadedKeys: PropTypes.arrayOf(keyPropType),
  onMouseEnter: PropTypes.func,
  onMouseLeave: PropTypes.func,
  onRightClick: PropTypes.func,
  onDragStart: PropTypes.func,
  onDragEnter: PropTypes.func,
  onDragOver: PropTypes.func,
  onDragLeave: PropTypes.func,
  onDragEnd: PropTypes.func,
  onDrop: PropTypes.func,
  filterTreeNode: PropTypes.func,
  motion: PropTypes.object,
  switcherIcon: PropTypes.oneOfType([PropTypes.node, PropTypes.func])
};
Tree.TreeNode = TreeNode;

__decorate([observable], Tree.prototype, "stateCheckedKeys", void 0);

__decorate([observable], Tree.prototype, "stateExpandedKeys", void 0);

__decorate([autobind], Tree.prototype, "handleDataSetLoad", null);

__decorate([action], Tree.prototype, "initDefaultExpandedRows", null);

__decorate([action], Tree.prototype, "initDefaultCheckRows", null);

__decorate([action], Tree.prototype, "initDefaultSelectRows", null);

__decorate([computed], Tree.prototype, "forceRenderKeys", null);

__decorate([computed], Tree.prototype, "expandedKeys", null);

__decorate([computed], Tree.prototype, "checkedKeys", null);

__decorate([computed], Tree.prototype, "selectedKeys", null);

__decorate([autobind], Tree.prototype, "handleExpand", null);

__decorate([autobind], Tree.prototype, "handleCheck", null);

__decorate([autobind], Tree.prototype, "handleSelect", null);

__decorate([autobind], Tree.prototype, "handleLoadData", null);

Tree = __decorate([observer], Tree);
export default Tree;
//# sourceMappingURL=index.js.map