@antv/s2/lib/utils/hide-columns.js

effective spreadsheet render core lib

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.getHiddenColumnContinuousSiblingNodes = exports.isEqualDisplaySiblingNodeId = exports.getValidDisplaySiblingNodeId = exports.getValidDisplaySiblingNode = exports.isLastColumnAfterHidden = exports.hideColumnsByThunkGroup = exports.getColumns = exports.hideColumns = exports.getSameHiddenGroupIndex = exports.getHiddenColumnsThunkGroup = exports.getHiddenColumnDisplaySiblingNode = exports.getHiddenColumnNodes = exports.getHiddenColumnFieldKey = void 0;
const tslib_1 = require("tslib");
const lodash_1 = require("lodash");
const constant_1 = require("../common/constant");
const utils_1 = require("../facet/utils");
const getHiddenColumnFieldKey = (field) => {
    const targetFieldKey = (field.includes(constant_1.NODE_ID_SEPARATOR) ? 'id' : 'field');
    return targetFieldKey;
};
exports.getHiddenColumnFieldKey = getHiddenColumnFieldKey;
/**
 * @name 获取需要隐藏的 field 转成对应的 Node
 */
const getHiddenColumnNodes = (spreadsheet, hiddenColumnFields = []) => {
    const colNodes = spreadsheet.facet.getInitColIndexLeafNodes();
    return (0, lodash_1.compact)(hiddenColumnFields.map((field) => {
        const targetFieldKey = (0, exports.getHiddenColumnFieldKey)(field);
        return colNodes.find((node) => node[targetFieldKey] === field);
    }));
};
exports.getHiddenColumnNodes = getHiddenColumnNodes;
/**
 * @name 获取隐藏列兄弟节点
 * @description 获取当前隐藏列(兼容多选) 所对应为未隐藏的兄弟节点
 * @param hideColumns 经过分组的连续隐藏列
 * [ 1, 2, 3, -, -, -, (7 √), 8, 9 ]
 * [ 1, 2, 3, (4 √), - ]
 */
const getHiddenColumnDisplaySiblingNode = (spreadsheet, hiddenColumnFields = []) => {
    if ((0, lodash_1.isEmpty)(hiddenColumnFields)) {
        return {
            prev: null,
            next: null,
        };
    }
    const initColLeafNodes = spreadsheet.facet.getInitColIndexLeafNodes();
    const hiddenColumnIndexes = (0, exports.getHiddenColumnNodes)(spreadsheet, hiddenColumnFields).map((node) => initColLeafNodes.findIndex((item) => item.id === node.id));
    const lastHiddenColumnIndex = Math.max(...hiddenColumnIndexes);
    const firstHiddenColumnIndex = Math.min(...hiddenColumnIndexes);
    const nextSiblingNode = initColLeafNodes.find((node, index) => index === lastHiddenColumnIndex + 1);
    const prevSiblingNode = initColLeafNodes.find((node, index) => index === firstHiddenColumnIndex - 1);
    return {
        prev: prevSiblingNode || null,
        next: nextSiblingNode || null,
    };
};
exports.getHiddenColumnDisplaySiblingNode = getHiddenColumnDisplaySiblingNode;
/**
 * @name 获取隐藏列组
 * @description 如果给定的隐藏列不是连续的, 比如原始列是 [1,2,3,4,5,6,7], 隐藏列是 [2,3,6], 那么其实在表格上需要显示两个展开按钮
 * [[2,3],[6]]
 */
const getHiddenColumnsThunkGroup = (columns, hiddenColumnFields) => {
    if ((0, lodash_1.isEmpty)(hiddenColumnFields)) {
        return [];
    }
    // 上一个需要隐藏项的序号
    let prevHiddenIndex = Number.NEGATIVE_INFINITY;
    return columns.reduce((result, field, index) => {
        if (!hiddenColumnFields.includes(field)) {
            return result;
        }
        if (index === prevHiddenIndex + 1) {
            const lastGroup = (0, lodash_1.last)(result);
            lastGroup === null || lastGroup === void 0 ? void 0 : lastGroup.push(field);
        }
        else {
            const group = [field];
            result.push(group);
        }
        prevHiddenIndex = index;
        return result;
    }, []);
};
exports.getHiddenColumnsThunkGroup = getHiddenColumnsThunkGroup;
/**
 * @name 获取相同隐藏组的索引
 * 原始列: [a, b, c, d, e, f, g, i]
 * 隐藏部分列: [[a, b], c, [d], e, f, [g], i]
 * 变换列头顺序后: [[a], e, [b], c, f, [d, g], i]
 * 也就是说，变换列头顺序后重新分组，本轮遍历时和列头变换顺序之前的隐藏组做对比，只要有一项是相同的, 那么就属于同一个隐藏组，需要进行替换，如 [a, b] => [a], 剩下的 b ，在本轮遍历时就不会有相同组了，会重新添加 [b]，本轮的[d, g]分组会找到上一次的 [d] 分组，并且替换
 */
const getSameHiddenGroupIndex = (currentHiddenColumnsInfo, lastHiddenColumnDetail) => {
    return lastHiddenColumnDetail.findIndex((item) => currentHiddenColumnsInfo.hideColumnNodes.some((node) => { var _a; return (_a = item.hideColumnNodes) === null || _a === void 0 ? void 0 : _a.find((hiddenNode) => hiddenNode.id === node.id); }));
};
exports.getSameHiddenGroupIndex = getSameHiddenGroupIndex;
/**
 * @name 隐藏指定列
 * @description 1. 通过分析组件隐藏, 2. 点击列头隐藏
 * 存储: 1.隐藏列所对应的兄弟节点 (显示展开按钮), 2.当前隐藏列 (点击展开按钮恢复隐藏)
 * 重置交互: 比如选中当前列, 显示高亮背景色, 隐藏后需要取消高亮
 * 钩子: 提供当前被隐藏的列, 和全量的隐藏组
 */
const hideColumns = (spreadsheet_1, ...args_1) => tslib_1.__awaiter(void 0, [spreadsheet_1, ...args_1], void 0, function* (spreadsheet, selectedColumnFields = [], forceRender = false) {
    const renderByHiddenColumns = (...args_2) => tslib_1.__awaiter(void 0, [...args_2], void 0, function* (hiddenColumnFields = [], hiddenColumnsDetail = []) {
        spreadsheet.setOptions({
            interaction: {
                hiddenColumnFields,
            },
        });
        spreadsheet.interaction.reset();
        spreadsheet.store.set('hiddenColumnsDetail', hiddenColumnsDetail);
        yield spreadsheet.render({
            reloadData: false,
            rebuildHiddenColumnsDetail: false,
        });
    });
    if ((0, lodash_1.isEmpty)(selectedColumnFields) && forceRender) {
        yield renderByHiddenColumns();
        return;
    }
    const lastHiddenColumnDetail = spreadsheet.store.get('hiddenColumnsDetail', []);
    const { hiddenColumnFields: lastHiddenColumnFields = [] } = spreadsheet.options.interaction;
    if ((0, lodash_1.isEqual)(selectedColumnFields, lastHiddenColumnFields) && !forceRender) {
        return;
    }
    const hiddenColumnFields = (0, lodash_1.uniq)([
        ...selectedColumnFields,
        ...lastHiddenColumnFields,
    ]);
    const isAllNearToHiddenColumnNodes = (0, exports.getHiddenColumnNodes)(spreadsheet, hiddenColumnFields).every((node, i, nodes) => {
        const nextNode = nodes[i + 1];
        return !nextNode || Math.abs(node.colIndex - nextNode.colIndex) === 1;
    });
    const displaySiblingNode = (0, exports.getHiddenColumnDisplaySiblingNode)(spreadsheet, isAllNearToHiddenColumnNodes ? hiddenColumnFields : selectedColumnFields);
    const currentHiddenColumnsInfo = {
        hideColumnNodes: (0, exports.getHiddenColumnNodes)(spreadsheet, selectedColumnFields),
        displaySiblingNode,
    };
    const index = (0, exports.getSameHiddenGroupIndex)(currentHiddenColumnsInfo, lastHiddenColumnDetail);
    let hiddenColumnsDetail = [];
    if (index !== -1) {
        hiddenColumnsDetail = lastHiddenColumnDetail.map((item, i) => {
            if (i === index) {
                return currentHiddenColumnsInfo;
            }
            return item;
        });
    }
    else {
        hiddenColumnsDetail = [...lastHiddenColumnDetail, currentHiddenColumnsInfo];
    }
    spreadsheet.emit(constant_1.S2Event.COL_CELL_HIDDEN, currentHiddenColumnsInfo, hiddenColumnsDetail);
    yield renderByHiddenColumns(hiddenColumnFields, hiddenColumnsDetail);
});
exports.hideColumns = hideColumns;
/**
 * @name 获取配置的列头
 * @description 明细表: 配置的是 field,直接使用, 透视表: 需要将 field 转成布局之后的唯一id
 */
const getColumns = (spreadsheet) => {
    const { columns = [] } = spreadsheet.dataCfg.fields;
    if (spreadsheet.isTableMode() && !spreadsheet.isCustomColumnFields()) {
        return columns;
    }
    return spreadsheet.facet.getInitColIndexLeafNodes().map(({ id }) => id);
};
exports.getColumns = getColumns;
/**
 * @name 根据分组隐藏指定列
 * @description 根据配置的隐藏列自动分组, 批量隐藏
 * @param spreadsheet
 * @param hiddenColumnFields 隐藏的列头字段
 * @param forceRender 隐藏的列头字段为空时, 是否强制更新
 */
const hideColumnsByThunkGroup = (spreadsheet_2, ...args_3) => tslib_1.__awaiter(void 0, [spreadsheet_2, ...args_3], void 0, function* (spreadsheet, hiddenColumnFields = [], forceRender = false) {
    // 隐藏列为空时, 有可能是隐藏后又展开 ( [] => ['A'] => []), 所以需要更新一次, 将渲染的展开icon, 隐藏列信息等清空
    if ((0, lodash_1.isEmpty)(hiddenColumnFields) && forceRender) {
        yield (0, exports.hideColumns)(spreadsheet, hiddenColumnFields, true);
    }
    const columns = (0, exports.getColumns)(spreadsheet);
    const leafs = (0, utils_1.getLeafColumnsWithKey)(columns);
    const hiddenColumnsGroup = (0, exports.getHiddenColumnsThunkGroup)(leafs, hiddenColumnFields);
    yield Promise.all(hiddenColumnsGroup.map((fields) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
        yield (0, exports.hideColumns)(spreadsheet, fields, forceRender);
    })));
});
exports.hideColumnsByThunkGroup = hideColumnsByThunkGroup;
const isLastColumnAfterHidden = (spreadsheet, columnField) => {
    const columnLeafNodes = spreadsheet.facet.getColLeafNodes();
    const initColLeafNodes = spreadsheet.facet.getInitColIndexLeafNodes();
    const fieldKey = (0, exports.getHiddenColumnFieldKey)(columnField);
    return ((0, lodash_1.get)((0, lodash_1.last)(columnLeafNodes), fieldKey) === columnField &&
        (0, lodash_1.get)((0, lodash_1.last)(initColLeafNodes), fieldKey) !== columnField);
};
exports.isLastColumnAfterHidden = isLastColumnAfterHidden;
const getValidDisplaySiblingNode = (displaySiblingNode, direction) => direction
    ? displaySiblingNode === null || displaySiblingNode === void 0 ? void 0 : displaySiblingNode[direction]
    : (displaySiblingNode === null || displaySiblingNode === void 0 ? void 0 : displaySiblingNode.next) || (displaySiblingNode === null || displaySiblingNode === void 0 ? void 0 : displaySiblingNode.prev);
exports.getValidDisplaySiblingNode = getValidDisplaySiblingNode;
const getValidDisplaySiblingNodeId = (displaySiblingNode, direction) => {
    const node = (0, exports.getValidDisplaySiblingNode)(displaySiblingNode, direction);
    return node === null || node === void 0 ? void 0 : node.id;
};
exports.getValidDisplaySiblingNodeId = getValidDisplaySiblingNodeId;
const isEqualDisplaySiblingNodeId = (displaySiblingNode, nodeId, direction) => (0, exports.getValidDisplaySiblingNodeId)(displaySiblingNode, direction) === nodeId;
exports.isEqualDisplaySiblingNodeId = isEqualDisplaySiblingNodeId;
const getHiddenColumnContinuousSiblingNodes = (spreadsheet, nodeId, hideDirection) => {
    var _a;
    const continuousSiblingNodes = [];
    const hiddenColumnFields = ((_a = spreadsheet.options.interaction) === null || _a === void 0 ? void 0 : _a.hiddenColumnFields) || [];
    const hiddenColumnNodes = (0, exports.getHiddenColumnNodes)(spreadsheet, hiddenColumnFields);
    const hiddenColumnNodesMap = new Map(hiddenColumnNodes.map((node) => [node.id, node]));
    const initColLeafNodes = spreadsheet.facet.getInitColIndexLeafNodes();
    const step = hideDirection === 'prev' ? 1 : -1;
    const nodeIndex = initColLeafNodes.findIndex((node) => node.id === nodeId);
    const startIndex = nodeIndex + step;
    for (let i = startIndex; i < initColLeafNodes.length; i += step) {
        const currentNode = initColLeafNodes[i];
        if (!currentNode) {
            break;
        }
        if (hiddenColumnNodesMap.has(currentNode === null || currentNode === void 0 ? void 0 : currentNode.id)) {
            continuousSiblingNodes.push(currentNode);
        }
        else {
            break;
        }
    }
    return (0, lodash_1.sortBy)(continuousSiblingNodes, 'colIndex');
};
exports.getHiddenColumnContinuousSiblingNodes = getHiddenColumnContinuousSiblingNodes;
//# sourceMappingURL=hide-columns.js.map