Form components for changing user environment role
This commit is contained in:
parent
ff41a20ad8
commit
d38c4df878
@ -1,14 +1,24 @@
|
||||
from flask_wtf import FlaskForm
|
||||
from wtforms.fields import FormField, FieldList, HiddenField, StringField
|
||||
from wtforms.fields import FormField, FieldList, HiddenField, RadioField, StringField
|
||||
from wtforms.validators import Required
|
||||
|
||||
from .application_member import EnvironmentForm
|
||||
from .application_member import EnvironmentForm as BaseEnvironmentForm
|
||||
from .data import ENV_ROLES
|
||||
from .forms import BaseForm
|
||||
from atst.forms.fields import SelectField
|
||||
from atst.domain.permission_sets import PermissionSets
|
||||
from atst.utils.localization import translate
|
||||
|
||||
|
||||
class EnvironmentForm(BaseEnvironmentForm):
|
||||
role = RadioField(
|
||||
"Role",
|
||||
choices=ENV_ROLES,
|
||||
default=None,
|
||||
filters=[lambda x: None if x == "None" else x],
|
||||
)
|
||||
|
||||
|
||||
class PermissionsForm(FlaskForm):
|
||||
perms_team_mgmt = SelectField(
|
||||
translate("portfolios.applications.members.new.manage_team"),
|
||||
|
@ -20,6 +20,7 @@ export default {
|
||||
optionsinput,
|
||||
textinput,
|
||||
optionsinput,
|
||||
toggler: this,
|
||||
},
|
||||
|
||||
data: function() {
|
||||
|
@ -609,3 +609,40 @@
|
||||
.member-list__name {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.member-list__role-select {
|
||||
overflow: auto;
|
||||
margin: 1.6rem -3.2rem -1.6rem -3.2rem;
|
||||
padding: 2rem 3.2rem 2rem 5rem;
|
||||
background: $color-gray-cool-light;
|
||||
border-top: 1px solid $color-gray-lighter;
|
||||
|
||||
> label {
|
||||
font-weight: $font-bold;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
> label:first-child + ul.member-list____role-select__radio {
|
||||
display: flex;
|
||||
background: $color-gray-cool-light;
|
||||
|
||||
li {
|
||||
border-bottom: none;
|
||||
|
||||
label {
|
||||
margin-top: 1rem;
|
||||
margin-left: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
li:first-child > label {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
button {
|
||||
font-size: $small-font-size;
|
||||
float: right;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
@ -73,7 +73,7 @@ $color-gray-lightest: #f1f1f1;
|
||||
|
||||
$color-gray-warm-dark: #494440;
|
||||
$color-gray-warm-light: #e4e2e0;
|
||||
$color-gray-cool-light: #dce4ef;
|
||||
$color-gray-cool-light: #eff2f7;
|
||||
|
||||
$color-gold-dark: #cd841b;
|
||||
$color-gold: #fdb81e;
|
||||
|
@ -12,7 +12,7 @@
|
||||
<button type='button' class='icon-link modal__dismiss' v-on:click='closeModal("{{name}}")'>
|
||||
{{ Icon('x') }}
|
||||
<span>
|
||||
{{ "components.modal.close" | translate }}
|
||||
{{ "common.close" | translate }}
|
||||
</span>
|
||||
</button>
|
||||
{% endif %}
|
||||
|
@ -37,40 +37,57 @@
|
||||
}}
|
||||
</div>
|
||||
{% call ToggleSection(section_name="environments") %}
|
||||
<ul>
|
||||
{% for environment_form in environment_roles_form %}
|
||||
<li class="accordion-table__item__expanded row">
|
||||
<div class="col col--grow">
|
||||
{{ environment_form.environment_name.data }}
|
||||
</div>
|
||||
<div class="accordion-table__item__expanded-role col col--grow">
|
||||
<div class="right">
|
||||
<span>
|
||||
{{ environment_form.role.data }}
|
||||
</span>
|
||||
<div class="icon-link">
|
||||
{{ Icon("edit") }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<div class="accordion-table__item__action-group">
|
||||
<a class="icon-link">
|
||||
{{ "portfolios.applications.team_settings.add_to_environment" | translate }}
|
||||
{{ Icon("plus") }}
|
||||
</a>
|
||||
<button
|
||||
id="delete-application"
|
||||
type="button"
|
||||
class='usa-button button-danger'
|
||||
<ul>
|
||||
{% for environment_form in environment_roles_form %}
|
||||
<li class="accordion-table__item__expanded">
|
||||
<toggler inline-template>
|
||||
<div>
|
||||
<div class="row">
|
||||
<div class="col col--grow">
|
||||
{{ environment_form.environment_name.data }}
|
||||
</div>
|
||||
<div class="accordion-table__item__expanded-role col col--grow">
|
||||
<div class="right">
|
||||
<span>
|
||||
{{ environment_form.role.data }}
|
||||
</span>
|
||||
<div class="icon-link" v-on:click="toggleSection('edit-env-role')">
|
||||
{{ Icon("edit") }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="member-list__role-select" v-show="selectedSection === 'edit-env-role'">
|
||||
{{ environment_form.role.label }}
|
||||
{{ environment_form.role(class="member-list____role-select__radio") }}
|
||||
<button
|
||||
class="usa-button"
|
||||
type="button"
|
||||
v-on:click="toggleSection('edit-env-role')"
|
||||
>
|
||||
{{ "common.close" | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</toggler>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<div class="accordion-table__item__action-group">
|
||||
<a class="icon-link">
|
||||
{{ "portfolios.applications.team_settings.add_to_environment" | translate }}
|
||||
{{ Icon("plus") }}
|
||||
</a>
|
||||
<button
|
||||
id="delete-application"
|
||||
type="button"
|
||||
class='usa-button button-danger'
|
||||
>
|
||||
{{ "portfolios.members.archive_button" | translate }}
|
||||
</button>
|
||||
</div>
|
||||
{{ "portfolios.members.archive_button" | translate }}
|
||||
</button>
|
||||
</div>
|
||||
{% endcall %}
|
||||
{{ member_form.user_id() }}
|
||||
</li>
|
||||
</li>
|
||||
</toggler>
|
||||
{% endfor %}
|
||||
|
@ -20,6 +20,7 @@ base_public:
|
||||
common:
|
||||
back: Back
|
||||
cancel: Cancel
|
||||
close: Close
|
||||
confirm: Confirm
|
||||
continue: Continue
|
||||
delete: Delete
|
||||
@ -46,7 +47,6 @@ common:
|
||||
name: Name
|
||||
components:
|
||||
modal:
|
||||
close: Close
|
||||
destructive_message: You will no longer be able to access this {resource}
|
||||
destructive_title: Warning! This action is permanent
|
||||
usa_header:
|
||||
|
Loading…
x
Reference in New Issue
Block a user