Динамические вкладки

Работа вкладок в системе

📅 Задачи yougile

• 🟢 Выполнить полный рефакторинг функционала работы с вкладками ITR-471
• 🟢 Реализовать правую панель с историей вкладок ITR-1028

✏️ Общее описание

Вся информация в системе отображается через вкладки или модальные окна

🔎 Уточнить

🖊️ Общие особенности

• Навигация по вкладкам:

  • Вкладки структурированы по группам, соответствующим пунктам в меню. При переключении между разделами меню вкладки, связанные с предыдущим пунктом, закрываются, а вкладки нового пункта становятся видимыми.
  • История переходов внутри групп вкладок сохраняется: при закрытии текущей вкладки автоматически активируется предыдущая в той же группе. Если такой нет, происходит возврат к главной странице.
  • В истории отображается единственный экземпляр каждой вкладки — при повторном открытии уже существующей, вкладка поднимается на верх списка.
  • Навигация между вкладками с помощью кнопок браузера "вперёд" и "назад" работает не с первого раза. Если при переходе открывается вкладка, которая была закрыта, она автоматически восстанавливается.
  • При переключении на другой пункт меню автоматически активируется последняя открытая вкладка в нем. Повторный клик по текущему меню открывает основную таблицу (логика по умолчанию. Можно изменить, чтобы всегда открывалась основная таблица).
  • После создания новой сущности предусмотрено перенаправление на её редактирование (если создание происходит через вкладку, а не модальное окно).

• Восстановление состояния:

  • Вкладки и текущая страница сохраняются:
    • при закрытии и повторном открытии браузера;
    • при обновлении страницы (F5);
    • при выходе и повторном входе под тем же пользователем;
    • при редиректе на страницу логина из-за недействительного токена (если пользователь возвращается под тем же аккаунтом).

• Удаление вкладок:

  • Вкладки удаляются:
    • при смене пользователя;
    • при сбросе настроек пользователя (функционал пока не реализован);
    • если вкладка перестала быть актуальной (например, URL в процессе разработки изменился или стал недоступен).
    • если из таблицы удалить сущность, а в открытых вкладках осуществляется просмотр или редактирование этой сущности, то соответствующая вкладка автоматически закрывается

• Сохранение параметров:

  • Вкладки хранят URL-параметры (например, taskId) и восстанавливают их при открытии, избегая дубликатов при повторном открытии одной и той же сущности.
  • Также помнят последнюю открытую вкладку слева (например, при переключении между контрагентами), чтобы быстро переключаться и попадать на соответствующие вкладки с договорами.

• Названия вкладок:

  • Вкладки с основной таблицей обычно имеют имя, совпадающее с пунктом меню, но могут отличаться для более компактного отображения (например, меню — «Склад», вкладка — «Складские учётные единицы»).
  • Для просмотра и редактирования название соответствует имени самой сущности (например, «Гидромотор МГП-200»).
  • Для добавления новых элементов название имеет формат «Добавление (название сущности)» (например, «Добавление контрагента»).

• Логика при закрытии активной вкладки:

  • по умолчанию:
    • происходит переключение на предыдущую вкладку
    • если история вкладок пуста, происходит переход на главную страницу
  • альтервнативный вариант:
    • если в текущей группе остались другие вкладки, происходит переключение на предыдущую вкладку в этой же группе.
    • если закрывается последняя вкладка в группе, переключение происходит на последнюю вкладку в предыдущей группе.
    • если история вкладок пуста, происходит переход на главную страницу.

💻 Веб интерфейс

Справа от вкладок есть две кнопки - вернуться на прошлую вкладку и показать все открытые вкладки

Доступна панель справа, показывающая все открытые вкладки во всех группах. Из этой панели можно перейти на нужную вкладку или закрыть вкладки.

При нажатии на кнопку показывается панель со всеми вкладками и возможностью закрыть любую вкладку, любую группу вкладок или все вкладки