diff --git a/public/buchungen-preise.js b/public/buchungen-preise.js index fe694a8..3dad3ca 100644 --- a/public/buchungen-preise.js +++ b/public/buchungen-preise.js @@ -110,6 +110,15 @@ export async function zeichnePreise(ctx, unterkunft) { allgemeinerFehler(), h('div', { class: 'bk-aktionen' }, ctx.nurLesen ? null : h('button', { type: 'button', class: 'kb-btn', 'data-aktion': 'preise-speichern', onclick: speichern }, 'Preise speichern'))) if (ctx.nurLesen) for (const el of form.querySelectorAll('input, select, textarea, button')) el.disabled = true + // Ein Feldfehler (z. B. Platzhalter in den Stornobedingungen) verschwindet, sobald im Feld getippt wird + for (const el of form.querySelectorAll('[data-feld]')) { + el.addEventListener('input', () => { + const name = el.getAttribute('data-feld') + const ziel = form.querySelector(`[data-fehler="${CSS.escape(name)}"]`) + if (ziel) ziel.textContent = '' + el.removeAttribute('aria-invalid') + }) + } async function speichern(ev) { const knopf = ev.currentTarget diff --git a/public/buchungen.css b/public/buchungen.css index e7506f2..022dad3 100644 --- a/public/buchungen.css +++ b/public/buchungen.css @@ -37,9 +37,9 @@ } .bk-kalenderkopf { flex-wrap: wrap; } .bk-monat { min-width: 9em; text-align: center; } -.bk-raster { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; max-width: 560px; margin: 10px 0; } +.bk-raster { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; width: 100%; margin: 10px 0; } .bk-wochentag { text-align: center; font-size: 12px; color: var(--kb-muted); } -.bk-tag { aspect-ratio: 1; min-height: 40px; border-radius: 8px; border: 1px solid var(--kb-border); background: rgba(255, 255, 255, 0.03); color: inherit; font: inherit; cursor: pointer; } +.bk-tag { aspect-ratio: 1.5; min-height: 40px; border-radius: 8px; border: 1px solid var(--kb-border); background: rgba(255, 255, 255, 0.03); color: inherit; font: inherit; cursor: pointer; } .bk-tag.bk-ausserhalb { opacity: 0.45; } .bk-tag.bk-heute { border-color: var(--kb-purple-line); font-weight: 700; } .bk-tag.bk-start { outline: 2px solid #d4b4ff; } @@ -74,4 +74,4 @@ } #view-buchungen .bk-posten select option, #view-buchungen .bk-filter select option { color: #111; } #view-buchungen .bk-posten input, #view-buchungen .bk-posten select { width: 100%; } -#view-buchungen input[readonly] { box-sizing: border-box; width: 100%; padding: 9px 10px; border-radius: 10px; font: inherit; font-size: 14px; border: 1px solid var(--kb-border-strong); background: rgba(255, 255, 255, 0.05); color: inherit; } +#view-buchungen input[readonly] { box-sizing: border-box; width: 100%; padding: 9px 10px; border-radius: 10px; font: inherit; font-size: 15px; border: 1px solid var(--kb-border-strong); background: rgba(255, 255, 255, 0.05); color: inherit; } diff --git a/test/buchungenUi.test.js b/test/buchungenUi.test.js index d483446..63e8b1e 100644 --- a/test/buchungenUi.test.js +++ b/test/buchungenUi.test.js @@ -855,3 +855,16 @@ test('Fehlertexte: alle Codes des Portals sind übersetzt (Du-Form, kein Standar assert.doesNotMatch(m, /\bSie\b|\bIhre?\b/, code) } }) + +test('Preis-Editor: Platzhalter-Feldfehler verschwindet beim Tippen', mit(ukServer(), async (fx) => { + const { panel } = await zeigeTab(fx, ukTab) + await fx.klick(aktion(fx, panel, 'bearbeiten')) + await fx.ruhe() + const storno = fx.finde(panel, '#bk-p-storno') + await fx.setze(storno, 'Bis zu [X] Tage vor Anreise kostenfrei stornierbar, danach 100 %.') + await fx.klick(aktion(fx, panel, 'preise-speichern')) + await fx.ruhe() + assert.match(fehlerText(fx, panel, 'stornobedingungen'), /Platzhalter/) + await fx.setze(storno, 'Bis zu 14 Tage vor Anreise kostenfrei stornierbar, danach 100 %.') + assert.equal(fehlerText(fx, panel, 'stornobedingungen'), '') +}))