Бронирование кулинарных мастер-классов

Table Stories

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

Технология
  • Nuxt
  • Vue
  • TypeScript
  • Nuxt UI

Задача

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

Как устроен сценарий

  1. Найти подходящее занятие

    В каталоге можно выбрать формат и тему, а затем сравнить длительность, сложность, даты и цену.

  2. Изучить мастер-класс

    До бронирования видны программа, ведущий, площадка, включённые материалы, доступные даты и время.

  3. Выбрать дату и условия

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

  4. Отправить заявку

    Если число свободных мест изменилось или сервис временно недоступен, форма сохраняет введённые данные и позволяет повторить отправку.

Сложные состояния

  • Число участников зависит от даты

    Допустимое число участников рассчитывается по оставшимся местам на выбранную дату, а не задаётся одним пределом для всего каталога.

  • Изменение свободных мест не обрывает заявку

    Если после выбора доступность изменилась, форма объясняет причину, сохраняет остальные ответы и предлагает следующее допустимое действие.