JSFiddle - React, Tailwind, and code Playground

HTML

<table>
      <tr>
        <td>Glavnica kredita</td>
        <td><input id="glavnica" class="deset"> v evrih (primer 200000)</td>
      </tr>
      <tr>
        <td>Obrestna mera (EOM)</td>
        <td><input id="eom" class="pet"> v odstotkih letno (primer 4,0)</td>
      </tr>
      <tr>
        <td>Število obrokov</td>
        <td><input id="stobrokov" class="pet"> (12 x število let)</td>
      </tr>
      <tr>
        <td>Dodatno odplačilo</td>
        <td><input id="dodatno" class="deset"> evrov vsakih <input id="dodatnomeseci" class="pet"> mesecev (primer 1000 evrov vsakih 12 mesecev)</td>
      </tr>
      <tr>
        <td></td>
        <td><button onclick="izracunaj();">Izračunaj</button></td>
      </tr>
      <tr>
        <td>Celotna vsota za odplačilo kredita</td>
        <td><input id="celznesek" class="deset"> v evrih</td>
      </tr>
      <tr>
        <td>Vsota obresti</td>
        <td><input id="vseobresti" class="deset"> v evrih</td>
      </tr>
    </table>
<table id="rezultat">

</table>

CSS

input.pet { width: 40px; }
input.deset { width: 80px; }
table#rezultat { border-collapse: collapse;}
table#rezultat th, table#rezultat td { border: 1px solid #000000; padding: 2px 4px;}
table#rezultat th { background-color: #d0d0d0;}
tr.ena td {background-color: #e0f0d0;}

JavaScript

function pad(n,d) {
	n = '' + n;
	while (n.length < d) n = '0' + n;
  return n;
}
function vcash(u) {
	var k = u.toFixed(2);
  var d = k.split('.')[0];
  var o = k.split('.')[1];
  var output = ',' + o;
  while (d > 1000) {
  	output = '.' + pad(d%1000,3) + output;
    d = parseInt((d/1000))
  }
  return d + output;
}
function izracunaj() {
	var glavnica = parseFloat($('#glavnica').val().replace(/\./g,'').replace(',','.'));
  var stobrokov = parseInt($('#stobrokov').val());
  var eom = parseFloat($('#eom').val().replace(',','.'));
  var dodatno = parseFloat($('#dodatno').val().replace(/\./g,'').replace(',','.'));
  var dodatnomeseci = parseInt($('#dodatnomeseci').val());
  var mom = 1.0 + eom/1200;
  var obrok = glavnica * ((mom-1)/(Math.pow(mom,-stobrokov)*(Math.pow(mom,stobrokov)-1)));
  var odplaciloglavnice = 0;
  var obresti = 0;
  var placanobrok = obrok;
  var output = '<tr><th>obrok št</th><th>znesek</th><th>od tega obresti</th><th>od tega glavnice</th><th>preostenek glavnice</th></tr>';
  var sumaplacilo = 0;
  var sumaobresti = 0;
  var i = 0;
  console.log(dodatno + ' - ' + dodatnomeseci);
  while (glavnica > 0) {
  	placanobrok = obrok;
    if (i%dodatnomeseci == 0 && i > 0) placanobrok += dodatno
  	if (placanobrok > glavnica) {
    	placanobrok = glavnica;
    	odplaciloglavnice = glavnica;
      obresti = 0;
    } else {
    	
      obresti = (mom-1) * glavnica;
      odplaciloglavnice = placanobrok - obresti;
    }
    sumaplacilo += placanobrok;
    sumaobresti += obresti;
    glavnica -= odplaciloglavnice;
   output += '<tr ' + ((i%2 == 1) ? 'class = "ena"' : '') + '><td>'+stobrokov+'</td><td>'+vcash(placanobrok)+'</td><td>'+vcash(obresti)+'</td><td>'+vcash(odplaciloglavnice)+'</td><td>'+vcash(glavnica)+'</td></tr>';
  	stobrokov--;
  	i++;
  }
  
  $('#rezultat').html(output);
  $('#celznesek').val(vcash(sumaplacilo));
  $('#vseobresti').val(vcash(sumaobresti));

}