hongluan-ui/lib/components/simple-table/src/composables/use-resizer.js

Hongluan Component Library for Vue 3

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');

function useResizer(resize, cols, table) {
  const limitation = { min: 30, max: Number.MAX_SAFE_INTEGER, ...typeof resize === "boolean" ? {} : resize };
  let tTH;
  function mousedownHanlder(event) {
    tTH = this;
    if (event.offsetX > tTH.offsetWidth - 10) {
      tTH.mouseDown = true;
      tTH.oldX = event.x;
      tTH.oldWidth = tTH.offsetWidth;
    }
  }
  function mouseupHanlder() {
    if (!tTH)
      tTH = this;
    tTH.mouseDown = false;
    tTH.style.cursor = "default";
  }
  function mousemoveHanlder(event) {
    if ((tTH == null ? void 0 : tTH.mouseDown) === true) {
      tTH.style.cursor = "col-resize";
      const newWidth = tTH.oldWidth + (event.x - tTH.oldX);
      if (newWidth >= limitation.min && newWidth <= limitation.max)
        tTH.style.width = newWidth + "px";
    } else {
      this.style.cursor = event.offsetX >= this.offsetWidth - 10 ? "col-resize" : "default";
    }
  }
  const doResizer = (cb) => {
    for (let i = 0; i < table.value.tHead.rows.length; i++) {
      for (let j = 0; j < table.value.tHead.rows[i].cells.length; j++) {
        const cell = table.value.tHead.rows[i].cells[j];
        cb(cell);
      }
    }
  };
  const addListener = () => {
    resize && doResizer((cell) => {
      cell.addEventListener("mousedown", mousedownHanlder);
      cell.addEventListener("mouseup", mouseupHanlder);
      cell.addEventListener("mousemove", mousemoveHanlder);
    });
  };
  const removeListener = () => {
    resize && doResizer((cell) => {
      cell.removeEventListener("mousedown", mousedownHanlder);
      cell.removeEventListener("mouseup", mouseupHanlder);
      cell.removeEventListener("mousemove", mousemoveHanlder);
    });
  };
  vue.watch(() => cols.value.length, () => {
    vue.nextTick(() => {
      removeListener();
      addListener();
    });
  });
  vue.onMounted(() => {
    addListener();
  });
  vue.onBeforeUnmount(() => {
    removeListener();
  });
}

exports.useResizer = useResizer;
//# sourceMappingURL=use-resizer.js.map