Часть четвертая – пользовательская часть.

Начнем с контроллера. Что он должен делать?

class ControllerModuleComments extends Controller { 
private $error = array(); // объявляем переменную - массив с возможными ошибками
public function index() {

Стандартное объявление класса модуля коментариев. Можно просто скопировать из админской части, название должно быть такое же.

Далее не подгружаем языковой файл и нужными нам текстами и не суем их в массив $data. Потому что нет у нам в модуле никаких стандартных фраз =) А мог бы быть к примеру заголовок или кнопка “править” для админа или заголовкие какие нибудь.

Получение коментов:

$data['commets'] = array();
$this->load->model('module/comments');
$data['comments'] = $this->model_module_comments->getAll();

Создаем массив с коментами, подгружаем модель (функция getAll такая же, как в админке. Страниц нету, выгружаются все коменты сразу – таково задание. Да и вообще, в этом случае взят просто файл из админки) и записываем коменты в $data.

Далее нам нужно коменты не просто вывести списком, а вывести их каруселью. Для этого возьмем любой плагин карусели – мне нравится owl slider.

По инструкции к плагину нам нужно подключить 2 css файла и 1 js. Помним, что jquery у нас уже загружен, но в другой ситуации его могло и не быть.

$this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.carousel.css');
$this->document->addStyle('catalog/view/javascript/jquery/owl-carousel/owl.transitions.css');
$this->document->addScript('catalog/view/javascript/jquery/owl-carousel/owl.carousel.min.js');

В принципе – это все, что должен делать наш контроллер, никакой обработки нету, тfк как она уже сделана из админки. Передаем на отрисовку:

if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/module/comments.tpl')) {
return $this->load->view($this->config->get('config_template') . '/template/module/comments.tpl', $data);
} else {
return $this->load->view('default/template/module/comments.tpl', $data);
}

Далее движок начинает смотреть как же отрисовать модуль и обращается к .tpl файлу.

 

 

 

“Пока есть коменты, согласно инструкции к слайдеру наполняем слайды карусели”.

<script>
$(document).ready(function() {
 
$("#carousel-comment").owlCarousel({
items: 2,
autoPlay: 1000,
navigation: true,
navigationText: ['<i class="fa fa-chevron-left fa-5x"></i>', '<i class="fa fa-chevron-right fa-5x"></i>'],
pagination: false,
transitionStyle: 'fade'
});
});
</script>

И, согласно той же инструкции подключаем js для этого слайдера.

Стоит заметить, что для модуля не подключен отдельный css файл. В конкретном случае модуль писался “на 1 раз” – и было принято решение стили прописать в основном css. Но в контроллере можно так же, как и файлы слайдера подключить кастомный css, можно написать в style в .tpl шаблоне или хардкорно – инлайн стилями (желательно так не делать =))

На этом все, рассмотрены все шаги по созданию модуля для opencart2, если насобирается вопросов в коментариях на еще одну статью – выйдет еще одна часть с ответами.

Предыдущие части:
Как написать модуль OpenCart (Часть 1)
Как написать модуль OpenCart (Часть 2)
Как написать модуль OpenCart (Часть 3)

Архив с модулем:
comments.rar