choerodon-ui
Version:
An enterprise-class UI design language and React-based implementation
213 lines (175 loc) • 8.28 kB
JavaScript
"use strict";
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
exports.groupedAggregationTree = groupedAggregationTree;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
var _react = _interopRequireWildcard(require("react"));
var _mobxReactLite = require("mobx-react-lite");
var _defaultTo = _interopRequireDefault(require("lodash/defaultTo"));
var _omit = _interopRequireDefault(require("lodash/omit"));
var _tree = _interopRequireDefault(require("../../../lib/tree"));
var _AggregationButton = _interopRequireDefault(require("./AggregationButton"));
var _TableContext = _interopRequireDefault(require("./TableContext"));
var _ColumnGroups = _interopRequireDefault(require("./ColumnGroups"));
var _utils = require("./utils");
var _TableStore = require("./TableStore");
var AggregationTree = function AggregationTree(props) {
var columns = props.columns,
groups = props.groups,
record = props.record,
rowGroup = props.rowGroup,
headerGroup = props.headerGroup,
column = props.column,
renderer = props.renderer,
_props$index = props.index,
index = _props$index === void 0 ? 0 : _props$index;
var _useContext = (0, _react.useContext)(_TableContext["default"]),
tableStore = _useContext.tableStore,
prefixCls = _useContext.prefixCls,
dataSet = _useContext.dataSet,
tableAggregation = _useContext.aggregation;
var cellPrefix = "".concat(prefixCls, "-cell");
var columnGroups = (0, _react.useMemo)(function () {
if (groups) {
return groups;
}
if (columns) {
return new _ColumnGroups["default"](columns, tableStore).columns;
}
return [];
}, [columns, groups]);
var tableColumnOnCell = tableStore.getConfig('tableColumnOnCell');
var getColumnsInnerNode = (0, _react.useCallback)(function (columns) {
return columns.map(function (colGroup) {
var hidden = colGroup.hidden,
col = colGroup.column;
var hiddenInAggregation = col.hiddenInAggregation;
if (!hidden && !(typeof hiddenInAggregation === 'function' ? record ? hiddenInAggregation(record) : false : hiddenInAggregation)) {
var columnKey = colGroup.key,
_headerGroup = colGroup.headerGroup;
var isBuiltInColumn = tableStore.isBuiltInColumn(col);
var columnOnCell = !isBuiltInColumn && (col.onCell || tableColumnOnCell);
var cellExternalProps = typeof columnOnCell === 'function' && record ? columnOnCell({
dataSet: dataSet,
record: record,
column: col
}) : {};
var header = (0, _utils.getHeader)((0, _objectSpread2["default"])((0, _objectSpread2["default"])({}, col), {}, {
dataSet: dataSet,
aggregation: tableAggregation,
group: _headerGroup
}));
var childColumns = colGroup.children;
if (childColumns) {
var colGroups = childColumns.columns;
if (colGroups.length) {
return /*#__PURE__*/_react["default"].createElement(_tree["default"].TreeNode, (0, _extends2["default"])({}, cellExternalProps, {
key: columnKey,
title: header
}), getColumnsInnerNode(colGroups));
}
} // 只有全局属性时候的样式可以继承给下级满足对td的样式能够一致表现
var style = !isBuiltInColumn && tableColumnOnCell === columnOnCell && typeof tableColumnOnCell === 'function' ? (0, _omit["default"])(cellExternalProps.style, ['width', 'height']) : undefined;
var innerNode = renderer({
colGroup: colGroup,
style: style
});
return /*#__PURE__*/_react["default"].createElement(_tree["default"].TreeNode, (0, _extends2["default"])({}, cellExternalProps, {
key: columnKey,
title: /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("span", {
className: "".concat(cellPrefix, "-label")
}, header), innerNode)
}));
}
return undefined;
});
}, [tableStore, record, dataSet, cellPrefix, renderer, tableColumnOnCell, tableAggregation]);
var aggregationExpandKey = (0, _utils.getColumnKey)(column);
var visibleChildren = columnGroups.filter(function (child) {
return !child.hidden;
});
var length = visibleChildren.length;
if (length > 0) {
var aggregationLimit = column.aggregationLimit,
aggregationDefaultExpandedKeys = column.aggregationDefaultExpandedKeys,
aggregationDefaultExpandAll = column.aggregationDefaultExpandAll,
aggregationLimitDefaultExpanded = column.aggregationLimitDefaultExpanded;
var hasExpand = index === 0 && length > aggregationLimit;
var expanded = hasExpand ? (0, _defaultTo["default"])(record ? tableStore.isAggregationCellExpanded(record, aggregationExpandKey) : headerGroup && headerGroup.getState(_TableStore.EXPAND_KEY), typeof aggregationLimitDefaultExpanded === 'function' ? record ? aggregationLimitDefaultExpanded(record) : false : aggregationLimitDefaultExpanded) || false : false;
var nodes = hasExpand && !expanded ? visibleChildren.slice(0, aggregationLimit - 1) : visibleChildren;
return /*#__PURE__*/_react["default"].createElement(_tree["default"], {
prefixCls: "".concat(cellPrefix, "-tree"),
virtual: false,
focusable: false,
selectable: false,
defaultExpandedKeys: aggregationDefaultExpandedKeys,
defaultExpandAll: aggregationDefaultExpandAll
}, getColumnsInnerNode(nodes), hasExpand && /*#__PURE__*/_react["default"].createElement(_tree["default"].TreeNode, {
title: /*#__PURE__*/_react["default"].createElement(_AggregationButton["default"], {
expanded: expanded,
record: record,
rowGroup: rowGroup,
headerGroup: headerGroup,
isColumnGroup: !(headerGroup || !column.__tableGroup),
aggregationExpandKey: aggregationExpandKey
})
}));
}
return null;
};
AggregationTree.displayName = 'AggregationTree';
var ObserverAggregationTree = (0, _mobxReactLite.observer)(AggregationTree);
var _default = ObserverAggregationTree;
exports["default"] = _default;
function groupedAggregationTree(props) {
var groups = props.groups,
columns = props.columns;
if (groups) {
var treeGroups = [];
groups.forEach(function (group) {
var _group$column$aggrega = group.column.aggregationTreeIndex,
aggregationTreeIndex = _group$column$aggrega === void 0 ? 0 : _group$column$aggrega;
var treeGroup = treeGroups[aggregationTreeIndex];
if (!treeGroup) {
treeGroup = [];
treeGroups[aggregationTreeIndex] = treeGroup;
}
treeGroup.push(group);
});
return treeGroups.reduce(function (trees, treeGroup, index) {
return treeGroup ? trees.concat( /*#__PURE__*/_react["default"].createElement(ObserverAggregationTree, (0, _extends2["default"])({
key: String(index)
}, props, {
groups: treeGroup
}))) : trees;
}, []);
}
if (columns) {
var treeColumns = [];
columns.forEach(function (column) {
var _column$aggregationTr = column.aggregationTreeIndex,
aggregationTreeIndex = _column$aggregationTr === void 0 ? 0 : _column$aggregationTr;
var treeColumn = treeColumns[aggregationTreeIndex];
if (!treeColumn) {
treeColumn = [];
treeColumns[aggregationTreeIndex] = treeColumn;
}
treeColumn.push(column);
});
return treeColumns.reduce(function (trees, treeColumn, index) {
return treeColumn ? trees.concat( /*#__PURE__*/_react["default"].createElement(ObserverAggregationTree, (0, _extends2["default"])({
key: String(index)
}, props, {
columns: treeColumn,
index: index
}))) : trees;
}, []);
}
return [];
}
//# sourceMappingURL=AggregationTree.js.map