Tasks

Tasks (Задачи)

Вкладка Задачи предоставляет два режима отображения: Kanban-доску с drag-and-drop и Gantt-диаграмму (Дорожная карта) для визуализации сроков. Переключение между режимами — кнопка-переключатель в заголовке (Доска / Дорожная карта).

Статусы задач

Статус	Описание	Цвет
Draft (Черновик)	Новая задача, видна только автору	Серый
To Do (К выполнению)	Запланированная задача	Синий
In Progress (В работе)	Задача в процессе выполнения	Жёлтый
Review (На проверке)	Задача на проверке	Фиолетовый
Done (Готово)	Завершённая задача	Зелёный

Kanban-доска

Колонки

Доска отображает 5 колонок, по одной на каждый статус. Задачи внутри колонки отсортированы по полю position.

Карточки задач

Каждая карточка отображает:

• Название — заголовок задачи (с обрезкой при переполнении)
• Иконка зависимости (🔗) — если задача заблокирована другими задачами
• Теги — максимум 2 тега + счётчик оставшихся (+N)
• Исполнитель — с иконкой пользователя
• Срок — дата дедлайна; выделяется красным, если просрочена
• Прогресс чеклиста — полоса прогресса X/Y (если есть пункты чеклиста)

Приватные задачи (черновики) отображаются с пунктирной рамкой.

Drag-and-drop

• Между колонками — перетаскивание карточки из одной колонки в другую меняет статус задачи
• Внутри колонки — изменяет порядок (позицию) задачи
• При перетаскивании из Draft в любой другой статус задача автоматически становится публичной
• В режиме гостя (guest) перетаскивание отключено

Изменяемая ширина колонок

• Между колонками находится ручка изменения размера (drag handle)
• Потяните влево/вправо для изменения ширины колонки
• Минимум: 180px, максимум: 600px, по умолчанию: 288px
• Ширина сохраняется в localStorage и восстанавливается при перезагрузке
• Кнопка «Сбросить ширину» возвращает все колонки к размеру по умолчанию

Сворачивание колонок

• Каждая колонка имеет кнопку сворачивания (◄) в заголовке
• В свёрнутом состоянии отображается: цветная точка статуса, количество задач и вертикальное название
• Клик по свёрнутой колонке разворачивает её
• Состояние сохраняется в localStorage

Прокрутка доски

• Горизонтальная прокрутка при большом количестве видимых колонок
• Drag-to-scroll: захватите пустое пространство доски и потяните для прокрутки

Кнопка «+ Новая задача»

Находится внизу колонки Draft. Открывает форму создания с полями:

• Название (обязательное)
• Описание (текстовое поле)
• Исполнитель
• Теги (через запятую)
• Дата начала / Срок

Новая задача всегда создаётся со статусом Draft и видна только автору до смены статуса.

Gantt-диаграмма (Дорожная карта)

Режим Roadmap отображает задачи на временной оси с помощью библиотеки frappe-gantt. Загружается лениво — чанк скачивается только при первом переключении.

Временные шкалы

Три режима масштабирования:

• День — детальное отображение по дням
• Неделя — основной режим (по умолчанию)
• Месяц — обзорный режим для долгосрочного планирования

Полосы задач

• Цвет полосы соответствует статусу задачи (серый/синий/жёлтый/фиолетовый/зелёный)
• Заполнение полосы отражает прогресс чеклиста (если есть пункты) или 100% для статуса Done
• Стрелки между полосами показывают зависимости (blockers)
• Клик по полосе открывает детали задачи (то же модальное окно, что и на доске)

Редактирование дат

• Перетащите край полосы для изменения даты начала или срока
• Изменения сохраняются через API (start_date, due_date)
• В режиме гостя (guest) перетаскивание отключено

Обработка дат

• Задачи без start_date используют created как начало
• Задачи без due_date получают диапазон +7 дней от начала
• Если due_date < start_date — срок выравнивается по дате начала
• Задачи без каких-либо дат не отображаются (показывается empty state)

Всплывающая подсказка

При наведении на полосу задачи отображается:

• Название задачи
• Период (дата начала — срок)
• Прогресс в процентах

Тёмная тема

Gantt-диаграмма полностью поддерживает все три темы приложения (Dark, Light, Night Eyes) через CSS-переменные --g-*.

Детали задачи

При клике на карточку открывается модальное окно с полной информацией:

Смена статуса

Выпадающий список для быстрой смены статуса. При переходе из Draft в любой другой статус задача автоматически становится публичной.

Чеклист

• Добавление пунктов чеклиста
• Отметка выполненных пунктов (checkbox)
• Удаление пунктов

Зависимости

Система зависимостей позволяет указать, какие задачи блокируют текущую:

• Добавление блокирующей задачи из выпадающего списка
• Удаление зависимости
• Защита от циклов — система автоматически проверяет, не создаст ли новая зависимость циклическую цепочку (DFS)

Удаление задачи

Кнопка удаления доступна только администраторам.

Права доступа

Действие	guest	user / web	admin
Просмотр задач	-	Свои + публичные	Все
Создание	-	+	+
Редактирование	-	Только свои	Все
Drag-and-drop	-	+	+
Удаление	-	-	+
Зависимости	-	+ (только публичные)	+

Видимость задач

• Admin видит все задачи
• User/Web видит свои задачи + чужие публичные (не-draft)
• Задачи со статусом Draft видны только автору и админам

Компоненты

Файл	Описание
views/KanbanView.vue	Корневой компонент: заголовок, переключатель вида, модальные окна
components/kanban/KanbanBoard.vue	Доска: 5 колонок, vuedraggable, resize, collapse, drag-to-scroll
components/kanban/KanbanRoadmap.vue	Gantt-диаграмма: frappe-gantt, переключение Day/Week/Month
components/kanban/KanbanCard.vue	Карточка задачи: title, tags, assignee, due date, checklist bar
components/kanban/KanbanCardDetail.vue	Модальное окно деталей задачи
components/kanban/KanbanTaskForm.vue	Форма создания/редактирования
components/kanban/KanbanStatusBadge.vue	Цветной бейдж статуса
stores/kanban.ts	Pinia store с tasksByStatus, ganttTasks
types/frappe-gantt.d.ts	TypeScript-декларации для frappe-gantt

База данных

Таблица kanban_tasks

Поле	Тип	Описание
id	INTEGER PK	Идентификатор
title	VARCHAR(500)	Заголовок
description	TEXT	Описание
status	VARCHAR(20)	Статус (draft/todo/in_progress/review/done)
is_private	BOOLEAN	Приватная задача
assignee	VARCHAR(100)	Исполнитель
created_by	VARCHAR(100)	Автор
start_date	VARCHAR(10)	Дата начала (YYYY-MM-DD)
due_date	VARCHAR(10)	Дедлайн (YYYY-MM-DD)
position	INTEGER	Позиция для сортировки внутри колонки
tags	TEXT	JSON-массив тегов
created	DATETIME	Дата создания
updated	DATETIME	Дата обновления

Таблица kanban_task_dependencies

Поле	Тип	Описание
blocker_id	INTEGER FK	Блокирующая задача
dependent_id	INTEGER FK	Зависимая задача

Композитный первичный ключ: (blocker_id, dependent_id). CASCADE при удалении.

Таблица kanban_checklist_items

Поле	Тип	Описание
id	INTEGER PK	Идентификатор
task_id	INTEGER FK	Задача
text	VARCHAR(500)	Текст пункта
is_done	BOOLEAN	Выполнен
position	INTEGER	Порядок

localStorage ключи

Ключ	Описание
kanban-column-widths	Сохранённые ширины колонок (JSON-объект)
kanban-collapsed	Массив свёрнутых статусов (JSON-массив)

API

См. полную документацию в API-Reference#kanban-задачи.

---

← CRM | Usage →