@gooddata/react-components
Version:
GoodData.UI - A powerful JavaScript library for building analytical applications
141 lines • 8.07 kB
JavaScript
;
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
// (C) 2007-2019 GoodData Corporation
var React = require("react");
var classNames = require("classnames");
var noop = require("lodash/noop");
var uniqueId = require("lodash/uniqueId");
var fixed_data_table_2_1 = require("fixed-data-table-2");
var react_intl_1 = require("react-intl");
var MappingHeader_1 = require("../../../../interfaces/MappingHeader");
var tableCell_1 = require("../../../../helpers/tableCell");
var utils_1 = require("./utils");
var AddTotal_1 = require("./AddTotal");
var layout_1 = require("../constants/layout");
var TotalCellPure = /** @class */ (function (_super) {
__extends(TotalCellPure, _super);
function TotalCellPure() {
return _super !== null && _super.apply(this, arguments) || this;
}
TotalCellPure.prototype.render = function () {
var _this = this;
var _a = this.props, columnIndex = _a.columnIndex, header = _a.header, totalsWithData = _a.totalsWithData, editAllowed = _a.editAllowed, headersCount = _a.headersCount, firstMeasureIndex = _a.firstMeasureIndex, separators = _a.separators, onCellMouseOver = _a.onCellMouseOver, onCellMouseLeave = _a.onCellMouseLeave;
var isFirstColumn = columnIndex === 0;
var measureColumnIndex = columnIndex - firstMeasureIndex;
var isMeasureColumn = measureColumnIndex >= 0;
var cellContent = totalsWithData.map(function (total, rowIndex) {
var classes = classNames("indigo-table-footer-cell", "col-" + columnIndex, "s-total-" + total.type + "-" + columnIndex);
var style = { height: layout_1.DEFAULT_FOOTER_ROW_HEIGHT };
var events = editAllowed
? {
onMouseOver: function () {
onCellMouseOver(rowIndex, columnIndex);
},
onMouseLeave: function () {
onCellMouseLeave(rowIndex, columnIndex);
},
}
: {};
return (React.createElement("div", __assign({}, events, { key: uniqueId("footer-cell-"), className: classes, style: style }), _this.renderCellContent(isFirstColumn, isMeasureColumn, columnIndex, measureColumnIndex, total, header, separators)));
});
return (React.createElement(fixed_data_table_2_1.Cell, null,
cellContent,
this.renderEditCell(header, columnIndex, headersCount)));
};
TotalCellPure.prototype.renderAddTotalButton = function (header, columnIndex, headersCount) {
if (!utils_1.shouldShowAddTotalButton(header, columnIndex === 0, true)) {
return null;
}
var _a = this.props, totalsWithData = _a.totalsWithData, intl = _a.intl, onAddDropdownOpenStateChanged = _a.onAddDropdownOpenStateChanged, onAddWrapperHover = _a.onAddWrapperHover, onAddButtonHover = _a.onAddButtonHover, onRowAdd = _a.onRowAdd;
var dataSource = utils_1.getTotalsDataSource(totalsWithData, intl);
return (React.createElement(AddTotal_1.AddTotal, { dataSource: dataSource, header: header, columnIndex: columnIndex, headersCount: headersCount, onDropdownOpenStateChanged: onAddDropdownOpenStateChanged, onWrapperHover: onAddWrapperHover, onButtonHover: onAddButtonHover, onAddTotalsRow: onRowAdd, addingMoreTotalsEnabled: totalsWithData.length < utils_1.AVAILABLE_TOTALS.length }));
};
TotalCellPure.prototype.renderEditCell = function (header, columnIndex, headersCount) {
if (!this.props.editAllowed) {
return null;
}
var style = { height: layout_1.TOTALS_ADD_ROW_HEIGHT };
var className = classNames("indigo-table-footer-cell", "col-" + columnIndex, "indigo-totals-add-cell", "s-total-add-cell-" + columnIndex);
return (React.createElement("div", { className: className, style: style }, this.renderAddTotalButton(header, columnIndex, headersCount)));
};
TotalCellPure.prototype.renderHeaderCellContent = function (total) {
var intl = this.props.intl;
var content = total.alias || intl.formatMessage({ id: "visualizations.totals.row.title." + total.type });
return React.createElement("span", { className: classNames("s-total-header-" + total.type) }, content);
};
TotalCellPure.prototype.renderMeasureCellContent = function (formattedValue, style, total, header, columnIndex) {
var _this = this;
var _a = this.props, firstMeasureIndex = _a.firstMeasureIndex, editAllowed = _a.editAllowed;
if (!MappingHeader_1.isMappingHeaderMeasureItem(header)) {
return null;
}
var columnHasTotal = utils_1.hasTableColumnTotalEnabled(total.outputMeasureIndexes, columnIndex, firstMeasureIndex);
var labelElement = (React.createElement("span", { className: classNames("s-total-value"), title: formattedValue, style: style }, formattedValue));
if (editAllowed) {
if (columnHasTotal) {
var onClick_1 = function () { return _this.props.onDisableColumn(columnIndex, total.type); };
return (React.createElement("span", null,
React.createElement("span", { className: classNames("gd-button-link", "gd-button-icon-only", "icon-circle-cross", "indigo-totals-disable-column-button", "s-disable-total-column"), onClick: onClick_1 }),
labelElement));
}
var onClick = function () { return _this.props.onEnableColumn(columnIndex, total.type); };
return (React.createElement("span", { className: classNames("gd-button-link", "gd-button-icon-only", "icon-circle-plus", "indigo-totals-enable-column-button", "s-enable-total-column"), onClick: onClick }));
}
if (!editAllowed && columnHasTotal) {
return labelElement;
}
return null;
};
TotalCellPure.prototype.renderCellContent = function (isFirstColumn, isMeasureColumn, columnIndex, measureColumnIndex, total, header, separators) {
if (isFirstColumn) {
return this.renderHeaderCellContent(total);
}
if (isMeasureColumn) {
var value = total.values[measureColumnIndex] !== null
? total.values[measureColumnIndex].toString()
: null;
var _a = tableCell_1.getCellStyleAndFormattedValue(header, value, false, separators), formattedValue = _a.formattedValue, style = _a.style;
return this.renderMeasureCellContent(formattedValue, style, total, header, columnIndex);
}
return "";
};
TotalCellPure.defaultProps = {
editAllowed: false,
onCellMouseOver: noop,
onCellMouseLeave: noop,
onEnableColumn: noop,
onDisableColumn: noop,
onAddDropdownOpenStateChanged: noop,
onAddWrapperHover: noop,
onAddButtonHover: noop,
onRowAdd: noop,
};
return TotalCellPure;
}(React.Component));
exports.TotalCellPure = TotalCellPure;
exports.TotalCell = react_intl_1.injectIntl(TotalCellPure);
//# sourceMappingURL=TotalCell.js.map