You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
74 lines
3.7 KiB
74 lines
3.7 KiB
<div x-show="value.kind == '{{kind}}'">
|
|
<h2 class="gradient">Ihr Bauvorhaben</h2>
|
|
|
|
<div class="form-container">
|
|
<div class="form-grid">
|
|
<label>{{main.label}}</label>
|
|
<input type="tel" {{cprop('value.' ~ kind ~ '.' ~ main.value, 'currency') | raw}}>
|
|
<span class="unit">€</span>
|
|
</div>
|
|
{% if bezahlt %}
|
|
<div class="form-grid">
|
|
<label>Bereits bezahlt?</label>
|
|
<select name="bezahlt" x-model="value.{{kind}}.bezahlt">
|
|
<option value="1">Ja</option>
|
|
<option value="0">Nein</option>
|
|
</select>
|
|
</div>
|
|
{% endif %}
|
|
<div class="separator"></div>
|
|
<div class="form-grid">
|
|
<label>{{second.label}}</label>
|
|
<input type="tel" {{cprop('value.' ~ kind ~ '.' ~ second.value, 'currency') | raw}}>
|
|
<span class="unit">€</span>
|
|
</div>
|
|
<div class="separator"></div>
|
|
<div class="form-grid">
|
|
<label>Notar- & Gerichtskosten</label>
|
|
<span>
|
|
<span class="result-label" x-text="units.percent.to(parts.notar * 100)"></span>
|
|
<span class="result" x-text="units.currency.to(value.{{kind}}.{{main.value}} * parts.notar)"></span>
|
|
</span>
|
|
<span class="unit">€</span>
|
|
</div>
|
|
<div class="separator primary"></div>
|
|
<div class="form-grid">
|
|
<label>Grunderwerbsteuer</label>
|
|
<span>
|
|
<span class="result-label" x-text="units.percent.to(parts.grundsteuer * 100)"></span>
|
|
<span class="result" x-text="units.currency.to(value.{{kind}}.{{main.value}} * parts.grundsteuer)"></span>
|
|
</span>
|
|
<span class="unit">€</span>
|
|
</div>
|
|
<div class="separator"></div>
|
|
<div class="form-grid">
|
|
<label>
|
|
Makler
|
|
<span x-html="`${units.percent.to(parts.makler * 100)} %`"></span>
|
|
</label>
|
|
<input type="tel" :value="units.currency.to(value.{{kind}}.{{main.value}} * parts.makler)"
|
|
@focus="$event.target.value = Math.round(value.{{kind}}.{{main.value}} * parts.makler)"
|
|
@blur="console.log($event); ($event.target || $event.originalTarget).value = units.currency.to(value.{{kind}}.{{main.value}} * parts.makler);"
|
|
@change="console.log('change'); parts.makler = units.currency.from($event.target.value) / value.{{kind}}.{{main.value}};"
|
|
>
|
|
<span class="unit">€</span>
|
|
<span class="comment">Die vorgeschlagene Maklercourtage gentspricht der regional üblichen Höhe. Sie können diese jedoch bei Bedarf verändern oder auch komplett entfallen lassen.</span>
|
|
</div>
|
|
<div class="separator"></div>
|
|
<div class="form-grid">
|
|
<label>Eigenkapital</label>
|
|
<input type="tel" {{cprop('value.' ~ kind ~ '.eigenkapital', 'currency') | raw}}>
|
|
<span class="unit">€</span>
|
|
</div>
|
|
<div class="separator primary"></div>
|
|
<div>
|
|
<div><span>=</span>Darlehensbetrag</div>
|
|
<div x-text="units.currency.to( Math.round((value.{{kind}}.{{main.value}} * (1+parts.notar+parts.grundsteuer+parts.makler) + value.{{kind}}.{{second.value}} - value.{{kind}}.eigenkapital) / 1000)*1000 )"></div>
|
|
</div>
|
|
<div class="separator gray"></div>
|
|
<div class="button-row">
|
|
<button @click="slideTo($event, step-1)" type="button">Zurück</button>
|
|
<button @click="slideTo($event, step+1)" type="button">Werte übernehmen und weiter zum letzten Schritt</button>
|
|
</div>
|
|
</div>
|
|
</div>
|