[farmacevt]

Вот это HTML

<div id="bannerCalculator">
<h3>Калькулятор цены баннера</h3>
<label for="width">Ширина баннера (мм):</label>
<input type="number" id="width" name="width" min="0"><br><br>

<label for="height">Высота баннера (мм):</label>
<input type="number" id="height" name="height" min="0"><br><br>

<label for="edgeGluing">Проклейка краёв:</label>
<input type="checkbox" id="edgeGluing" name="edgeGluing"><br><br>

<label for="grommets">Люверсы (каждые 50 см):</label>
<input type="checkbox" id="grommets" name="grommets"><br><br>

<button onclick="calculatePrice()">Рассчитать стоимость</button>
<p>Стоимость: <span id="price">0</span> тенге</p>
</div>


А вот это вставить после HTML

<script>
function calculatePrice() {
var width = document.getElementById('width').value;
var height = document.getElementById('height').value;
var edgeGluing = document.getElementById('edgeGluing').checked;
var grommets = document.getElementById('grommets').checked;

var area = (width / 1000) * (height / 1000); // Переводим мм в метры
var bannerPrice = 2100 * area;

var perimeter = (2 * (width / 1000) + 2 * (height / 1000)); // Периметр в метрах
var edgeGluingPrice = edgeGluing ? 120 * perimeter : 0;

var grommetsCount = Math.floor(perimeter * 2); // Люверсы каждые 50 см
var grommetsPrice = grommets ? 120 * grommetsCount : 0;

var totalPrice = bannerPrice + edgeGluingPrice + grommetsPrice;

document.getElementById('price').innerText = totalPrice.toFixed(2);
}
</script>

Сделал на пробу максимально просто, без выбора частоты люверсов.