verschiedene Hilfsmodule
var tooltips = gantt.ext.tooltips;
tooltips.tooltipFor({
selector: ".gantt_scale_cell",
html: function (event, node) {
const domHelper = gantt.utils.dom;
const pos = domHelper.getRelativeEventPosition(event, gantt.$task_scale);
return gantt.templates.task_date(gantt.dateFromPos(pos.x));
}
});
Derzeit bietet dieses Modul hauptsächlich Helfer für DOM-Operationen über gantt.utils.dom an.
var domHelpers = gantt.utils.dom;
Es stellt folgende Methoden bereit:
getNodePosition (node): object - ermittelt die Position eines Elements auf dem Bildschirm und gibt ein Objekt wie {x:number, y:number,width:number, height:number}
zurück
getRelativeEventPosition (e, node): object - ermittelt die Mauskoordinaten relativ zu einem angegebenen DOM-Element, zurückgegeben als {x:number, y:number}
gantt.message({
expire: -1,
text: "<span id='pointer-date'></span>"
});
const formatDate = gantt.date.date_to_str("%Y-%m-%d %H:%i");
gantt.attachEvent("onMouseMove", function (id, e){
const helper = gantt.utils.dom;
if(helper.isChildOf(e.target, gantt.$task_data)){
const textContainer = document.querySelector("#pointer-date");
const pos = helper.getRelativeEventPosition(e, gantt.$task_data);
const pointerDate = gantt.dateFromPos(pos.x);
textContainer.innerText = formatDate(pointerDate);
}
});
isChildOf (child, parent): boolean - prüft, ob der erste Knoten ein DOM-Kind des zweiten Knotens ist, gibt true
zurück, wenn ja
hasClass (node, className): boolean - bestimmt, ob das angegebene node
eine bestimmte CSS-Klasse enthält, gibt true
zurück, wenn dies der Fall ist
closest (node, cssSelector): HTMLElement - findet den nächsten Vorfahrenknoten (einschließlich des Knotens selbst), der dem angegebenen CSS-Selektor entspricht
gantt.attachEvent("onEmptyClick", function (e) {
const domHelpers = gantt.utils.dom;
if(!domHelpers.closest(e.target, `[${gantt.config.link_attribute}]`)){
gantt.message("not a link");
}else{
gantt.message("link!");
}
});
Zurück nach oben