Функциональность Отмены/Повтора

Гант диаграмма dhtmlxGantt включает в себя функцию отмены и повтора изменений. Чтобы активировать эту возможность, необходимо включить плагин undo с помощью метода gantt.plugins.

gantt.plugins({
    undo: true
});

По умолчанию, обе опции отмены и повтора включены. Если необходимо, вы можете управлять этими функциями через настройки undo и redo.

Вы также можете включить только одну из опций, отключив другую:

// Активна только функция Повтора
gantt.config.undo = false;
gantt.config.redo = true;

Related sample:  Undo/Redo changes in Gantt

API Отмены/Повтора

Чтобы отменить изменения в Гант диаграмме, можно использовать метод undo:

gantt.undo();

Для повтора изменений, которые были ранее отменены, используйте метод redo:

gantt.redo();

Начиная с версии 6.3, методы undo()/redo() также доступны через объект gantt.ext.undo. Для получения более подробной информации обратитесь к статье Расширение Undo.

Получение стека сохраненных действий Отмены/Повтора

Все действия в Гант диаграмме хранятся в виде массивов, содержащих наборы командных объектов. Эти команды сохраняются в стеке наиболее недавно выполненных действий. Расширение undo может отменить эти действия и повторить их по мере необходимости.

При отмене или повторе команды расширение извлекает последний объект команды и выполняет связанный метод.

Чтобы получить стек действий отмены, используйте метод getUndoStack:

var stack = gantt.getUndoStack();

Чтобы получить стек действий повтора, примените метод getRedoStack:

var stack = gantt.getRedoStack();

Возвращаемые данные представляют собой массив пользовательских действий, где каждое действие включает набор команд:

  • UndoRedoAction - (object) - объект, содержащий команды для действий Отмены или Повтора
    • commands - (UndoRedoCommand[]) - массив изменений (команд) для действия Отмены или Повтора

Каждая команда имеет следующие атрибуты:

  • UndoRedoCommand - (object) - объект, содержащий начальное и обновленное состояние объектов Task или Link:
    • type - (string) - тип команды: "add/remove/update"
    • entity - (string) - тип измененного объекта: "task" или "link"
    • value - (Task | Link) - измененный объект task/link
    • oldValue - (Task | Link) - объект task/link до изменений

Например:

Здесь метод getUndoStack() возвращает стек, содержащий два действия отмены. В первом действии три команды, во втором — только одна.

Начиная с версии 6.3, методы getUndoStack()/getRedoStack() также доступны через объект gantt.ext.undo. Для получения дополнительной информации ознакомьтесь со статьей Расширение Undo.

Очистка стека сохраненных команд Отмены/Повтора

Сохраненные команды Отмены/Повтора могут быть очищены с использованием соответствующих методов API Gantt.

Чтобы очистить стек отмены, используйте метод clearUndoStack:

gantt.clearUndoStack();

Чтобы очистить стек повтора, примените метод clearRedoStack:

gantt.clearRedoStack();

Начиная с версии 6.3, методы clearUndoStack()/clearRedoStack() также доступны через объект gantt.ext.undo. Более подробная информация доступна в статье Расширение Undo.

Отмена/Повтор изменений, сделанных в коде

Изменения, сделанные непосредственно в коде, также могут быть отменены или повторены. Для этого необходимо комбинировать методы undo()/redo() с методом saveState() из объекта gantt.ext.undo.

По умолчанию Gantt не отслеживает изменения, сделанные непосредственно в коде. Чтобы сохранить состояние задачи или ссылки перед внесением изменений, метод saveState() должен быть использован до начала модификаций.

После завершения изменений необходимо уведомить Gantt. Это можно сделать с помощью методов updateTask() или updateLink(). Эти методы сохраняют как предыдущее, так и обновленное состояния в стек отмены.

Вот пример того, как восстановить оригинальный текст задачи после его изменения в коде:

const undoExtension = gantt.ext.undo;
const task = gantt.getTask(1);
 
console.log(task.text);
// ->  "task 1";
 
undoExtension.saveState(task.id, "task");  
task.text = "modified"; gantt.updateTask(1);  
console.log(task.text);
// ->  "modified";
 
undoExtension.undo();
 
console.log(task.text);
// ->  "task 1";

В этом случае метод saveState() сохранил оригинальный текст "task 1" перед его изменением на "modified". Метод gantt.ext.undo.undo() затем восстановил текст в его первоначальное значение. Для получения дополнительной информации о методе saveState() ознакомьтесь со статьей Расширение Undo.

Настройка функциональности Отмены

Доступно несколько настроек для настройки операций Отмены.

Чтобы указать, какие действия могут быть отменены, используйте параметр undo_actions:

gantt.config.undo_actions = {
    update:"update",
    remove:"remove", // удаление элемента из хранилища данных
    add:"add"
};

Чтобы установить максимальное количество шагов, которые могут быть отменены, используйте параметр undo_steps:

gantt.config.undo_steps = 10;

По умолчанию, можно отменить до 10 действий.

Вы также можете определить, к каким сущностям применяется функция отмены, используя параметр undo_types:

gantt.config.undo_types = {
    link:"link",
    task:"task"
};

Список API событий

Вот некоторые полезные события, связанные с функциональностью Отмены/Повтора:

  • onBeforeUndo - срабатывает перед выполнением метода undo
  • onAfterUndo - срабатывает после выполнения метода undo
  • onBeforeRedo - срабатывает перед выполнением метода redo
  • onAfterRedo - срабатывает после выполнения метода redo
  • onBeforeRedoStack - срабатывает перед добавлением действия в стек повтора
  • onBeforeUndoStack - срабатывает перед добавлением действия в стек отмены
К началу