В Magento 1 для каждого shipping method есть возможность вывести дополнительный блок с информацией, которая может впоследствии понадобиться.
Можно выводить уведомление клиентам, к примеру "Доставка осуществляется по рабочим дням с 10:00 до 17:00"
Посмотрим, как это сделать.
Для начала создадим базу модуля, подключив его через composer к нашему магазину.
composer.json
{
"name": "vendor/module",
"type": "magento2-module",
"license": "proprietary",
"homepage": "http://www.example.ru/magento2-module.html",
"description": "Модуль доставки",
"keywords": [
"magento",
"module",
"delivery",
"vendor"
],
"authors": [
{
"name": "Vendor",
"email": "mail@example.net",
"homepage": "http://www.vendor.ru/"
}
],
"require": {
"php": "~5.5.0|~5.6.0|~7.0.0",
"magento/framework": "*"
},
"repositories": [
{
"type": "composer",
"url": "https://repo.magento.com"
}
],
"autoload": {
"files": [
"registration.php"
],
"psr-4": {
"Vendor\\Module\\": ""
}
}
}
registration.php
<?php \Magento\Framework\Component\ComponentRegistrar::register( \Magento\Framework\Component\ComponentRegistrar::Module, 'Vendor_Module', __DIR__ );
etc/module.xml
<?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"> <module name="Vendor_Module" setup_version="2.0.0"> </module> </config>
Для вставки блока в чекаут, нужно создать dependency injection (di). В Magento 2 DI открывает большие возможности по кастомизации функционала кода "не добавляя костыли".
etc/frontend/di.xml
<?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd"> <type name="Magento\Checkout\Model\CompositeConfigProvider"> <arguments> <argument name="configProviders" xsi:type="array"> <item name="checkout_module_shipping_block" xsi:type="object">Vendor\Module\Model\CheckoutConfigProvider</item> </argument> </arguments> </type> </config>
Следующим шагом добавим вывод блока в нужную секцию чекаута
view/frontend/layout/checkout_index_index.xml
<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <body> <referenceBlock name="checkout.root"> <arguments> <argument name="jsLayout" xsi:type="array"> <item name="components" xsi:type="array"> <item name="checkout" xsi:type="array"> <item name="children" xsi:type="array"> <item name="steps" xsi:type="array"> <item name="children" xsi:type="array"> <item name="shipping-step" xsi:type="array"> <item name="children" xsi:type="array"> <item name="shippingAddress" xsi:type="array"> <item name="children" xsi:type="array"> <item name="shippingAdditional" xsi:type="array"> <item name="component" xsi:type="string">uiComponent</item> <item name="displayArea" xsi:type="string">shippingAdditional</item> <item name="children" xsi:type="array"> <item name="module_block" xsi:type="array"> <item name="component" xsi:type="string">Vendor_Module/js/view/checkout/shipping/module-block</item> </item> </item> </item> </item> </item> </item> </item> </item> </item> </item> </item> </item> </argument> </arguments> </referenceBlock> </body> </page>
В Magento 2 весь frontend завязан на UI компонентах, которые можно расширять/подключать.
view/frontend/web/js/view/checkout/shipping/module-block.js
define([
'uiComponent'
], function (Component) {
'use strict';
var show_module_block = window.checkoutConfig.show_module_block;
return Component.extend({
defaults: {
template: 'Vendor_Module/checkout/shipping/module-block'
},
canVisibleBlock: show_module_block
});
});
Внесем информацию в шаблон нашего блока.
view/frontend/web/template/checkout/shipping/module-block.html
<div data-bind="visible: canVisibleBlock"> <h1> Additional Block check app/code/Magento/Checkout/view/frontend/web/template/shipping.html </h1> <input type="text"> </div> <br/>
В шаблоне можно заметить необычный параметр data-bind="visible: canVisibleBlock". Параметр visible позволяет динамически задавать условие видимости блока в чекауте. К примеру, если ваш модуль доставки выключен, то незачем показывать инфоблок.
Magento 2 позволяет динамически подключать конфигурационные параметры на frontend. Для этого создадим модель, которая будет отвечать за работу конфигурации.
Model/CheckoutConfigProvider.php
<?php namespace Vendor\Module\Model; use Magento\Checkout\Model\ConfigProviderInterface; class CheckoutConfigProvider implements ConfigProviderInterface { /** @var \Vendor\Module\Helper\Data */ protected $_helper; public function __construct( \Vendor\Module\Helper\Data $helper ) { $this->_helper = $helper; } /** * {@inheritdoc} */ public function getConfig() { $showHide = []; $showHide['show_module_block'] = $this->_helper->getConfig('active'); return $showHide; } }
В нашем примере, мы используем метод готового helper'а модуля для упрощения получения настроек метода доставки.
Привяжем параметр показа инфоблока к включенности самого модуля доставки.
etc/adminhtml/system.xml
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Config:etc/system_file.xsd"> <system> <section id="carriers"> <group id="module" translate="label" type="text" sortOrder="99" showInDefault="1" showInWebsite="1" showInStore="1"> <label>Vendor Module</label> <field id="active" translate="label" type="select" sortOrder="1" showInDefault="1" showInWebsite="1" showInStore="0"> <label>Enabled</label> <source_model>Magento\Config\Model\Config\Source\Yesno</source_model> </field> </group> </section> </system> </config>
Чистим кеш:
demo@webhosting:/current$ php bin/magento cache:clean Cleaned cache types: config layout block_html collections reflection db_ddl eav customer_notification full_page config_integration config_integration_api translate config_webservice
Запускаем перегенерацию DI:
demo@webhosting:/current$ php bin/magento setup:di:compile Compilation was started. Interception cache generation... 7/7 [============================] 100% 3 mins 264.0 MiB Generated code and dependency injection configuration successfully.
Модуль готов. Заходим в настройки, включаем модуль. Готово.
