${name}

${value}

`; }).join(''); } function renderAirpodsConstructor(products) { const section = document.querySelector('.constructor'); if (!section) return; const t = airpodsConstructorText[activeLang]; const modelButtons = section.querySelector('.constructor__models'); const image = section.querySelector('.constructor__image'); const placeholder = section.querySelector('.constructor__image-placeholder'); const title = section.querySelector('.constructor__title'); const productName = section.querySelector('.constructor__product-name'); const price = section.querySelector('.constructor__price'); const creditElement = section.querySelector('.constructor__credit'); const buyLink = section.querySelector('.constructor__link'); modelButtons.innerHTML = products.map((product, index) => ` `).join(''); const update = (sku) => { const product = products.find((item) => item.sku === sku) || products[0]; const imageUrl = getApiProductImage(product); const numericPrice = Number(product.price); const credit = getApiCredit(product); modelButtons.querySelectorAll('.constructor__model-btn').forEach((button) => { const active = button.dataset.airpodsSku === product.sku; button.classList.toggle('constructor__model-btn--active', active); button.setAttribute('aria-selected', String(active)); }); title.textContent = t.title; productName.textContent = product.name || product.label; price.textContent = numericPrice ? `${numericPrice.toLocaleString('ru-RU')} ₸` : t.unavailable; creditElement.textContent = credit ? t.monthly(credit.amount, credit.months) : ''; buyLink.href = `https://www.technodom.kz/p/${product.sku}`; image.hidden = !imageUrl; placeholder.hidden = Boolean(imageUrl); if (imageUrl) { image.src = imageUrl; image.alt = product.name || product.label; } else { placeholder.textContent = t.imageUnavailable; } renderAirpodsSpecs(getApiCharacteristics(product, [])); }; modelButtons.addEventListener('click', (event) => { const button = event.target.closest('[data-airpods-sku]'); if (button) update(button.dataset.airpodsSku); }); update(products[0].sku); } async function initAirpodsConstructor() { const section = document.querySelector('.constructor'); if (!section) return; try { const cityId = await getConstructorCityId(); const skus = airpodsConstructorProducts.map((product) => product.sku); const [landingsResponse, titlesResponse] = await Promise.all([ fetch('https://api.technodom.kz/katalog/api/v1/products/landings', { method: 'POST', headers: { 'Content-Type': 'application/json', affiliation: 'web', ...(activeLang === 'kk' ? { 'Content-Language': 'kk-KK' } : {}), }, body: JSON.stringify({ skus, city_id: cityId, limit: 100, page: 1 }), }), fetch('https://api.technodom.kz/katalog/api/v1/products/titles', { method: 'POST', headers: { 'Content-Type': 'application/json', ...(activeLang === 'kk' ? { 'Content-Language': 'kk-KK' } : {}) }, body: JSON.stringify({ skus }), }), ]); if (!landingsResponse.ok) throw new Error('Не удалось получить AirPods из каталога'); const { payload = [] } = await landingsResponse.json(); const titles = titlesResponse.ok ? await titlesResponse.json() : []; const products = airpodsConstructorProducts.map((config) => { const landing = payload.find((product) => String(product.sku) === config.sku) || {}; const title = titles.find((product) => String(product.sku) === config.sku)?.name; return { ...config, ...landing, sku: config.sku, name: title || landing.name || config.label }; }).filter((product) => product.price || product.images?.length); if (!products.length) throw new Error('AirPods отсутствуют в каталоге'); renderAirpodsConstructor(products); } catch (error) { console.error('Не удалось инициализировать конструктор AirPods:', error); section.hidden = true; } } async function getConstructorCityId() { const cityMagentoId = JSON.parse(localStorage.getItem('cityMagentoId') || 'null')?.data; const response = await fetch('https://api.technodom.kz/config-discovery/api/v1/cities'); if (!response.ok) throw new Error('Не удалось получить список городов'); const { cities = [] } = await response.json(); return cities.find((city) => city.city_magento_id === cityMagentoId)?.city_id || '5f5f1e3b4c8a49e692fefd70'; } initAirpodsConstructor(); /* ===================== Форма заявки (регистрация) ===================== */ (function initLeadForm() { const SCRIPT_URL = 'https://script.google.com/macros/s/AKfycbyS3u3Ipqv4TmLYWQSkz0Mb5gDhmI1xU40iFg6_MTuINUTNPo-Enw0OLp2Ru6bxDgcOQA/exec'; const form = document.querySelector('.lead-form__form'); if (!form) return; const nameInput = form.querySelector('[name="name"]'); const phoneInput = form.querySelector('[name="phone"]'); const submitBtn = form.querySelector('.lead-form__submit'); const statusEl = form.querySelector('.lead-form__status'); const PHONE_PREFIX = '+7 '; /* --- Тексты формы (ru / kk) --- */ // Локаль уже определена по localStorage или lang атрибуту страницы. const leadFormText = { ru: { title: 'Оставляйте заявку и узнавайте первым о старте продаж новых Apple Watch.', nameLabel: 'ФИО', phoneLabel: 'Номер телефона', namePlaceholder: 'Иванов Иван Иванович', submit: 'Оставить заявку', errorName: 'Укажите ФИО', errorPhone: 'Введите номер полностью: +7 ХХХ ХХХ ХХ ХХ', success: 'Спасибо! Заявка отправлена.', error: 'Не удалось отправить заявку. Попробуйте ещё раз чуть позже.', }, kk: { title: 'Өтінім қалдырып, жаңа Apple Watch-тың сатылымға шығатын уақытын алғашқылардың бірі болып біліңіз.', nameLabel: 'Аты-жөні', phoneLabel: 'Телефон нөмірі', namePlaceholder: 'Асанов Асан Асанұлы', submit: 'Өтінім қалдыру', errorName: 'Аты-жөніңізді көрсетіңіз', errorPhone: 'Нөмірді толық енгізіңіз: +7 ХХХ ХХХ ХХ ХХ', success: 'Рахмет! Өтінім жіберілді.', error: 'Өтінімді жіберу мүмкін болмады. Сәл кейінірек қайталап көріңіз.', }, }; const t = leadFormText[activeLang] || leadFormText.ru; (function applyLeadFormText() { const title = document.querySelector('.lead-form__title'); const nameLabel = form.querySelector('label[for="lead-form-name"]'); const phoneLabel = form.querySelector('label[for="lead-form-phone"]'); if (title) title.textContent = t.title; if (nameLabel) nameLabel.textContent = t.nameLabel; if (phoneLabel) phoneLabel.textContent = t.phoneLabel; if (nameInput) nameInput.placeholder = t.namePlaceholder; if (submitBtn) submitBtn.textContent = t.submit; })(); /* --- Маска телефона: +7 ХХХ ХХХ ХХ ХХ --- */ // Из любой строки достаём только 10 цифр самого номера (без кода страны). function extractPhoneDigits(value) { let digits = String(value).replace(/\D/g, ''); // Ведущая «7» приходит из префикса «+7 »; «8» — если номер ввели как 8XXXXXXXXXX. if (digits[0] === '7' || digits[0] === '8') digits = digits.slice(1); return digits.slice(0, 10); } function formatPhone(digits) { let out = PHONE_PREFIX; if (digits.length) out += digits.slice(0, 3); if (digits.length > 3) out += ' ' + digits.slice(3, 6); if (digits.length > 6) out += ' ' + digits.slice(6, 8); if (digits.length > 8) out += ' ' + digits.slice(8, 10); return out; } function setCaretToEnd() { requestAnimationFrame(() => { const end = phoneInput.value.length; try { phoneInput.setSelectionRange(end, end); } catch (e) { /* no-op */ } }); } // При клике/фокусе в пустое поле сразу подставляем «+7 ». phoneInput.addEventListener('focus', () => { if (!phoneInput.value) { phoneInput.value = PHONE_PREFIX; setCaretToEnd(); } }); // Не даём поставить курсор внутрь префикса «+7 ». phoneInput.addEventListener('click', () => { if (phoneInput.selectionStart < PHONE_PREFIX.length) setCaretToEnd(); }); // Backspace не должен стирать префикс. phoneInput.addEventListener('keydown', (event) => { if (event.key !== 'Backspace') return; if (phoneInput.selectionStart === phoneInput.selectionEnd && phoneInput.selectionStart <= PHONE_PREFIX.length) { event.preventDefault(); } }); // Любой ввод переформатируем: остаются только цифры в маске +7 ХХХ ХХХ ХХ ХХ. phoneInput.addEventListener('input', () => { phoneInput.value = formatPhone(extractPhoneDigits(phoneInput.value)); setCaretToEnd(); clearError(phoneInput); }); // Вставка номера в любом формате (+7…, 8…, 7…, с пробелами/скобками). phoneInput.addEventListener('paste', (event) => { event.preventDefault(); const pasted = event.clipboardData ? event.clipboardData.getData('text') : ''; let digits = String(pasted).replace(/\D/g, ''); if (digits.length > 10) digits = digits.slice(-10); else if (digits.length < 10) digits = digits.replace(/^[78]/, ''); phoneInput.value = formatPhone(digits.slice(0, 10)); setCaretToEnd(); clearError(phoneInput); }); // Если ничего не ввели — очищаем поле, чтобы показывался placeholder. phoneInput.addEventListener('blur', () => { if (extractPhoneDigits(phoneInput.value).length === 0) phoneInput.value = ''; }); /* --- Валидация и отправка --- */ function fieldError(input) { return form.querySelector('[data-error-for="' + input.name + '"]'); } function showError(input, message) { const el = fieldError(input); if (el) el.textContent = message; input.classList.add('lead-form__input--invalid'); } function clearError(input) { const el = fieldError(input); if (el) el.textContent = ''; input.classList.remove('lead-form__input--invalid'); } function setStatus(message, type) { if (!statusEl) return; statusEl.textContent = message || ''; statusEl.hidden = !message; statusEl.classList.toggle('lead-form__status--success', type === 'success'); statusEl.classList.toggle('lead-form__status--error', type === 'error'); } nameInput.addEventListener('input', () => clearError(nameInput)); form.addEventListener('submit', async (event) => { event.preventDefault(); setStatus('', null); const name = nameInput.value.trim().replace(/\s+/g, ' '); const digits = extractPhoneDigits(phoneInput.value); let hasError = false; if (name.length < 2) { showError(nameInput, t.errorName); hasError = true; } if (digits.length !== 10) { showError(phoneInput, t.errorPhone); hasError = true; } if (hasError) return; submitBtn.disabled = true; try { await fetch(SCRIPT_URL, { method: 'POST', // text/plain — «простой» запрос без CORS-preflight; Apps Script // всё равно читает тело как строку и делает JSON.parse. headers: { 'Content-Type': 'text/plain;charset=utf-8' }, body: JSON.stringify({ name: name, phone: '+7' + digits }), }); form.reset(); phoneInput.value = ''; clearError(nameInput); clearError(phoneInput); setStatus(t.success, 'success'); } catch (error) { console.error('Не удалось отправить заявку:', error); setStatus(t.error, 'error'); } finally { submitBtn.disabled = false; } }); })();

AirPods 5 уже в Technodom!

Выберите модель