@progress/kendo-vue-grid
Version:
86 lines (85 loc) • 5.29 kB
JavaScript
/**
* @license
*-------------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the package root for more information
*-------------------------------------------------------------------------------------------
*/
import { getIndex as h } from "../utils/main.mjs";
import { canUseDOM as a } from "@progress/kendo-vue-common";
class c {
constructor(r, i, s) {
this.reorderable = !1, this.groupable = !1, this.dropElementClue = null, this.dragElementClue = null, this.startColumn = -1, this.startGroup = -1, this.currentColumn = -1, this.currentGroup = -1, this.groupPanelDivElement = null, this.refGroupPanelDiv = (t) => {
this.groupPanelDivElement = t.children ? t.children[0] : t;
}, this.refDropElementClue = (t) => {
this.dropElementClue = t, this.dropElementClue && a && document.body.appendChild(this.dropElementClue.$el);
}, this.refDragElementClue = (t) => {
this.dragElementClue = t, this.dragElementClue && a && document.body.appendChild(this.dragElementClue.$el);
}, this.pressHandler = (t, e) => {
t.isTouch || t.originalEvent.preventDefault();
const l = this.getColumnIndex(t, e);
if (this.startGroup = this.getGroupIndex(t), l >= 0) {
const n = this.columns[l];
(n.reorderable && this.reorderable || n.groupable && this.groupable) && (this.startColumn = l);
}
}, this.dragHandler = (t, e) => {
if (t.isTouch || t.originalEvent.preventDefault(), t.originalEvent.stopPropagation(), this.startColumn === -1 && this.startGroup === -1)
return;
this.currentColumn = this.getColumnIndex(t, e);
const l = this.groupPanelDivElement && this.groupPanelDivElement.children;
this.currentGroup = this.isTargetGroupingContainer(t) ? l && l.length ? l.length : 0 : this.getGroupIndex(t);
const n = !this.isValid();
n && (this.currentColumn = -1, this.currentGroup = -1);
const u = this.currentColumn >= 0 ? e.children[this.columns[this.currentColumn].index] : this.isTargetGroupingContainer(t) ? t.originalEvent.target : this.groupPanelDivElement && this.groupPanelDivElement.children[this.currentGroup];
this.updateDragElementClue(t, e, u, n), this.updateDropElementClue(t, e, u, n);
}, this.releaseHandler = (t) => {
const e = this.startColumn, l = this.currentColumn, n = this.startGroup, u = this.currentGroup;
this.dropElementClue && (this.dropElementClue.visible = !1), this.dragElementClue && (this.dragElementClue.visible = !1);
const o = this.isValid();
this.startColumn = this.startGroup = this.currentColumn = this.currentGroup = -1, o && (e >= 0 && l >= 0 ? this.columnReorder(e, l, t.originalEvent) : n >= 0 && u >= 0 ? this.groupReorder(n, u, t.originalEvent) : e >= 0 && u >= 0 && this.columnToGroup(e, u, t.originalEvent));
}, this.columnReorder = r, this.groupReorder = i, this.columnToGroup = s;
}
getColumnIndex(r, i) {
if (!i || i.parentElement === this.groupPanelDivElement)
return -1;
const s = h(r, i);
if (s === -1)
return -1;
for (let t = 0; t < i.parentNode.children.length; t++)
if (i.parentNode.children[t] === i)
return this.columns.findIndex((e) => e.index === s && e.depth === t);
return -1;
}
isTargetGroupingContainer(r) {
const i = r.originalEvent.target;
return i.className.indexOf && i.className.indexOf("k-grouping-drop-container") !== -1;
}
getGroupIndex(r) {
return h(r, this.groupPanelDivElement);
}
isValid() {
return this.startGroup >= 0 ? this.currentGroup >= 0 && this.currentGroup !== this.startGroup : this.startColumn === -1 ? !1 : this.currentGroup >= 0 ? this.columns[this.startColumn].groupable === !0 && this.groupable === !0 : this.reorderable === !0 && this.currentColumn >= 0 && this.currentColumn !== this.startColumn && this.columns[this.startColumn].reorderable === !0 && this.columns[this.currentColumn].parentIndex === this.columns[this.startColumn].parentIndex;
}
updateDragElementClue(r, i, s, t) {
if (!this.dragElementClue)
return;
const e = this.startColumn >= 0 ? i.children[this.columns[this.startColumn].index].innerText : i.innerText;
this.dragElementClue.visible = !0, this.dragElementClue.top = r.pageY + 10, this.dragElementClue.left = r.pageX, this.dragElementClue.innerText = e, this.dragElementClue.status = t || !s ? "cancel" : "plus";
}
updateDropElementClue(r, i, s, t) {
if (!this.dropElementClue)
return;
if (t || !s) {
this.dropElementClue.visible = !1;
return;
}
const e = s.getBoundingClientRect(), n = (s.closest(".k-grouping-header") || s).getBoundingClientRect();
let u = e.left + r.pageX - r.clientX - 6;
!this.isTargetGroupingContainer(r) && (this.currentColumn > this.startColumn || this.currentGroup > this.startGroup && this.startGroup !== -1) && (u += e.width);
const o = n.top + r.pageY - r.clientY;
this.dropElementClue.visible = !0, this.dropElementClue.top = o, this.dropElementClue.left = u, this.dropElementClue.height = this.currentColumn >= 0 ? i.clientHeight : n.height;
}
}
export {
c as CommonDragLogic
};