- Создан модуль calendarEventDragDrop.js с классами DragDropState и CalendarUtils
- Реализовано перетаскивание событий между календарями через модальное окно
- Добавлена кнопка 'Переместить все' для массового перемещения
- Модальное окно отображает источник и цель перемещения
- Поддержка legacy-календарей (company/department/personal)
- Добавлены стили для подсветки drop-target (папки и календари)
- Backend: исправлена обработка null значений в serializer
- Backend: добавлен endpoint list_raw для получения немодерируемых событий
- Использованы стандартные Bootstrap стили для модалов
- Исправлено всплытие событий dragover/drop (stopPropagation)
- Эмодзи иконки для типов календарей (����)
- Toast уведомления об успехе/ошибках перемещения
Проблема:
- Левая граница (корешок) событий была белой
- Не отображался цвет календаря
- border-left устанавливался без цвета в SCSS
Решение:
1. calendarWidget.js - eventDidMount:
- Вернул установку полного border-left через JS
- С цветом календаря: border-left: 4px solid <calendarColor>
- Без цвета календаря: border-left: 3px solid <eventColor>
2. _calendar-events.scss:
- Оставил только padding-left (не конфликтует с JS)
- Добавил комментарии что border-left устанавливается через JS
Результат:
✅ Корешок показывает цвет календаря (4px)
✅ Для legacy календарей - цвет события (3px)
✅ Двухцветная схема работает корректно
✅ SCSS не перезаписывает JS стили
Пример:
- Календарь отдела (красный) + событие (синее) = красный корешок + синий фон
- Legacy календарь + событие (синее) = синий корешок + синий фон
Проблемы:
- Многодневные события неправильно растягивались
- Инлайн-стили JS перезаписывали SCSS правила
- Не было четкой визуализации начала/конца/середины события
Решение:
1. Обновлён eventDidMount в calendarWidget.js:
- Убраны инлайн-стили для border-radius, padding, box-shadow
- Добавлен атрибут data-has-calendar-color для SCSS селекторов
- Упрощена логика - доверяем SCSS стилям
- Определение многодневных событий через info.isStart/isEnd
2. Улучшены SCSS стили в _calendar-events.scss:
- Добавлен width: 100% для растягивания на всю ячейку
- Раздельные border-radius для start/middle/end сегментов
- Улучшены визуальные индикаторы (‹ › с цветом)
- Явные правила для всех комбинаций fc-event-start/end
Результаты:
✅ Многодневные события корректно растягиваются
✅ Четкая визуализация начала (левый радиус) и конца (правый радиус)
✅ Средние дни без закруглений (seamless переход)
✅ Индикаторы продолжения (‹ ›) белого цвета
✅ Совместимость с двухцветной схемой (календарь + событие)
Изменения:
- 2 files changed, 48 insertions(+), 51 deletions(-)
- Компилирован app.css
Проблема:
- Многодневные события отображались странно
- Не было визуальной связи между сегментами
- Закругления и отступы были некорректными
Решение:
1. Визуальные индикаторы продолжения
- Первый день: стрелка › справа
- Средние дни: стрелки ‹ › с обеих сторон
- Последний день: стрелка ‹ слева
- Цвет стрелок: белый с opacity 0.7
2. Правильные закругления углов
- Первый день: слева закруглено, справа прямо
- Средние дни: без закруглений
- Последний день: слева прямо, справа закруглено
- Один день: закруглено со всех сторон
3. Убраны лишние отступы
- margin-left/right: 0 для соединённых сегментов
- Увеличен padding для стрелок (+2px)
- Высота увеличена до 22px для читаемости
4. Улучшенное позиционирование
- Многодневные события в отдельном слое (z-index: 2)
- Абсолютное позиционирование для пересечений
- Правильные отступы между сегментами
Результат:
✅ Многодневные события визуально связаны
✅ Понятно где начало/середина/конец
✅ Стрелки указывают направление
✅ Сегменты плотно соединены
✅ Улучшенная читаемость
Реализовано:
1. Множественный выбор календарей через чекбоксы
- Заменил <select> на чекбоксы для выбора нескольких календарей
- События создаются одновременно во всех выбранных календарях
- При редактировании - обновляется только первый выбранный
- Цветовые индикаторы для каждого календаря
2. Современный дизайн событий
- Двухцветная схема: левая граница = цвет календаря, фон = цвет события
- Полупрозрачный фон события (80%) для лучшей видимости
- Тени и hover эффекты для объёма
- Закругленные углы (4px)
- Плавные анимации (transform + transition)
3. Улучшенное отображение накладывающихся событий
- dayMaxEvents: автоматически показывать '+N еще'
- dayMaxEventRows: 4 - максимум 4 строки на день
- moreLinkClick: 'popover' - красивый popover для остальных
- eventMaxStack: 3 - до 3 событий в стеке
- eventOrder: сортировка по началу, длительности, алфавиту
4. Новый CSS файл calendar-improvements.css
- Современные стили для FullCalendar
- Улучшенный popover с градиентом
- Стили для выходных дней (розоватый фон)
- Hover эффекты на события
- Анимация fadeInEvent при загрузке
- Улучшенная читаемость текущего дня
- Адаптивность для мобильных устройств
- Кастомные scrollbar для списков
5. Передача цвета календаря в события
- calendar_color добавляется в extendedProps
- Используется __calendar из интеграции
- Отдельная обработка eventColor и calendarColor
6. Визуальные улучшения
- Текст события: font-weight 500, line-height 1.3
- Отступы: paddingLeft 6px (с цветом календаря)
- Тень текста для читаемости на любом фоне
- Паттерн для ежегодных событий (диагональные полосы)
- Индикатор текущего дня: синий круг с белым текстом
Результат:
✅ События визуально различимы по календарям (левая граница)
✅ Сохранён индивидуальный цвет события (основной фон)
✅ Множество событий в день отображается компактно (+N еще)
✅ Современный Material Design стиль
✅ Плавные анимации и hover эффекты
✅ Улучшенная читаемость и UX
- Добавлено поле Employee.username для кэширования LDAP логина
- API endpoint обновлен: поддержка кэша и force_refresh параметра
- Новый дизайн: убран blur, добавлена иконка обновления
- Автоматическая загрузка при инициализации (из кэша или LDAP)
- Визуальная индикация источника данных (cached/fresh)
- Доступно всем пользователям без ограничений
- Использована встроенная система пермишенов DRF вместо ручной проверки
- Добавлен ldap_info в required_perms_by_action с правом view_ldap_info
- Добавлен ldap_info в get_permissions() для применения IsSelfOrStaff
- Удалена избыточная ручная проверка прав внутри метода ldap_info()
- Проверка прав теперь выполняется автоматически через get_object()
- Пользователь может видеть свой LDAP логин (IsSelfOrStaff)
- Админы и пользователи с view_ldap_info могут видеть любые логины
- Добавлено поле с LDAP логином (sAMAccountName) в профиле сотрудника
- Реализован blur-эффект с раскрытием по клику для безопасности
- Создан API endpoint /api/v1/employees/{id}/ldap-info/ для получения LDAP данных
- Добавлен новый пермишен employees.view_ldap_info
- Стили: SCSS компонент _ldap-login.scss с анимациями и состояниями
- JavaScript: класс LdapLoginField с AJAX запросами и обработкой ошибок
- Доступ только для staff или пользователей с правом view_ldap_info
- Данные запрашиваются из Active Directory on-demand (не хранятся в БД)
- Исправлен PollSerializer для создания опросов с опциями
- Добавлено поле read_only_fields для корректной валидации
- Реализована отправка WebSocket уведомлений при создании опроса
- Исправлен импорт serialize_message из communications.serialization
- Добавлен обработчик poll_update в UserConsumer для WebSocket событий
- Исправлен эндпоинт /results/ для возврата user_voted_option_ids
- Добавлено поле voters в PollOptionSerializer для списка проголосовавших
- Реализована инициализация poll виджетов после рендера сообщений
- Добавлено игнорирование poll_update в notification-manager
- Исправлены стили для request list badges (height, word-break, flex)
- Восстановлены стили team-wheel (.wheel-focus, .scroll-arc) из git истории
- Реализовано отображение forwarded message info в messageRendererV2
- Множественные улучшения UI и UX для опросов
Fixes: создание опросов, голосование, отображение результатов, список проголосовавших
Проблема:
- У медиафайлов были большие пустые поля сверху и снизу
- Причины: padding/margin от .attachment-item и .bubble .attachment-item a
- inline стили конфликтовали с CSS
Решение:
CSS (_chat-detail.scss):
- Добавлен модификатор .attachment-item--media для медиа-контейнеров
- .attachment-item--media имеет margin-bottom: 0 (вместо 8px)
- Вложенные <a> в медиа-контейнерах: padding: 0, line-height: 0
- .chat-media: display: block (было inline-block), vertical-align: top
- Селектор для файлов: .attachment-item:not(.attachment-item--media)
JavaScript (messageRendererV2.js):
- Добавлен класс attachment-item--media к изображениям и видео
- Убраны inline стили (style="display: block; ...")
- Чистая разметка без конфликтов
Результат: медиафайлы отображаются плотно без пустых полей
Проблема:
- Аватары деформировались из-за object-fit на контейнере
- Аватары выравнивались по верху сообщения вместо низа
- Неконсистентная HTML структура: <img class="mini-ava"> vs <div class="mini-ava"><i></i></div>
Решение:
SCSS (_common.scss):
- object-fit: cover перемещен с контейнера на вложенный img
- Добавлен display: block для img элементов
SCSS (_chat-detail.scss):
- Добавлен align-items: flex-end к .d-flex.msg для выравнивания по низу
- .mini-ava рефакторинг: display: flex (было grid), border-radius: 50% (было 9999px)
- Добавлен background и border для контейнера
- Добавлен font-size: 20px для fallback иконки
- object-fit остается только на img тегах
JavaScript (messageRendererV2.js):
- Всегда создавать <div class="mini-ava"> как контейнер
- Вложенный <img> или <i class="bi bi-person-circle"> внутри
- Устранена несогласованность разметки
Рефакторинг архитектуры SCSS (бонус):
- Создан Design System: abstracts/_variables.scss (200+ токенов)
- Создано abstracts/_mixins.scss (40+ миксинов)
- Реорганизована файловая структура: layout/, components/, components/chat/
- Централизованы стили аватаров в _common.scss
- Устранены дубликаты (avatar определялся в 3 файлах)
- Применены design tokens к navbar, page-header
- Создана документация: SCSS_NAMING_CONVENTIONS.md
- Удалено 9 дублирующихся CSS файлов
Компиляция: 280KB, 0 ошибок, production ready
КРИТИЧЕСКИЕ ИСПРАВЛЕНИЯ CSS:
- Добавлен flex-wrap: nowrap в .message-field (запрет переноса)
- Добавлен min-width: 0 в .message-input (позволяет сжиматься)
- Удален flex-wrap: wrap из mobile media query
- Улучшены mobile стили: меньшие отступы и размеры кнопок
- Поле ввода теперь корректно сжимается на мобильных
- Кнопки смайлика и отправки остаются на месте
ВЛИЯНИЕ:
- Модальное окно постов
- Чаты (messenger)
- Все формы комментариев
- Все места с .message-field компонентом
ОТКЛЮЧЕН DEBUG в postDetailModal.js
- Комментарии автора поста отображаются справа без бейджа
- Форма ввода комментариев теперь не накладывается на список (position: relative вместо sticky)
- Исправлена автоматическая прокрутка к низу комментариев при открытии модала (requestAnimationFrame)
- Блок комментариев использует flex-layout для правильного размещения
- Секция комментариев имеет min-height: 300px и max-height: 65vh
- Добавлена граница сверху формы ввода для визуального разделения
- Добавлен класс comment-item--own для комментариев текущего пользователя
- Комментарии автора выравниваются по правому краю
- Добавлен стиль с фоном primary для комментариев автора
- Комментарии других пользователей остаются слева с серым фоном
- Максимальная ширина комментариев 70% для лучшей читаемости
- Заменен лишний div.container на стандартный container для единообразия
- Заменен класс .card на .ios-card в секции активности для устранения конфликтов стилей
- Добавлен card-list.css в base.html для корректного отображения карточек новостей
- Добавлены CSS правила для правильного поведения .row и колонок в grid-layout
- Исправлена проблема с выходом календаря за границы страницы
- Убраны видимые скроллбары у modal-body и modal-content для чистого UI
