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