<!--ЕЖЕМЕСЯЧНЫЙ КАЛЬКУЛЯТОР-->
<div class="auto_calc__row auto_calc__row-month-pay t-descr">
<div class="auto_calc__col">
<div class="auto_calc__prop-name">Ежемесячный платеж:</div>
<div class="auto_calc__prop-value auto_calc__payment"></div>
<a href="#popup:myform" class="btn search_btn" style="display:none;">Отправить заявку</a>
</div>
<div class="auto_calc__col">
<div class="auto_calc__error"></div>
</div>
</div>
<script>
$(document).ready(function(){
//Годовой процент
let calcPercent = 70;
//Процент первоначального взноса
let prevPercent = 0.25;
$('.uc-car-price, .uc-car-price2').wrapAll('<div class="calc-wrapper t-container"></div>');
$('.uc-car-price .t-form__inputsbox').addClass('auto_calc');
$('.auto_calc__row-month-pay').appendTo('.auto_calc');
$('.uc-car-price .t-input-group').addClass('auto_calc__row');
$('.uc-car-price .t-input-block').addClass('auto_calc__prop-value');
$('.uc-car-price select[name="time_pay"] option:eq(0)').val(6);
$('.uc-car-price select[name="time_pay"] option:eq(1)').val(12);
$('.uc-car-price select[name="time_pay"] option:eq(2)').val(18);
$('.uc-car-price select[name="time_pay"] option:eq(3)').val(24);
$('.uc-car-price select[name="time_pay"] option:eq(4)').val(30);
$('.uc-car-price select[name="time_pay"] option:eq(5)').val(36);
var formatter = new Intl.NumberFormat("ru");
function getMonthPayment (summ, percents, months) {
let pr = calcPercent;
let mPayment = (summ)*( (pr/1200)*(1+ (pr/1200) )**months)/((1+ (pr/1200) )**months-1);
let p = mPayment;
return p;
};
function divideNumberByPieces(x, delimiter) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, delimiter || " ");
};
function calc() {
var price = $('.uc-car-price input[name="car_price"]').val() || '';
price = price.replace(/[^0-9]/gim, '');
var firstPayManual = $('.uc-car-price input[name="first_pay"]').val() || '';
firstPayManual = firstPayManual.replace(/[^0-9]/gim, '');
var creditSumm = price - firstPayManual;
var firstPayMin = parseInt(price * prevPercent );
var months = parseInt($('.uc-car-price select[name="time_pay"]').val()) || 0;
var summ = parseInt(price - firstPayManual);
var error = '';
if (creditSumm < 100000) {
error = "Минимальная сумма рассрочки - 100 000 р.";
}
if (firstPayMin > firstPayManual) {
error = "Первоначальный платеж - минимум 25% от стоимости автомобиля.";
}
if (price < 150000) {
error = "Минимальная сумма автомобиля - 150 000 р.";
}
if (creditSumm >= 100000 && creditSumm < 150000) {
$('.uc-car-price select[name="time_pay"] option').eq(0).attr('disabled', 'disabled');
$('.uc-car-price select[name="time_pay"] option').eq(1).attr('disabled', 'disabled');
if ($('.uc-car-price select[name="time_pay"] option:selected').val() < 18) {
$('.uc-car-price select[name="time_pay"]').val(18);
}
} else if (creditSumm >= 150000 && creditSumm < 200000) {
$('.uc-car-price select[name="time_pay"] option').eq(0).attr('disabled', 'disabled');
if ($('.uc-car-price select[name="time_pay"] option:selected').val() < 12) {
$('.uc-car-price select[name="time_pay"]').val(12);
}
} else {
$('.uc-car-price select[name="time_pay"] option').removeAttr('disabled');
}
if (error == '') {
var p = parseInt(getMonthPayment(summ, 1, months));
p = divideNumberByPieces(p)
$('.auto_calc__error').hide();
$('.auto_calc .search_btn').show();
$('.auto_calc__payment').html(p+' рублей').show();
} else {
$('.auto_calc__payment').hide();
$('.auto_calc .search_btn').hide();
$('.auto_calc__error').html(error).show();
}
}
$('.uc-car-price input[name="car_price"]').on('keyup', function(event) {
//if (event.keyCode >= 48 && event.keyCode <= 57) { }
var price = $(this).val();
price = price.replace(/[^0-9]/gim, '');
var priceFormat = formatter.format(price);
if (priceFormat == 0) priceFormat = '';
$(this).val(priceFormat);
//calc();
});
//$('input[name="car_price"]').trigger('keyup');
$('.uc-car-price input[name="first_pay"]').on('keyup', function(event) {
var firstPayManual = $(this).val();
firstPayManual = firstPayManual.replace(/[^0-9]/gim, '');
var priceFormat = formatter.format(firstPayManual);
if (priceFormat == 0) priceFormat = '';
$(this).val(priceFormat);
calc();
});
$('.uc-car-price input[name="car_price"]').on('blur', function() {
var price = $(this).val() || '';
price = price.replace(/[^0-9]/gim, '');
var firstPayMin = parseInt(price * prevPercent);
var priceFormat = formatter.format(firstPayMin);
if (priceFormat == 0) priceFormat = '';
$('.uc-car-price input[name="first_pay"]').val(priceFormat);
calc();
});
$('.auto_calc .search_btn').on('click', function(e) {
//e.preventDefault();
let price = $('.uc-car-price input[name="car_price"]').val() || '';
let firstPayManual = $('.uc-car-price input[name="first_pay"]').val() || '';
let months = parseInt($('.uc-car-price select[name="time_pay"]').val()) || 0;
let car = {'car_price':price, 'first_pay':firstPayManual, 'time_pay':months, 'expires':Date.now()};
localStorage.setItem('car', JSON.stringify(car));
});
$('.uc-car-price select[name="time_pay"]').on('change', function() {
calc();
});
$(document).on("keydown", ".t-form", function(event) {return event.key != "Enter";});
});
</script>
<style>
.uc-car-price {
margin-top: -40px;
position: relative;
z-index: 99;
}
.uc-car-price .t-container {
background-color: #f9f9f9;
padding: 30px 0 0 0;
box-sizing: border-box;
box-shadow: 0 0 40px rgb(0 0 0 / 50%);
}
.uc-car-price .t-form__submit {
display: none;
}
.auto_calc__prop-name {
font-weight: 600;
color: #212529;
}
.auto_calc__prop-value.auto_calc__payment {
color: #e77817;
font-weight: 700;
margin-top: 15px;
font-size: 22px;
margin-bottom: 40px;
}
a.btn.search_btn {
padding: 10px 22px;
background-color: #ef6c00;
color: #fff !important;
font-weight: bold;
}
.auto_calc__row-month-pay {
display: flex;
justify-content: space-between;
}
.auto_calc__row .input-error, .auto_calc__row .auto_calc__error {
color: #ff6347;
font-weight: 400;
}
.uc-car-price .t-col {
margin: 0;
max-width: none;
}
.t-input-group.t-input-group_in.auto_calc__row, .t-input-group.t-input-group_sb.auto_calc__row {
border-bottom: 1px solid #ddd;
padding-bottom: 25px;
}
.t-input-group.t-input-group_sb.auto_calc__row {
margin-bottom: 0;
}
.auto_calc__row.auto_calc__row-month-pay.t-descr {
background-color: #fff;
padding: 20px 25px 48px 25px;
}
.auto_calc__row {
padding: 0 25px;
}
.t-input-block.auto_calc__prop-value input, .t-input-block.auto_calc__prop-value select {
height: 40px;
}
.t-input-block.auto_calc__prop-value {
width: 100%;
}
.t-input-group.t-input-group_in.auto_calc__row {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.t-input-group.t-input-group_in.auto_calc__row .t-input-title {
width: 100%;
}
.t-input-group.t-input-group_in.auto_calc__row .t-input-subtitle {
order: 1;
padding-bottom: 0;
padding-left: 10px;
}
.auto_calc__row input:focus, .auto_calc__row select:focus {
box-shadow: 0px 0px 10px rgb(240 124 0 / 30%);
border: 1px solid #f07c00 !important;
}
.calc-wrapper {
display: flex;
justify-content: space-evenly;
}
.calc-wrapper>div {
width: 40%;
}
.t678 {
height: 100%;
}
.t678 .t-container {
height: 100%;
background-color: #fff;
outline: 2px solid #000;
}
.auto_calc__prop-value div, .auto_calc2__prop-value div {
color: #f7a553;
font-size: 20px;
font-weight: 600;
}
@media screen and (max-width:960px){
.calc-wrapper {
display:block;
}
.calc-wrapper>div {
width: 100%;
}
}
@media screen and (max-width:960px){
.t-input-group.t-input-group_in.auto_calc__row .t-input-subtitle {
padding-left: 0px;
padding-top: 6px;
}
}
@media screen and (max-width:560px){
.t-input-group.t-input-group_sb.auto_calc__row .t-input-block.auto_calc__prop-value {
width: auto;
}
a.btn.search_btn {
font-size: 11px;
}
}
@media screen and (max-width: 960px){
.uc-car-price .t-col {
padding-left: 0px;
padding-right: 0px;
}
}
</style> <!--ЕЖЕСУТОЧНЫЙ КАЛЬКУЛЯТОР-->
<div class="auto_calc2__row auto_calc2__row-month-pay t-descr">
<div class="auto_calc2__col">
<div class="auto_calc2__prop-name">Ежесуточный платеж:</div>
<div class="auto_calc2__prop-value auto_calc2__payment"></div>
<a href="#popup:myform" class="btn search_btn" style="display:none;">Отправить заявку</a>
</div>
<div class="auto_calc2__col">
<div class="auto_calc2__error"></div>
</div>
</div>
<script>
$(document).ready(function(){
//Годовой процент
let calcPercent2 = 100;
//Процент первоначального взноса
let prevPercent2 = 0.05;
$('.uc-car-price2 .t-form__inputsbox').addClass('auto_calc2');
$('.auto_calc2__row-month-pay').appendTo('.auto_calc2');
$('.uc-car-price2 .t-input-group').addClass('auto_calc2__row');
$('.uc-car-price2 .t-input-block').addClass('auto_calc2__prop-value');
$('.uc-car-price2 select[name="time_pay"] option:eq(0)').val(6);
$('.uc-car-price2 select[name="time_pay"] option:eq(1)').val(12);
$('.uc-car-price2 select[name="time_pay"] option:eq(2)').val(18);
$('.uc-car-price2 select[name="time_pay"] option:eq(3)').val(24);
$('.uc-car-price2 select[name="time_pay"] option:eq(4)').val(30);
$('.uc-car-price2 select[name="time_pay"] option:eq(5)').val(36);
var formatter = new Intl.NumberFormat("ru");
// function getMonthPayment (summ, percents, months) {
// var r = (100*0.01)/12; //78/100/12
// var t = r*Math.pow(1+r, months);
// var b = Math.pow(1+r, months)-1;
// var p = summ*t/b;
// p = p*12/365;
// return p;
// };
function getMonthPayment (summ, percents, months) {
let pr = calcPercent2;
let mPayment = (summ)*( (pr/1200)*(1+ (pr/1200) )**months)/((1+ (pr/1200) )**months-1);
let p = mPayment*12/365;
return p;
};
function divideNumberByPieces(x, delimiter) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, delimiter || " ");
};
function calc2() {
var price = $('.uc-car-price2 input[name="car_price"]').val() || '';
price = price.replace(/[^0-9]/gim, '');
var firstPayManual = $('.uc-car-price2 input[name="first_pay"]').val() || '';
firstPayManual = firstPayManual.replace(/[^0-9]/gim, '');
var creditSumm = price - firstPayManual;
var firstPayMin = parseInt(price * prevPercent2);
var months = parseInt($('.uc-car-price2 select[name="time_pay"]').val()) || 0;
var summ = parseInt(price - firstPayManual);
var error = '';
if (creditSumm < 100000) {
error = "Минимальная сумма - 100 000 р.";
}
if (firstPayMin > firstPayManual) {
error = "Залог - минимум 5% от стоимости автомобиля.";
}
if (price > 400000) {
error = "Максимальная сумма автомобиля - 400 000 р.";
}
if (creditSumm >= 100000 && creditSumm < 150000) {
$('.uc-car-price2 select[name="time_pay"] option').eq(0).attr('disabled', 'disabled');
$('.uc-car-price2 select[name="time_pay"] option').eq(1).attr('disabled', 'disabled');
if ($('.uc-car-price2 select[name="time_pay"] option:selected').val() < 18) {
$('.uc-car-price2 select[name="time_pay"]').val(18);
}
} else if (creditSumm >= 150000 && creditSumm < 200000) {
$('.uc-car-price2 select[name="time_pay"] option').eq(0).attr('disabled', 'disabled');
if ($('.uc-car-price2 select[name="time_pay"] option:selected').val() < 12) {
$('.uc-car-price2 select[name="time_pay"]').val(12);
}
} else {
$('.uc-car-price2 select[name="time_pay"] option').removeAttr('disabled');
}
if (error == '') {
var p = parseInt(getMonthPayment(summ, 1, months));
p = divideNumberByPieces(p)
$('.auto_calc2__error').hide();
$('.auto_calc2 .search_btn').show();
$('.auto_calc2__payment').html(p+' руб').show();
} else {
$('.auto_calc2__payment').hide();
$('.auto_calc2 .search_btn').hide();
$('.auto_calc2__error').html(error).show();
}
}
$('.uc-car-price2 input[name="car_price"]').on('keyup', function(event) {
//if (event.keyCode >= 48 && event.keyCode <= 57) { }
var price = $(this).val();
price = price.replace(/[^0-9]/gim, '');
var priceFormat = formatter.format(price);
if (priceFormat == 0) priceFormat = '';
$(this).val(priceFormat);
//calc2();
});
//$('input[name="car_price"]').trigger('keyup');
$('.uc-car-price2 input[name="first_pay"]').on('keyup', function(event) {
var firstPayManual = $(this).val();
firstPayManual = firstPayManual.replace(/[^0-9]/gim, '');
var priceFormat = formatter.format(firstPayManual);
if (priceFormat == 0) priceFormat = '';
$(this).val(priceFormat);
calc2();
});
$('.uc-car-price2 input[name="car_price"]').on('blur', function() {
var price = $(this).val() || '';
price = price.replace(/[^0-9]/gim, '');
var firstPayMin = parseInt(price * prevPercent2);
var priceFormat = formatter.format(firstPayMin);
if (priceFormat == 0) priceFormat = '';
$('.uc-car-price2 input[name="first_pay"]').val(priceFormat);
calc2();
});
$('.auto_calc2 .search_btn').on('click', function(e) {
//e.preventDefault();
let price = $('input[name="car_price"]').val() || '';
let firstPayManual = $('input[name="first_pay"]').val() || '';
let months = parseInt($('select[name="time_pay"]').val()) || 0;
let car = {'car_price':price, 'first_pay':firstPayManual, 'time_pay':months, 'expires':Date.now()};
localStorage.setItem('car', JSON.stringify(car));
});
$('.uc-car-price2 select[name="time_pay"]').on('change', function() {
calc2();
});
$(document).on("keydown", ".t-form", function(event) {return event.key != "Enter";});
});
</script>
<style>
.uc-car-price2 {
margin-top: -40px;
position: relative;
z-index: 99;
}
.uc-car-price2 .t-container {
background-color: #f9f9f9;
padding: 30px 0 0 0;
box-sizing: border-box;
box-shadow: 0 0 40px rgb(0 0 0 / 50%);
}
.uc-car-price2 .t-form__submit {
display: none;
}
.auto_calc2__prop-name {
font-weight: 600;
color: #212529;
}
.auto_calc2__prop-value.auto_calc2__payment {
color: #e77817;
font-weight: 700;
margin-top: 15px;
font-size: 22px;
margin-bottom: 40px;
}
a.btn.search_btn {
padding: 10px 22px;
background-color: #ef6c00;
color: #fff !important;
font-weight: bold;
}
.auto_calc2__row-month-pay {
display: flex;
justify-content: space-between;
}
.auto_calc2__row .input-error, .auto_calc2__row .auto_calc2__error {
color: #ff6347;
font-weight: 400;
}
.uc-car-price2 .t-col {
margin: 0;
max-width: none;
}
.t-input-group.t-input-group_in.auto_calc2__row, .t-input-group.t-input-group_sb.auto_calc2__row {
border-bottom: 1px solid #ddd;
padding-bottom: 25px;
}
.t-input-group.t-input-group_sb.auto_calc2__row {
margin-bottom: 0;
}
.auto_calc2__row.auto_calc2__row-month-pay.t-descr {
background-color: #fff;
padding: 20px 25px 48px 25px;
}
.auto_calc2__row {
padding: 0 25px;
}
.t-input-block.auto_calc2__prop-value input, .t-input-block.auto_calc2__prop-value select {
height: 40px;
}
.t-input-block.auto_calc2__prop-value {
width: 100%;
}
.t-input-group.t-input-group_in.auto_calc2__row {
display: flex;
flex-wrap: wrap;
align-items: center;
}
.t-input-group.t-input-group_in.auto_calc2__row .t-input-title {
width: 100%;
}
.t-input-group.t-input-group_in.auto_calc2__row .t-input-subtitle {
order: 1;
padding-bottom: 0;
padding-left: 10px;
}
.auto_calc2__row input:focus, .auto_calc2__row select:focus {
box-shadow: 0px 0px 10px rgb(240 124 0 / 30%);
border: 1px solid #f07c00 !important;
}
@media screen and (max-width:960px){
.t-input-group.t-input-group_in.auto_calc2__row .t-input-subtitle {
padding-left: 0px;
padding-top: 6px;
}
}
@media screen and (max-width:560px){
.t-input-group.t-input-group_sb.auto_calc2__row .t-input-block.auto_calc2__prop-value {
width: auto;
}
a.btn.search_btn {
font-size: 11px;
}
}
@media screen and (max-width: 960px){
.uc-car-price2 .t-col {
padding-left: 0px;
padding-right: 0px;
}
}
</style>