choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
659 lines (562 loc) • 22.2 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
exports.defaultRenderer = defaultRenderer;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var _tslib = require("tslib");
var _react = _interopRequireWildcard(require("react"));
var _mobxReact = require("mobx-react");
var _mobx = require("mobx");
var _defaultTo = _interopRequireDefault(require("lodash/defaultTo"));
var _noop = _interopRequireDefault(require("lodash/noop"));
var _xor = _interopRequireDefault(require("lodash/xor"));
var _isNil = _interopRequireDefault(require("lodash/isNil"));
var _tree = _interopRequireWildcard(require("../../../lib/tree"));
var _autobind = _interopRequireDefault(require("../_util/autobind"));
var _util = require("./util");
var _enum = require("../data-set/enum");
var _spin = _interopRequireDefault(require("../spin"));
var _excluded = ["dataSet", "renderer", "titleField", "treeNodeRenderer", "onTreeNode", "loadData", "async", "selectable", "filter"];
function defaultRenderer(_ref) {
var text = _ref.text;
return text;
}
function defaultNodeCover() {
return {};
}
function getCheckedKeys(checkedKeys) {
return Array.isArray(checkedKeys) ? checkedKeys : (0, _typeof2["default"])(checkedKeys) === 'object' ? checkedKeys.checked : [];
}
var Tree = /*#__PURE__*/function (_Component) {
(0, _inherits2["default"])(Tree, _Component);
var _super = (0, _createSuper2["default"])(Tree);
function Tree(props, context) {
var _this;
(0, _classCallCheck2["default"])(this, Tree);
_this = _super.call(this, props, context);
_this.inCheckExpansion = false;
(0, _mobx.runInAction)(function () {
_this.stateCheckedKeys = [];
_this.stateExpandedKeys = [];
_this.stateLoadedKeys = [];
});
return _this;
}
(0, _createClass2["default"])(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 _this$props2 = this.props,
dataSet = _this$props2.dataSet,
selectable = _this$props2.selectable,
checkable = _this$props2.checkable;
if (dataSet) {
var handler = flag ? dataSet.addEventListener : dataSet.removeEventListener;
handler.call(dataSet, _enum.DataSetEvents.load, this.handleDataSetLoad);
if (checkable && selectable === false) {
handler.call(dataSet, _enum.DataSetEvents.batchSelect, this.handleBatchSelect);
handler.call(dataSet, _enum.DataSetEvents.batchUnSelect, this.handleUnBatchSelect);
}
}
}
}, {
key: "handleDataSetLoad",
value: function handleDataSetLoad() {
this.initDefaultExpandedRows();
this.initDefaultCheckRows();
this.initDefaultSelectRows();
this.initDefaultLoadedRows();
}
}, {
key: "initDefaultExpandedRows",
value: function initDefaultExpandedRows() {
var _this$props3 = this.props,
defaultExpandAll = _this$props3.defaultExpandAll,
dataSet = _this$props3.dataSet,
defaultExpandedKeys = _this$props3.defaultExpandedKeys;
this.stateExpandedKeys = this.dealDefaultCheckExpand(dataSet, defaultExpandedKeys, defaultExpandAll);
}
}, {
key: "initDefaultCheckRows",
value: function initDefaultCheckRows() {
var _this$props4 = this.props,
dataSet = _this$props4.dataSet,
checkable = _this$props4.checkable,
selectable = _this$props4.selectable,
defaultCheckedKeys = _this$props4.defaultCheckedKeys;
this.stateCheckedKeys = this.dealDefaultCheckExpand(dataSet, defaultCheckedKeys);
if (dataSet) {
var _dataSet$props = dataSet.props,
checkField = _dataSet$props.checkField,
idField = _dataSet$props.idField;
if (checkable && selectable === false) {
if (checkField) {
var field = dataSet.getField(checkField);
dataSet.forEach(function (record) {
if (record.get(checkField) === (field ? field.get(_enum.BooleanValue.trueValue, record) : true)) {
record.isSelected = true;
}
});
} else {
this.stateCheckedKeys = dataSet.selected.map(function (selected) {
return String(idField ? selected.get(idField) : selected.id);
});
}
}
}
}
}, {
key: "initDefaultLoadedRows",
value: function initDefaultLoadedRows() {
this.stateLoadedKeys = [];
}
}, {
key: "initDefaultSelectRows",
value: function initDefaultSelectRows() {
var _this$props5 = this.props,
dataSet = _this$props5.dataSet,
defaultSelectedKeys = _this$props5.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 defaultAll
* @param defaultKeys
*/
}, {
key: "dealDefaultCheckExpand",
value: function dealDefaultCheckExpand(dataSet, defaultKeys, defaultAll) {
var defaultStateKeys = [];
if (dataSet) {
var _dataSet$props2 = dataSet.props,
idField = _dataSet$props2.idField,
expandField = _dataSet$props2.expandField;
if (defaultAll && !expandField) {
defaultStateKeys = dataSet.reduce(function (array, record) {
if (record.children) {
array.push((0, _util.getKey)(record, idField));
}
return array;
}, []);
} else if (defaultKeys && !expandField) {
defaultStateKeys = dataSet.reduce(function (array, record) {
defaultKeys.map(function (key) {
if ((0, _util.getKey)(record, idField) === key) {
array.push(key);
}
return null;
});
return array;
}, []);
}
}
return defaultStateKeys;
}
}, {
key: "expandedKeys",
get: function get() {
var dataSet = this.props.dataSet;
if (dataSet) {
var _dataSet$props3 = dataSet.props,
expandField = _dataSet$props3.expandField,
idField = _dataSet$props3.idField;
if (expandField) {
var keys = [];
dataSet.forEach(function (record) {
if (record.isExpanded) {
keys.push((0, _util.getKey)(record, idField));
}
});
return keys;
}
}
return this.stateExpandedKeys;
}
}, {
key: "checkedKeys",
get: function get() {
var dataSet = this.props.dataSet;
if (dataSet) {
var _dataSet$props4 = dataSet.props,
checkField = _dataSet$props4.checkField,
idField = _dataSet$props4.idField;
if (checkField) {
var keys = [];
var field = dataSet.getField(checkField);
dataSet.forEach(function (record) {
var key = (0, _util.getKey)(record, idField);
if (record.get(checkField) === (field ? field.get(_enum.BooleanValue.trueValue, record) : true)) {
keys.push(key);
}
});
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 (0, _util.getKey)(record, idField);
});
}
return [];
}
}, {
key: "checkStrictly",
get: function get() {
var _this$props6 = this.props,
dataSet = _this$props6.dataSet,
checkStrictly = _this$props6.checkStrictly;
if (dataSet && !(0, _isNil["default"])(dataSet.props.treeCheckStrictly)) {
return dataSet.props.treeCheckStrictly;
}
if (dataSet && dataSet.props.checkField) {
return false;
}
return checkStrictly;
}
}, {
key: "setExpand",
value: function setExpand(eventObj) {
var dataSet = this.props.dataSet;
if (dataSet) {
var _dataSet$props5 = dataSet.props,
expandField = _dataSet$props5.expandField,
idField = _dataSet$props5.idField;
if (expandField) {
var node = eventObj.node,
expanded = eventObj.expanded;
var eventKey = node.eventKey;
var found = dataSet.find(function (record) {
return eventKey === (0, _util.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$props6 = dataSet.props,
checkField = _dataSet$props6.checkField,
idField = _dataSet$props6.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 = dataSet.getField(checkField);
found.set(checkField, field ? checked ? field.get(_enum.BooleanValue.trueValue, found) : field.get(_enum.BooleanValue.falseValue, found) : checked);
return false;
}
}
}
return true;
}
}, {
key: "handleExpand",
value: function handleExpand(expandedKeys, eventObj) {
var _this2 = this;
if (this.setExpand(eventObj)) {
(0, _mobx.runInAction)(function () {
_this2.stateExpandedKeys = expandedKeys;
});
}
var _this$props$onExpand = this.props.onExpand,
onExpand = _this$props$onExpand === void 0 ? _noop["default"] : _this$props$onExpand;
onExpand(expandedKeys, eventObj);
}
}, {
key: "handleCheck",
value: function handleCheck(checkedKeys, eventObj, oldCheckedKeys) {
var _this3 = this;
var checkedKeysArr = getCheckedKeys(checkedKeys);
var oldCheckedKeysArr = getCheckedKeys(oldCheckedKeys);
this.inCheckExpansion = true;
var _this$props7 = this.props,
dataSet = _this$props7.dataSet,
selectable = _this$props7.selectable;
if (this.setCheck(eventObj)) {
(0, _mobx.runInAction)(function () {
_this3.stateCheckedKeys = checkedKeysArr;
});
}
if (dataSet && selectable === false) {
var idField = dataSet.props.idField;
var diffKeys = (0, _xor["default"])(oldCheckedKeysArr, checkedKeysArr);
dataSet.forEach(function (record) {
diffKeys.forEach(function (key) {
if ((0, _util.getKey)(record, idField) === key) {
if (!record.isSelected) {
dataSet.select(record);
} else {
dataSet.unSelect(record);
}
}
});
});
}
var _this$props$onCheck = this.props.onCheck,
onCheck = _this$props$onCheck === void 0 ? _noop["default"] : _this$props$onCheck;
onCheck(checkedKeys, eventObj, oldCheckedKeys);
this.inCheckExpansion = false;
}
}, {
key: "handleBatchSelect",
value: function handleBatchSelect(_ref2) {
var dataSet = _ref2.dataSet,
records = _ref2.records;
this.handleDataSetSelect({
dataSet: dataSet,
records: records
}, true);
}
}, {
key: "handleUnBatchSelect",
value: function handleUnBatchSelect(_ref3) {
var dataSet = _ref3.dataSet,
records = _ref3.records;
this.handleDataSetSelect({
dataSet: dataSet,
records: records
}, false);
}
}, {
key: "handleDataSetSelect",
value: function handleDataSetSelect(_ref4, checked) {
var _this4 = this;
var dataSet = _ref4.dataSet,
records = _ref4.records;
if (!this.inCheckExpansion) {
var _dataSet$props7 = dataSet.props,
checkField = _dataSet$props7.checkField,
idField = _dataSet$props7.idField;
if (checkField) {
var field = dataSet.getField(checkField);
records.forEach(function (record) {
record.set(checkField, field ? checked ? field.get(_enum.BooleanValue.trueValue, record) : field.get(_enum.BooleanValue.falseValue, record) : checked);
});
} else {
(0, _mobx.runInAction)(function () {
_this4.stateCheckedKeys = dataSet.selected.map(function (selected) {
return String(idField ? selected.get(idField) : selected.id);
});
});
}
}
}
}, {
key: "handleSelect",
value: function handleSelect(selectedKeys, eventObj) {
var _this$props8 = this.props,
dataSet = _this$props8.dataSet,
_this$props8$onSelect = _this$props8.onSelect,
onSelect = _this$props8$onSelect === void 0 ? _noop["default"] : _this$props8$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 _this5 = this;
var _this$props9 = this.props,
dataSet = _this$props9.dataSet,
loadData = _this$props9.loadData,
async = _this$props9.async;
var promises = [];
if (async && dataSet) {
var record = event.props.record;
promises.push(dataSet.queryMoreChild(record));
}
if (loadData) {
promises.push(loadData(event));
}
return Promise.all(promises).then((0, _mobx.action)(function () {
_this5.stateLoadedKeys.push(event.key);
_this5.handleAfterLoadData(event);
}));
}
}, {
key: "handleAfterLoadData",
value: function handleAfterLoadData(event) {
var _this$props10 = this.props,
dataSet = _this$props10.dataSet,
selectable = _this$props10.selectable;
if (dataSet && selectable === false) {
var _dataSet$props8 = dataSet.props,
checkField = _dataSet$props8.checkField,
idField = _dataSet$props8.idField;
var loadRootRecord = dataSet.find(function (record) {
return (0, _util.getKey)(record, idField) === String(event.key);
});
if (!loadRootRecord) {
return;
}
var loadRecords = (0, _defaultTo["default"])(loadRootRecord.children, []);
if (checkField) {
var field = dataSet.getField(checkField);
loadRecords.forEach(function (record) {
if (record.get(checkField) === (field ? field.get(_enum.BooleanValue.trueValue, record) : true)) {
dataSet.select(record);
}
});
if (!loadRootRecord.isSelected && loadRecords.every(function (record) {
return record.isSelected;
})) {
dataSet.select(loadRootRecord);
} else if (loadRootRecord.isSelected && loadRecords.some(function (record) {
return !record.isSelected;
})) {
dataSet.unSelect(loadRootRecord);
}
} else if (event.checked) {
loadRecords.forEach(function (record) {
dataSet.select(record);
});
}
}
}
}, {
key: "render",
value: function render() {
var _this$props11 = this.props,
dataSet = _this$props11.dataSet,
_this$props11$rendere = _this$props11.renderer,
renderer = _this$props11$rendere === void 0 ? defaultRenderer : _this$props11$rendere,
titleField = _this$props11.titleField,
treeNodeRenderer = _this$props11.treeNodeRenderer,
onTreeNode = _this$props11.onTreeNode,
loadData = _this$props11.loadData,
async = _this$props11.async,
selectable = _this$props11.selectable,
optionsFilter = _this$props11.filter,
otherProps = (0, _objectWithoutProperties2["default"])(_this$props11, _excluded);
if (dataSet) {
var props = {};
props.treeData = (0, _util.getTreeNodes)(dataSet, dataSet.treeData, renderer, onTreeNode || treeNodeRenderer || defaultNodeCover, async || !!loadData, titleField, optionsFilter) || [];
props.onExpand = this.handleExpand;
props.onCheck = this.handleCheck;
props.onSelect = this.handleSelect;
props.selectable = selectable;
props.loadData = this.handleLoadData;
props.expandedKeys = this.expandedKeys.slice();
if (!('checkedKeys' in otherProps)) {
props.checkedKeys = this.checkedKeys.slice();
}
if (!('multiple' in otherProps)) {
props.multiple = dataSet.props.selection === _enum.DataSetSelection.multiple;
}
if (!('selectedKeys' in otherProps)) {
props.selectedKeys = this.selectedKeys.slice();
}
if (!('loadedKeys' in otherProps)) {
props.loadedKeys = this.stateLoadedKeys.slice();
}
props.checkStrictly = this.checkStrictly;
return /*#__PURE__*/_react["default"].createElement(_spin["default"], {
dataSet: dataSet
}, /*#__PURE__*/_react["default"].createElement(_tree["default"], (0, _extends2["default"])({}, otherProps, props)));
}
return /*#__PURE__*/_react["default"].createElement(_tree["default"], (0, _extends2["default"])({}, otherProps));
}
}]);
return Tree;
}(_react.Component);
Tree.displayName = 'Tree<PRO>';
Tree.TreeNode = _tree.TreeNode;
(0, _tslib.__decorate)([_mobx.observable], Tree.prototype, "stateCheckedKeys", void 0);
(0, _tslib.__decorate)([_mobx.observable], Tree.prototype, "stateExpandedKeys", void 0);
(0, _tslib.__decorate)([_mobx.observable], Tree.prototype, "stateLoadedKeys", void 0);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleDataSetLoad", null);
(0, _tslib.__decorate)([_mobx.action], Tree.prototype, "initDefaultExpandedRows", null);
(0, _tslib.__decorate)([_mobx.action], Tree.prototype, "initDefaultCheckRows", null);
(0, _tslib.__decorate)([_mobx.action], Tree.prototype, "initDefaultLoadedRows", null);
(0, _tslib.__decorate)([_mobx.action], Tree.prototype, "initDefaultSelectRows", null);
(0, _tslib.__decorate)([_mobx.computed], Tree.prototype, "expandedKeys", null);
(0, _tslib.__decorate)([_mobx.computed], Tree.prototype, "selectedKeys", null);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleExpand", null);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleCheck", null);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleBatchSelect", null);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleUnBatchSelect", null);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleDataSetSelect", null);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleSelect", null);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleLoadData", null);
(0, _tslib.__decorate)([_autobind["default"]], Tree.prototype, "handleAfterLoadData", null);
Tree = (0, _tslib.__decorate)([_mobxReact.observer], Tree);
var _default = Tree;
exports["default"] = _default;
//# sourceMappingURL=index.js.map