Этот раздел объясняет, как выполнять базовые действия с зависимостями ссылок, такие как создание, обновление или удаление, а также динамическое изменение их свойств.
Для создания новой ссылки в диаграмме Ганта можно использовать метод gantt.addLink
, как показано ниже:
var linkId = gantt.addLink({
id:1,
source:1,
target:2,
type:"1"
});
Для динамического обновления свойства ссылки доступен метод gantt.refreshLink
:
var links= gantt.config.links;
var link = gantt.getLink(1);//->{id:1,source:1, target:2, type:"1"}
if (link.type == links.finish_to_start){ link.type = links.finish_to_finish; gantt.refreshLink(1); }
Если необходимо обновить все ссылки в диаграмме Ганта сразу, можно использовать метод gantt.refreshData
:
var links= gantt.config.links;
var link1 = gantt.getLink(1);//->{id:1,source:1, target:2, type:"1"}
var link2 = gantt.getLink(2);//->{id:2,source:4, target:5, type:"0"}
if (link1.type == links.finish_to_finish){ gantt.refreshData() }
Все типы зависимостей ссылок хранятся в объекте gantt.config.links
.
Для удаления конкретной ссылки используется метод gantt.deleteLink
:
gantt.deleteLink(linkId);
Чтобы очистить диаграмму Ганта от всех задач и ссылок, можно использовать метод gantt.clearAll
:
gantt.clearAll();
Встроенного интерфейса для редактирования свойств ссылок, таких как задержка, не существует. Если это необходимо, данную функциональность нужно реализовать вручную. Обычно это делается следующим образом:
onLinkDblClick
.Для последнего шага можно использовать встроенные всплывающие окна или создать собственное решение. Ниже приведен пример того, как реализовать всплывающее окно для редактирования задержки:
(function(){
var modal;
var editLinkId;
function endPopup(){
modal = null;
editLinkId = null;
}
function cancelEditLink(){
endPopup();
}
function deleteLink(){
gantt.deleteLink(editLinkId);
endPopup();
}
function saveLink(){
var link = gantt.getLink(editLinkId);
var lagValue = modal.querySelector(".lag-input").value;
if(!isNaN(parseInt(lagValue, 10))){
link.lag = parseInt(lagValue, 10);
}
gantt.updateLink(link.id);
if(gantt.autoSchedule){
gantt.autoSchedule(link.source);
}
endPopup();
}
gantt.attachEvent("onLinkDblClick", function(id,e){
editLinkId = id;
var link = gantt.getLink(id);
var linkTitle = gantt.getTask(link.source).text + " -> " +
gantt.getTask(link.target).text;
modal = gantt.modalbox({
title: linkTitle,
text: "<div>" +
"<label>Lag <input type='number' class='lag-input' /></label>" +
"</div>",
buttons: [
{label:"Save", value:"save"},
{label:"Cancel", value:"cancel"},
{label:"Delete", value:"delete"}
],
width: "500px",
callback: function(result){
switch(result){
case "save":
saveLink();
break;
case "cancel":
cancelEditLink();
break;
case "delete":
deleteLink();
break;
}
}
});
modal.querySelector(".lag-input").value = link.lag || 0;
return false;
});
})();
Related sample: Edit-lag Popup
К началу