Иллюстрация каталога комплектов: выбор отдельных товаров и сборка набора

Каталог комплектов на 1С-Битрикс с выбором товаров

Разработали отдельный каталог комплектов с умным фильтром и карточками. Добавили выбор минимум двух товаров, пересчёт цен и поддержку оптовых условий.

1С-БитриксКомплекты товаровКаталогОптовые цены

От проблемы к результату

Как мы решали конкретную задачу клиента и что получилось.

Проблема

Клиенту требовался новый сценарий покупки: отдельный раздел с готовыми сочетаниями товаров и возможностью собрать комплект на существующем сайте.

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

Решение

Создали отдельный инфоблок комплектов с привязкой к товарам каталога. Разработали компоненты списка и детальной карточки, добавили свойства, сортировку и умный фильтр.

Изменили правило добавления в корзину: покупатель выбирает минимум два товара. Добавили скрипт пересчёта цен и доработали его для оптовых условий. Проверили избранное, недоступные комплекты и кеширование, внесли исправления и перенесли изменения.

Результат

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

Реализованы минимальный выбор двух товаров, пересчёт цен и доработки для оптовых цен. На работающем сайте доступны список комплектов, сортировка, фильтры и подсказка об условии добавления в корзину.

Как это работает

Этапы реализации

Проектирование

Структура комплектов и связь с каталогом

Обсудили сценарий покупки и создали отдельный инфоблок. Для комплектов предусмотрели название, изображение, цену и привязку к исходным товарам.

1
Каталог

Список, карточка и умный фильтр

Разработали компоненты списка комплектов и детальной карточки. Добавили свойства, сортировку и умный фильтр, проверили отображение и работу избранного.

2
Корзина

Выбор минимум двух товаров

По дополнительному запросу изменили исходное правило обязательной покупки всего набора. Добавили ограничение: для оформления комплекта должны быть выбраны минимум два товара.

3
Цены

Пересчёт и оптовые условия

Добавили отдельный скрипт пересчёта цен, поскольку цена используется не только в карточке, но и при фильтрации. Затем доработали скрипт для оптовых цен.

4
Тестирование

Проверки, кеширование и перенос

Проверили карточку, фильтр, избранное и недоступные комплекты. Внесли правки после тестов, решили проблему с кешированием и перенесли изменения.

5
Каталог женских комплектов: фильтр и карточки со взрослыми моделями
Реальный интерфейс

Отдельный каталог комплектов

Комплекты представлены отдельными карточками с изображениями, названиями и ценами. Фильтр помогает отобрать подходящие сочетания, а сортировка задаёт порядок выдачи.

Детальная карточка женского комплекта: взрослая модель в бордовой шапке и шарфе, цены и характеристики; домен скрыт
Реальный интерфейс

Детальная карточка комплекта

В детальной карточке показаны товары комплекта, их характеристики и цены. Общая цена и условие выбора минимум двух товаров вынесены рядом с кнопкой добавления в корзину.

Как собирается комплект

Шапка и шарф с отдельным выбором

Комплект объединяет две товарные позиции. Для каждой пользователь выбирает доступный цвет и указывает количество. Условие добавления в корзину требует выбора минимум двух товаров.

На иллюстрации ниже объединены фрагменты длинной карточки комплекта. Это составная иллюстрация по реальному интерфейсу; расположение фрагментов адаптировано для кейса.

Составная иллюстрация по реальным фрагментам карточки комплекта: шапка и шарф, цены, цвета и поля количества
Техническая деталь

Цена должна работать и в фильтре

Недостаточно вычислить цену только при открытии карточки комплекта, если это значение участвует в умном фильтре. Данные для отбора и отображение покупателю должны быть согласованы.

Поэтому реализовали отдельный скрипт пересчёта цен. После первоначальной реализации его доработали для оптовых условий. Проверка кеширования также вошла в завершающие работы по задаче.

На чём построено решение

Технологии и инструменты

Логотип 1С-Битрикс

1С-Битрикс

Инфоблок комплектов, связи с товарами, компоненты каталога, умный фильтр и корзина.

Логотип PHP

PHP

Серверная логика компонентов и скрипт пересчёта цен, включая оптовые условия.