atst/templates/fragments/admin/change_ppoc.html
dandds 457b1f9523 Detangle the MultiStepModalForm modal-open link from the modal.
In order to place modal forms in other places on the page (so that forms
are not nested) it's necessary to move MultiStepModalForm links out of
the component. They just need to refer to the correct modal.

This PR also makes changes to ensure that the active modal is being
unset everywhere correctly when a modal is closed.
2019-05-08 11:16:56 -04:00

84 lines
2.3 KiB
HTML

{% from "components/icon.html" import Icon %}
{% from "components/selector.html" import Selector %}
{% from "components/text_input.html" import TextInput %}
{% from "components/multi_step_modal_form.html" import MultiStepModalForm %}
{% from "components/alert.html" import Alert %}
{% from "components/options_input.html" import OptionsInput %}
{% set step_one %}
<div class="modal__form--header">
<h1>{{ "fragments.ppoc.update_ppoc_title" | translate }}</h1>
</div>
{{
Alert(
level="warning",
title=("fragments.ppoc.alert.title" | translate),
message=("fragments.ppoc.alert.message" | translate),
)
}}
<div class='form-row'>
<div class='form-col form-col--half'>
{{
OptionsInput(
assign_ppoc_form.user_id
)
}}
</div>
<div class='form-col form-col--half'>
</div>
</div>
<div class='action-group'>
<input
type='button'
v-on:click="next()"
v-bind:disabled="invalid"
class='action-group__action usa-button'
value='{{ "fragments.ppoc.assign_user_button_text" | translate }}'>
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('change-ppoc-form')">
{{ "common.cancel" | translate }}
</a>
</div>
{% endset %}
{% set step_two %}
<div class="modal__form--padded">
<div class="modal__form--header">
<h1>{{ "fragments.ppoc.update_ppoc_confirmation_title" | translate }}</h1>
</div>
{{
Alert(
level="info",
title=("fragments.ppoc.confirm_alert.title" | translate),
)
}}
<div class='action-group'>
<input
type="submit"
class='action-group__action usa-button'
form="change-ppoc-form"
value='{{ "common.confirm" | translate }}'>
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('change-ppoc-form')">
{{ "common.cancel" | translate }}
</a>
</div>
</div>
{% endset %}
<div class="flex-reverse-row">
<a class="usa-button-primary" v-on:click="openModal('change-ppoc-form')">
{{ "fragments.ppoc.update_btn" | translate }}
</a>
{{
MultiStepModalForm(
'change-ppoc-form',
assign_ppoc_form,
form_action=url_for("portfolios.update_ppoc", portfolio_id=portfolio.id),
steps=[step_one, step_two],
)
}}
</div>