Mieterdaten-Eckdaten: unbefristet-Haken direkt neben Mietende, Felder enger zusammenrücken
This commit is contained in:
parent
e2a54d3ad6
commit
117c0b66d9
@ -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';
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user