zarm-web/lib/tree/Tree.js

基于 React 的桌面端UI库

"use strict";

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

var _react = _interopRequireWildcard(require("react"));

var _TreeNode = _interopRequireDefault(require("./TreeNode"));

var _utils = require("./utils");

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

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a 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); } }

function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }

function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }

function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }

function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }

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

function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }

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

  function Tree() {
    var _getPrototypeOf2;

    var _this;

    _classCallCheck(this, Tree);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(Tree)).call.apply(_getPrototypeOf2, [this].concat(args)));
    _this.state = {
      checkedKeys: [],
      halfCheckedKeys: [],
      expandedKeys: [],
      treeData: []
    };

    _this.initTreeNodes = function () {
      var _this$props = _this.props,
          _this$props$treeData = _this$props.treeData,
          treeData = _this$props$treeData === void 0 ? [] : _this$props$treeData,
          checkedKeys = _this$props.checkedKeys,
          expandedKeys = _this$props.expandedKeys,
          defaultExpandAll = _this$props.defaultExpandAll,
          children = _this$props.children;
      var newState = {
        treeData: [],
        halfCheckedKeys: [],
        checkedKeys: [],
        expandedKeys: []
      };
      var TreeDataInformationSet = {
        allExpandDataMap: {},
        treeData: []
      };

      if (treeData.length > 0) {
        // 深拷贝treeData
        newState.treeData = (0, _utils.deepCopy)(treeData);
        TreeDataInformationSet = (0, _utils.initialTreeData)(newState.treeData);
      } else if (children) {
        var treeNodeChildren = (0, _utils.getTreeNodeChildren)({
          children: children
        });

        if (treeNodeChildren.length > 0) {
          TreeDataInformationSet = (0, _utils.initialTreeData)((0, _utils.convertTreeToData)(treeNodeChildren));
        }
      }

      var _TreeDataInformationS = TreeDataInformationSet,
          allExpandDataMap = _TreeDataInformationS.allExpandDataMap,
          initialedTreeData = _TreeDataInformationS.treeData;
      newState.treeData = initialedTreeData; // 初始化checkedKeys，更新treeData

      if (checkedKeys && checkedKeys.length > 0) {
        var _conductCheck = (0, _utils.conductCheck)(checkedKeys, true, newState.treeData),
            finalCheckedKeys = _conductCheck.checkedKeys,
            finalHalfCheckedKeys = _conductCheck.halfCheckedKeys,
            finaltreeDataAfter = _conductCheck.treeData;

        newState.checkedKeys = finalCheckedKeys;
        newState.halfCheckedKeys = finalHalfCheckedKeys;
        newState.treeData = finaltreeDataAfter;
      }
      /*
      初始化expandedKeys
      如果要展开所有结点，则取到所有根结点作为展开结点；
      否则展开传入的展开结点
       */


      if (defaultExpandAll) {
        newState.expandedKeys = (0, _utils.conductExpandParent)(Object.keys(allExpandDataMap), newState.treeData);
      } else if (expandedKeys && expandedKeys.length > 0) {
        newState.expandedKeys = (0, _utils.conductExpandParent)(expandedKeys, newState.treeData);
      }

      _this.setState(newState);
    };

    _this.onNodeCheck = function (node, targetChecked, event) {
      var onCheck = _this.props.onCheck;
      var keys = node.props.keys;
      var originalTreeData = _this.state.treeData;
      var _this$state = _this.state,
          originalCheckedKeys = _this$state.checkedKeys,
          originHalfCheckedKeys = _this$state.halfCheckedKeys;

      var _conductCheck2 = (0, _utils.conductCheck)([keys], targetChecked, originalTreeData, {
        checkedKeys: originalCheckedKeys,
        halfCheckedKeys: originHalfCheckedKeys
      }),
          checkedKeys = _conductCheck2.checkedKeys,
          halfCheckedKeys = _conductCheck2.halfCheckedKeys,
          treeData = _conductCheck2.treeData;

      var checkedMap = {
        checkedKeys: checkedKeys,
        halfCheckedKeys: halfCheckedKeys
      };

      _this.setState({
        checkedKeys: checkedKeys,
        halfCheckedKeys: halfCheckedKeys,
        treeData: treeData
      });

      if (onCheck) {
        onCheck(checkedMap, {
          node: node,
          checked: targetChecked,
          event: event
        });
      }
    };

    _this.onNodeExpand = function (node, targetExpanded, event) {
      var expandedKeys = _this.state.expandedKeys;
      var onExpand = _this.props.onExpand;
      var keys = node.props.keys;

      if (targetExpanded) {
        expandedKeys = (0, _utils.arrAdd)(expandedKeys, keys);
      } else {
        expandedKeys = (0, _utils.arrDel)(expandedKeys, keys);
      }

      _this.setState({
        expandedKeys: expandedKeys
      });

      if (onExpand) {
        onExpand({
          expandedKeys: expandedKeys,
          node: node,
          expanded: targetExpanded,
          event: event
        });
      }
    };

    _this.renderTreeNodes = function (data) {
      var _this$props2 = _this.props,
          prefixCls = _this$props2.prefixCls,
          canCheck = _this$props2.canCheck;
      var _this$state2 = _this.state,
          expandedKeys = _this$state2.expandedKeys,
          checkedKeys = _this$state2.checkedKeys,
          halfCheckedKeys = _this$state2.halfCheckedKeys;
      return data.map(function (item, index) {
        var keys = item.keys,
            title = item.title,
            checkDisabled = item.checkDisabled,
            children = item.children;
        return _react.default.createElement(_TreeNode.default, {
          key: "".concat(index),
          keys: keys,
          title: title,
          canCheck: canCheck,
          checkDisabled: !!checkDisabled,
          prefixCls: prefixCls,
          expanded: expandedKeys.indexOf(keys) !== -1,
          checked: checkedKeys.indexOf(keys) !== -1,
          halfChecked: halfCheckedKeys.indexOf(keys) !== -1,
          isLeaf: !children,
          onNodeCheck: _this.onNodeCheck,
          onNodeExpand: _this.onNodeExpand
        }, children ? _this.renderTreeNodes(children) : null);
      });
    };

    return _this;
  }

  _createClass(Tree, [{
    key: "componentWillMount",
    value: function componentWillMount() {
      this.initTreeNodes();
    }
  }, {
    key: "render",
    value: function render() {
      var prefixCls = this.props.prefixCls;
      var treeData = this.state.treeData;
      return _react.default.createElement("ul", {
        className: prefixCls
      }, this.renderTreeNodes(treeData));
    }
  }]);

  return Tree;
}(_react.Component);

Tree.defaultProps = {
  prefixCls: 'ui-tree',
  checkedKeys: [],
  expandedKeys: []
};
Tree.TreeNode = void 0;
var _default = Tree;
exports.default = _default;