Mieterdaten-Eckdaten: unbefristet-Haken direkt neben Mietende, Felder enger zusammenrücken

This commit is contained in:
Giuseppe Lombardo 2026-08-13 18:20:25 +00:00
parent e2a54d3ad6
commit 117c0b66d9

View File

@ -3647,9 +3647,10 @@
const form = el('div', 'contract-template-form');
form.style.flexWrap = 'nowrap';
form.style.overflowX = 'auto';
form.style.gap = '6px 10px';
const startField = el('div', 'field');
startField.style.cssText = 'min-width:140px; flex:0 0 auto;';
startField.style.cssText = 'min-width:130px; flex:0 0 auto;';
startField.appendChild(el('label', null, 'Mietbeginn'));
const startInput = document.createElement('input');
startInput.type = 'date';
@ -3658,8 +3659,15 @@
form.appendChild(startField);
const endField = el('div', 'field');
endField.style.cssText = 'min-width:140px; flex:0 0 auto;';
endField.appendChild(el('label', null, 'Mietende'));
endField.style.cssText = 'min-width:130px; flex:0 0 auto;';
const endLabel = el('label', null, 'Mietende ');
endLabel.style.cssText = 'display:flex; align-items:center; gap:4px;';
const unbefristetCheckbox = document.createElement('input');
unbefristetCheckbox.type = 'checkbox';
unbefristetCheckbox.checked = !c.endDate;
endLabel.appendChild(unbefristetCheckbox);
endLabel.appendChild(document.createTextNode('unbefristet'));
endField.appendChild(endLabel);
const endInput = document.createElement('input');
endInput.type = 'date';
endInput.value = c.endDate ? c.endDate.slice(0, 10) : '';
@ -3667,21 +3675,13 @@
endField.appendChild(endInput);
form.appendChild(endField);
const unbefristetField = el('div', 'field field-checkbox');
unbefristetField.style.flex = '0 0 auto';
const unbefristetCheckbox = document.createElement('input');
unbefristetCheckbox.type = 'checkbox';
unbefristetCheckbox.checked = !c.endDate;
unbefristetField.appendChild(unbefristetCheckbox);
unbefristetField.appendChild(document.createTextNode('unbefristet'));
unbefristetCheckbox.onchange = () => {
endInput.disabled = unbefristetCheckbox.checked;
if (unbefristetCheckbox.checked) endInput.value = '';
};
form.appendChild(unbefristetField);
const rentField = el('div', 'field');
rentField.style.cssText = 'width:110px; flex:0 0 auto;';
rentField.style.cssText = 'width:95px; flex:0 0 auto;';
rentField.appendChild(el('label', null, 'Warmmiete (€)'));
const rentInput = document.createElement('input');
rentInput.type = 'number';
@ -3692,7 +3692,7 @@
form.appendChild(rentField);
const depositField = el('div', 'field');
depositField.style.cssText = 'width:110px; flex:0 0 auto;';
depositField.style.cssText = 'width:95px; flex:0 0 auto;';
depositField.appendChild(el('label', null, 'Kaution (€)'));
const depositInput = document.createElement('input');
depositInput.type = 'number';
@ -3703,7 +3703,7 @@
form.appendChild(depositField);
const dueDayField = el('div', 'field');
dueDayField.style.cssText = 'min-width:130px; flex:0 0 auto;';
dueDayField.style.cssText = 'min-width:115px; flex:0 0 auto;';
dueDayField.appendChild(el('label', null, 'Fälligkeit der Miete'));
const dueDaySelect = document.createElement('select');
[[1, 'Immer zum 1.'], [15, 'Immer zum 15.']].forEach(([value, label]) => {
@ -3717,7 +3717,7 @@
form.appendChild(dueDayField);
const noticeField = el('div', 'field');
noticeField.style.cssText = 'width:110px; flex:0 0 auto;';
noticeField.style.cssText = 'width:95px; flex:0 0 auto;';
noticeField.appendChild(el('label', null, 'Kündigung (Mon.)'));
const noticeInput = document.createElement('input');
noticeInput.type = 'number';