Список продуктів 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 - ідентифікатор опції
Sarvesh Tiwari

я отримую помилки невизначених змінних $ 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 / listing / renderer.phtml

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

І все важливе робиться в swatch 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-теги (swatches divs). Ціна обробляється і тут. У вашому випадку ви матимете спадні місця.

Вам потрібно буде написати власний модуль, щоб реалізувати все вище. Теоретично можна додати будь-які варіанти з усіх типів продуктів (пакет, згрупований, ..). Вартість - ефективність, оскільки вам потрібно буде завантажувати більше даних у моделі для кожного продукту на сторінці категорії, яка має варіанти.

Як альтернатива, ви можете спробувати встановити налаштовані / прості асоційовані продукти невізуальні зразки (без зображень).


0

Для продуктів, що налаштовуються: Ви повинні встановити тип атрибута " Swatch Text " та змінити шаблон, щоб відобразити зразок (Це за замовчуванням у Magento 2), при бажанні це найпростіший або розширити функціональний зразок через модуль, який додає новий параметр типу атрибута і створити новий шаблон для цього параметра.


Здається, це не найкращий варіант, дивіться моє оновлене запитання, тільки ціни на даний момент не працюють.
Сільван

0

У лівому списку меню -> Перейти до розділу атрибутів та натиснути на Продукт -> Опція пошуку продукту, яку потрібно показати та натиснути на цей атрибут -> Перейти до властивостей вітрини магазину -> та змінити -> у розділі Видиме на сторінках каталогу на сторінці вітрини та використаних у списку продуктів -> НІ ТАК.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.