Agregar regla a rules.js Magento2

Nuestro grupo de especialistas pasados algunos días de investigación y recopilar de información, hallamos la solución, queremos que resulte de gran utilidad para tu proyecto.

Solución:

Aquí hay un ejemplo de trabajo completo y real para agregar una regla personalizada al campo de entrada de pago para verificar la edad mínima:

Cree un requirejs-config.js en su módulo para agregar una mezcla al validator oponerse a Namespace/Modulename/view/frontend/requirejs-config.js con el siguiente contenido:

var config = 
    config: 
        mixins: 
            'Magento_Ui/js/lib/validation/validator': 
                'Namespace_Modulename/js/validator-mixin': true
            
        
    
;

Cree un script js en la carpeta de su módulo en Namespace/Modulename/view/frontend/web/js/validator-mixin.js con el siguiente contenido:

define([
    'jquery',
    'moment'
], function ($, moment) 
    'use strict';

    return function (validator) 

        validator.addRule(
            'validate-minimum-age',
            function (value, params, additionalParams) 
                return $.mage.isEmptyNoTrim(value) ,
            $.mage.__("Sorry, you don't have the age to purchase the current articles.")
        );

        return validator;
    ;
);

USO

Si desea utilizar un complemento PHP de Magento para insertar un campo de entrada en su dirección de envío de pago y validar el contenido de este campo con la regla personalizada que agregó anteriormente, aquí hay un código de muestra:

Crear un di.xml archivar en el etc/frontend carpeta de su módulo con el siguiente contenido:

Luego crea el LayoutProcessor.php archivar en app/code/Namespace/Modulename/Plugin/Block/Checkout/LayoutProcessor.php con el siguiente contenido, actualícelo según sus necesidades:

 * @category    diglin
 * @package     diglin
 * @copyright   Copyright (c) diglin (http://www.diglin.com)
 */

namespace MyNamespaceModulenamePluginBlockCheckout;

use MyNamespaceModulenameHelperAgeValidation;

/**
 * Class LayoutProcessor
 * @package MyNamespaceModulenamePluginBlockCheckout
 */
class LayoutProcessor

    /**
     * @var MyNamespaceCheckoutHelperAgeValidation
     */
    private $ageValidation;
    /**
     * @var MagentoFrameworkStdlibDateTimeTimezoneInterface
     */
    private $timezone;
    /**
     * @var MagentoFrameworkAppConfigScopeConfigInterface
     */
    private $scopeConfig;

    /**
     * LayoutProcessor constructor.
     *
     * @param MyNamespaceCheckoutHelperAgeValidation $ageValidation
     * @param MagentoFrameworkStdlibDateTimeTimezoneInterface $timezone
     * @param MagentoFrameworkAppConfigScopeConfigInterface $scopeConfig
     */
    public function __construct(
        AgeValidation $ageValidation,
        MagentoFrameworkStdlibDateTimeTimezoneInterface $timezone,
        MagentoFrameworkAppConfigScopeConfigInterface $scopeConfig
    )
    
        $this->ageValidation = $ageValidation;
        $this->timezone = $timezone;
        $this->scopeConfig = $scopeConfig;
    

    /**
     * Checkout LayoutProcessor after process plugin.
     *
     * @param MagentoCheckoutBlockCheckoutLayoutProcessor $processor
     * @param array $jsLayout
     *
     * @return array
     */
    public function afterProcess(MagentoCheckoutBlockCheckoutLayoutProcessor $processor, $jsLayout)
    
        $shippingConfiguration = &$jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']
        ['children']['shippingAddress']['children']['shipping-address-fieldset']['children'];

        // Checks if shipping step available.
        if (isset($shippingConfiguration)) 
            $shippingConfiguration = $this->processAddress(
                $shippingConfiguration
            );
        

        return $jsLayout;
    

    /**
     * Process provided address to contains checkbox and have trackable address fields.
     *
     * @param $addressFieldset - Address fieldset config.
     *
     * @return array
     */
    private function processAddress($addressFieldset)
    
        $minimumAge = $this->ageValidation->getMinimumAge();
        if ($minimumAge === null) 
            unset($addressFieldset['my_dob']);
         else 
            $addressFieldset['my_dob'] = array_merge(
                $addressFieldset['my_dob'],
                [
                    'component' => 'Magento_Ui/js/form/element/date',
                    'config' => array_merge(
                        $addressFieldset['my_dob']['config'],
                        [
                            'elementTmpl' => 'ui/form/element/date',
                            // options of datepicker - see http://api.jqueryui.com/datepicker/
                            'options' => [
                                'dateFormat' => $this->timezone->getDateFormatWithLongYear(),
                                'yearRange' => '-120y:c+nn',
                                'maxDate' => '-1d',
                                'changeMonth' => 'true',
                                'changeYear' => 'true',
                                'showOn' => 'both',
                                'firstDay' => $this->getFirstDay(),
                            ],
                        ]
                    ),
                    'validation' => array_merge($addressFieldset['my_dob']['validation'],
                        [
                            'required-entry' => true,
                            'validate-date' => true,
                            'validate-minimum-age' => $minimumAge, // custom value in year - array('minimum_age' => 16)
                        ]
                    ),
                ]
            );
        

        return $addressFieldset;
    

    /**
     * Return first day of the week
     *
     * @return int
     */
    public function getFirstDay()
    
        return (int)$this->scopeConfig->getValue(
            'general/locale/firstday',
            MagentoStoreModelScopeInterface::SCOPE_STORE
        );
    

EDITAR

Gracias @ alan-storm por su explicación aquí https://alanstorm.com/the-curious-case-of-magento-2-mixins/ y @ jisse-reitsma trae en la dirección

Plus Magento 2 doc http://devdocs.magento.com/guides/v2.2/javascript-dev-guide/javascript/js_mixins.html

Recuerda dar difusión a esta crónica si te valió la pena.

---

---

Utiliza Nuestro Buscador