msOptionsPrice2 галлерея модификаций

Всем привет, решил в первый раз написать готовое решение. Надеюсь кому-то пригодится.
Была задача вывести различные цвета товаров, решили выбрать msOptionsPrice2 он для этого подходит идеально.
По умолчанию все модификации выводятся текстом, а нам нужно получить не только название, но и изображение модификации.


И так давайте начнем, для начала создадим копию сниппета msOptionsPrice.option и назовем его msOptionsPrice.option_img
чтобы получить изображение нам нужно разобраться какие таблицы использует msOptionsPrice2:
_msop_modifications модификации
_msop_modification_images галлерею модификаций
_msop_modification_options опции модификаций

Наша задача взять опцию color из таблицы _msop_modification_options и сравнить ее mid с id _msop_modifications и уже с этой таблицы получить id изображения
открываем наш только что созданный сниппет msOptionsPrice.option_img
находим в 50 строке
if (!function_exists('getOptionColors')) {
//остальной код
}
и удаляем код или комментируем, как вам удобно
и пишем новый
if (!function_exists('getOptionColors')) {
        function getOptionColors(modX & $modx, $rid = null, $key = null)
    {
        $colors = [];

        $classModification = 'msopModification';
        $classFile = 'msProductFile';
        $classOption = 'msopModificationOption';
        $q = $modx->newQuery($classOption);
        
        $q->leftJoin($classModification, $classModification, "{$classOption}.mid = {$classModification}.id");
        $q->leftJoin($classFile, $classFile, "{$classModification}.image = {$classFile}.parent");
        
        $q->select($modx->getSelectColumns($classFile, $classFile, '', ['url'], false));
        $q->select($modx->getSelectColumns($classModification, $classModification, '', ['image'], false));
        $q->select($modx->getSelectColumns($classOption, $classOption, '', ['value'], false));
        
        $q->where([
            "{$classOption}.rid" => "{$rid}",
            "{$classOption}.key" => "{$key}",
        ]);
        if ($q->prepare() AND $q->stmt->execute()) {
            while ($row = $q->stmt->fetch(PDO::FETCH_ASSOC)) {
                $k = $row['value'];
                $colors[$k] = $row;
            }
        }
        return $colors;
    }
}
Теперь мы можем запустить сниппет
{'msOptionsPrice.option_img' | snippet : [
'options' => 'color', //Тут нужно указать свой ключ
'tpl' => 'tpl.msOptions_colors_img',
'processColors' => 1,
]}
И сам чанк tpl.msOptions_colors_img
{foreach $options as $name => $values}
    <div class="sm-text"><b>{('ms2_product_' ~ $name) | lexicon}</b></div>
    <div
        {if $constraints[$name]}
            data-constraints="{$constraints[$name]| json_encode: 256 | htmlentities}"
        {/if}
        >
        {foreach $values as $value index=$index}
        <label class="input-parent">
        <input type="radio" value="{$values[$index]}" name="options[{$name}]" 
            {if $index == 0}checked="checked"{/if}
            
            {if $constraints[$name]}
                data-relations="{$relations[$name][$value]| json_encode: 256 | htmlentities}"
            {/if}
                    
            />
            <img src="{$value.url}" alt="{$value.value}"
            width="50" height="50" style="opacity: 1;"  title="{$value.value}">
        </label>
    
        {/foreach}
        
    </div>
{/foreach}
Добавляем свои стили и получаем такой результат
vit
vit
07 февраля 2024, 16:15
modx.pro
1
714
+9

Комментарии: 6

Николай Савин
08 февраля 2024, 09:28
+1
Перенес в готовые решения
    vit
    vit
    08 февраля 2024, 12:00
    0
    Спасибо. Нужно рейтинга набрать)
    Maks
    17 февраля 2024, 09:19
    0
    Сделал все по инструкции ничего не получилось.
    В итоге выводит вот так


    <img src="�" alt="�" width="50" height="50" style="opacity: 1;" title="�">
    И вот такое в коде.
      vit
      vit
      18 февраля 2024, 22:30
      +1
      Напишите в лс посмотрю в чем дело
        Maks
        19 февраля 2024, 09:41
        0
        Куда писать сообщения в профиле отключены.
          vit
          vit
          19 февраля 2024, 13:14
          +1
          включил, в тг можно
      Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
      6