Як ми розробляємо віджет вибору пунктів видачі на карті для 1С-Бітрікс

Ми часто стикаємося з ситуацією: на сайті інтернет-магазину сотні пунктів видачі, а стандартний компонент sale.order.ajax пропонує лише випадний список з адресами. Це незручно для користувача — він не бачить, де саме знаходяться ПВЗ відносно його адреси, а менеджеру підтримки доводиться пояснювати, як знайти потрібний пункт. Ми розробляємо віджет з картою, який вирішує цю проблему. У статті розповімо, як влаштована архітектура такого рішення, як зберігаються дані та як віджет вбудовується в checkout Бітрікс.

Віджет дозволяє користувачеві вибрати ПВЗ на карті з фільтрами за режимом роботи, типом пункту та відстанню. Він значно прискорює оформлення замовлення: за нашими вимірами, час вибору скорочується в 3–5 разів порівняно зі списком. До того ж знижується кількість помилок — користувач бачить актуальну інформацію про пункт (розклад, контакти, фотографії).

Як віджет прискорює оформлення замовлення?

При стандартному списку користувач змушений читати адреси та уявляти розташування. Карта дає візуальне уявлення, а кластеризація дозволяє працювати з тисячами точок без втрати продуктивності. Вибір ПВЗ зводиться до одного кліку. Інтеграція з розрахунком вартості доставки відбувається миттєво — віджет надсилає запит до обробника та показує ціну і термін поруч з адресою ще до підтвердження.

Де живе віджет в архітектурі Бітрікс

Віджет вбудовується в процес оформлення замовлення. Використовуємо подію OnBeforeSaleOrderFinalAction або шаблон компонента sale.checkout.v2 — залежно від того, який checkout використовується на сайті.

Віджет — це окремий JS-компонент, який:

1. Завантажує список ПВЗ через AJAX-запит до обробника на сервері.
2. Рендерить карту (Яндекс.Карти або Leaflet з OpenStreetMap).
3. Розставляє мітки ПВЗ на карті.
4. По кліку на мітку показує інформацію про ПВЗ.
5. При підтвердженні вибору записує ПВЗ у властивість замовлення.

Зберігання даних про пункти видачі

Якщо ПВЗ надходять від служби доставки (СДЕК, Boxberry, Укрпошта) — дані синхронізуються періодично. Структура:

CREATE TABLE custom_pvz_points (
    id          SERIAL PRIMARY KEY,
    provider    VARCHAR(50) NOT NULL,   -- 'cdek', 'boxberry', 'pochta'
    external_id VARCHAR(100) NOT NULL,
    name        VARCHAR(255) NOT NULL,
    address     TEXT NOT NULL,
    city        VARCHAR(100),
    lat         DECIMAL(10,8) NOT NULL,
    lng         DECIMAL(11,8) NOT NULL,
    schedule    JSON,
    phone       VARCHAR(50),
    is_active   TINYINT DEFAULT 1,
    synced_at   DATETIME,
    INDEX idx_city (city),
    INDEX idx_coords (lat, lng),
    UNIQUE KEY uk_provider_ext (provider, external_id)
);

Синхронізація запускається через агент Бітрікс (\Bitrix\Main\Agent) раз на добу або за запитом з адміністративної панелі.

Серверний обробник (AJAX-endpoint)

Запити від віджета обробляються через /bitrix/services/main/ajax.php або local/ajax/pvz.php. Обробник приймає параметри: місто, координати центру карти, радіус, провайдер доставки.

// Отримуємо ПВЗ в радіусі N км від координат
$lat = (float)$_REQUEST['lat'];
$lng = (float)$_REQUEST['lng'];
$radius = (int)($_REQUEST['radius'] ?? 10); // км

// Формула Haversine в SQL
$sql = "
    SELECT *, (
        6371 * ACOS(
            COS(RADIANS({$lat})) * COS(RADIANS(lat))
            * COS(RADIANS(lng) - RADIANS({$lng}))
            + SIN(RADIANS({$lat})) * SIN(RADIANS(lat))
        )
    ) AS distance
    FROM custom_pvz_points
    WHERE is_active = 1
    HAVING distance <= {$radius}
    ORDER BY distance
    LIMIT 100
";

Результат кешується через \Bitrix\Main\Data\Cache з ключем по місту та провайдеру. Список ПВЗ змінюється раз на добу — кеш на 12–24 години виправданий.

Фронтенд: інтеграція з Яндекс.Картами

// Ініціалізація карти
ymaps.ready(function() {
    const map = new ymaps.Map('pvz-map', {
        center: [userLat, userLng],
        zoom: 12,
        controls: ['zoomControl', 'geolocationControl']
    });

    // Кластеризація міток при великій кількості ПВЗ
    const clusterer = new ymaps.Clusterer({
        preset: 'islands#invertedDarkBlueClusterIcons',
        groupByCoordinates: false,
    });

    points.forEach(pvz => {
        const placemark = new ymaps.Placemark(
            [pvz.lat, pvz.lng],
            {
                balloonContentHeader: pvz.name,
                balloonContentBody: `${pvz.address}<br>${pvz.schedule}`,
                hintContent: pvz.name,
            },
            { preset: 'islands#darkBlueIcon' }
        );

        placemark.events.add('click', function() {
            selectPvz(pvz);
        });

        clusterer.add(placemark);
    });

    map.geoObjects.add(clusterer);
});

При виборі ПВЗ через selectPvz() заповнюються приховані поля форми замовлення — адреса доставки та зовнішній ID пункту. Ці дані передаються у властивість замовлення DELIVERY_LOCATION або кастомну властивість UF_PVZ_ID.

Геолокація користувача

При відкритті віджета запитуємо координати користувача через navigator.geolocation.getCurrentPosition(). Якщо дозвіл не надано — визначаємо місто через IP (сервіс ip-api.com або вбудований геолокатор Бітрікс \Bitrix\Main\Web\IpTools). Карта центрується на знайденому місті.

Інтеграція з розрахунком вартості доставки

Після вибору ПВЗ віджет оновлює вартість доставки. Запит до обробника, який викликає \Bitrix\Sale\Delivery\Services\Manager::calculateDelivery() з обраним пунктом — повертає вартість та термін. Дані показуються поруч з адресою ПВЗ ще до підтвердження.

Синхронізація з провайдерами

Агент Бітрікс запускає синхронізацію, оновлює custom_pvz_points через INSERT ... ON DUPLICATE KEY UPDATE, знімає прапорець is_active у зниклих пунктів.

Що входить в роботу (під ключ)

• Проектування схеми даних та вибір картографічного API
• Розробка серверної частини: зберігання ПВЗ, AJAX-обробник, агенти синхронізації
• Розробка фронтенду: карта, мітки, кластеризація, фільтри
• Інтеграція в checkout: передача обраного ПВЗ в замовлення, оновлення вартості доставки
• Документація та навчання: передача вихідних кодів, інструкція з додавання нових провайдерів
• Технічна підтримка протягом місяця після здачі

Ми гарантуємо, що віджет працюватиме на всіх сучасних браузерах та мобільних пристроях. Всі роботи ведуться за договором з фіксованим кошторисом. Щоб оцінити проект під вашу задачу, зв'яжіться з нами — ми проаналізуємо поточний checkout та кількість ПВЗ. Вартість — від $500, термін — від 2 тижнів. Маємо 5+ років досвіду в інтеграціях з Бітрікс, реалізовано 30+ подібних проектів.

Терміни

Разом: 2–3 тижні. Якщо потрібна інтеграція з кількома провайдерами доставки одночасно — плюс 3–5 днів на кожного.

Документація Яндекс.Карт: Яндекс.Карти API. Докладніше про подію OnBeforeSaleOrderFinalAction — в офіційному курсі 1С-Бітрікс.

Розробка та налаштування модулів 1С-Бітрікс

Головна пастка Бітрікса — init.php. Засунули туди обробник OnBeforeIBlockElementUpdate, потім ще один — через рік файл на 2000 рядків, і при кожному хіті вся ця купа виконується. Ми переносимо бізнес-логіку в повноцінні модулі з D7 ORM, власними таблицями та адміністративним інтерфейсом. Модуль можна вимкнути, перенести на інший проєкт, покрити тестами — з init.php нічого з цього не вийде. Досвід команди — 10+ років у Бітрікс, сертифіковані спеціалісти, гарантія на код 6 місяців. Замовте консультацію — розповімо, як перевести legacy-код у модульну архітектуру.

Як модульна архітектура підвищує продуктивність?

Чому init.php — найгірше місце для бізнес-логіки?

Init.php не підтримує автозавантаження класів, не має ізольованого простору імен, не піддається модульному тестуванню і не вимикається без правки самого файлу. Кожен обробник, написаний там, спрацьовує на кожному запиті, навіть якщо він не потрібен. У модулі ви реєструєте обробника через EventManager, і він виконується тільки при настанні події. Різниця в продуктивності — до 3 разів при 10+ обробниках.

Стандартні модулі: типові проблеми та рішення

Інформаційні блоки. Архітектура ІБ — перше, що ми рев'юїмо на будь-якому проєкті. Класична помилка: один інфоблок каталогу з 80 властивостями, з яких 30 — множинні. Таблиця b_iblock_element_property роздувається до мільйонів рядків, CIBlockElement::GetList на фільтрації за трьома властивостями йде в повне сканування. Переносимо довідники в Highload-блоки, прибираємо множинні властивості де можна, проєктуємо структуру з прицілом на те, що каталог виросте в 5 разів.

Інтернет-магазин (sale). Бізнес-правила кошика — окрема історія. Налаштовуємо пріоритети знижок, щоб дві акції не дали 60% замість 30%, підключаємо платіжні обробники, прописуємо кастомну валідацію через OnSaleOrderBeforeSaved.

Пошук. Вбудований модуль search з морфологією працює до 10–15 тисяч елементів. Далі — Elasticsearch. Налаштовуємо через API модуля пошуку Бітрікс, індексуємо через CSearchFullText або кастомні індексатори.

Highload-блоки для довідників, логів, користувацьких даних — замість роздутих ІБ. Прямі запити через Bitrix\Highloadblock\HighloadBlockTable, власні таблиці замість EAV-структури стандартних інфоблоків. Мільйон записів — без деградації.

Поштові події. Налаштування — не лише шаблони в b_event_message. Головне — SPF, DKIM, DMARC на DNS, інакше транзакційні листи летять у спам. Перевіряємо доставність, налаштовуємо bounce-обробку.

Проектування інфоблоків для продуктивності

Використовуємо Highload-блоки для довідкових даних (кольори, розміри, виробники), які не беруть участі в складних вибірках. Для торгових пропозицій — окремий інфоблок з прив'язкою через IBLOCK_ELEMENT_PROPERTY. Увімкнемо INDEX_PROPERTY для часто фільтрованих властивостей. Кешування теговане: при зміні елемента скидається лише пов'язаний кеш. Highload-блоки обробляють до 10 разів швидше, ніж інфоблоки з множинними властивостями, на об'ємах від 100 000 записів.

Розробка кастомних модулів

Кожен модуль — за структурою /local/modules/vendor.modulename/:

• install/index.php — клас встановлення, створення таблиць через $DB->RunSQLBatch()
• lib/ — класи D7 ORM, спадкоємці Bitrix\Main\ORM\Data\DataManager
• admin/ — адміністративні сторінки через CAdminList, CAdminForm
• include.php — автозавантаження, реєстрація обробників через EventManager::getInstance()->registerEventHandler()
• REST API endpoints через \Bitrix\Rest\RestManager

Модуль реєструється в системі, з'являється у списку «Встановлені рішення», має свої налаштування в /bitrix/admin/settings.php?mid=vendor.modulename. Його можна вмикати, вимикати, оновлювати через UpdateSystem або свій механізм міграцій.

Приклади реалізованих завдань:

• Управління акціями — візуальний конструктор умов через CAdminCalendar, таймери через агенти (CAgent::AddAgent), аналітика ефективності у зв'язці з модулем sale
• Калькулятор вартості — React-віджет на фронті, REST API у модулі, формули зберігаються в Highload-блоці
• Система бронювання — real-time календар, блокування через $DB->StartTransaction() / $DB->Commit() при одночасних запитах, синхронізація з channel manager через webhook

Компоненти та композитний кеш

Кастомізація компонентів — через result_modifier.php і component_epilog.php, не через правку template.php стандартного шаблону. Так ядро оновлюється безболісно.

Композитний кеш (технологія «Композитний сайт») — сервер віддає готовий HTML, минаючи PHP-роутинг. Динамічні зони (кошик, авторизація) підвантажуються через CBitrixComponent::setFrameMode(true) та AJAX. TTFB падає до 30–50 мс. Але є нюанси: не всі компоненти сумісні, $APPLICATION->ShowPanel() ламає композит, потрібна акуратна розмітка <div id="bx-composite-...">.

Маркетплейс: аудит перед встановленням

Перед встановленням модуля з маркетплейсу — обов'язковий аудит. Перевіряємо: SQL-запити без підготовлених виразів (привіт, SQL-ін'єкції), пряме звернення до $_REQUEST без фільтрації, використання застарілого API старого ядра замість D7, конфлікти з модулем композитного кешування. Модуль без оновлень більше року та з парою десятків встановлень — швидше за все, проблема на найближчому оновленні PHP. Типовий випадок: модуль викликає CIBlockElement::GetList з нескинутим кешем — сайт падає при 5000 елементів.

Міграція на D7

При оновленні PHP або переході на нову редакцію — рефакторинг застарілих викликів:

• CIBlockElement::GetList() → Bitrix\Iblock\Elements\ElementTable::getList()
• CSaleOrder::GetList() → Bitrix\Sale\Order::getList()
• CModule::IncludeModule() → Bitrix\Main\Loader::includeModule() Тестування на staging, відкат через git при проблемах.

Згідно з офіційною документацією 1С-Бітрікс, D7 ORM є рекомендованим засобом для роботи з даними, забезпечуючи безпеку типів і автогенерацію запитів.

Порівняння підходів: Init.php vs Модуль

Вартість та склад розробки модулів

Що входить у розробку модуля?

• Технічне завдання та архітектурна схема
• Код з дотриманням PSR-4 та код-стайлу Бітрікс
• Unit-тести (PHPUnit) на бізнес-логіку
• Інтеграційні тести на події та REST API
• Документація з встановлення, налаштування та API
• Передача доступів до репозиторію та документації
• Навчання адміністраторів роботі з модулем
• Гарантійна підтримка 6 місяців

Орієнтовні терміни та складність:

Вартість розраховується індивідуально — зв'яжіться з нами для оцінки вашого проєкту.

Тестування модулів

Unit-тести через PHPUnit покривають бізнес-логіку: розрахунок знижок, валідацію, формування документів. Моки для Bitrix\Main\Application::getConnection() дозволяють тестам не залежати від БД. Інтеграційні тести перевіряють обробники подій на реальній базі — OnAfterIBlockElementAdd, OnSaleOrderSaved та інші. REST API endpoints тестуємо через curl або PHPUnit HTTP-клієнт. Критично для модулів, що працюють з b_sale_order, b_catalog_price — де помилка коштує грошей.

Сумісність перевіряється на PHP 7.4, 8.0, 8.1, 8.2 та редакціях: Стандарт, Малий бізнес, Бізнес. Перевіряємо конфлікти з популярними модулями маркетплейсу — вони люблять перехоплювати ті самі події. Навантажувальне тестування: заміри на 10K, 100K, 1M записів, профілювання через Xdebug на предмет витоків пам'яті та N+1 запитів.

Приклади з практики

Модуль акцій для мережі електроніки. Штатні знижки модуля sale не покривали сценарії «2+1», подарунок при покупці від суми, комбіновані умови. Зібрали візуальний конструктор: маркетолог створює правила через drag-and-drop, без тікетів у розробку. Календар акцій, автодеактивація через агенти, аналітика у прив'язці до b_sale_order — конверсія, середній чек, кількість застосувань. Час запуску нової акції впав з двох днів до півгодини.

Калькулятор для будівельників. Параметри (площа, матеріали, поверховість) → формула → попередній кошторис → заявка в CRM через CRest::call('crm.lead.add'). Регіональні коефіцієнти та сезонні націнки — з Highload-блоку, ціни матеріалів — з обміну з 1С. Кількість цільових заявок зросла на третину: клієнти бачать розбивку за статтями до дзвінка менеджеру.

Бронювання для мережі готелів. Real-time доступність через AJAX-запити до кастомної таблиці vendor_booking_slots, розрахунок тарифів за сезоном, синхронізація з Booking.com через channel manager API. Блокування номера при одночасному бронюванні — через SELECT ... FOR UPDATE у транзакції. Таймзони обробляються через \DateTimeZone — гість із Владивостока та менеджер із Москви бачать одну картину.

Оцінимо проєкт за 1 день. Пишіть — розповімо, що входить у розробку під ключ. Зв'яжіться з нами для консультації за вашим проєктом. Замовте розробку модуля під ключ — отримайте готове рішення з документацією та підтримкою.