Только в поле результатов (ввод) значение не отображается в ценовом формате с jquery и маской. js

Question

У меня проблема с расчетом моей формы. Сам расчет работает, но результат не отображается в поле цены в поле ввода. Я использую маску. js, чтобы изменить формат. К сожалению, в других полях это не работает в поле результатов. У тебя есть идея? Есть ли у меня ошибка логики c?

Кроме того, у меня возникает проблема, когда я работаю с ползунком диапазона, значение в поле ввода (значение1) отображается, но не включается в расчет. Может, у кого-то тоже есть идея?

Приложил код: (jquery 3.3.1 и маска. js плагин включен)

$('.maske2').mask('#.###.###', {
  reverse: true
});

$(function() {
  $('#value1, #value2, .value3, #value4').keyup(function() {
    var value1 = parseFloat($('#value1').val().replace(/\./g, '')) || 0;
    var value2 = parseFloat($('#value2').val().replace(/\./g, '')) || 0;
    var value3 = parseFloat($('.value3').val()) || 0;
    var value4 = parseFloat($('#value4').val().replace(/\./g, '')) || 0;

    if (value3 > 0) {
      var rechnen = value1 + value2;
      var makler = rechnen * value3 / 100 + rechnen;
      var ergebnis = makler.toFixed(2);
      $('#ausgabe').val(ergebnis);
    } else {
      var rechnen = value1 + value2;
      var ergebnis = rechnen;
      $('#ausgabe').val(ergebnis);
    };
    
    var gesamtpreis = ergebnis - value4;
    $('#ausgabegesamt').val(gesamtpreis).toFixed(2);
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="value1">Kaufpreis</label>
<span class="symbol">€</span>
<input id="valR" max="10000000" oninput="this.form.value1.value=this.value" min="1" step="1" type="range" value="1" class="form-control">
<input type="text" name="value1" id="value1" oninput="this.form.valR.value=this.value" class="form-control maske2" placeholder="480.000" />
<hr>
<label for="value2">Modernisierung</label>
<span class="symbol">€</span>
<input type="text" name="value2" id="value2" class="form-control maske2" placeholder="198.000" />
<div style="background-color: #99999926;color:#333;
	border: 1px solid #4CAF50;padding: 15px 15px;font-size: 18px">
  <h4 style="margin: 0; padding-bottom: 20px;">Gesamtaufwand:</h4>
  <span class="symbol">€</span> <input type="text" value="0.00" id="ausgabe" class="form-control maske" style="display: inline-block" readonly>
</div>
<label for="value3" style="margin: 10px 0">Eigenkapital</label>
<span class="symbol">€</span><input type="text" id="value4" name="value4" class="form-control maske2" placeholder="100.000">
<div style="background-color: #99999926;color:#333;
	border: 1px solid #4CAF50;padding: 15px 15px;font-size: 18px;margin-top:20px">
  <h4 style="margin: 0;
    padding-bottom: 20px;">Finanzierungsbedarf:</h4>
  <span class="symbol">€</span> <input type="text" value="0.00 " id="ausgabegesamt" class="form-control maske2" style="display: inline-block" readonly>
</div>