ming-demo3/lib/components/basic/tree.js

mdf metaui web

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

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

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

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

var _baseui = require("@mdf/baseui");

var TreeNode = _baseui.Tree.TreeNode;

var TreeControl = function (_React$Component) {
  (0, _inherits2["default"])(TreeControl, _React$Component);

  function TreeControl(props) {
    var _this;

    (0, _classCallCheck2["default"])(this, TreeControl);
    _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(TreeControl).call(this, props));
    _this.state = {
      multiple: _this.props.multiple || false,
      checkable: _this.props.checkable || false,
      expandAll: _this.props.expandAll || false,
      keyField: _this.props.keyField || 'key',
      titleField: _this.props.titleField || 'title',
      childrenField: _this.props.childrenField || 'children',
      visible: !props.bHidden,
      dataSource: [],
      renderFlag: true
    };
    return _this;
  }

  (0, _createClass2["default"])(TreeControl, [{
    key: "componentDidMount",
    value: function componentDidMount() {
      if (this.props.model) this.props.model.addListener(this);
    }
  }, {
    key: "componentDidUpdate",
    value: function componentDidUpdate() {
      if (this.props.model) this.props.model.addListener(this);
    }
  }, {
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps) {
      var childrenField = this.state.childrenField;
      if (!nextProps.dataSource || this.props.id === nextProps.id) return;
      var states = {
        dataSource: nextProps.dataSource
      };

      if (this.state.expandAll) {
        var keyField = this.state.keyField;
        var expandedKeys = [];

        var loop = function loop(data) {
          return data.map(function (item) {
            expandedKeys.push(item[keyField]);
            if (item[childrenField]) loop(item[childrenField]);
          });
        };

        loop(nextProps.dataSource);
        states.expandedKeys = expandedKeys;
      }

      this.setState(states);
    }
  }, {
    key: "componentWillUnmount",
    value: function componentWillUnmount() {
      if (this.props.model) this.props.model.removeListener(this);
    }
  }, {
    key: "onSelect",
    value: function onSelect(selectedKeys, e) {
      if (this.props.onSelect) this.props.onSelect(selectedKeys, e);
      if (this.props.model) this.props.model.select(selectedKeys);
    }
  }, {
    key: "onExpand",
    value: function onExpand(expandedKeys, e) {
      this.setState({
        expandedKeys: expandedKeys
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;

      var titleField = this.state.titleField;
      var keyField = this.state.keyField;
      var childrenField = this.state.childrenField;

      var loop = function loop(data) {
        return data.map(function (item) {
          if (item[childrenField]) {
            return _react["default"].createElement(TreeNode, {
              data: item,
              title: item[titleField],
              key: item[keyField]
            }, loop(item[childrenField]));
          }

          return _react["default"].createElement(TreeNode, {
            data: item,
            title: item[titleField],
            key: item[keyField],
            isLeaf: item.isLeaf,
            disabled: item.disabled
          });
        });
      };

      var treeNodes = loop(this.state.dataSource);
      var treeProps = {
        autoExpandParent: false,
        multiple: this.state.multiple,
        checkable: this.state.checkable,
        expandedKeys: this.state.expandedKeys
      };
      var style = this.state.visible ? {} : {
        display: "none"
      };
      return _react["default"].createElement(_baseui.Tree, (0, _extends2["default"])({
        style: style,
        onExpand: function onExpand(expandedKeys, e) {
          return _this2.onExpand(expandedKeys, e);
        },
        onSelect: function onSelect(selectedKeys, e) {
          return _this2.onSelect(selectedKeys, e);
        }
      }, treeProps), treeNodes);
    }
  }]);
  return TreeControl;
}(_react["default"].Component);

exports.TreeControl = TreeControl;
;
var _default = TreeControl;
exports["default"] = _default;
//# sourceMappingURL=tree.js.map