OpenCart. Выгрузка заказов в Excel. Часть 2

18 Мар 2023г. в 15:45

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



Теперь в этом же файле — admin\view\template\sale\order_list.tpl – напишем несложны скрипт, который будет получать введенные даты и отправлять их асинхронно. Скрипт поместим внизу файла, там, где находится прочий JS-код.

$('#button-export').on('click', function(){
var wfm_start_date = $("input[name='wfm_start_date']").val(),
wfm_end_date = $("input[name='wfm_end_date']").val(),
url = 'index.php?route=sale/order/wfm_export&token=<?php echo $token; ?>';

$.ajax({
url: url,
data: {wfm_start_date: wfm_start_date, wfm_end_date: wfm_end_date},
type: 'GET',
beforeSend: function(){
$('.preloader').fadeIn(300);
},
success: function(res) {
$('.preloader').delay(500).fadeOut('slow', function(){
$('.wfm-result').empty().html('<div class="alert alert-info" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>' + res + '</div>');
});
},
error: function () {
alert('Error!');
}
});
});

$('#button-export').on('click', function(){
var wfm_start_date = $("input[name='wfm_start_date']").val(),
wfm_end_date = $("input[name='wfm_end_date']").val(),
url = 'index.php?route=sale/order/wfm_export&token=<?php echo $token; ?>';

$.ajax({
url: url,
data: {wfm_start_date: wfm_start_date, wfm_end_date: wfm_end_date},
type: 'GET',
beforeSend: function(){
$('.preloader').fadeIn(300);
},
success: function(res) {
$('.preloader').delay(500).fadeOut('slow', function(){
$('.wfm-result').empty().html('<div class="alert alert-info" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>' + res + '</div>');
});
},
error: function () {
alert('Error!');
}
});
});
Немного прокомментируем данный скрипт. Вначале мы формируем три переменных:

wfm_start_date – начальная дата

wfm_end_date – конечная дата

url – адрес, на который отправится запрос.

Обратим внимание на адрес — index.php?route=sale/order/wfm_export&token=. Запрос будет отправлен в контроллер ControllerSaleOrder и, среди прочих, мы отправляем параметр token. Этот параметр необходим для проверки безопасности, чтобы запрос обрабатывался только от администратора.

Далее формируется сам запрос методом ajax. Здесь в свойстве data отправляются даты. В свойстве beforeSend включается прелоадер, который мы добавим чуть позже. Свойство success принимает ответ с сервера и выводит его в блок с классом wfm-result. Ну и свойство error сработает, если запрос на сервер не дойдет и вернет ошибку.

Теперь добавим перед формой с полями добавим прелоадер и немного стилей для него:

<style>
.preloader {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
background-color: #fefefe;
opacity: .7;
display: none;
}
.preloader img {
position: relative;
left: 50%;
top: 50vh;
margin: -100px 0 0 -100px;
}
</style>
<div class="preloader"><img src="/wfm_export_orders/ring.svg " alt=""></div>

<style>
.preloader {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
background-color: #fefefe;
opacity: .7;
display: none;
}
.preloader img {
position: relative;
left: 50%;
top: 50vh;
margin: -100px 0 0 -100px;
}
</style>
<div class="preloader"><img src="/wfm_export_orders/ring.svg " alt=""></div>
Осталось протестировать запрос. Для этого откроем контроллер ControllerSaleOrder, который находится по пути admin\controller\sale\order.php, и добавим в него экшен, принимающий запрос, с простейшим кодом, который просто покажет данные запроса. Эти данные мы должны увидеть в качестве ответа на ajax-запрос.

В итоге мы должны увидеть примерно такой результат:

Как видим, запрос отправляется и ответ приходит. В момент отправки включается прелоадер, который выключается после получения ответа на запрос. Отлично! На этом пока что остановимся. В следующей статье мы напишем обработчик запроса, который на основе принятого диапазона дат сформирует файл Excel с выгрузкой товаров.