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

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

Таблиця розмірів взуття складніша, ніж одягу: розміри взуття мають три несумісні системи (російська/європейська, американська чоловіча/жіноча, британська), плюс довжина стопи в сантиметрах як універсальна мірка. Різні виробники використовують різні колодки, і формальна конвертація «RU 40 = EU 40» не завжди вірна для конкретного бренду. Це потрібно враховувати в архітектурі.

Відмінності таблиці взуття від одягу

У взутті один ключовий параметр — довжина стопи в сантиметрах. Все інше (RU, EU, US M/W, UK) — системи позначень, які конвертуються з довжини стопи за стандартними формулами, але з поправкою на бренд.

Додаткові складнощі:

• Статеві відмінності: US 8 чоловічий ≠ US 8 жіночий (різниця ~1.5 EU-розміру)
• Дитяче взуття — окрема шкала (17–35 EU)
• Деякі бренди (Converse, Vans) мають свої нюанси конвертації
• Повнота взуття (B, D, EE) — рідко, але зустрічається у професійних магазинах

Структура БД для таблиці взуття

CREATE TABLE b_shoe_size_charts (
    ID          SERIAL PRIMARY KEY,
    NAME        VARCHAR(255) NOT NULL,   -- "Nike чоловіча", "Adidas дитяча"
    BRAND_ID    INT,
    GENDER      VARCHAR(10),             -- 'male', 'female', 'kids', 'unisex'
    AGE_GROUP   VARCHAR(20),             -- 'adult', 'kids', 'baby'
    ACTIVE      BOOLEAN DEFAULT TRUE
);

CREATE TABLE b_shoe_size_rows (
    ID             SERIAL PRIMARY KEY,
    CHART_ID       INT NOT NULL REFERENCES b_shoe_size_charts(ID),
    FOOT_LENGTH_MM INT NOT NULL,    -- довжина стопи в мм (основна мірка)
    SIZE_RU        NUMERIC(4,1),    -- російський розмір
    SIZE_EU        NUMERIC(4,1),    -- європейський розмір
    SIZE_US_M      NUMERIC(4,1),    -- US чоловічий
    SIZE_US_W      NUMERIC(4,1),    -- US жіночий
    SIZE_UK        NUMERIC(4,1),    -- британський
    SIZE_CM        NUMERIC(4,1),    -- японський/корейський (в см)
    SORT           INT DEFAULT 100
);

Довжина стопи в міліметрах — не сантиметрах — як базова мірка, тому що стандарти взуття працюють з точністю до 5 мм.

Компонент таблиці розмірів взуття

Компонент аналогічний одяговому, але з особливостями виведення.

Вибір статі — якщо таблиця «unisex», потрібний перемикач для показу US M або US W:

<div class="size-gender-tabs">
    <button class="active" data-gender="male">Чоловічі (US M)</button>
    <button data-gender="female">Жіночі (US W)</button>
</div>

document.querySelectorAll('.size-gender-tabs button').forEach(btn => {
    btn.addEventListener('click', function() {
        const gender = this.dataset.gender;
        document.querySelectorAll('.col-us-m').forEach(el => el.hidden = gender !== 'male');
        document.querySelectorAll('.col-us-w').forEach(el => el.hidden = gender !== 'female');
    });
});

Колонки таблиці для чоловічого дорослого взуття:

Напіврозміри (39.5, 40.5) мають бути в таблиці — багато виробників їх використовують.

Інтерактивний підбір за довжиною стопи

Головна відмінність взуття: покупець знає довжину своєї стопи (або може її виміряти), але не завжди знає розмір у різних системах. Інтерактивна форма:

<div class="shoe-size-finder">
    <label>Введіть довжину стопи (мм або см):</label>
    <input type="number" id="foot-length" placeholder="255" min="150" max="340">
    <select id="length-unit">
        <option value="mm">мм</option>
        <option value="cm">см</option>
    </select>
    <button onclick="findShoeSize()">Знайти мій розмір</button>
</div>

function findShoeSize() {
    let length = parseInt(document.getElementById('foot-length').value);
    const unit = document.getElementById('length-unit').value;
    if (unit === 'cm') length = Math.round(length * 10);

    // Шукаємо найближчий розмір (стопа вміщується в розмір + до 5 мм запасу)
    const sizes = window.shoeSizeData;
    const match = sizes.find(s => length <= s.foot_length_mm + 5 && length > s.foot_length_mm - 5);

    if (match) {
        highlightRow(match.id);
        showResult(`Ваш розмір: RU ${match.size_ru} / EU ${match.size_eu}`);
    } else {
        showResult('Розмір не знайдено в таблиці. Уточніть у консультанта.');
    }
}

Інструкція з вимірювання стопи

Текстова інструкція + SVG-ілюстрація у модальному вікні. Стандартна інструкція: поставити ногу на папір, обвести, виміряти від п'яти до найдовшого пальця. Це знижує кількість помилок при самостійному вимірюванні.

Ілюстрацію робимо SVG — не PNG, тому що SVG масштабується без втрати якості і важить 3–5 KB проти 30–50 KB для PNG аналогічного вигляду.

Інтеграція з вибором торгових пропозицій

У взутті торгові пропозиції — це розміри. У кожного ТП є властивість SHOE_SIZE зі значенням типу «40», «40.5», «41». Це значення зіставляється з рядками таблиці за SIZE_RU або SIZE_EU.

При відкритті сторінки:

1. Якщо ТП не вибрано — таблиця показана повністю
2. При виборі розміру (ТП) — відповідний рядок підсвічується
3. При кліку на рядок таблиці — автоматично вибирається відповідне ТП

// Клік по рядку таблиці
document.querySelectorAll('.size-chart tr[data-size-ru]').forEach(row => {
    row.addEventListener('click', function() {
        const sizeRu = this.dataset.sizeRu;
        // Знайти і активувати кнопку ТП з цим розміром
        const offerBtn = document.querySelector(`[data-size="${sizeRu}"]`);
        if (offerBtn && !offerBtn.disabled) offerBtn.click();
    });
});

Розмірна сітка дитячого взуття

Дитяче взуття вимагає окремої таблиці. EU-розміри для дітей починаються з 16–17 (новонароджені) і йдуть до 35–36 (перехідні розміри). Довжина стопи — ключовий параметр, тому що дитяча нога росте швидко і потрібен правильний запас.

Додатковий параметр для дитячої таблиці: рекомендований вік (орієнтовно, не як жорстке правило):

Строки

Таблиця розмірів взуття — інвестиція у зниження повернень. У fashion-сегменті повернення однієї пари взуття коштує дорожче від створення таблиці: витрати на кур'єра, переупакування, втрата товарного вигляду. Проект окупається за 1–2 місяці роботи магазину.