@antv/s2-react
Version:
use S2 with react
68 lines • 3.31 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.StrategySheet = void 0;
const tslib_1 = require("tslib");
const s2_1 = require("@antv/s2");
const lodash_1 = require("lodash");
const react_1 = tslib_1.__importDefault(require("react"));
const base_sheet_1 = require("../base-sheet");
const custom_cell_1 = require("./custom-cell");
const custom_data_set_1 = require("./custom-data-set");
const custom_tooltip_1 = require("./custom-tooltip");
/**
* 趋势分析表特性：
* 1. 维度为空时默认为自定义目录树结构
* 2. 单指标时数值置于列头，且隐藏指标列头
* 3. 多指标时数值置于行头，不隐藏指标列头
* 4. 支持 KPI 进度 (子弹图)
* 5. 行头, 数值单元格不支持多选
*/
exports.StrategySheet = react_1.default.memo((props) => {
const { options, themeCfg, dataCfg } = props, restProps = tslib_1.__rest(props, ["options", "themeCfg", "dataCfg"]);
const strategySheetOptions = react_1.default.useMemo(() => {
var _a;
if ((0, lodash_1.isEmpty)(dataCfg)) {
return null;
}
// 单指标非自定义树结构隐藏指标列
const shouldHideValue = (0, lodash_1.size)((_a = dataCfg === null || dataCfg === void 0 ? void 0 : dataCfg.fields) === null || _a === void 0 ? void 0 : _a.values) === 1;
return {
hierarchyType: 'tree',
dataCell: (viewMeta, spreadsheet) => new custom_cell_1.StrategySheetDataCell(viewMeta, spreadsheet),
colCell: (node, spreadsheet, headerConfig) => new custom_cell_1.StrategySheetColCell(node, spreadsheet, headerConfig),
dataSet: (spreadSheet) => new custom_data_set_1.StrategySheetDataSet(spreadSheet),
showDefaultHeaderActionIcon: false,
style: {
colCell: {
hideValue: shouldHideValue,
},
},
interaction: {
autoResetSheetStyle: true,
// 趋势分析表禁用 刷选, 多选, 区间多选
brushSelection: false,
selectedCellMove: false,
multiSelection: false,
rangeSelection: false,
},
tooltip: {
operation: {
hiddenColumns: true,
},
rowCell: {
content: (cell) => react_1.default.createElement(custom_tooltip_1.StrategySheetRowCellTooltip, { cell: cell }),
},
colCell: {
content: (cell) => react_1.default.createElement(custom_tooltip_1.StrategySheetColCellTooltip, { cell: cell }),
},
dataCell: {
content: (cell) => react_1.default.createElement(custom_tooltip_1.StrategySheetDataCellTooltip, { cell: cell }),
},
},
};
}, [dataCfg]);
const s2Options = react_1.default.useMemo(() => (0, s2_1.customMerge)(strategySheetOptions, options), [options, strategySheetOptions]);
return (react_1.default.createElement(base_sheet_1.BaseSheet, Object.assign({ options: s2Options, themeCfg: themeCfg, dataCfg: dataCfg }, restProps)));
});
exports.StrategySheet.displayName = 'StrategySheet';
//# sourceMappingURL=index.js.map