Верстка сайта для секс-шопа «Eros»
Задача
Разработать сайт по готовому дизайн-макету.
Страницы
Проверка при заказе товара
Не буду вставлять участки кода, вам это будет вряд ли интересно.
Ближе к делу
В детальной карточке товара, в некоторых товарах присутствует возможность выбрать цвет и размер товара. Размеры появляются только тогда, когда выбран цвет, они подбираются из базы данных в зависимости от цвета.
Изначально, у меня была проверка на выбранный цвет и размер. Без этого нельзя было купить товар. При нажатии на купить без выбранного размера или цвета, показывалось сообщение «Выберите цвет или размер».
Товары разные, в некоторых были только цвета, в других были только размеры. Формулировка «Выберите цвет или размер» не очень-то подходила.
На тот момент я сделал так, потому что были задачи важнее, я запомнил недочет и собирался вернуться и все поправить.
Уведомление об отсутствии товара на складе.
От заказчика поступила задача, при увеличении количества товара, если такого количества нет, показывать пользователю уведомление об этом.
Мои коллеги вывели для меня на странице оставшееся количество товара, которое я смог использовать и показывать уведомление.
Проверка на цвет и размер
Первая задача решена. Но осталось недоработка с подсказками для цвета и размера.
Дело в том, что помимо подсказки отдельно про цвет и размер, нужно было запретить пользователю выбирать количество, если не выбран цвет или размер. Иначе как я буду проверять остаток на складе?
Итак, я отключил возможность увеличивать или уменьшать количество товара. Вместо этого я подсказываю пользователю, что ему нужно делать, чтобы выбрать количество и купить товар.
Цвет не выбран, нажали на количество или кнопку «Купить» — уведомление «Выберите цвет».
Цвет выбран, нажали на количество или кнопку «Купить» — уведомление «Выберите размер».
Иногда запросы в базу данные на размер бывают долгими, и цвета не появляются по 5 секунд. Что пользователь подумает об этом? — «Сайт не работает». Не порядок.
Я сделал еще одну проверку и если размеры еще не загрузились, показываю уведомление о том, что размеры загружаются, подождите немного.
Супер! Теперь пользователь будет знать что сайт работает, а сайт ищет в базе данных размеры по этому цвету.
Если же все поля были выбраны верно, то есть и цвет и размер — товар успешно попадает в корзину.
