Ich möchte meinen Minicart in Magento 2 anpassen. Ich muss 3 Attribute hinzufügen

11

Ich möchte meinen Minicart in Magento 2 anpassen. Ich muss 3 Attribute hinzufügen: SKU, Hersteller und Hersteller-Teilenummer. Dies sind vorhandene Attribute. Ich sehe, wo die Ausgabewerte hinzugefügt werden sollen, aber nicht, woher sie aufgerufen werden sollen.

magento2 mini-cart knockoutjs Matthew McLennan
quelle

Antworten:

25

Sie können dazu ein Modul erstellen. Es wird ein Plugin verwendet, um die Attribute zum Datenarray hinzuzufügen, das von der Knockout-JS-Vorlage gelesen wird. Dann müssen wir die Vorlage überschreiben, um diese Werte anzuzeigen.

Dies ist das Modulverzeichnis:

|   registration.php
|   
+---etc
|   |   module.xml
|   |   catalog_attributes.xml
|   |   
|   \---frontend
|           di.xml
|           
+---Plugin
|       DefaultItem.php
|       
\---view
    +---frontend
    |   \---layout
    |           checkout_cart_sidebar_item_renderers.xml
    |           
    \---web
        \---template
            \---mini cart
                \---item
                        default.html

catalog_attributes.xml

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Catalog:etc/catalog_attributes.xsd">
    <group name="quote_item">
        <attribute name="manufacturer"/>
        <attribute name="part_number"/>
    </group>
</config>

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\CustomerData\DefaultItem">
        <plugin name="AddAttPlug" type="Your\Module\Plugin\DefaultItem" disabled="false" sortOrder="10"/>
    </type>
</config>

DefaultItem.php

<?php

namespace Your\Module\Plugin;

use Magento\Quote\Model\Quote\Item;

class DefaultItem
{
    public function aroundGetItemData($subject, \Closure $proceed, Item $item)
    {
        $data = $proceed($item);
        $product = $item->getProduct();

        $atts = [
            "product_manufacturer" => $product->getAttributeText('manufacturer'),
            "product_part_number" => $product->getAttributeText('product_part_number')
        ];

        return array_merge($data, $atts);
    }
}

Die SKU ist bereits in den Daten vorhanden, sodass sie nicht hinzugefügt werden müssen.

checkout_cart_sidebar_item_renderers.xml

<?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="minicart">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="minicart_content" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="item.renderer" xsi:type="array">
                                    <item name="config" xsi:type="array">
                                        <item name="template" xsi:type="string">Your_Module/minicart/item/default</item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

default.html ist eine Kopie von Magento/Checkout/view/frontend/web/template/minicart/item/default.htmlmit Änderungen in Zeile 66

<li class="item product product-item" data-role="product-item">
    <div class="product">
        <!-- ko if: product_has_url -->
        <a data-bind="attr: {href: product_url, title: product_name}" tabindex="-1" class="product-item-photo">
            <!-- ko foreach: $parent.getRegion('itemImage') -->
                <!-- ko template: {name: getTemplate(), data: item.product_image} --><!-- /ko -->
            <!-- /ko -->
        </a>
        <!-- /ko -->
        <!-- ko ifnot: product_has_url -->
        <span class="product-item-photo">
            <!-- ko foreach: $parent.getRegion('itemImage') -->
                <!-- ko template: {name: getTemplate(), data: item.product_image} --><!-- /ko -->
            <!-- /ko -->
        </span>
        <!-- /ko -->

        <div class="product-item-details">
            <strong class="product-item-name">
                <!-- ko if: product_has_url -->
                <a data-bind="attr: {href: product_url}, text: 
                  product_name"></a>
                <!-- /ko -->
                <!-- ko ifnot: product_has_url -->
                    <!-- ko text: product_name --><!-- /ko -->
                <!-- /ko -->
            </strong>

            <!-- ko if: options.length -->
            <div class="product options" data-mage-init='{"collapsible":{"openedState": "active", "saveState": false}}'>
                <span data-role="title" class="toggle"><!-- ko i18n: 'See Details' --><!-- /ko --></span>

                <div data-role="content" class="content">
                    <strong class="subtitle"><!-- ko i18n: 'Options Details' --><!-- /ko --></strong>
                    <dl class="product options list">
                        <!-- ko foreach: { data: options, as: 'option' } -->
                        <dt class="label"><!-- ko text: option.label --><!-- /ko --></dt>
                        <dd class="values">
                            <!-- ko if: Array.isArray(option.value) -->
                                <span data-bind="html: option.value.join('<br>')"></span>
                            <!-- /ko -->
                            <!-- ko ifnot: Array.isArray(option.value) -->
                                <span data-bind="html: option.value"></span>
                            <!-- /ko -->
                        </dd>
                        <!-- /ko -->
                    </dl>
                </div>
            </div>
            <!-- /ko -->

            <div class="product-item-pricing">
                <!-- ko if: canApplyMsrp -->

                <div class="details-map">
                    <span class="label" data-bind="i18n: 'Price'"></span>
                    <span class="value" data-bind="i18n: 'See price before order confirmation.'"></span>
                </div>
                <!-- /ko -->
                <!-- ko ifnot: canApplyMsrp -->
                <!-- ko foreach: $parent.getRegion('priceSidebar') -->
                    <!-- ko template: {name: getTemplate(), data: item.product_price, as: 'price'} --><!-- /ko -->
                <!-- /ko -->
                <!-- /ko -->

                <div data-bind="html: 'SKU#: ' + item.product_sku"></div>
                <div data-bind="html: 'Manufacturer: ' + item.product_manufacturer"></div>
                <div data-bind="html: 'Part #: ' + item.product_part_number"></div>

                <div class="details-qty qty">
                    <label class="label" data-bind="i18n: 'Qty', attr: {
                           for: 'cart-item-'+item_id+'-qty'}"></label>
                    <input data-bind="attr: {
                           id: 'cart-item-'+item_id+'-qty',
                           'data-cart-item': item_id,
                           'data-item-qty': qty,
                           'data-cart-item-id': product_sku
                           }, value: qty"
                           type="number"
                           size="4"
                           class="item-qty cart-item-qty"
                           maxlength="12"/>
                    <button data-bind="attr: {
                           id: 'update-cart-item-'+item_id,
                           'data-cart-item': item_id,
                           title: $t('Update')
                           }"
                            class="update-cart-item"
                            style="display: none">
                        <span data-bind="i18n: 'Update'"></span>
                    </button>
                </div>
            </div>

            <div class="product actions">
                <!-- ko if: is_visible_in_site_visibility -->
                <div class="primary">
                    <a data-bind="attr: {href: configure_url, title: $t('Edit item')}" class="action edit">
                        <span data-bind="i18n: 'Edit'"></span>
                    </a>
                </div>
                <!-- /ko -->
                <div class="secondary">
                    <a href="#" data-bind="attr: {'data-cart-item': item_id, title: $t('Remove item')}"
                       class="action delete">
                        <span data-bind="i18n: 'Remove'"></span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</li>
Aaron Allen
quelle
Was ist in register.php und module.xml?
Matthew McLennan
Ich habe dies hinzugefügt und jetzt heißt meine Ausgabe "UNDEFINED". Bedeutet das, dass es funktioniert, aber ich habe meine Attribute falsch benannt?
Matthew McLennan
Registration.php und module.xml sind Boilerplate-Dateien. In diesem Tutorial unter alanstorm.com/magento_2_mvvm_mvc erfahren Sie , wie m2-Module definiert werden. Könnten Sie vielleicht einen Screenshot des Fehlers posten, den Sie bekommen, oder genauer sein?
Aaron Allen
@AaronAllen, es funktioniert für mich, aber ich möchte auch die content.html desselben Minicarts überschreiben und einige dynamische Daten in diese Datei einfügen. Können Sie bitte erklären, wie ich das erreichen kann? Danke im Voraus !
Ashish Jagnani
2
Wenn Sie die Attribute in aroundGetItemData () laden, können Sie sie stattdessen zu etc / catalog_attributes.xml hinzufügen. Danach kann auf die Attribute mit $ item-> getProduct () -> getAttributeText ('attribute_code') zugegriffen werden. _productRepo wird nicht mehr benötigt.
Andreas Riedmüller
0

Ich habe meine Anfrage um 2 einfache Schritte in Magento 2.1 verschoben:

In Datei ändern: ->

1.DefaultItem.php Zeile hinzufügen : 

    $objectManager = \Magento\Framework\App\ObjectManager::getInstance();
    $this->product = $objectManager->get('Magento\Catalog\Model\Product')-
    >load($this->item->getId());

   *Add element into return array result:*

   'short_description' => $this->product->getShortDescription(),

2.default.html Zeile hinzufügen :

   <a data-bind="text: short_description"></a>

ich hoffe, dies wird dir helfen.

Sejal Shah
quelle