@antv/s2/lib/interaction/range-selection.js

effective spreadsheet render core lib

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.RangeSelection = void 0;
const lodash_1 = require("lodash");
const cell_1 = require("../cell");
const constant_1 = require("../common/constant");
const select_event_1 = require("../utils/interaction/select-event");
const tooltip_1 = require("../utils/tooltip");
const base_interaction_1 = require("./base-interaction");
class RangeSelection extends base_interaction_1.BaseEvent {
    constructor() {
        super(...arguments);
        this.isRangeSelection = false;
        this.handleColClick = (event) => {
            event.stopPropagation();
            const { interaction, facet } = this.spreadsheet;
            const cell = this.spreadsheet.getCell(event.target);
            const meta = cell === null || cell === void 0 ? void 0 : cell.getMeta();
            if (!(0, lodash_1.isNil)(meta === null || meta === void 0 ? void 0 : meta.x)) {
                interaction.addIntercepts([constant_1.InterceptType.HOVER]);
                let selectedCells = [(0, select_event_1.getCellMeta)(cell)];
                const lastCell = this.spreadsheet.store.get('lastClickedCell');
                // 处理shift区间多选
                if (this.isRangeSelection &&
                    lastCell &&
                    lastCell.cellType === cell.cellType &&
                    lastCell.getMeta().level === meta.level) {
                    const { rowsHierarchy, colsHierarchy } = facet.getLayoutResult();
                    const [rowMaxLevel, colMaxLevel] = [
                        rowsHierarchy.maxLevel,
                        colsHierarchy.maxLevel,
                    ];
                    const { start, end } = (0, select_event_1.getRangeIndex)(lastCell.getMeta(), meta);
                    if (cell instanceof cell_1.DataCell) {
                        selectedCells = this.handleSeriesNumberRowSelected(start.rowIndex, end.rowIndex, cell);
                    }
                    else if ((cell === null || cell === void 0 ? void 0 : cell.cellType) === constant_1.CellType.ROW_CELL &&
                        meta.level === rowMaxLevel) {
                        selectedCells = this.handleRowSelected(start.rowIndex, end.rowIndex, cell);
                    }
                    else if ((cell === null || cell === void 0 ? void 0 : cell.cellType) === constant_1.CellType.COL_CELL &&
                        meta.level === colMaxLevel) {
                        selectedCells = this.handleColSelected(start.colIndex, end.colIndex, cell);
                    }
                    interaction.changeState({
                        cells: selectedCells,
                        stateName: constant_1.InteractionStateName.SELECTED,
                    });
                    const selectedCellIds = (0, select_event_1.groupSelectedCells)(selectedCells);
                    interaction.updateCells(facet.getHeaderCells(selectedCellIds));
                    interaction.emitSelectEvent({
                        event,
                        targetCell: cell,
                        interactionName: constant_1.InteractionName.RANGE_SELECTION,
                    });
                }
                else {
                    if ((0, lodash_1.isEmpty)(interaction.getCells())) {
                        interaction.reset();
                    }
                    this.spreadsheet.store.set('lastClickedCell', cell);
                }
            }
        };
    }
    bindEvents() {
        this.bindKeyboardDown();
        this.bindDataCellClick();
        this.bindColCellClick();
        this.bindKeyboardUp();
        this.bindMouseMove();
    }
    reset() {
        this.isRangeSelection = false;
        this.spreadsheet.interaction.removeIntercepts([constant_1.InterceptType.CLICK]);
    }
    bindKeyboardDown() {
        this.spreadsheet.on(constant_1.S2Event.GLOBAL_KEYBOARD_DOWN, (event) => {
            if (event.key === constant_1.InteractionKeyboardKey.SHIFT) {
                this.isRangeSelection = true;
                this.spreadsheet.interaction.addIntercepts([constant_1.InterceptType.CLICK]);
            }
        });
    }
    bindKeyboardUp() {
        this.spreadsheet.on(constant_1.S2Event.GLOBAL_KEYBOARD_UP, (event) => {
            if (event.key === constant_1.InteractionKeyboardKey.SHIFT) {
                this.reset();
            }
        });
    }
    bindMouseMove() {
        // 当快捷键被系统拦截后，按需补充调用一次 reset
        this.spreadsheet.on(constant_1.S2Event.GLOBAL_MOUSE_MOVE, (event) => {
            if (this.isRangeSelection && !event.shiftKey) {
                this.reset();
            }
        });
    }
    bindColCellClick() {
        this.spreadsheet.on(constant_1.S2Event.COL_CELL_CLICK, (event) => {
            this.handleColClick(event);
        });
    }
    bindDataCellClick() {
        this.spreadsheet.on(constant_1.S2Event.DATA_CELL_CLICK, (event) => {
            event.stopPropagation();
            const cell = this.spreadsheet.getCell(event.target);
            const meta = cell.getMeta();
            const { interaction } = this.spreadsheet;
            if (!meta) {
                return;
            }
            const lastClickedCell = this.spreadsheet.store.get('lastClickedCell');
            const isShiftSelect = this.isRangeSelection && (lastClickedCell === null || lastClickedCell === void 0 ? void 0 : lastClickedCell.cellType) === cell.cellType;
            if (!isShiftSelect) {
                this.spreadsheet.store.set('lastClickedCell', cell);
                return;
            }
            const { start, end } = (0, select_event_1.getRangeIndex)(lastClickedCell.getMeta(), cell.getMeta());
            const cells = (0, lodash_1.range)(start.colIndex, end.colIndex + 1).flatMap((col) => {
                const cellIdSuffix = this.spreadsheet.facet.getColLeafNodes()[col].id;
                return (0, lodash_1.range)(start.rowIndex, end.rowIndex + 1).map((row) => {
                    const cellIdPrefix = this.spreadsheet.facet.getSeriesNumberWidth() ||
                        this.spreadsheet.isTableMode()
                        ? String(row)
                        : this.spreadsheet.facet.getRowLeafNodes()[row].id;
                    return {
                        id: `${cellIdPrefix}-${cellIdSuffix}`,
                        colIndex: col,
                        rowIndex: row,
                        type: cell.cellType,
                    };
                });
            });
            interaction.addIntercepts([constant_1.InterceptType.CLICK, constant_1.InterceptType.HOVER]);
            interaction.changeState({
                cells,
                stateName: constant_1.InteractionStateName.SELECTED,
            });
            this.spreadsheet.showTooltipWithInfo(event, (0, tooltip_1.getCellsTooltipData)(this.spreadsheet));
            interaction.emitSelectEvent({
                targetCell: cell,
                event,
                interactionName: constant_1.InteractionName.RANGE_SELECTION,
            });
        });
    }
    handleSeriesNumberRowSelected(startIndex, endIndex, cell) {
        // table模式下序列号行头
        const cellIdSufFix = this.spreadsheet.facet.getColLeafNodes()[0].id;
        return (0, lodash_1.range)(startIndex, endIndex + 1).map((row) => {
            const cellIdPrefix = String(row);
            return {
                id: `${cellIdPrefix}-${cellIdSufFix}`,
                colIndex: 0,
                rowIndex: row,
                type: cell.cellType,
            };
        });
    }
    handleRowSelected(startIndex, endIndex, cell) {
        // ROW_CELL类型 最后一个Level支持区间选择
        return this.spreadsheet.facet
            .getRowNodes()
            .filter(({ rowIndex }) => (0, lodash_1.inRange)(rowIndex, startIndex, endIndex + 1))
            .map((e) => {
            return {
                id: e.id,
                colIndex: e.colIndex,
                rowIndex: e.rowIndex,
                type: cell.cellType,
            };
        });
    }
    handleColSelected(startIndex, endIndex, cell) {
        // COL_CELL类型 最后一个Level支持区间选择
        return this.spreadsheet.facet
            .getColLeafNodes()
            .filter(({ colIndex }) => (0, lodash_1.inRange)(colIndex, startIndex, endIndex + 1))
            .map((e) => {
            return {
                id: e.id,
                colIndex: e.colIndex,
                rowIndex: e.rowIndex,
                type: cell.cellType,
            };
        });
    }
}
exports.RangeSelection = RangeSelection;
//# sourceMappingURL=range-selection.js.map