vue-gantt-3/lib/composables/useGanttSelect.js

A gantt component for Vue 3

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const vue = require("vue");
const useGanttSelect = ({
  vGanttRef,
  visibleRowIds,
  rowHeight,
  rowSelection,
  rowClass,
  emitGanttMouseDown,
  emitSelectChange
}) => {
  const selectedRowIds = vue.ref(/* @__PURE__ */ new Set());
  let lastMouseMoveTarget = null;
  let lastClickedRowId = "";
  let lastClickedRowIndex = 0;
  vue.provide(
    "selectedRowIds",
    selectedRowIds
  );
  vue.watch(selectedRowIds, (val) => {
    emitSelectChange([...val]);
  }, { deep: true });
  vue.onMounted(() => {
    var _a;
    (_a = vGanttRef.value) == null ? void 0 : _a.addEventListener("mousedown", handleGanttMouseDown);
  });
  vue.onBeforeUnmount(() => {
    var _a;
    (_a = vGanttRef.value) == null ? void 0 : _a.removeEventListener("mousedown", handleGanttMouseDown);
  });
  function handleGanttMouseDown(event) {
    if (rowSelection.value === "none") return;
    const { target, attributeValue: rowId, rowIndex } = getTargetElementInfo(event.target, rowClass, "data-row-id");
    emitGanttMouseDown(event, rowId);
    if (target) {
      const isLeftMouse = event.button === 0;
      if (rowId) {
        handleRowSelect(rowId, event, rowIndex);
      } else {
        selectedRowIds.value.clear();
        return;
      }
      if (isLeftMouse && rowSelection.value === "multiple") {
        this.addEventListener("mousemove", handleGanttMouseMove);
        document.addEventListener("mouseup", handleGanttMouseUp);
      }
    } else {
      const { target: ganttBodyRef } = getTargetElementInfo(event.target, "vg-body");
      if (ganttBodyRef) {
        selectedRowIds.value.clear();
      }
    }
  }
  function handleGanttMouseMove(event) {
    const { target, attributeValue: rowId, rowIndex } = getTargetElementInfo(event.target, rowClass, "data-row-id");
    if (target && lastMouseMoveTarget !== target) {
      lastMouseMoveTarget = target;
      if (rowId) {
        handleRowSelect(rowId, event, rowIndex, true);
      }
    }
  }
  function handleGanttMouseUp() {
    var _a;
    (_a = vGanttRef.value) == null ? void 0 : _a.removeEventListener("mousemove", handleGanttMouseMove);
    document.removeEventListener("mouseup", handleGanttMouseUp);
  }
  const handleRowSelect = (rowId, event, rowIndex, onShift) => {
    const pressCtrl = event == null ? void 0 : event.ctrlKey;
    const pressShift = (event == null ? void 0 : event.shiftKey) || onShift;
    const isContextmenuClick = (event == null ? void 0 : event.type) === "contextmenu";
    const selectedRowIdSize = selectedRowIds.value.size;
    if (!pressCtrl || isContextmenuClick) {
      selectedRowIds.value.clear();
    }
    if (pressCtrl && !pressShift) {
      if (selectedRowIds.value.has(rowId)) {
        selectedRowIds.value.delete(rowId);
        return;
      }
    }
    if (pressShift && !isContextmenuClick && selectedRowIdSize > 0 && lastClickedRowId !== rowId) {
      const bigRowIndex = Math.max(rowIndex, lastClickedRowIndex);
      const smallRowIndex = Math.min(rowIndex, lastClickedRowIndex);
      const willSelectedRowIds = visibleRowIds.value.slice(smallRowIndex, bigRowIndex + 1);
      for (let id of willSelectedRowIds) {
        selectedRowIds.value.add(id);
      }
    } else {
      selectedRowIds.value.add(rowId);
      lastClickedRowId = rowId;
      lastClickedRowIndex = rowIndex;
    }
  };
  const getTargetElementInfo = (initialTarget, targetClass, attribute) => {
    var _a;
    let target = initialTarget;
    let attributeValue = "";
    let rowIndex = 0;
    while (target && !target.classList.contains(targetClass)) {
      target = target == null ? void 0 : target.parentElement;
    }
    if (target && attribute) {
      attributeValue = target.getAttribute(attribute);
      const transform = target.style.transform;
      const transformYStr = (_a = transform.match(/translateY\((.+)px\)/)) == null ? void 0 : _a[1];
      if (transformYStr) {
        const transformY = parseFloat(transformYStr);
        rowIndex = parseInt((transformY / rowHeight.value).toFixed(0));
      }
    }
    return {
      target,
      attributeValue,
      rowIndex
    };
  };
  const handleSetSelect = (id) => {
    if (rowSelection.value === "none") return;
    selectedRowIds.value.clear();
    selectedRowIds.value.add(id);
  };
  const selectRows = (ids) => {
    selectedRowIds.value = new Set(ids);
  };
  return {
    handleSetSelect,
    selectRows,
    getTargetElementInfo
  };
};
exports.useGanttSelect = useGanttSelect;
//# sourceMappingURL=useGanttSelect.js.map