137 lines
5.3 KiB
HTML
137 lines
5.3 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="usa-input__choices">
|
|
<div class="form-row">
|
|
<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>
|
|
</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>
|
|
<input
|
|
type='button'
|
|
v-on:click="previous()"
|
|
class='action-group__action usa-button action-group__action--left'
|
|
value='Previous step'>
|
|
</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",
|
|
) }}
|