Тема: Отображение картинки при группировке товаров

Используем «виртуальные многомерные комплектации».
В шаблоне product_offers.tpl выводим список в виде радиокнопок.
Подскажите как правильно задать отображение картинки соответствующей товару в списке.
Привожу часть кода из шаблона, но в качестве картинки сейчас отображается картинка выбранного товара.

{foreach $level.values as $key => $value}
     <div class="level-row">
           <input id="mo_{$level.prop_id}_{$key}" type="radio" name="multioffers[{$level.prop_id}]" data-prop-title="{if $level.title}{$level.title}{else}{$level.prop_title}{/if}" data-prop-id="{$property_id}" value="{$value.val_str}">
            {* Отображаем  картинку *}
            <a href="{$product->getUrl()}"><img src="{$product->getMainImage()->getUrl(30, 30)}" alt="{$product.title}"></a>
            {* Отображаем  радиокнопки *}
             <label for="mo_{$level.prop_id}_{$key}">{$value.val_str}</label>
     </div>
{/foreach}

Повысить оценку Понизить оценку

Re: Отображение картинки при группировке товаров

Дело в том, что для отображения нужной картинки соответствующей выбранному из списка значению нужно иметь комплектацию которой это фото принадлежит. И эта комплектация должна иметь характеристики подходящие под значения многомерных комплектаций. У Вас вообще комплектации есть?

3

Re: Отображение картинки при группировке товаров

Я наверно не совсем точно выразился насчет "многомерной комплектации" хотя пользовался выражением из статьи https://readyscript.ru/text-blog/opoves … em-relize/
У нас используется группировка товаров. В качестве характеристики задается точное название товара.

Повысить оценку Понизить оценку

Re: Отображение картинки при группировке товаров

Группировка товаров, это виртуальные многомерноые комплектации. Если совпадение находится по характеристике комплектации, то у Вас должна страница внутри перезагружаться полностью. Соответственно и картинки от другого товара должны подтягиваться. У Вас сейчас содержимое вообще не меняется?

5

Re: Отображение картинки при группировке товаров

Конечно меняется при нажатии радиокнопки. Причем верно и как задумано.
http://prntscr.com/h3tf7n
Вопрос в том чтобы картинки, отмеченные знаком вопроса соответствовали товару в данной строке.

Повысить оценку Понизить оценку

Re: Отображение картинки при группировке товаров

Покажите код который у Вас всё это выводит.

7

Re: Отображение картинки при группировке товаров

Полностью product_offers.tpl

{* Комплектации товара *}
{$shop_config=ConfigLoader::byModule('shop')}
{$check_quantity=$shop_config.check_quantity}
{$catalog_config=ConfigLoader::byModule('catalog')} 
{if $product->isMultiOffersUse() || $product->isVirtualMultiOffersUse()}
    {$first_offer_params=$product.offers.items.0.propsdata_arr} {* Первая комплектация для виртуальных многомерок *}
    {* Многомерные комплектации *}
    <div class="multiOffers">
        <span class="pname">{$product.offer_caption|default:t('Комплектация')}</span>
        {* Подгрузим у многомерных комплектаций фото к их вариантам *}
        {$product->fillMultiOffersPhotos()}
        {* Переберём доступные многомерные комплектации *}
        
        {foreach $product.multioffers.levels as $property_id => $level}
            
            {if !empty($level.values)}
                {$property = $level->getPropertyItem()}
                
{*              <div class="title">{if $level.title}{$level.title}{else}{$level.prop_title}{/if}</div>     *}
                {if !$level.is_photo && !isset($level.values_photos)} {* Если отображать не как фото (выпадающим списком)*}
                    
                    {if in_array($property.type, ['radio', 'color', 'image'])}
                        <div class="levelType-{$property.type}">
                        {foreach $level.values as $key => $value}
                            <div class="levelRow">
                                <input id="mo_{$level.prop_id}_{$key}" type="radio" name="multioffers[{$level.prop_id}]" data-prop-title="{if $level.title}{$level.title}{else}{$level.prop_title}{/if}" data-prop-id="{$property_id}" value="{$value.val_str}">
                                
                                {if $property.type == 'radio'}
                                    {* Отображаем  радиокнопки *}
                                    <label for="mo_{$level.prop_id}_{$key}">{$value.val_str}</label>
                                
                                {elseif $property.type == 'color'}
                                    {* Отображаем выбор цвета *}
                                    <label for="mo_{$level.prop_id}_{$key}" title="{$value.val_str}" style="background-color:{$value.color}">
                                        {if $value.image}
                                            <img src="{$value.__image->getUrl(32, 32, 'axy')}">
                                        {/if}
                                    </label>
                                    
                                {elseif $property.type == 'image'}
                                    {* Отображаем картинки *}
                                    <label for="mo_{$level.prop_id}_{$key}" title="{$value.val_str}">
                                        {if $value.image}
                                            <img src="{$value.__image->getUrl(60, 60, 'cxy')}">
                                        {/if}
                                    </label>
                                    
                                {/if}
                            </div>
                        {/foreach}
                        </div>
                    {else}
                        {* Отображаем обычный список *}
{*                        
                        <select name="multioffers[{$level.prop_id}]" data-prop-title="{if $level.title}{$level.title}{else}{$level.prop_title}{/if}" data-prop-id="{$property_id}">
                            {foreach $level.values as $value}
                                <option value="{$value.val_str}" {if isset($level.is_virtual) && $value.val_str==$first_offer_params[$level.title]}selected{/if}>{$value.val_str}</option>
                            {/foreach}
                        </select>
*}
                        <div class="levelType-{$property.type}">
                        {foreach $level.values as $key => $value}
                            <div class="levelRow">
                                <input id="mo_{$level.prop_id}_{$key}" type="radio" name="multioffers[{$level.prop_id}]" data-prop-title="{if $level.title}{$level.title}{else}{$level.prop_title}{/if}" data-prop-id="{$property_id}" value="{$value.val_str}">
                                {* Отображаем  картинку *}
                                <a href="{$product->getUrl()}"><img src="{$product->getMainImage()->getUrl(30, 30)}" alt="{$product.title}"></a>
                                {* Отображаем  радиокнопки *}
                                <label for="mo_{$level.prop_id}_{$key}">{$value.val_str}</label>
                            </div>
                        {/foreach}
                        </div>
                    {/if}
                    
                {else} {* Как фото, привязанные к комплектации *}
                    <div class="multiOfferValues">
                        <input type="hidden" name="multioffers[{$level.prop_id}]" data-prop-title="{if $level.title}{$level.title}{else}{$level.prop_title}{/if}" data-prop-id="{$property_id}"/>
                        {foreach $level.values as $value}
                            {if isset($level.values_photos[$value.val_str])}
                                <a class="multiOfferValueBlock {if $value@first}sel{/if}" data-value="{$value.val_str}" data-image="{$level.values_photos[$value.val_str]->getUrl({$preview_width|default:"310"},{$preview_height|default:"310"}, {$preview_scale|default:"axy"})}"  title="{$value.val_str}"><img src="{$level.values_photos[$value.val_str]->getUrl(40,40,'axy')}"/></a>
                            {else}
                                <a class="multiOfferValueBlock likeString {if $value@first}sel{/if}" data-value="{$value.val_str}" title="{$value.val_str}">{$value.val_str}</a>
                            {/if}
                        {/foreach}
                    </div>
                {/if}
            {/if}
        {/foreach}
    </div>
    
    {if $product->isVirtualMultiOffersUse()}
        {* Сведения по виртуальным многомерным комплектациям *}
        {foreach from=$product.virtual_multioffers.items key=product_id item=offer}
            <input value="{$product_id}" type="hidden" name="hidden_multioffers" class="hidden_offers" id="offer_{$product_id}" data-url='{$offer.url}' data-info='{json_encode($offer.values)}'/>
        {/foreach}
        
    {else}
        {* Сведения по простым комплектациям, связанным с многомерными для изменения цены и остатка *}
        {foreach from=$product.offers.items key=key item=offer name=offers}
            {* В data-info подменяем двойную ковычку на специальную конструкцию во избежание проблемы jquery с json *}
            <input value="{$key}" type="hidden" name="hidden_offers" class="hidden_offers" {if $smarty.foreach.offers.first}checked{/if} id="offer_{$key}" data-info='{str_replace('&quot;', '*`*', {$offer->getPropertiesJson()})}' {if $check_quantity}data-num="{$offer.num}"{/if} {if $catalog_config.use_offer_unit}data-unit="{$offer->getUnit()->stitle}"{/if} data-change-cost='{ ".offerBarcode": "{$offer.barcode|default:$product.barcode}", ".myCost": "{$product->getCost(null, $key)}", ".lastPrice": "{$product->getOldCost($key)}", ".myCurrency": "{$product->getCurrency()}"}' data-images='{$offer->getPhotosJson()}' data-offer-id='{$offer.id}' data-sticks='{$offer->getStickJson()}' {if !$product->isOffersUse()}data-type-offer="notExist"{/if}/>
        {/foreach}
        {if $product->isOffersUse()}
            <input value="{count($product.offers.items)}" type="hidden" name="hidden_offers" class="hidden_offers" id="offer_{count($product.offers.items)}" data-type-offer="notExist" data-info=" " {if $check_quantity}data-num="0"{/if} {if $catalog_config.use_offer_unit}data-unit="{$product.offers.items.0->getUnit()->stitle}"{/if} data-change-cost='{ ".offerBarcode": "{$product.barcode}", ".myCost": "{t}нет цены{/t}", ".lastPrice": " ", ".myCurrency": " "}' data-offer-id='0' data-sticks="[]"/>
        {/if}
        <input type="hidden" name="offer" value="0"/>
    {/if}

{elseif $product->isOffersUse()}
    {* Простые комплектации *}
    <div class="packages">
        <div class="package">
            <span class="pname">{$product.offer_caption|default:t('Комплектация')}</span>
            <div class="values">
                {if count($product.offers.items)>5}
                    {* Если комплектаций много, то отобразим их в виде списка *}
                    <select name="offer">
                        {foreach from=$product.offers.items key=key item=offer name=offers}
                        <option value="{$key}" {if $smarty.foreach.offers.first}checked{/if} {if $check_quantity}data-num="{$offer.num}"{/if} {if $catalog_config.use_offer_unit}data-unit="{$offer->getUnit()->stitle}"{/if} data-change-cost='{ ".offerBarcode": "{$offer.barcode|default:$product.barcode}", ".myCost": "{$product->getCost(null, $key)}", ".lastPrice": "{$product->getOldCost($key)}"}' data-images='{$offer->getPhotosJson()}' data-offer-id='{$offer.id}' data-sticks='{$offer->getStickJson()}'>{$offer.title}</option>
                        {/foreach}
                    </select>
                {else}
                    {* Если комплектаци мало, то отобразим их в виде радиокнопок *}
                    {foreach from=$product.offers.items key=key item=offer name=offers}
                        <div class="packageItem">
                            <input value="{$key}" type="radio" name="offer" {if $smarty.foreach.offers.first}checked{/if} id="offer_{$key}" {if $check_quantity}data-num="{$offer.num}"{/if} {if $catalog_config.use_offer_unit}data-unit="{$offer->getUnit()->stitle}"{/if} data-change-cost='{ ".offerBarcode": "{$offer.barcode|default:$product.barcode}", ".myCost": "{$product->getCost(null, $key)}", ".lastPrice": "{$product->getOldCost($key)}"}' data-images='{$offer->getPhotosJson()}' data-offer-id='{$offer.id}' data-sticks='{$offer->getStickJson()}'>
                            <label for="offer_{$key}">{$offer.title}</label>
                        </div>
                    {/foreach}
                {/if}
            </div>
        </div>
    </div><br>
{/if}

Повысить оценку Понизить оценку

Re: Отображение картинки при группировке товаров

Когда мы перебираем виртуальные многомерные комплектации нам доступен идентификатор товара. По нему можно подгрузить товар:

{foreach from=$product.virtual_multioffers.items key=product_id item=offer}
            {* В $product_id находится идентификатор товара *}
            {$virtual_product=\Catalog\Model\Orm\Product::loadByWhere(['id' => $product_id])}
            {if $virtual_product}
                <img src="{$virtual_product->getMainImage->getUrl(30,30)}" alt=""/>
            {/if}
 {/foreach}

Попробуйте так.

9

Re: Отображение картинки при группировке товаров

Ошибочка http://prntscr.com/h4fsb5 выскочила.

Повысить оценку Понизить оценку

10 Отредактировано Закусило Александр (31.10.2017 20:47:50)

Re: Отображение картинки при группировке товаров

Прошу прощения. немного не так. Нужно использовать static_call

{foreach from=$product.virtual_multioffers.items key=product_id item=offer}
            {* В $product_id находится идентификатор товара *}
            {static_call var=virtual_product callback=['\Catalog\Model\Orm\Product', 'loadByWhere'] params=[['id' => $product_id]]}
            {if $virtual_product}
                <img src="{$virtual_product->getMainImage->getUrl(30,30)}" alt=""/>
            {/if}
 {/foreach}

11

Re: Отображение картинки при группировке товаров

К сожалению не срабатывает подгрузка. Ошибки нет, но при этом основная форма не прогружается.

Повысить оценку Понизить оценку

Re: Отображение картинки при группировке товаров

А посмотрите через var_dump, что у Вас в переменных

{var_dump($product_id)}
{var_dump($virtual_product)}

13

Re: Отображение картинки при группировке товаров

Большое вам спасибо за подсказки!
Все заработало в таком виде:

{* Комплектации товара *}
{$shop_config=ConfigLoader::byModule('shop')}
{$check_quantity=$shop_config.check_quantity}
{$catalog_config=ConfigLoader::byModule('catalog')} 
{if $product->isMultiOffersUse() || $product->isVirtualMultiOffersUse()}
    {$first_offer_params=$product.offers.items.0.propsdata_arr} {* Первая комплектация для виртуальных многомерок *}
    {* Многомерные комплектации *}    
    <div class="multiOffers">
        <span class="pname">{$product.offer_caption|default:t('Комплектация')}</span>
    </div>
    
    {if $product->isVirtualMultiOffersUse()}
        {* Сведения по виртуальным многомерным комплектациям *}
        {foreach from=$product.virtual_multioffers.items key=product_id item=offer}
            <div class="levelRow">
            {* В $product_id находится идентификатор товара *}
            {static_call var=virtual_product callback=['\Catalog\Model\Orm\Product', 'loadByWhere'] params=[['id' => $product_id]]} 
            {if $virtual_product}
                <a href="{$offer.url}"><img src="{$virtual_product->getMainImage()->getUrl(50, 50)}" alt="{$virtual_product.title}"></a> 
                <label for="$product_id">{$virtual_product.title}</label>
            {/if}
            </div>
         {/foreach}
    {else}
        {* Сведения по простым комплектациям, связанным с многомерными для изменения цены и остатка *}
    {/if}

{elseif $product->isOffersUse()}
    {* Простые комплектации *}
{/if}

Повысить оценку Понизить оценку