@antv/s2-react
Version:
use S2 with react
65 lines • 5.33 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.StrategySheetDataCellTooltip = void 0;
const tslib_1 = require("tslib");
const s2_1 = require("@antv/s2");
const classnames_1 = tslib_1.__importDefault(require("classnames"));
const lodash_1 = require("lodash");
const react_1 = tslib_1.__importDefault(require("react"));
require("./index.less");
exports.StrategySheetDataCellTooltip = react_1.default.memo((props) => {
var _a, _b;
const { cell, label, showOriginalValue: showOriginalValueFromTooltip = false, renderDerivedValue, } = props;
const meta = cell.getMeta();
const { spreadsheet } = meta;
const metaFieldValue = meta === null || meta === void 0 ? void 0 : meta.fieldValue;
const rowDescription = spreadsheet.dataSet.getCustomFieldDescription(cell);
const defaultRowName = spreadsheet.dataSet.getCustomRowFieldName(cell);
const customLabel = (0, lodash_1.isFunction)(label) ? label(cell, defaultRowName) : label;
const rowName = customLabel !== null && customLabel !== void 0 ? customLabel : defaultRowName;
const colLeafNode = spreadsheet.facet.getColLeafNodeByIndex(meta.colIndex);
const [, ...derivedLabels] = react_1.default.useMemo(() => {
try {
return JSON.parse(colLeafNode === null || colLeafNode === void 0 ? void 0 : colLeafNode.value);
}
catch (_a) {
return [];
}
}, [colLeafNode === null || colLeafNode === void 0 ? void 0 : colLeafNode.value]);
const { placeholder, style } = spreadsheet.options;
const valuesCfg = (_a = style === null || style === void 0 ? void 0 : style.dataCell) === null || _a === void 0 ? void 0 : _a.valuesCfg;
const [value, ...derivedValues] = (0, lodash_1.first)(metaFieldValue === null || metaFieldValue === void 0 ? void 0 : metaFieldValue.values) || [
metaFieldValue,
];
const [originalValue, ...derivedOriginalValues] = (0, lodash_1.first)((0, lodash_1.get)(metaFieldValue, valuesCfg === null || valuesCfg === void 0 ? void 0 : valuesCfg.originalValueField)) || [value];
const emptyPlaceholder = (0, s2_1.getEmptyPlaceholder)(meta, placeholder);
const showOriginalValue = (valuesCfg === null || valuesCfg === void 0 ? void 0 : valuesCfg.showOriginalValue) || showOriginalValueFromTooltip;
return (react_1.default.createElement("div", { className: (0, classnames_1.default)((0, s2_1.getStrategySheetTooltipClsName)(), (0, s2_1.getStrategySheetTooltipClsName)('data')) },
react_1.default.createElement("div", { className: (0, s2_1.getStrategySheetTooltipClsName)('header') },
react_1.default.createElement("span", { className: 'header-label' }, rowName),
react_1.default.createElement("span", null, (_b = value) !== null && _b !== void 0 ? _b : emptyPlaceholder)),
showOriginalValue && (react_1.default.createElement("div", { className: (0, s2_1.getStrategySheetTooltipClsName)('original-value') }, (0, lodash_1.isNil)(originalValue)
? emptyPlaceholder
: originalValue)),
!(0, lodash_1.isEmpty)(derivedValues) && (react_1.default.createElement(react_1.default.Fragment, null,
react_1.default.createElement("div", { className: (0, s2_1.getStrategySheetTooltipClsName)('divider') }),
react_1.default.createElement("ul", { className: (0, s2_1.getStrategySheetTooltipClsName)('derived-values') }, derivedValues.map((derivedValue, i) => {
var _a;
const isUnchanged = (0, s2_1.isUnchangedValue)(derivedValue, value);
const isUp = !isUnchanged && (0, s2_1.isUpDataValue)(derivedValue);
const isDown = !isUnchanged && !isUp;
const originalDerivedValue = derivedOriginalValues[i];
return (react_1.default.createElement("li", { className: "derived-value-item", key: i },
react_1.default.createElement("span", { className: "derived-value-label" }, derivedLabels[i]),
react_1.default.createElement("span", { className: (0, classnames_1.default)('derived-value-group', {
'derived-value-trend-up': isUp,
'derived-value-trend-down': isDown,
}) },
!isUnchanged && (react_1.default.createElement("span", { className: "derived-value-trend-icon" })), (_a = renderDerivedValue === null || renderDerivedValue === void 0 ? void 0 : renderDerivedValue(derivedValue, originalDerivedValue, cell)) !== null && _a !== void 0 ? _a : (react_1.default.createElement("span", { className: "derived-value-content" }, derivedValue !== null && derivedValue !== void 0 ? derivedValue : emptyPlaceholder)))));
})))),
rowDescription && (react_1.default.createElement("div", { className: (0, s2_1.getStrategySheetTooltipClsName)('description') },
react_1.default.createElement("span", { className: (0, s2_1.getStrategySheetTooltipClsName)('description-label') }, (0, s2_1.i18n)('说明')),
react_1.default.createElement("span", { className: (0, s2_1.getStrategySheetTooltipClsName)('description-text') }, rowDescription)))));
});
exports.StrategySheetDataCellTooltip.displayName = 'StrategySheetDataCellTooltip';
//# sourceMappingURL=data-cell-tooltip.js.map