Pavyzdžiui, skolinantis 5000 Eur, kai sudaroma 72 mėn. sutartis, fiksuota metinė palūkanų norma –
6%,
mėnesinis administravimo mokestis – 9,5 Eur, sutarties sudarymo mokestis – 7% (grąžinamas lygiomis
dalimis per visą sutarties galiojimo laikotarpį), mėnesio įmoka – 97,23 Eur, bendra sumokama suma –
7000,24 Eur, bendra vartojimo kredito kainos metinė norma – 12,46%
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bigbank calculator</title>
<link rel="stylesheet" href="assets/css/noui.css">
<link rel="stylesheet" href="assets/css/main.css?v=1.5">
</head>
<body>
<script>
// Pagrindiniai skaičiuoklės parametrai
// Minimali paskolos suma
var minAmount = 70;
// Maksimali paskolos suma
var maxAmount = 20000;
// Paskolos suma, kurią standartiškai rodo skaičiuoklėje
var startAmount = 5000;
// Paskolos siderio žingsnis
var step = 10;
// Minimalus paskolos periodas
var minPeriod = 6;
// Maksimalus paskolos periodas
var maxPeriod = 96;
// Paskolos periodas, kurį standartiškai rodo skaičiuoklėje
var startPeriod = 72;
// Palūkanų norma %, (Interest rate)
var interestRate = 6;
// Mėnesinis administravimo mokestis Eur (Monthly service fee)
var monthlyServicefee = 9.5;
// Sutarties mokestis % (Conclusion fee)
var conclusionPercent = 7;
// Skaičiuoklės tekstas
var pagrindinisTekstas = 'Pirkimas išsimokėtinai';
// Nuoroda, į kurią kreipia skaičiuoklė
var nuoroda = 'https://issimoketinai.bigbank.lt/?gedarta';
</script>
<div class="bigbank">
<div class="bigbank__wrapper">
<div class="bigbank__left">
<div class="bigbank__logo_holder">
<a href="https://www.bigbank.lt/" target="_blank">
<img src="assets/img/logo.svg" alt="bigbank logo">
</a>
<h2 id="title">
Pirkimas
išsimokėtinai
</h2>
</div>
</div>
<div class="bigbank__middle">
<div class="bigbank__sliders">
<div class="bigbank__first-slider-holder">
<div class="bigbank__first-slider-min slider-value">
<span id="amount-slider-value-min">1 000</span> €
</div>
<div class="bigbank__amount-slide" id="amount-slide">
</div>
<div class="bigbank__first-slider-max slider-value">
<span id="amount-slider-value-max">20 000</span> €
</div>
</div>
<div class="bigbank__second-slider-holder">
<div class="bigbank__second-slider-min slider-value">
<span id="month-slider-value-min">6</span> mėn
</div>
<div class="bigbank__month-slide" id="month-slide">
</div>
<div class="bigbank__second-slider-max slider-value">
<span id="month-slider-value-max">72</span> mėn
</div>
</div>
</div>
<div class="bigbank__inputs">
<input type="text" value="10000 €" id="amount" step="100" data-value="10000">
<input type="text" value="60 mėn" step="100" id="month" data-value="60">
</div>
<div class="bigbank__monthly">
Mėnesio įmoka: <span id="calculated-price">70,36</span> €
</div>
</div>
<div class="bigbank__right">
<form id="main_form" method="GET" target="_blank" >
<button class="bigbank__link" id="bigbank-link">Gaukite
pasiūlymą<span class="chevron right"></span></button>
<input name="amount" hidden>
<input name="period" hidden>
</form>
</div>
</div>
<div class="bigbank__marquee">
<div class="bigbank__marquee-wrapper">
<div class="bigbank__marquee-content">
Pavyzdžiui, skolinantis 5000 Eur, kai sudaroma 72 mėn. sutartis, fiksuota metinė palūkanų norma –
6%,
mėnesinis administravimo mokestis – 9,5 Eur, sutarties sudarymo mokestis – 7% (grąžinamas lygiomis
dalimis per visą sutarties galiojimo laikotarpį), mėnesio įmoka – 97,23 Eur, bendra sumokama suma –
7000,24 Eur, bendra vartojimo kredito kainos metinė norma – 12,46%
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="assets/js/noui.min.js"></script>
<script>
$(document).ready(function () {
// Kintamūjų sudėjimas į reikiamas vietas
document.getElementById('title').innerHTML = pagrindinisTekstas;
document.getElementById('amount-slider-value-min').innerHTML = minAmount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");;
document.getElementById('amount-slider-value-max').innerHTML = maxAmount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");;
document.getElementById('month-slider-value-min').innerHTML = minPeriod;
document.getElementById('month-slider-value-max').innerHTML = maxPeriod;
document.getElementById('main_form').setAttribute('action', nuoroda);
// Patikrinam ar yra partnerio parametras START 20210819 update
$('#main_form').on('submit', function (e) {
if (nuoroda.includes('/?')) {
e.preventDefault();
var amount = $('#amount').val();
var period = $('#month').val();
nuoroda += `&amount=${parseInt(amount)}&period=${parseInt(period)}`;
window.open(nuoroda, '_blank');
}
});
// Patikrinam ar yra partnerio parametras END
var amountInput = $('input[name="amount"]');
var periodInput = $('input[name="period"]');
function pmt(rate_per_period, number_of_payments, present_value, future_value, type) {
future_value = typeof future_value !== 'undefined' ? future_value : 0;
type = typeof type !== 'undefined' ? type : 0;
if (rate_per_period != 0.0) {
// Interest rate exists
var q = Math.pow(1 + rate_per_period, number_of_payments);
return -(rate_per_period * (future_value + (q * present_value))) / ((-1 + q) * (1 + rate_per_period * (type)));
} else if (number_of_payments != 0.0) {
// No interest rate, but number of payments exists
return -(future_value + present_value) / number_of_payments;
}
return 0;
}
function calculatePMT() {
let amount = parseInt(document.getElementById('amount').getAttribute('data-value')),
period = parseInt(document.getElementById('month').getAttribute('data-value')),
conclusion_fee = amount * conclusionPercent / 100,
fullInterestRate = interestRate / 12 / 100;
calcPMT = pmt(fullInterestRate, period, -amount, 0, 0) + monthlyServicefee + (conclusion_fee / period);
calcPMT = calcPMT.toFixed(2);
document.getElementById('calculated-price').innerHTML = calcPMT.replace(".", ",");
}
// Amount slider
var stepSlider = document.getElementById('amount-slide');
noUiSlider.create(stepSlider, {
start: [startAmount],
step: parseInt(step),
connect: 'lower',
range: {
'min': [minAmount],
'max': [maxAmount]
}
});
var stepSliderValueElement = document.getElementById('amount');
stepSlider.noUiSlider.on('update', function (values, handle) {
stepSliderValueElement.value = Math.round(values[handle]) + ' €';
stepSliderValueElement.setAttribute('data-value', Math.round(values[handle]));
amountInput.val(Math.round(values[handle]))
calculatePMT()
});
// Months slider
var monthSlider = document.getElementById('month-slide');
noUiSlider.create(monthSlider, {
start: [startPeriod],
step: 1,
connect: 'lower',
range: {
'min': [minPeriod],
'max': [maxPeriod]
}
});
var monthSliderValueElement = document.getElementById('month');
monthSlider.noUiSlider.on('update', function (values, handle) {
monthSliderValueElement.value = Math.round(values[handle]) + ' mėn';
monthSliderValueElement.setAttribute('data-value', Math.round(values[handle]));
periodInput.val(Math.round(values[handle]));
calculatePMT()
});
$('#amount').focus(function () {
this.value = this.getAttribute('data-value');
});
$('#amount').on('focusout', function () {
var value = this.value;
if (isNaN(value)) {
this.setAttribute('data-value', 0);
amountInput.val(0);
this.value = 0 + ' €';
value = 0;
} else if (value < minAmount) {
this.setAttribute('data-value', minAmount);
amountInput.val(minAmount);
this.value = minAmount + ' €';
value = minAmount;
} else if (value > maxAmount) {
this.setAttribute('data-value', maxAmount);
amountInput.val(maxAmount);
this.value = maxAmount + ' €';
value = maxAmount;
} else {
this.setAttribute('data-value', value);
amountInput.val(value);
this.value = value + ' €';
}
stepSlider.noUiSlider.updateOptions({
start: [value],
});
calculatePMT()
});
$('#month').focus(function () {
this.value = this.getAttribute('data-value');
});
$('#month').on('focusout', function () {
var value = this.value;
if (isNaN(value)) {
this.setAttribute('data-value', 0);
periodInput.val(0);
this.value = 0 + ' mėn';
value = 0;
} else if (value < minPeriod) {
this.setAttribute('data-value', minPeriod);
periodInput.val(minPeriod);
this.value = minPeriod + ' mėn';
value = minPeriod;
} else if (value > maxPeriod) {
this.setAttribute('data-value', maxPeriod);
periodInput.val(maxPeriod);
this.value = maxPeriod + ' mėn';
value = maxPeriod;
} else {
this.setAttribute('data-value', value);
periodInput.val(value);
this.value = value + ' mėn';
}
monthSlider.noUiSlider.updateOptions({
start: [value],
});
calculatePMT()
});
});
</script>
</body>
</html>