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

Обдумывая эту задачу, я разбил ее на две подзадачи: первая — вывод всплывающего окна и вторая, собственно, отправка письма. Для решения первой подзадачи я решил использовать стандартную для Опенкарта библиотеку колорбокс. Для решения второй подзадачи я определил для себя два возможных варианта решения: во-первых, сделать собственную отправку писем, либо использовать встроенную в опенкарт отправку. Для того, что бы не искать себе дополнительные проблемы в виде верстке письма я решил остановиться на втором варианте.

Перед началом работы я решил накидать для себя план работы:

  1. Вывести кнопку
  2. Написать обработчик клика по кнопке, который будет выводить всплывающее окно
  3. Сверстать окно
  4. Обработать кнопку подтверждения заказа
    1. Добавить товар в корзину
    2. Оформить заказ
    3. Подтвердить заказ
    4. При успешном оформлении заказа пойдет письмо администратору о заказе.
  5. Закрыть окно
  6. Вывести сообщение об удачном заказе

Итак, приступим-с…

Модуль я делал на стандартном Опенкарте, поэтому со стилями я особо не заморачивался. После кнопки в корзину в файле catalog/view/theme/*/template/product/product.tpl (* я обозначил название темы) я поставил следующее:

Выглядит это приблизительно так:

1

Первый инпут это собственно кнопка «быстрый заказ», второй инпут – скрытый в который записывается ид товара. Позже я опишу, для чего я так сделал. Для того, что бы выводить кнопку на странице категорий необходимо в шаблоне категорий добавить тот же код и не забыть в контроллере подключить колоробокс.

Теперь настало время для всплывающего окна. Для этой цели, как уже было сказано ранее, я использовал библиотеку Колорбокс. Что бы в заказе был товар надо сначала его добавить в корзину, поэтому я взял стандартную функцию добавления товара в корзину и в success ajax запроса вместо вывода сообщения о добавлении товара в корзину я поставил вызов всплывающего окна. Этот код я вставил в catalog/view/theme/*/template/common/footer.tpl перед закрывающим тегом бади, получилось следующее:

Немного поясню этот код. Для начала, из вышеупомянутого скрытого инпута я взял id товара, передал его ajax-ом в функцию добавления товара в корзину. Если у товара есть обязательные опции и этот код вызывается со страницы категорий или из модуля, то переадресовываем на страницу товара, если вызываем со страницы товара, то нам показывает поля, обязательные для заполнения, в случае же успешного добавления товара в корзину открывается всплывающее окно.

Для контролера я взял стандартный котроллер checkout/guest.php и переделал его под свои цели. Первая функция index(), которая, собственно говоря, и формирует окно с заказом. Там все просто – 3 текстовые переменные, сумма заказа и состав заказа, а так же подключаем наш шаблон:

Теперь, когда контроллер готов можно приступить к работе над шаблоном. Тут все просто – заголовок, таблица с полями для ввода данных, вывод состава заказа и суммы заказа, а так же кнопка подтверждения заказа. Вот что получилось:

2

Осталось самое главное, а именно обработать кнопку купить. Для начала необходимо проверить поля. Для этого я взял функцию validate() контроллера checkout/guest.php и оставил в ней только проверку данных, необходимых нам для подтверждения заказа. После проверки данных создается сессия guest, в которую записывается имя, телефон, а так же создаются сессии оплаты и доставки (для доставки я использовал модуль flat, для оплаты – cod) и еще добавил комментарий «быстрый заказ» (что бы администратор понял, что это за заказ). Для оплаты пришлось немного переделать модель payment/cod.php. Там все просто в функцию getMethod() добавляем один аргумент $quick_order = false и ставим проверку

Далее в else ставим весь стандартный код этой функции до $method_data = array(). Теперь осталось в функции validate() контроллера checkout/guest.php при вызове getMethod() добавить наш параметр true.

Так вот, подтверждение заказа. Получаем значение полей имя и телефон и передаем их ajax ом в выше описанную функцию validate(). Если поля заполнены не корректно, то указываем пользователю, какое из полей заполнено не верно. Если все нормально, то отправляем следующий запрос к контроллеру checkout/confirm.php, в котором и проверяются сессии с данными о пользователе, оплате и т.д. (созданные в validate() контроллера checkout/guest.php). При желании можно немного переделать и контроллер checkout/confirm.php. Так как я из функции validate() убрал ненужные сессии, то в checkout/confirm.php будут вылазить нотайсы, говорящие о неизвестных переменных. Но у меня такого желания не возникло, ведь все работает, а нотайсы эти клиент не видит. Так вот, далее запрос на payment/cod/confirm (способ оплаты), данный контроллер так же нужно отредактировать для наших целей. Когда мы его вызываем ajax-ом добавляем данные “quick_order=true”. В контроллере проверяем, если есть гет quick_order, то в вызов $this->model_checkout_order->confirm добавляем еще три аргумента », false, false (пустая строка и два фалса). Это нам нужно для того, что бы в модели checkout/order.php в функции confirm() не отправлять при быстром заказе письмо покупателю (потому что мы не брали у него мэйл). Теперь в этой функции добавляем аргумент $quick_order = true. Дале отправку письма клиенту добавляем if:

Теперь отправляем последний запрос на checkout/success.php (там чистится корзина и сессии заказа), закрываем окно и в div “notification” записываем сообщение о том, что заказ успешно принят.

Вот в принципе, я описал весь ход выполнения поставленной задачи. Хочу добавить только то, что после окончания работы я решил собрать все это в модуль. Что бы не перезаписывать стандартные файлы опенкарт на мои с изменениями я использовал vqmod. Установить модуль просто:

  1. если не установлен vqmod, установить его
  2. залить файл в корень сайта.

Ну а те, кто не желает устанавливать vqmod могут действовать по изложенной выше инструкции.

Summary
Author Rating
1star1star1star1star1star
Aggregate Rating
5 based on 1 votes
Brand Name
Panda Code
Product Name
Модуль
Price
RUB 200
Product Availability
Available in Stock