Структура приложения:
- На главной странице левостороннее меню. Центральная "рабочая" область и кнопка Оплатить
- Меню "ростет в низ " по количеству залов в кинотеатре
- При навигации на зал в центральной части открывается таблица со списком мест. Данные подтягиваются через простой запрос Ajax (чтобы не возиться с CORS) 3.5. Экран рефрешится с интервалом в 1 минуту (Пользовательский выбор с местами сбрасывается, но подтягивает актуальную занятость мест в текущем зале)
- Места в зале представляют собой сетку таблицы с чекбоксами. Если место занято, то чекбокс недоступен для выбора
- При нажатии на кнопку Оплатить через js собираются все "чекнутые" места и открывается модальное окно для ввода ФИО, телефона и данными по оплате (кол-во купленых билетов и сумма).
- Сумма задана хардкодом.
- По нажатию на Оплату данные передаются в сервлет: Пользователь добавляется в БД. Купленные места обновляются в БД.
- Далее идет возврат на первоначальную страницу
p.s.: Изначальное задание предполагало отдельный экран для отображения списка мест. В этом случае обновление можно было бы сделать не через setTimeout, а через html свойства страницы За один раз можно было купить только один билет (что на самом деле неочень удобно, но по другому options не работает.) В итоге заменил его на кучу чекбоксов, которые собираю через js селекторы и обрабатываю.
p.p.s: фронт требует доработки напильником, но на основной функционал это не влияет