Как добавить JavaScript в back-office (админку) PrestaShop с помощью модуля?

Question

Как правильно добавить JavaScript в back-office (админку) PrestaShop с помощью модуля?

Answer 1

В большинстве случаев для этого нужно использовать хук actionAdminControllerSetMedia(). Пошаговая инструкция:

1) Зарегистрировать хук при инсталляции модуля.

public function install()
{
    if (!parent::install()) {
        return false;
    }

    // Регистрируем хук после установки модуля
    if (!$this->registerHook('actionAdminControllerSetMedia')) {
        return false;
    }

    return true;
}

2) Теперь добавляем JavaScript файл.

public function hookActionAdminControllerSetMedia()
{
    // Подключает jQuery и его некоторые зависимости, нужные для PrestaShop
    $this->context->controller->addJquery();

    // Подключает ваш JavaScript
    $this->context->controller->addJS($this->_path . 'views/js/example.js');
}

Есть несколько способов и методов, которые могут быть использованы для регистрации ресурсов (файлов JavaScript и CSS) в back-office (админке). Методы (перечислены в порядке их запуска):

1. Хук hookDisplayBackOfficeHeader()
2. Метод контроллера AdminControllerCore::setMedia()
3. Хук actionAdminControllerSetMedia()
4. Метод модуля Module::getContent()
5. Хук hookDisplayBackOfficeFooter()

Лучший способ добавить inline-код - это использовать хук hookDisplayBackOfficeFooter(). Например:

public function hookDisplayBackOfficeFooter()
{
    return '
        <script type="text/javascript">
            var EXAMPLE_VARIABLE = "Привет, Zapalm!";
        </script>
    ';
}

Еще один пример для случая, когда вам нужно добавить ресурс JavaScript, но в дочернем классе AdminController вашего модуля (для PrestaShop 1.7):

public function setMedia($isNewTheme = false)
{
    parent::setMedia($isNewTheme);

    $this->addCSS(_MODULE_DIR_ . $this->module->name . '/views/css/example.css');
    $this->addJS(_MODULE_DIR_ . $this->module->name . '/views/js/example.js');
}

Для PrestaShop 1.6 и 1.5 вы можете сделать так же, как в этом примере, но вам необходимо удалить параметр $isNewTheme из определения метода и вызова родительского метода.

Дополнительная информация:

1. Документация на английском языке по теме: Asset management in PrestaShop 1.7.