Gantt-чарт в админке WorkflowTemplate (НЕЗАВЕРШЁННАЯ ФУНКЦИОНАЛЬНОСТЬ)¶

Внимание! Данный функционал не используется в продакшене и отключён в коде. Статья предназначена для разработчиков, которые будут дорабатывать или возвращать интеграцию Gantt-чарта в будущем.

1. Введение¶

Gantt-чарт (dhtmlxGantt) предназначался для визуализации шаблонов бизнес-процессов (WorkflowTemplate) в админке Django. Позволяет видеть структуру задач, их зависимости, длительности и связи в виде диаграммы Ганта прямо в интерфейсе администратора.

На момент написания статьи интеграция отключена (код закомментирован), но все ключевые компоненты и подходы сохранены для будущей доработки.

2. Архитектура интеграции¶

Подключение dhtmlxGantt¶

JS и CSS библиотеки dhtmlxGantt подключаются через media-ресурсы виджета (GanttChartWidget).
Статические файлы лежат в static/core/js/gantt_init.js и соответствующих директориях.
Для корректной работы media виджета явно подключается в property media админки.

Формирование данных для чарта¶

Данные для чарта формируются функцией build_gantt_data_for_template(obj) (см. utils.py).
Структура данных:
tasks: список задач с полями id, text, start_date, duration, parent, prev и др.
links: связи между задачами (по prev, type: 0 — finish-to-start).
Особое внимание уделяется корректности дат (start_date, end_date), уникальности id, корректности parent/prev.

Виджет GanttChartWidget¶

Универсальный виджет, поддерживает режим только для чтения (readonly).
Данные передаются через data-атрибуты (JSON).
Подключает необходимые js/css через свойство media.

Рендеринг в админке¶

Виджет рендерится как readonly_field (gantt_chart_widget) в WorkflowTemplateAdmin.
Для корректной работы media виджета явно добавляется к media админки.
В шаблоне создаётся контейнер <div id="gantt_here"> для чарта.

Особенности и режимы¶

Поддерживались два режима:
Реальные даты (основной, рабочий)
Абстрактные дни ("День 1", "День 2" — отключён из-за сложности)
Для режима "День N" вычисление дат происходило на фронте (js), для реальных дат — на бэке.
Генерация links по prev для отображения зависимостей.

3. Проблемы и ограничения¶

Функционал отключён из-за проблем с UX, багов в отображении, сложностей с поддержкой и тестированием.
Основные сложности:
dhtmlxGantt не отображает задачи без корректных дат
Проблемы с parent/prev (циклы, некорректные связи)
Стили контейнера (ширина 0, display: none)
Тесты Playwright не всегда видят DOM-элементы задач
Сложности с режимом "День N" (виртуальные даты)

4. TODO для будущей доработки¶

Для возврата чарта:
Раскомментировать методы и property в admin.py
Проверить актуальность js-логики (gantt_init.js)
Актуализировать функцию build_gantt_data_for_template
Проверить структуру данных (dates, parent, prev, links)
Убедиться, что media js/css реально подключаются
Протестировать в реальной админке и автотестах
Особое внимание:
Контейнер #gantt_here должен быть видимым и иметь ненулевую ширину/высоту
Все задачи должны иметь корректные даты и уникальные id
Проверить работу с разными режимами (реальные даты, "День N")
Следить за совместимостью с dhtmlxGantt (см. документацию)

5. История изменений¶

Изначально чарт инициализировался прямо в шаблоне через js.
Затем логика вынесена во внешний js-файл, создан универсальный виджет.
Добавлены режимы дат, вычисление дат на фронте.
Отключено из-за багов и проблем с поддержкой.

Ссылки и исходные файлы¶

src/planiqum/core/workflow/admin.py — интеграция чарта, методы, media
src/planiqum/core/workflow/utils.py — функция build_gantt_data_for_template
src/planiqum/core/static/core/js/gantt_init.js — логика инициализации чарта
Документация dhtmlxGantt

NB: Для возврата функционала — см. TODO выше и внимательно проверьте все зависимости и js-инициализацию.