<script>
$( document ).ready(function() {
let delivery = 1000;
let calcForm = $('input[value="cleanform"]').closest('form');
let result = $('input[name="price-result"]');
let areaWr = $('input[name="cleaning-area"]').closest('.t-radio__wrapper');
areaWr.addClass('area-wrapper');
areaWr.append('<input type="text" name="more-square" placeholder="150" class="t-input more-input hide-more" value="" tabindex="-1">');
result.closest('.t-input-group').addClass('result_wrapper');
result.attr('tabindex', '-1').css('pointer-events','none');
let calcPrice = [
/*Поддержка*/ ['1890','2190','2490','3290','3690','28'],
/*Генеральная*/ ['4900','6300','7800','8500','9200','85'],
/*После ремонта*/ ['6300','7100','8300','9700','10800','95'],
/*Поддержка*/ ['5900','7300','8800','9500','10200','104']
];
function divideNumberByPieces(x, delimiter) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, delimiter || " ");
};
function printPrice(em){
result.val( divideNumberByPieces( em+delivery )+' руб.');
};
printPrice(Number(calcPrice[0][0]));
calcForm.on('change input', 'select, input ', function() {
let typeInd = $('select[name="type-of-cleaning"]')[0].selectedIndex;
let squareInput = $('input:radio[name="cleaning-area"]');
let squareInd = squareInput.index(squareInput.filter(':checked'));
let cost = +calcPrice[typeInd][squareInd];
if (squareInd==5){
$('.more-input').removeClass('hide-more');
$('.more-input').addClass('js-tilda-rule').attr('data-tilda-req',1);
let inpSq = +$('.more-input').val();
if(inpSq) cost = cost*inpSq;
areaWr.find('label:last input').val(inpSq);
}else{
$('.more-input').addClass('hide-more').val('');
$('.more-input').removeClass('js-tilda-rule').attr('data-tilda-req','');
areaWr.find('label:last input').val(areaWr.find('label:last').text());
};
printPrice(cost);
});
calcForm.on('input', '.more-input', function(){
this.value = this.value.replace(/[^0-9]/g, '');
});
});
</script>
<style>
.result_wrapper input {
background-color: transparent !important;
text-align: right;
padding: 0;
color: #fff !important;
font-size: 45px;
font-weight: 600;
}
input.t-input.more-input {
color: #000000;
background-color: #ffffff;
border-radius: 7px;
width: 150px;
margin-top: 10px;
}
.hide-more{
display:none;
}
.result_wrapper:before {
content: "Уборка + Выезд:";
font-size: 24px;
color: #ffff;
font-family: 'Roboto',Arial,sans-serif;
}
.result_wrapper {
text-align: right;
box-shadow: 0 -2px 0 0 #fff;
padding-top: 8px;
}
.t698 .t-input-group_tx {
text-align: right;
}
.area-wrapper{
text-align:right;
}
.t698 .t-radio__control {
background-color: rgba(255, 255, 255, 0);
border-radius: 3px;
padding: 4px 15px;
display: inline-block;
margin-right: 10px !important;
}
.t698 .t-radio__indicator {
position: absolute;
height: 100%;
left: 0;
top: 0;
width: 100%;
border: none;
border-radius: 3px;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6);
}
.t698 .t-radio__indicator:after {
display: none;
}
.t698 .t-radio__control .t-radio:checked ~ .t-radio__indicator {
background-color: rgba(255, 255, 255, 0.2);
box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 1);
}
.t698 .t-form__screen .t-form__screen-number-container {
margin-left: 3px;
color: #fff;
}
</style>