fd1d0b527a
It will be enabled when the user checks the "manage environments" permission. This updates the Jinja and Vue checkbox input components so that Vue can monitor the inpur state.
130 lines
5.0 KiB
HTML
130 lines
5.0 KiB
HTML
{% from "components/icon.html" import Icon %}
|
|
{% from "components/text_input.html" import TextInput %}
|
|
{% from "components/checkbox_input.html" import CheckboxInput %}
|
|
{% from "components/multi_step_modal_form.html" import MultiStepModalForm %}
|
|
|
|
{% set step_one %}
|
|
<div class="modal__form--header">
|
|
<h1>Invite new member</h1>
|
|
</div>
|
|
<div class='form-row'>
|
|
<div class='form-col form-col--half'>
|
|
{{ TextInput(member_form.user_data.first_name, validation='requiredField') }}
|
|
</div>
|
|
<div class='form-col form-col--half'>
|
|
{{ TextInput(member_form.user_data.last_name, validation='requiredField') }}
|
|
</div>
|
|
</div>
|
|
<div class='form-row'>
|
|
<div class='form-col form-col--half'>
|
|
{{ TextInput(member_form.user_data.email, validation='email') }}
|
|
</div>
|
|
<div class='form-col form-col--half'>
|
|
{{ TextInput(member_form.user_data.phone_number, validation='usPhone', optional=True) }}
|
|
</div>
|
|
</div>
|
|
<div class='form-row'>
|
|
<div class='form-col form-col--half'>
|
|
{{ TextInput(member_form.user_data.dod_id, validation='dodId') }}
|
|
</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='Next'>
|
|
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">Cancel</a>
|
|
</div>
|
|
{% endset %}
|
|
{% set step_two %}
|
|
<div class="modal__form--padded">
|
|
<div class="modal__form--header">
|
|
<h1>{{ "portfolios.applications.members.new.assign_roles" | translate }}</h1>
|
|
<a class='icon-link'>
|
|
{{ Icon('info') }}
|
|
{{ "portfolios.applications.members.new.learn_more" | translate }}
|
|
</a>
|
|
<div class="environment-roles-new">
|
|
<div class="form-row">
|
|
<div class="form-col form-col--quarter">
|
|
<span class="environment-roles-new__head">
|
|
{{ "common.resource_names.environments" | translate }}:
|
|
</span>
|
|
</div>
|
|
<div class="form-col form-col--three-quarters">
|
|
<span class="environment-roles-new__head">
|
|
{{ "common.choose_role" | translate }}:
|
|
</span>
|
|
</div>
|
|
</div>
|
|
{% for environment_data in member_form.environment_roles %}
|
|
<optionsinput inline-template
|
|
v-bind:initial-value="'{{ environment_data.role.data | string }}'"
|
|
>
|
|
<div class="usa-input">
|
|
<fieldset data-ally-disabled="true" class="form-row usa-input__choices">
|
|
<div class="form-col form-col--quarter">
|
|
<legend>
|
|
<div v-bind:class='["usa-input__title-inline", {"environment-name--gray": value === "None" }]'>
|
|
{{ environment_data.environment_name.data }}
|
|
</div>
|
|
</legend>
|
|
</div>
|
|
<div class="form-col form-col--three-quarters">
|
|
{{ environment_data.role(**{"v-model": "value"}) }}
|
|
</div>
|
|
</fieldset>
|
|
</div>
|
|
</optionsinput>
|
|
{{ environment_data.environment_id() }}
|
|
{% endfor %}
|
|
</div>
|
|
<h1>{{ "portfolios.applications.members.new.manage_perms" | translate({"application_name": application.name}) }}</h1>
|
|
{{ CheckboxInput(member_form.permission_sets.perms_team_mgmt, classes="input__inline-fields") }}
|
|
{% call CheckboxInput(member_form.permission_sets.perms_env_mgmt, classes="input__inline-fields") %}
|
|
{% set field=member_form.permission_sets.perms_del_env %}
|
|
<checkboxinput
|
|
name='{{ field.name }}'
|
|
inline-template
|
|
key='{{ field.name }}'
|
|
v-bind:initial-checked='{{ field.data|string|lower }}'
|
|
>
|
|
<div class="usa-input input__inline-fields input__inline-fields--indented">
|
|
<fieldset data-ally-disabled="true" class="usa-input__choices usa-input__choices--inline">
|
|
<legend>
|
|
<input
|
|
id="permission_sets-perms_del_env"
|
|
name="permission_sets-perms_del_env"
|
|
type="checkbox"
|
|
v-model="checked"
|
|
v-bind:disabled="!$parent.checked">
|
|
{{ field.label | safe }}
|
|
</legend>
|
|
</fieldset>
|
|
</div>
|
|
</checkboxinput>
|
|
{% endcall %}
|
|
</div>
|
|
<div class='action-group'>
|
|
<input
|
|
type="submit"
|
|
class='action-group__action usa-button'
|
|
form="add-app-mem"
|
|
value='Invite member'>
|
|
<a class='action-group__action icon-link icon-link--default' v-on:click="closeModal('{{ new_port_mem }}')">Cancel</a>
|
|
</div>
|
|
</div>
|
|
{% endset %}
|
|
{{ MultiStepModalForm(
|
|
'add-app-mem',
|
|
member_form,
|
|
url_for("applications.create_member", application_id=application.id),
|
|
[step_one, step_two],
|
|
button_text=("portfolios.admin.add_new_member" | translate),
|
|
button_icon="plus-circle-solid",
|
|
) }}
|