web/flows: fix checkboxes not being rendered correctly

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-08-27 23:09:53 +02:00
parent 2d8b4f543b
commit 6237352e25
2 changed files with 17 additions and 8 deletions

View file

@ -64,13 +64,6 @@ export class PromptStage extends BaseStage<PromptChallenge, PromptChallengeRespo
placeholder="${prompt.placeholder}"
class="pf-c-form-control"
?required=${prompt.required}>`;
case "checkbox":
return `<input
type="checkbox"
name="${prompt.fieldKey}"
placeholder="${prompt.placeholder}"
class="pf-c-form-control"
?required=${prompt.required}>`;
case "date":
return `<input
type="date"
@ -115,6 +108,22 @@ export class PromptStage extends BaseStage<PromptChallenge, PromptChallengeRespo
}}
>
${this.challenge.fields.map((prompt) => {
// Checkbox is rendered differently
if (prompt.type === "checkbox") {
return html`<div class="pf-c-check">
<input
type="checkbox"
class="pf-c-check__input"
name="${prompt.fieldKey}"
?checked=${prompt.placeholder !== ""}
?required=${prompt.required}
/>
<label class="pf-c-check__label">${prompt.label}</label>
${prompt.required
? html`<p class="pf-c-form__helper-text">${t`Required.`}</p>`
: html``}
</div>`;
}
// Special types that aren't rendered in a wrapper
if (
prompt.type === "static" ||

View file

@ -157,7 +157,7 @@ export class PromptForm extends ModelForm<Prompt, string> {
<ak-form-element-horizontal label=${t`Order`} ?required=${true} name="order">
<input
type="number"
value="${ifDefined(this.instance?.order)}"
value="${first(this.instance?.order, 0)}"
class="pf-c-form-control"
required
/>