'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _react = require('react'); var _react2 = _interopRequireDefault(_react); var _propTypes = require('prop-types'); var _propTypes2 = _interopRequireDefault(_propTypes); var _Utilities = require('./Utilities'); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } // helper function for setting row/col-span in pivotTableRenderer var spanSize = function spanSize(arr, i, j) { var x = void 0; if (i !== 0) { var asc = void 0, end = void 0; var noDraw = true; for (x = 0, end = j, asc = end >= 0; asc ? x <= end : x >= end; asc ? x++ : x--) { if (arr[i - 1][x] !== arr[i][x]) { noDraw = false; } } if (noDraw) { return -1; } } var len = 0; while (i + len < arr.length) { var asc1 = void 0, end1 = void 0; var stop = false; for (x = 0, end1 = j, asc1 = end1 >= 0; asc1 ? x <= end1 : x >= end1; asc1 ? x++ : x--) { if (arr[i][x] !== arr[i + len][x]) { stop = true; } } if (stop) { break; } len++; } return len; }; function redColorScaleGenerator(values) { var min = Math.min.apply(Math, values); var max = Math.max.apply(Math, values); return function (x) { // eslint-disable-next-line no-magic-numbers var nonRed = 255 - Math.round(255 * (x - min) / (max - min)); return { backgroundColor: 'rgb(255,' + nonRed + ',' + nonRed + ')' }; }; } function makeRenderer() { var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; var TableRenderer = function (_React$PureComponent) { _inherits(TableRenderer, _React$PureComponent); function TableRenderer() { _classCallCheck(this, TableRenderer); return _possibleConstructorReturn(this, (TableRenderer.__proto__ || Object.getPrototypeOf(TableRenderer)).apply(this, arguments)); } _createClass(TableRenderer, [{ key: 'render', value: function render() { var _this2 = this; var pivotData = new _Utilities.PivotData(this.props); var colAttrs = pivotData.props.cols; var rowAttrs = pivotData.props.rows; var rowKeys = pivotData.getRowKeys(); var colKeys = pivotData.getColKeys(); var rowKeysSub = []; if (this.props.showSubtotales === true && rowAttrs !== null && rowAttrs.length > 1) { var beforeFirstKey = null; for (var idx = 0; idx < rowKeys.length; idx++) { var arrRowKeys = rowKeys[idx]; var emptyElements = arrRowKeys.length - 2; var arrEmptyElements = []; for (var idxEmpt = 0; idxEmpt < emptyElements; idxEmpt++) { arrEmptyElements.push(''); } var currentFirstKey = arrRowKeys[0]; if (beforeFirstKey === null) { beforeFirstKey = currentFirstKey; } if (beforeFirstKey !== currentFirstKey) { rowKeysSub.push([beforeFirstKey].concat(arrEmptyElements, ['[:sub-total:]'])); beforeFirstKey = currentFirstKey; } rowKeysSub.push(arrRowKeys); if (idx === rowKeys.length - 1) { rowKeysSub.push([currentFirstKey].concat(arrEmptyElements, ['[:sub-total:]'])); } } } else { rowKeysSub = pivotData.getRowKeys(); } var grandTotalAggregator = pivotData.getAggregator([], []); var getStylesHeaders = function getStylesHeaders() { return _this2.props.stylesHeaders; }; var getHeaderClass = function getHeaderClass() { return _this2.props.headerClass; }; var valueCellColors = function valueCellColors() {}; var rowTotalColors = function rowTotalColors() {}; var colTotalColors = function colTotalColors() {}; if (opts.heatmapMode) { var colorScaleGenerator = this.props.tableColorScaleGenerator; var rowTotalValues = colKeys.map(function (x) { return pivotData.getAggregator([], x).value(); }); rowTotalColors = colorScaleGenerator(rowTotalValues); var colTotalValues = rowKeys.map(function (x) { return pivotData.getAggregator(x, []).value(); }); colTotalColors = colorScaleGenerator(colTotalValues); if (opts.heatmapMode === 'full') { var allValues = []; rowKeys.map(function (r) { return colKeys.map(function (c) { return allValues.push(pivotData.getAggregator(r, c).value()); }); }); var colorScale = colorScaleGenerator(allValues); valueCellColors = function valueCellColors(r, c, v) { return colorScale(v); }; } else if (opts.heatmapMode === 'row') { var rowColorScales = {}; rowKeys.map(function (r) { var rowValues = colKeys.map(function (x) { return pivotData.getAggregator(r, x).value(); }); rowColorScales[r] = colorScaleGenerator(rowValues); }); valueCellColors = function valueCellColors(r, c, v) { return rowColorScales[r](v); }; } else if (opts.heatmapMode === 'col') { var colColorScales = {}; colKeys.map(function (c) { var colValues = rowKeys.map(function (x) { return pivotData.getAggregator(x, c).value(); }); colColorScales[c] = colorScaleGenerator(colValues); }); valueCellColors = function valueCellColors(r, c, v) { return colColorScales[c](v); }; } } var getClickHandler = this.props.tableOptions && this.props.tableOptions.clickCallback ? function (value, rowValues, colValues) { var filters = {}; var _iteratorNormalCompletion = true; var _didIteratorError = false; var _iteratorError = undefined; try { for (var _iterator = Object.keys(colAttrs || {})[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) { var i = _step.value; var attr = colAttrs[i]; if (colValues[i] !== null) { filters[attr] = colValues[i]; } } } catch (err) { _didIteratorError = true; _iteratorError = err; } finally { try { if (!_iteratorNormalCompletion && _iterator.return) { _iterator.return(); } } finally { if (_didIteratorError) { throw _iteratorError; } } } var _iteratorNormalCompletion2 = true; var _didIteratorError2 = false; var _iteratorError2 = undefined; try { for (var _iterator2 = Object.keys(rowAttrs || {})[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) { var _i = _step2.value; var attr = rowAttrs[_i]; if (rowValues[_i] !== null) { filters[attr] = rowValues[_i]; } } } catch (err) { _didIteratorError2 = true; _iteratorError2 = err; } finally { try { if (!_iteratorNormalCompletion2 && _iterator2.return) { _iterator2.return(); } } finally { if (_didIteratorError2) { throw _iteratorError2; } } } return function (e) { return _this2.props.tableOptions.clickCallback(e, value, filters, pivotData); }; } : null; var isNotNullish = function isNotNullish(val) { if (typeof val !== 'undefined' && val !== null) { return true; } return false; }; var getFinalFormat = function getFinalFormat(objCol) { if (objCol.type !== 'number' || isNotNullish(objCol.format) && objCol.format.includes('Q')) { return objCol.format; } if (objCol.format.includes('.')) { if (isNotNullish(objCol.number_decimals)) { var numberDecimals = parseInt(objCol.number_decimals); var resultDecimals = ''; if (numberDecimals && !isNaN(numberDecimals) && numberDecimals > 0) { var counter = 0; resultDecimals = '.'; while (counter < numberDecimals) { resultDecimals = resultDecimals + '0'; counter += 1; } } return objCol.format.replace('.00', resultDecimals); } return objCol.format; } return objCol.format; }; var getLocaleConfig = function getLocaleConfig(objCol) { if (objCol.type !== 'number' || isNotNullish(objCol.format) && objCol.format.includes('Q')) { return null; } return { delimiters: { thousands: isNotNullish(objCol.delimiter_thousands) ? objCol.delimiter_thousands : ',', decimal: isNotNullish(objCol.delimiter_decimal) ? objCol.delimiter_decimal : '.' }, abbreviations: { thousand: 'k', million: 'm', billion: 'b', trillion: 't' }, currency: { symbol: isNotNullish(objCol.currency_symbol) ? objCol.currency_symbol : '$' } }; }; var getFormatedValue = function getFormatedValue(aggregator) { var valToFormat = aggregator.value(); var resultValue = typeof aggregator.format === 'function' ? aggregator.format(valToFormat) : valToFormat; var keyColumnaCalculo = isNotNullish(_this2.props.vals) && _this2.props.vals.length ? _this2.props.vals[0] : null; if (_this2.props.aggregatorName === 'Conteo') { resultValue = isNotNullish(_this2.props.functions) ? _this2.props.functions.formatedValue(valToFormat, '0,0', 'number', false) : resultValue; } else if (isNotNullish(keyColumnaCalculo) && isNotNullish(_this2.props.headersDefinitions)) { var _definition = _this2.props.headersDefinitions[keyColumnaCalculo]; if (isNotNullish(_definition) && isNotNullish(_definition.value)) { if (_definition.value.startsWith('count_') || _definition.value.startsWith('countd_')) { resultValue = isNotNullish(_this2.props.functions) ? _this2.props.functions.formatedValue(valToFormat, '0,0', 'number', false) : resultValue; } else if (isNotNullish(_definition.format) && _definition.format !== '') { resultValue = isNotNullish(_this2.props.chartFunctions) ? _this2.props.chartFunctions.formatedValue(valToFormat, getFinalFormat(_definition), _definition.type, false, null, getLocaleConfig(_definition)) : resultValue; } } } return resultValue; }; var getValueClass = function getValueClass(aggregator) { var valToFormat = aggregator.value(); var keyColumnaCalculo = isNotNullish(_this2.props.vals) && _this2.props.vals.length ? _this2.props.vals[0] : null; if (isNotNullish(keyColumnaCalculo) && isNotNullish(_this2.props.headersDefinitions)) { var _definition = _this2.props.headersDefinitions[keyColumnaCalculo]; var objItem = {}; if (isNotNullish(_definition) && isNotNullish(_definition.value) && isNotNullish(_definition.classItem) && typeof _definition.classItem === 'function') { objItem[_definition.value] = valToFormat; objItem['rv_' + _definition.value] = valToFormat; return _definition.classItem(objItem, true); } } return ''; }; var getSubAggregator = function getSubAggregator(rowKey, colKey) { if (rowKey.includes('[:sub-total:]')) { var _resultAgg = {}; var _arrRowKeys = rowKeys.filter(function (itmRk) { return itmRk[0] === rowKey[0]; }); var subTotalBruto = 0; var subTotalCount = _arrRowKeys.length; var subTotalMin = null; var subTotalMax = null; for (var _idx = 0; _idx < subTotalCount; _idx++) { var _rowKey = _arrRowKeys[_idx]; var _agg = pivotData.getAggregator(_rowKey, colKey); var _aggValue = _agg.value(); subTotalBruto = subTotalBruto + _aggValue; if (_idx === 0) { subTotalMin = _aggValue; subTotalMax = _aggValue; } else { subTotalMin = _aggValue < subTotalMin ? _aggValue : subTotalMin; subTotalMax = _aggValue > subTotalMax ? _aggValue : subTotalMax; } } _resultAgg.sum = subTotalBruto; _resultAgg.count = subTotalCount; _resultAgg.format = function () { return 'f'; }; _resultAgg.value = function () { if (_this2.props.aggregatorName === 'Suma' || _this2.props.aggregatorName === 'Conteo') { return subTotalBruto; } if (_this2.props.aggregatorName === 'Promedio') { return subTotalBruto / subTotalCount; } if (_this2.props.aggregatorName === 'Mínimo') { return subTotalMin; } if (_this2.props.aggregatorName === 'Máximo') { return subTotalMax; } return 0; }; return _resultAgg; } return pivotData.getAggregator(rowKey, colKey); }; return _react2.default.createElement( 'table', { className: 'pvtTable' }, _react2.default.createElement( 'thead', null, colAttrs.map(function (c, j) { return _react2.default.createElement( 'tr', { key: 'colAttr' + j }, j === 0 && rowAttrs.length !== 0 && _react2.default.createElement('th', { colSpan: rowAttrs.length, rowSpan: colAttrs.length, className: getHeaderClass(), style: getStylesHeaders() }), _react2.default.createElement( 'th', { className: getHeaderClass(), style: getStylesHeaders() }, c ), colKeys.map(function (colKey, i) { var x = spanSize(colKeys, i, j); if (x === -1) { return null; } return _react2.default.createElement( 'th', { className: getHeaderClass(), key: 'colKey' + i, colSpan: x, style: getStylesHeaders(), rowSpan: j === colAttrs.length - 1 && rowAttrs.length !== 0 ? 2 : 1 }, colKey[j] ); }), j === 0 && _react2.default.createElement( 'th', { className: getHeaderClass(), style: getStylesHeaders(), rowSpan: colAttrs.length + (rowAttrs.length === 0 ? 0 : 1) }, 'Total' ) ); }), rowAttrs.length !== 0 && _react2.default.createElement( 'tr', null, rowAttrs.map(function (r, i) { return _react2.default.createElement( 'th', { className: getHeaderClass(), key: 'rowAttr' + i, style: getStylesHeaders() }, r ); }), _react2.default.createElement( 'th', { className: getHeaderClass(), style: getStylesHeaders() }, colAttrs.length === 0 ? 'Total' : null ) ) ), _react2.default.createElement( 'tbody', null, rowKeysSub.map(function (rowKey, i) { var isSubTotal = rowKey.includes('[:sub-total:]'); var totalAggregator = getSubAggregator(rowKey, []); return _react2.default.createElement( 'tr', { key: 'rowKeyRow' + i + ' ' + (isSubTotal ? ' bg-sky-50 ' : '') }, rowKey.map(function (txt, j) { var x = spanSize(rowKeysSub, i, j); if (x === -1) { return null; } return _react2.default.createElement( 'th', { key: 'rowKeyLabel' + i + '-' + j, className: getHeaderClass(), style: getStylesHeaders(), rowSpan: x, colSpan: j === rowAttrs.length - 1 && colAttrs.length !== 0 ? 2 : 1 }, isSubTotal ? 'SubTotal' : txt ); }), colKeys.map(function (colKey, j) { var aggregator = getSubAggregator(rowKey, colKey); return _react2.default.createElement( 'td', { className: 'pvtVal ' + (isSubTotal ? '' : getValueClass(aggregator)) + ' ' + (isSubTotal ? 'pvtSubTotal' : ''), key: 'pvtVal' + i + '-' + j, onClick: getClickHandler && getClickHandler(aggregator.value(), rowKey, colKey), style: valueCellColors(rowKey, colKey, aggregator.value()) }, getFormatedValue(aggregator) ); }), _react2.default.createElement( 'td', { className: ' pvtTotal ' + (isSubTotal ? 'pvtSubTotal' : '') + ' ', onClick: getClickHandler && getClickHandler(totalAggregator.value(), rowKey, [null]), style: colTotalColors(totalAggregator.value()) }, getFormatedValue(totalAggregator) ) ); }), _react2.default.createElement( 'tr', null, _react2.default.createElement( 'th', { className: getHeaderClass(), style: getStylesHeaders(), colSpan: rowAttrs.length + (colAttrs.length === 0 ? 0 : 1) }, 'Total' ), colKeys.map(function (colKey, i) { var totalAggregator = pivotData.getAggregator([], colKey); return _react2.default.createElement( 'td', { className: 'pvtTotal', key: 'total' + i, onClick: getClickHandler && getClickHandler(totalAggregator.value(), [null], colKey), style: rowTotalColors(totalAggregator.value()) }, getFormatedValue(totalAggregator) ); }), _react2.default.createElement( 'td', { onClick: getClickHandler && getClickHandler(grandTotalAggregator.value(), [null], [null]), className: 'pvtGrandTotal' }, getFormatedValue(grandTotalAggregator) ) ) ) ); } }]); return TableRenderer; }(_react2.default.PureComponent); TableRenderer.defaultProps = _Utilities.PivotData.defaultProps; TableRenderer.propTypes = _Utilities.PivotData.propTypes; TableRenderer.defaultProps.tableColorScaleGenerator = redColorScaleGenerator; TableRenderer.defaultProps.tableOptions = {}; TableRenderer.propTypes.tableColorScaleGenerator = _propTypes2.default.func; TableRenderer.propTypes.tableOptions = _propTypes2.default.object; return TableRenderer; } var TSVExportRenderer = function (_React$PureComponent2) { _inherits(TSVExportRenderer, _React$PureComponent2); function TSVExportRenderer() { _classCallCheck(this, TSVExportRenderer); return _possibleConstructorReturn(this, (TSVExportRenderer.__proto__ || Object.getPrototypeOf(TSVExportRenderer)).apply(this, arguments)); } _createClass(TSVExportRenderer, [{ key: 'render', value: function render() { var pivotData = new _Utilities.PivotData(this.props); var rowKeys = pivotData.getRowKeys(); var colKeys = pivotData.getColKeys(); if (rowKeys.length === 0) { rowKeys.push([]); } if (colKeys.length === 0) { colKeys.push([]); } var headerRow = pivotData.props.rows.map(function (r) { return r; }); if (colKeys.length === 1 && colKeys[0].length === 0) { headerRow.push(this.props.aggregatorName); } else { colKeys.map(function (c) { return headerRow.push(c.join('-')); }); } var result = rowKeys.map(function (r) { var row = r.map(function (x) { return x; }); colKeys.map(function (c) { var v = pivotData.getAggregator(r, c).value(); row.push(v ? v : ''); }); return row; }); result.unshift(headerRow); return _react2.default.createElement('textarea', { value: result.map(function (r) { return r.join('\t'); }).join('\n'), style: { width: window.innerWidth / 2, height: window.innerHeight / 2 }, readOnly: true }); } }]); return TSVExportRenderer; }(_react2.default.PureComponent); TSVExportRenderer.defaultProps = _Utilities.PivotData.defaultProps; TSVExportRenderer.propTypes = _Utilities.PivotData.propTypes; exports.default = { Table: makeRenderer(), 'Table Heatmap': makeRenderer({ heatmapMode: 'full' }), 'Table Col Heatmap': makeRenderer({ heatmapMode: 'col' }), 'Table Row Heatmap': makeRenderer({ heatmapMode: 'row' }), 'Exportable TSV': TSVExportRenderer }; module.exports = exports['default']; //# sourceMappingURL=TableRenderers.js.map