<?
require($_SERVER["DOCUMENT_ROOT"]."/bitrix/header.php");
$APPLICATION->SetTitle("Оформление заявки для детального расчёта системы отопления");

use Bitrix\Main\Page\Asset;
Asset::getInstance()->addCss("/local/templates/home-comfort/components/bitrix/catalog/promo/bitrix/catalog.section/.default/style.css");
Asset::getInstance()->addJs("/local/templates/home-comfort/components/bitrix/catalog/promo/bitrix/catalog.section/.default/script.js");

?>

<div class="heating-calculation-form">
    <div class="calculation__title-blu">Оформление заявки для детального расчёта системы отопления</div>
    <form class="calculation__content">
        <div class="calculation__row">
            <div class="calculation__col calculation__col-width-left">
                <div class="calculation__head">1. Контактные данные</div>
                <div class="calculation__text">
                    Оставьте Ваши контакты. На&nbsp;них мы&nbsp;в&nbsp;дальнейшем вышлем
                    готовый проект системы отопления Electrolux.
                    Также, возможно, они понадобятся для уточнения данных для расчёта
                </div>
            </div>
            <div class="calculation__col calculation__col-width-right calculation__col_flex-direction">
                <div class="calculation__col-items">
                    <div class="calculation__field calculation__field_big">
                         <div class="calculation__field-name">Имя</div>
                         <input class="calculation__field-enter" name="name" type="text" value="">
                    </div>
                    <div class="calculation__field-prompt">
                        Пожалуйста, представьтесь
                    </div>
                </div>
                <div class="calculation__col-items">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-name">Телефон</div>
                        <input class="calculation__field-enter" name="phone" type="text" value="">
                    </div>
                    <div class="calculation__field-prompt">
                        Для уточнения важной информации не указанной в заявке
                    </div>
                </div>
                <div class="calculation__col-items">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-name">Электронная почта</div>
                        <input class="calculation__field-enter" name="mail" type="text" value="">
                    </div>
                    <div class="calculation__field-prompt">
                        На эту почту направим результат расчета. Никакого спама!
                    </div>
                </div>
                <div class="calculation__col-items">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-name">Город или регион</div>
                        <input class="calculation__field-enter" name="city" type="text" value="">
                    </div>
                    <div class="calculation__field-prompt">
                        Укажите где находится объект, для определения климата
                    </div>
                </div>
            </div>
        </div>
        <div class="calculation__row">
            <div class="calculation__col calculation__col-width-left">
                <div class="calculation__head">2. Основное или дополнительное</div>
                <div class="calculation__text">
                    Вы&nbsp;хотите использовать систему отопления Electrolux в&nbsp;качестве
                    основного и&nbsp;единственного источника
                    тепла или в&nbsp;дополнение к&nbsp;имеющемуся отоплению?
                </div>
            </div>
            <div class="calculation__col calculation__col-width-right">
                <div class="calculation__radio">
                    <label class="calculation__radio-label">
                        <input class="calculation__radio-input" type="radio" name="radiant">
                        <div class="calculation__text">
                            Единственный источник тепла
                        </div>
                    </label>
                    <div class="calculation__field-prompt">
                        Выберите этот пункт, если не планируете обогревать здание ничем другим
                    </div>
                </div>
                <div class="calculation__radio">
                    <label class="calculation__radio-label">
                        <input class="calculation__radio-input" type="radio" name="radiant">
                        <div class="calculation__text">
                            Дополнительный источник тепла
                        </div>
                    </label>
                    <div class="calculation__field-prompt">
                        Выберите этот пункт, если уже есть какая-либо система отопления, но требуется вспомогательный источник тепла
                    </div>
                </div>
            </div>
        </div>
        <div class="calculation__row">
            <div class="calculation__col calculation__col-width-left">
                <div class="calculation__head">3. Режим эксплуатации</div>
                <div class="calculation__text">
                    Будете использовать отопление круглый год или только в&nbsp;межсезонье?
                </div>
            </div>
            <div class="calculation__col calculation__col-width-right">
                <div class="calculation__radio">
                    <label class="calculation__radio-label">
                        <input class="calculation__radio-input" type="radio" name="season">
                        <div class="calculation__text">
                            Круглый год
                        </div>
                    </label>
                    <div class="calculation__field-prompt">
                        Выберите это поле, если планируете использовать систему отопления зимой
                    </div>
                </div>
                <div class="calculation__radio">
                    <label class="calculation__radio-label">
                        <input class="calculation__radio-input" type="radio" name="season">
                        <div class="calculation__text">
                            Только период весна-осень
                        </div>
                    </label>
                    <div class="calculation__field-prompt">
                        Выберите это поле, если не планируете отапливать здание зимой
                    </div>
                </div>
            </div>
        </div>
        <div class="calculation__row">
            <div class="calculation__col calculation__col-width-left">
                <div class="calculation__head">4. Размер объекта</div>
                <div class="calculation__text">
                    Укажите длину и&nbsp;ширину объекта.<br> <br>

                    Для того, чтобы рассчитать площадь стен,
                    необходимо сложить все длины стен по&nbsp;наружной
                    стороне здания и&nbsp;умножить на&nbsp;высоту.
                    Именно для этого требуется знать максимальную длину и&nbsp;ширину объекта.
                </div>
            </div>
            <div class="calculation__col calculation__col-width-right calculation__col_flex-direction">
                <div class="calculation__col_flex-mob">
                <div class="calculation__col-items">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-name">Длина</div>
                        <input class="calculation__field-enter" name="length" type="text" value="">
                        <div class="calculation__field-measurement">м</div>
                    </div>
                    <div class="calculation__field-prompt">
                        Укажите длину по большей стене
                    </div>
                </div>
                <div class="calculation__col-items">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-name">Ширина</div>
                        <input class="calculation__field-enter" name="width" type="text" value="">
                        <div class="calculation__field-measurement">м</div>
                    </div>
                    <div class="calculation__field-prompt">
                        Укажите ширину по большей стене
                    </div>
                </div>
                </div>
            </div>
        </div>
        <div class="calculation__row">
            <div class="calculation__col calculation__col-width-left">
                <div class="calculation__head">5. Kоличество этажей</div>
                <div class="calculation__text">
                    Укажите количество и&nbsp;среднюю высоту этажей.
                    <br> <br>
                    Необходимо указать все этажи объекта, мансардные и&nbsp;не&nbsp;отапливаемые.
                    <br> <br>
                    Если Вы&nbsp;не&nbsp;планируете устанавливать отопление на&nbsp;все этажи, то&nbsp;тепло
                    в&nbsp;любом случае будет распространяться в&nbsp;холодные помещения.
                    В&nbsp;расчёте отопления нужно это учитывать. В&nbsp;противном случае
                    мощности системы отопления может не&nbsp;хватить для создания
                    комфортной комнатной температуры.

                </div>
            </div>
            <div class="calculation__col calculation__col-width-right calculation__col_flex-direction">
                <div class="calculation__col-items">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-select-box">
                        <div class="calculation__field-name">Количество этажей</div>
                         <label for="calculation__select-box" class="calculation__select-label calculation__select-box"></label>
                        <select id="calculation__select-box" class="calculation__select">
                            <option value="1">1 Этаж</option>
                            <option value="2">2 Этажа</option>
                        </select>
                        </div>
                    </div>
                    <div class="calculation__field-prompt">
                        Укажите количество этажей
                    </div>
                </div>
                <div class="calculation__col_flex-mob">
                <div class="calculation__col-items">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-name">Высота комнат (1 этаж) </div>
                        <input class="calculation__field-enter" name="heightRoom" type="text" value="">
                        <div class="calculation__field-measurement"> м</div>
                    </div>
                    <div class="calculation__field-prompt">
                        Укажите среднюю высоту – это расстояние от пола до потолка этажа
                    </div>
                </div>
                <div class="calculation__col-items hidden">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-name">Высота комнат (2 этаж)</div>
                        <input class="calculation__field-enter" name="heightRoom2" type="text" value="">
                        <div class="calculation__field-measurement"> м</div>
                    </div>
                    <div class="calculation__field-prompt">
                        Укажите среднюю высоту – это расстояние от пола до потолка этажа
                    </div>
                </div>
                </div>
                <div class="calculation__radio">
                    <label class="calculation__radio-label">
                        <input class="calculation__radio-input" type="radio" name="partObject">
                        <div class="calculation__text">
                            Требуется отапливать только часть объекта
                        </div>
                    </label>
                    <div class="calculation__field-prompt">
                        Пример: вариант, когда вы не планируете зимой обогревать второй этаж.
                    </div>
                </div>
            </div>
        </div>
        <div class="calculation__row">
            <div class="calculation__col calculation__col-width-left">
                <div class="calculation__head">6. Площади помещений</div>
                <div class="calculation__text">
                    Укажите площади и&nbsp;количество окон всех помещений. Для удобства, рекомендуем, указать название комнат.
                    <br> <br>
                    Площадь помещения определяется как длина помещения в&nbsp;метрах, умноженная на&nbsp;ширину помещения.
                    <br> <br>
                    Информация о&nbsp;количестве окон нам нужна для того,
                    чтобы рассчитать количество конвекторов в&nbsp;помещении.
                    Согласно СНиП 41-01-2003 отопительные приборы
                    рекомендуется размещать под световыми проёмами (окнами).
                    <br> <br>
                    В&nbsp;проекте отопления комнаты будут обозначены в&nbsp;соответствии с&nbsp;Вашими названиями.
                </div>
            </div>
            <div class="calculation__col calculation__col-width-right">
                <div class="calculation__col-floor">
                    <div class="calculation__text">
                        1 этаж (список помещений):
                    </div>
                <div class="inline">
                    <div class="calculation__field calculation__field_big">
                        <div class="calculation__field-name js-increment">Название помещения #<span>1</span></div>
                        <input class="calculation__field-enter" name="name-room" type="text" value="">
                    </div>
                    <div class="calculation__field calculation__field_small">
                        <div class="calculation__field-name">Площадь</div>
                        <input class="calculation__field-enter" name="square" type="text" value="" onkeyup="this.value = this.value.replace (/\D/, '')">
                        <div class="calculation__field-measurement">м<sup>2</sup></div>
                    </div>
                    <div class="calculation__field calculation__field_small">
                        <div class="calculation__field-name">Высота потолка</div>
                        <input class="calculation__field-enter" name="ceiling-height" type="text" value="" onkeyup="this.value = this.value.replace (/\D/, '')">
                        <div class="calculation__field-measurement">м</div>
                    </div>
                    <div class="calculation__field calculation__field_small">
                        <div class="calculation__field-name">Количество окон</div>
                        <input class="calculation__field-enter" name="windows" type="text" value="">
                    </div>
                </div>
                <div class="calculation__add-button calculation__add-button_indent js-add-room">
                    <div class="calculation__add-icon-blu"></div>
                    <div class="calculation__add-text">Добавить помещение</div>
                </div>
                </div>
                <div class="calculation__col-floor hidden">
                    <div class="calculation__text">
                        2 этаж (список помещений):
                    </div>
                    <div class="inline">
                        <div class="calculation__field calculation__field_big">
                            <div class="calculation__field-name js-increment">Название помещения #<span>1</span></div>
                            <input class="calculation__field-enter" name="name-room" type="text" value="">
                        </div>
                        <div class="calculation__field calculation__field_small">
                            <div class="calculation__field-name">Площадь</div>
                            <input class="calculation__field-enter" name="square" type="text" value="">
                            <div class="calculation__field-measurement">м<sup>2</sup></div>
                        </div>
                        <div class="calculation__field calculation__field_small">
                            <div class="calculation__field-name">Высота потолка</div>
                            <input class="calculation__field-enter" name="ceiling-height" type="text" value="">
                            <div class="calculation__field-measurement">м</div>
                        </div>
                        <div class="calculation__field calculation__field_small">
                            <div class="calculation__field-name">Количество окон</div>
                            <input class="calculation__field-enter" name="windows" type="text" value="">
                        </div>
                    </div>
                    <div class="calculation__add-button calculation__add-button_indent js-add-room">
                        <div class="calculation__add-icon-blu"></div>
                        <div class="calculation__add-text">Добавить помещение</div>
                    </div>
                </div>
            </div>
        </div>
        <div class="calculation__row">
            <div class="calculation__col calculation__col-width-left">
                <div class="calculation__head">7. Остекление</div>
                <div class="calculation__text">
                    Укажите наличие нестандартного остекления
                </div>
            </div>
            <div class="calculation__col calculation__col-width-right">
                <div class="calculation__radio">
                    <label class="calculation__radio-label">
                        <input class="calculation__radio-input" type="radio" name="glass">
                        <div class="calculation__text">
                            Стандартное остекление
                        </div>
                    </label>
                    <div class="calculation__field-prompt">
                        Укажите, если процент остекленности фасада для жилья не превышает 10%
                    </div>
                </div>
                <div class="calculation__radio">
                    <label class="calculation__radio-label">
                        <input class="calculation__radio-input" type="radio" name="glass">
                        <div class="calculation__text">
                            Указать площадь остекления
                        </div>
                    </label>
                    <div class="calculation__field-prompt">
                        Если процент остекления превышает 10% или есть панорамные/большие окна
                    </div>
                </div>
            </div>
        </div>
        <div class="calculation__row">
            <div class="calculation__col calculation__col-width-left">
                <div class="calculation__head">8. Комментарии</div>
                <div class="calculation__text">
                    Укажите здесь любую информацию, которую посчитаете нужной для расчёта отопления. <br>
                    &mdash;&nbsp;Если стены здания или этажи выполнены из&nbsp;различных материалов.<br>
                    &mdash;&nbsp;В&nbsp;комнатах есть второй свет.<br>
                    &mdash;&nbsp;Материала ограждающих конструкций нет в&nbsp;списке. <br>
                    &mdash;&nbsp;В&nbsp;помещении нет возможности установкаи обогревателя (или не&nbsp;требуется). <br>
                    &mdash;&nbsp;Потолок имеет переменную высоту (например, мансарда). <br>
                    &mdash;&nbsp;Если Ваш объект&nbsp;&mdash; это квартира в&nbsp;многоквартирном доме, таунхаус, дом на&nbsp;нескольких хозяев.
                </div>
            </div>
            <div class="calculation__col calculation__col-width-right">
                <textarea class="calculation__textarea" name="comment" id="comment" rows="11" placeholder="Комментарий"></textarea>
                <label class="calculation__add-button calculation__add-button_indent js-add-file">
                    <input class="hidden" name="file" type="file">
                    <div class="calculation__add-icon-file">
                        <img src="/local/templates/home-comfort/img/file.png" alt="">
                    </div>
                    <div class="calculation__add-text">Прикрепите файл (не более 10 мб) </div>
                </label>
            </div>
        </div>
        <div class="calculation__buttons">
            <button class="calculation__button calculation__button_blue-form">Отправить заявку</button>
        </div>
    </form>
</div>
<?require($_SERVER["DOCUMENT_ROOT"]."/bitrix/footer.php");?>