77afc0d9fa
This refactors references to values in templates from `{{foo}}` to either `{{this.foo}}` if it's a property of backing JavaScript class or `{{@foo}}` if it's passed in on invocation.
You could find more details on this change in Ember docs:
- [required `this` in templates](https://guides.emberjs.com/release/upgrading/current-edition/templates/#toc_required-this-in-templates)
- [named arguments](https://guides.emberjs.com/release/upgrading/current-edition/templates/#toc_named-arguments)
While doing this I noticed that `<PollEvaluationSummaryOption>` component could be easily refactored to a template-only component. Done it as part of this pull request even so it's technically not related.
114 lines
No EOL
3.5 KiB
Handlebars
114 lines
No EOL
3.5 KiB
Handlebars
<div class="participation cr-form-wrapper">
|
|
<BsForm
|
|
@formLayout="horizontal"
|
|
@model={{this}}
|
|
@onInvalid={{scroll-first-invalid-element-into-view-port}}
|
|
@onSubmit={{action "submit"}}
|
|
novalidate
|
|
as |form|
|
|
>
|
|
<form.element
|
|
@autofocus={{true}}
|
|
@controlType="text"
|
|
@label={{t "poll.input.newUserName.label"}}
|
|
@placeholder={{t "poll.input.newUserName.placeholder"}}
|
|
@property="name"
|
|
class="name"
|
|
data-test-form-element="name"
|
|
/>
|
|
<div class="selections">
|
|
{{#each this.selections as |selection|}}
|
|
{{#if this.isFreeText}}
|
|
<form.element
|
|
@controlType="text"
|
|
@label={{if this.isFindADate
|
|
(moment-format
|
|
selection.labelValue
|
|
(if (eq selection.momentFormat "day") this.momentLongDayFormat selection.momentFormat)
|
|
locale=this.currentLocale
|
|
timeZone=this.timezone
|
|
)
|
|
selection.labelValue
|
|
}}
|
|
@model={{selection}}
|
|
@property="value"
|
|
/>
|
|
{{else}}
|
|
<form.element
|
|
@label={{if this.isFindADate
|
|
(moment-format
|
|
selection.labelValue
|
|
(if (eq selection.momentFormat "day") this.momentLongDayFormat selection.momentFormat)
|
|
locale=this.currentLocale
|
|
timeZone=this.timezone
|
|
)
|
|
selection.labelValue
|
|
}}
|
|
@model={{selection}}
|
|
@property="value"
|
|
@showValidationOn="change"
|
|
@useIcons={{false}}
|
|
data-test-form-element={{concat "option-" selection.labelValue}}
|
|
as |el|
|
|
>
|
|
{{#each this.possibleAnswers as |possibleAnswer|}}
|
|
<div class="radio custom-control custom-radio custom-control-inline {{possibleAnswer.type}}">
|
|
<input
|
|
class="custom-control-input
|
|
{{if (eq el.validation "success") "is-valid"}}
|
|
{{if (eq el.validation "error") "is-invalid"}}
|
|
"
|
|
type="radio"
|
|
value={{possibleAnswer.type}}
|
|
checked={{eq possibleAnswer.type el.value}}
|
|
onchange={{action (mut el.value) possibleAnswer.type}}
|
|
id={{concat el.id "_" possibleAnswer.type}}
|
|
name={{selection.labelValue}}
|
|
>
|
|
<label class="custom-control-label" for={{concat el.id "_" possibleAnswer.type}}>
|
|
{{possibleAnswer.label}}
|
|
</label>
|
|
</div>
|
|
{{/each}}
|
|
</form.element>
|
|
{{/if}}
|
|
{{/each}}
|
|
</div>
|
|
|
|
<div class="row cr-steps-bottom-nav">
|
|
<div class="col-md-8 offset-md-4">
|
|
<SaveButton @isPending={{form.isSubmitting}} data-test-button="submit" />
|
|
</div>
|
|
</div>
|
|
</BsForm>
|
|
</div>
|
|
|
|
<BsModal
|
|
@onHidden={{action (mut this.savingFailed) false}}
|
|
@onSubmit={{action "save"}}
|
|
@open={{this.savingFailed}}
|
|
data-test-modal="saving-failed"
|
|
as |modal|
|
|
>
|
|
<modal.header
|
|
@closeButton={{false}}
|
|
@title={{t "modal.save-retry.title"}}
|
|
/>
|
|
<modal.body>
|
|
<p>{{t "modal.save-retry.text"}}</p>
|
|
</modal.body>
|
|
<modal.footer>
|
|
<BsButton
|
|
@onClick={{action modal.close}}
|
|
>
|
|
{{t "action.abort"}}
|
|
</BsButton>
|
|
<BsButton
|
|
@type="primary"
|
|
@onClick={{action modal.submit}}
|
|
data-test-button="retry"
|
|
>
|
|
{{t "modal.save-retry.button-retry"}}
|
|
</BsButton>
|
|
</modal.footer>
|
|
</BsModal> |