shineout/es/Table/TreeExpand.js

Shein 前端组件库

import _extends from "@babel/runtime/helpers/extends";
import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React from 'react';
import immer from 'immer';
import { getKey } from '../utils/uid';
import { keysToArray } from '../utils/transform';
var TREE_TABLE_DEFAULT_INDENT = 15;
var defaultProps = {
  defaultTreeExpandKeys: []
};
export default (function (WrappedComponent) {
  var _class, _temp;

  return _temp = _class =
  /*#__PURE__*/
  function (_React$Component) {
    _inheritsLoose(TreeExpand, _React$Component);

    function TreeExpand(props) {
      var _this;

      _this = _React$Component.call(this, props) || this;

      _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "changedByExpand", void 0);

      _defineProperty(_assertThisInitialized(_assertThisInitialized(_this)), "expandLevel", void 0);

      _this.state = {
        expandKeys: TreeExpand.getMapFromArray(props.defaultTreeExpandKeys)
      };
      _this.handleTreeExpand = _this.handleTreeExpand.bind(_assertThisInitialized(_assertThisInitialized(_this)));
      return _this;
    }

    var _proto = TreeExpand.prototype;

    _proto.componentDidUpdate = function componentDidUpdate() {
      this.changedByExpand = false;
    };

    _proto.getTreeIndent = function getTreeIndent() {
      var columns = this.props.columns;

      for (var i = 0; i < columns.length; i++) {
        if (typeof columns[i].treeIndent === 'number') return columns[i].treeIndent;
      }

      return TREE_TABLE_DEFAULT_INDENT;
    };

    _proto.getExpandKeys = function getExpandKeys() {
      var treeExpandKeys = this.props.treeExpandKeys;
      if (!treeExpandKeys) return this.state.expandKeys;
      return TreeExpand.getMapFromArray(treeExpandKeys);
    };

    TreeExpand.getMapFromArray = function getMapFromArray(arr) {
      return arr.reduce(function (map, key) {
        map.set(key, true);
        return map;
      }, new Map());
    } // getChildrenLength(children) {
    //   const { treeColumnsName, keygen } = this.props
    //   const { expandKeys } = this.state
    //   if (!children) return 0
    //   let { length = 0 } = children
    //   for (let i = 0; i < children.length; i++) {
    //     const child = children[i]
    //     const key = getKey(child, keygen)
    //     if (!expandKeys.get(key)) continue
    //     expandKeys.delete(key)
    //     if (child[treeColumnsName] && child[treeColumnsName].length) {
    //       length += this.getChildrenLength(child[treeColumnsName])
    //     }
    //   }
    //   return length
    // }
    ;

    _proto.getExpandData = function getExpandData() {
      var _this2 = this;

      var _this$props = this.props,
          data = _this$props.data,
          keygen = _this$props.keygen,
          treeColumnsName = _this$props.treeColumnsName;
      var expandKeys = this.getExpandKeys();
      this.expandLevel = new Map();
      if (expandKeys.size === 0) return data;
      var storeExpandKeys = new Map();
      expandKeys.forEach(function (value, key) {
        return storeExpandKeys.set(key, value);
      });
      var cloneData = JSON.parse(JSON.stringify(data));
      return immer(cloneData, function (draft) {
        var dataCo = draft;

        var _loop = function _loop(i) {
          if (storeExpandKeys.size === 0) return "break";
          var item = dataCo[i];
          var key = getKey(item, keygen, i);
          var parentLevel = _this2.expandLevel.get(key) || 0;
          var children = item[treeColumnsName];

          if (storeExpandKeys.get(key) && children) {
            children.forEach(function (child) {
              _this2.expandLevel.set(getKey(child, keygen), parentLevel + 1);
            });
            draft.splice.apply(draft, [i + 1, 0].concat(children));
            dataCo = draft;
            storeExpandKeys.delete(key);
          }
        };

        for (var i = 0; i < dataCo.length; i++) {
          var _ret = _loop(i);

          if (_ret === "break") break;
        }
      });
    };

    _proto.handleTreeExpand = function handleTreeExpand(data, index) {
      var _this$props2 = this.props,
          keygen = _this$props2.keygen,
          treeExpandKeys = _this$props2.treeExpandKeys,
          onTreeExpand = _this$props2.onTreeExpand;
      var expandKeys = this.getExpandKeys();
      var key = getKey(data, keygen, index);
      var changedKeys = immer(expandKeys, function (draft) {
        // eslint-disable-next-line no-unused-expressions
        expandKeys.get(key) ? draft.delete(key) : draft.set(key, true);
      });

      if (treeExpandKeys && onTreeExpand) {
        onTreeExpand(keysToArray(changedKeys), data, !!expandKeys.get(key), index);
        return;
      }

      this.changedByExpand = true;
      this.setState({
        expandKeys: changedKeys
      });
    };

    _proto.render = function render() {
      var treeColumnsName = this.props.treeColumnsName;
      var expandKeys = this.getExpandKeys();
      var data = this.getExpandData();
      var rootTree = data.filter(function (v) {
        return v && v[treeColumnsName] && v[treeColumnsName].length;
      }).length === 0;
      var treeIndent = this.getTreeIndent();
      return React.createElement(WrappedComponent, _extends({}, this.props, {
        changedByExpand: this.changedByExpand || this.props.changedByExpand,
        data: data,
        onTreeExpand: this.handleTreeExpand,
        treeExpandKeys: expandKeys,
        treeExpandLevel: this.expandLevel,
        treeRoot: rootTree,
        treeIndent: treeIndent
      }));
    };

    return TreeExpand;
  }(React.Component), _defineProperty(_class, "defaultProps", defaultProps), _temp;
});