Перейти к основному содержимому

Обзор DHTMLX Kanban

JavaScript Kanban - удобный инструмент для визуализации рабочих процессов. С его помощью проще понять, как устроены бизнес-процессы и оценить загрузку вашей команды. Этот инструмент очень гибкий: поддерживает любое количество карточек, колонок и дорожек (swimlanes). Так как он построен на чистом JavaScript и CSS, его легко внедрять и настраивать, и он отлично впишется в любое веб-приложение или веб-страницу.

Структура Kanban​

Панель инструментов​

Панель инструментов (Toolbar) в Kanban представляет собой отдельную область интерфейса. В ней есть строка поиска по карточкам, элемент управления сортировкой карточек по разным параметрам, кнопки отмены/повтора действий для управления историей, а также элементы управления для добавления новых колонок и строк. Вы можете настраивать работу поиска и сортировки, а также легко изменять состав панели, добавляя свои элементы или меняя порядок встроенных. Подробнее см. в разделе Configuration.

Kanban Toolbar

Доска​

Доска (Board) - это то место, где происходит основная работа в Kanban. Здесь карточки располагаются по колонкам и строкам (swimlanes). Вы можете легко изменить внешний вид карточек или использовать собственные шаблоны. Подробнее об этом читайте в разделе Configuration.

На панели Board вы можете взаимодействовать с карточками, колонками и строками следующими способами:

  • Добавлять новые карточки, нажимая на иконку плюса (с учетом лимитов для каждой колонки и дорожки)
  • Добавлять комментарии и голоса к задачам через панель редактора (Пример)
  • Настраивать связи между задачами в редакторе (Пример)
  • Удалять карточки, колонки и строки с помощью контекстного меню (иконка с тремя точками)
  • Дублировать карточки через контекстное меню (иконка с тремя точками) или с помощью Ctrl (Command)+D (позволяет копировать сразу несколько карточек)
  • Экспортировать данные Kanban в файл JSON
  • Управлять историей Kanban с помощью следующих сочетаний клавиш:
    • Ctrl (Command)+Z - отменить последнее действие (шаг назад в истории Kanban)
    • Ctrl (Command)+Y или Ctrl (Command)+Shift+Z - вернуть отмененное действие (шаг вперед в истории Kanban)
  • Перемещать карточки перетаскиванием в любые колонки и строки
  • Перемещать колонки и строки через контекстное меню (иконка с тремя точками)
  • Переименовывать колонки и строки двойным кликом по их названию или через контекстное меню (иконка с тремя точками)
  • Открывать редактор карточки простым кликом по ней
  • Сворачивать и разворачивать строки с помощью стрелки слева от заголовка строки
  • Сворачивать и разворачивать колонки с помощью стрелки слева от заголовка колонки
  • Выделять несколько карточек с помощью следующих сочетаний:
    • Shift + клик - выбор нескольких карточек в одной колонке
    • Ctrl (Command) + клик - выбор карточек в разных колонках

Kanban Board

Редактор​

Редактор (Editor) открывается в виде модального окна и предоставляет поля и элементы управления для обновления данных выбранной карточки. Достаточно кликнуть по карточке, чтобы открыть редактор. Вы также можете настраивать редактор, добавляя новые поля или управляющие элементы. Подробнее - в разделе Configuration.

Kanban Editor

Что дальше​

Чтобы начать работу с Kanban в вашем приложении, перейдите к пошаговому руководству How to start.