Список продуктов Magento2 - Показать варианты продукта


10

Я сейчас работаю над новой темой Magento 2. Для этой темы я хочу показать все параметры продукта (настраиваемые параметры и параметры настраиваемого продукта) в списке продуктов. Таким образом, пользователь может быстро добавлять товары в свою корзину.

Я попытался добавить product.infoблок catalog_category_view.xmlи установить продукт для этого блока. Опции показаны для каждого продукта, проблема в том, что показанная опция только для первого продукта. Таким образом, все другие продукты имеют эту опцию.

--- ОБНОВИТЬ ---

Мне удалось показать варианты товара, но цены не обновились. Может ли кто-нибудь указать мне правильное направление?

<form id='product_addtocart_form_<?php echo $product->getId(); ?>' class="c-product__details__add-to-cart" data-role="tocart-form" action="<?php echo $postParams[ 'action' ]; ?>" method="post">
    <input type="hidden" name="product" value="<?php echo $postParams[ 'data' ][ 'product' ]; ?>">
    <input type="hidden" name="<?php echo Action::PARAM_NAME_URL_ENCODED; ?>" value="<?php echo $postParams[ 'data' ][ Action::PARAM_NAME_URL_ENCODED ]; ?>">
    <?php echo $block->getBlockHtml('formkey') ?>
    <div class="product-options-wrapper" id="product-options-wrapper" data-hasrequired="* Verplichte velden">
        <?php if($product->getTypeId() === 'configurable') : ?>
            <?php foreach($product->getTypeInstance()->getConfigurableAttributes($product) as $attribute) : ?>
                <div class="field">
                    <label class="label" for="select_<?php echo $attribute->getAttributeId(); ?>"><span><?php echo $attribute->getLabel() ?></span></label>
                    <?php $values = $attribute->getOptions(); ?>
                    <div class="control">
                        <select id="select_<?php echo $attribute->getAttributeId() ?>" name="options[<?php echo $attribute->getAttributeId() ?>]" class="product-option product-custom-option-<?php echo $attribute->getAttributeId() ?> admin__control-select" data-selector="options[<?php echo $attribute->getAttributeId() ?>]">
                            <?php foreach($values as $value): ?>

                                <option value="<?php echo $value['value_index'] ?>" price="2"><?php echo  $value['label'] ?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
            <?php endforeach; ?>
        <?php else : ?>
            <?php foreach($customOptions as $option): ?>
                <div class="field">
                    <label class="label" for="select_<?php echo $option->getId(); ?>"><span><?php echo $option->getTitle() ?></span></label>
                    <?php $values = $option->getValues(); ?>
                    <div class="control">
                        <select id="select_<?php echo $option->getId() ?>" data-id="<?php echo $product->getId() ?>" name="options[<?php echo $option->getId() ?>]" class="product-option product-custom-option-<?php echo $product->getId() ?> admin__control-select" data-selector="options[<?php echo $option->getId() ?>]">
                            <?php foreach($values as $value): ?>

                                <option value="<?php echo $value->getData('option_type_id') ?>" price="3"><?php echo $value->getTitle() ?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
            <?php endforeach; ?>
        <?php endif; ?>
        <script>
            require([
                'jquery',
                'Magento_Catalog/js/price-box'
            ], function($){
                var priceBoxes = $('[data-product-id=<?php echo $product->getId(); ?>]');

                priceBoxes = priceBoxes.filter(function(index, elem){
                    return !$(elem).find('.price-from').length;
                });
                var priceBox = priceBoxes.priceBox({'priceConfig': <?php /* @escapeNotVerified */ echo $block->getJsonConfig($product, $customOptions) ?>});

                $('.product-option').on('change', function() {
                    priceBox.trigger('updatePrice');
                });
            });
        </script>
    </div>
    <button type="submit" title="<?php echo $block->escapeHtml(__('Add to Cart')); ?>" class="action tocart primary im">
        <span><?php echo __('Add to cart'); ?></span>
    </button>
</form>

Я также реализовал getJsonConfigфункцию в своем собственном классе ListProduct.


magento.stackexchange.com/questions/100801/… Как для пользовательских опций, может привести вас к обычным опциям. Добавить в корзину в списке категорий: magento.stackexchange.com/a/125813/69
B00MER

что такое value_index и option_type_id в вашем коде. value_index - это индекс значения опции, а option_type_id - это идентификатор опции.
Сарвеш Тивари

я получаю сообщение об ошибке неопределенные переменные $ customOptions вы можете проверить и отозвать меня, я жду вашего ответа
Сарвеш Тивари

Ответы:


1

Вы можете взять в качестве примера модуль Magento_Swatch.

Блок Magento\Swatches\Block\Product\Renderer\Listing\Configurableдобавляется в блок с именем category.product.type.details.renderers.

Как здесь: https://github.com/magento/magento2/blob/develop/app/code/Magento/Swatches/view/frontend/layout/catalog_category_view.xml

Шаблон инициализирует JS, используемый для образцов: Magento_Swatches :: product / list / renderer.phtml

https://github.com/magento/magento2/blob/develop/app/code/Magento/Swatches/view/frontend/templates/product/listing/renderer.phtml

И все важное сделано в образце JS. https://github.com/magento/magento2/blob/develop/app/code/Magento/Swatches/view/frontend/web/js/swatch-renderer.js Как функции: _RenderControls, _RenderFormInput, _EventListener, _UpdatePriceи другие. JS выглядит большим. Но в нем много кода для рендеринга образцов изображений, получаемых через AJAX. Возможно, вам это не нужно, это легче реализовать.

Здесь параметры (супер атрибуты и связанные продукты) html-теги (образцы div) создаются и обрабатываются. Цена обрабатывается и здесь. В вашем случае у вас будут выпадающие списки.

Вам нужно написать свой собственный модуль для реализации всего вышеперечисленного. Теоретически вы можете добавить любые варианты из всех типов продуктов (связка, группировка, ..). Стоимость - это производительность, поскольку вам нужно будет загружать больше данных в модели для каждого продукта на странице категории, в которой есть опции.

В качестве альтернативы вы можете попытаться установить для настраиваемых / простых сопутствующих продуктов невизуальные образцы (без изображений).


0

Для настраиваемых продуктов: Вы должны установить тип атрибута « Образец текста » и изменить шаблон так, чтобы отображать образец (это по умолчанию в Magento 2), при желании это самый простой образец или образец расширенной функциональности через модуль, который добавляет новый Опция на тип атрибута и создайте новый шаблон для этой опции.


Это не лучший вариант, посмотрите мой обновленный вопрос, только цены не работают в данный момент.
Сильван

0

В левом списке меню -> раздел «Перейти к атрибуту» и выберите «Продукт» -> «Поиск варианта продукта», который необходимо отобразить, и щелкните этот атрибут -> «Перейти к свойствам витрины» -> «И изменить» -> в разделе «Видимый» на страницах каталога в витрине магазина и используется в списке товаров -> НЕТ ДА.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.