Update the environments section and delete unused templates
This commit is contained in:
leigh-mil
@@ -322,6 +322,34 @@
|
|||||||
input#delete-application {
|
input#delete-application {
|
||||||
margin-top: $gap * 3;
|
margin-top: $gap * 3;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.accordion-table__item-content.form-row {
|
||||||
|
margin-bottom: 0;
|
||||||
|
margin-top: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
li.accordion-table__item__expanded {
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.environment-list__item {
|
||||||
|
position: relative;
|
||||||
|
height: 7rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
span.accordion-table__item__toggler.icon-link {
|
||||||
|
font-size: $small-font-size;
|
||||||
|
font-weight: $font-normal;
|
||||||
|
position: absolute;
|
||||||
|
left: -$gap * 1.25;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.application-list-item__environment__csp_link.icon-link {
|
||||||
|
font-size: $small-font-size;
|
||||||
|
font-weight: $font-normal;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.activity-log {
|
.activity-log {
|
||||||
|
|||||||
@@ -28,15 +28,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
|
<a class='icon-link' v-on:click="toggle">
|
||||||
<div v-else class="panel__footer">
|
{{ Icon('plus') }}
|
||||||
<div class="action-group">
|
{{ "portfolios.applications.add_environment" | translate }}
|
||||||
<a class='icon-link' v-on:click="toggle">
|
</a>
|
||||||
{{ "portfolios.applications.add_environment" | translate }}
|
|
||||||
{{ Icon('plus') }}
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</new-environment>
|
</new-environment>
|
||||||
|
|
||||||
|
|||||||
@@ -1,91 +0,0 @@
|
|||||||
{% from "components/icon.html" import Icon %}
|
|
||||||
{% from "components/save_button.html" import SaveButton %}
|
|
||||||
|
|
||||||
|
|
||||||
{% for env_form in members_form.envs %}
|
|
||||||
{% if env_form.env_id.data == env['id'] %}
|
|
||||||
<form
|
|
||||||
action="{{ url_for('applications.update_env_roles', environment_id=env['id']) }}"
|
|
||||||
method="post">
|
|
||||||
{{ members_form.csrf_token }}
|
|
||||||
{{ env_form.env_id() }}
|
|
||||||
<edit-environment-role
|
|
||||||
inline-template
|
|
||||||
v-bind:initial-role-categories='{{ env_form.team_roles.data | tojson }}'>
|
|
||||||
<div>
|
|
||||||
<div v-for='(roleCategory, roleindex) in roleCategories' class='environment-role'>
|
|
||||||
<h4 v-if='checkNoAccess(roleCategory.role)'>
|
|
||||||
{{ 'fragments.edit_environment_team_form.unassigned_title' | translate }}
|
|
||||||
</h4>
|
|
||||||
<h4 v-else v-html='roleCategory.role'></h4>
|
|
||||||
<ul class='environment-role__users'>
|
|
||||||
<div
|
|
||||||
v-if="roleCategory.members && !roleCategory.members.length"
|
|
||||||
class='environment-role__no-user'>
|
|
||||||
{{ 'fragments.edit_environment_team_form.no_members' | translate }}
|
|
||||||
</div>
|
|
||||||
<li
|
|
||||||
v-for='(member, memberindex) in roleCategory.members'
|
|
||||||
class="environment-role__user"
|
|
||||||
v-bind:class="{'unassigned': checkNoAccess(member.role_name)}">
|
|
||||||
<span v-html='member.user_name'>
|
|
||||||
</span>
|
|
||||||
<span v-on:click="toggleSection(member.application_role_id)" class="icon-link right">
|
|
||||||
{{ Icon('edit', classes="icon--medium") }}
|
|
||||||
</span>
|
|
||||||
<div
|
|
||||||
v-show="selectedSection === member.application_role_id"
|
|
||||||
class='environment-role__user-field'>
|
|
||||||
<div class="usa-input">
|
|
||||||
<fieldset
|
|
||||||
data-ally-disabled="true"
|
|
||||||
class="usa-input__choices"
|
|
||||||
v-on:change="onInput">
|
|
||||||
<ul
|
|
||||||
v-for='(roleCategory, roleinputindex) in roleCategories'
|
|
||||||
v-bind:id="'envs-{{ loop.index0 }}-team_roles-' + roleindex + '-members-' + memberindex + '-role_name'">
|
|
||||||
<li>
|
|
||||||
<input
|
|
||||||
v-bind:checked="member.role_name === roleCategory.role"
|
|
||||||
v-bind:name="'envs-{{ loop.index0 }}-team_roles-' + roleindex + '-members-' + memberindex + '-role_name'"
|
|
||||||
v-bind:id="'envs-{{ loop.index0 }}-team_roles-' + roleindex + '-members-' + memberindex + '-role_name-' + roleinputindex"
|
|
||||||
type="radio"
|
|
||||||
v-bind:user-id='member.application_role_id'
|
|
||||||
v-bind:value='roleCategory.role'>
|
|
||||||
<label
|
|
||||||
v-bind:for="'envs-{{ loop.index0 }}-team_roles-' + roleindex + '-members-' + memberindex + '-role_name-' + roleinputindex">
|
|
||||||
<span v-if='checkNoAccess(roleCategory.role)'>
|
|
||||||
{{ 'fragments.edit_environment_team_form.no_access' | translate }}
|
|
||||||
</span>
|
|
||||||
<span v-else v-html='roleCategory.role'></span>
|
|
||||||
</label>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</fieldset>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<input
|
|
||||||
v-bind:id="'envs-{{ loop.index0 }}-team_roles-' + roleindex + '-members-' + memberindex + '-application_role_id'"
|
|
||||||
v-bind:name="'envs-{{ loop.index0 }}-team_roles-' + roleindex + '-members-' + memberindex + '-application_role_id'"
|
|
||||||
type="hidden"
|
|
||||||
v-bind:value='member.application_role_id'>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class='action-group'>
|
|
||||||
{{
|
|
||||||
SaveButton(
|
|
||||||
text=("common.save" | translate)
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</edit-environment-role>
|
|
||||||
<div class='action-group-cancel'>
|
|
||||||
<a class='action-group-cancel__action icon-link icon-link--default' v-on:click="toggleSection('members')">
|
|
||||||
{{ "common.cancel" | translate }}
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
{% endif %}
|
|
||||||
{% endfor %}
|
|
||||||
@@ -1,128 +0,0 @@
|
|||||||
{% from "components/delete_confirmation.html" import DeleteConfirmation %}
|
|
||||||
{% from "components/icon.html" import Icon %}
|
|
||||||
{% from "components/modal.html" import Modal %}
|
|
||||||
{% from "components/options_input.html" import OptionsInput %}
|
|
||||||
{% from "components/save_button.html" import SaveButton %}
|
|
||||||
{% from "components/text_input.html" import TextInput %}
|
|
||||||
{% from "components/toggle_list.html" import ToggleButton, ToggleSection %}
|
|
||||||
|
|
||||||
|
|
||||||
<div class="application-list-item application-list">
|
|
||||||
<header>
|
|
||||||
<div class="responsive-table-wrapper__header">
|
|
||||||
<div class='responsive-table-wrapper__title'>
|
|
||||||
<div class='h3'>{{ 'portfolios.applications.environments_heading' | translate }}</div>
|
|
||||||
</div>
|
|
||||||
<a class='icon-link'>
|
|
||||||
{{ Icon('info') }}
|
|
||||||
{{ "portfolios.admin.settings_info" | translate }}
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<div class="accordion-table accordion-table-list">
|
|
||||||
<div class="accordion-table__head row">
|
|
||||||
<div class="col col--grow">{{ "portfolios.applications.environments.name" | translate }}</div>
|
|
||||||
<div class="col col--grow">{{ "portfolios.applications.environments.edit_name" | translate }}</div>
|
|
||||||
<div class="col col--grow">{{ "common.delete" | translate }}</div>
|
|
||||||
<div class="col col--grow">{{ "common.members" | translate }}</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul class="accordion-table__items">
|
|
||||||
{% for env in environments_obj %}
|
|
||||||
{% set delete_environment_modal_id = "delete_modal_environment{}".format(env['id']) %}
|
|
||||||
{% set edit_form = env['edit_form'] %}
|
|
||||||
|
|
||||||
<toggler inline-template {% if active_toggler == (env['id'] | safe) %}initial-selected-section="{{ active_toggler_section }}"{% endif %}>
|
|
||||||
<li class="accordion-table__item">
|
|
||||||
<div class="accordion-table__item-content row">
|
|
||||||
<div class="col col--grow">
|
|
||||||
{{ env['name'] }}
|
|
||||||
</div>
|
|
||||||
<div class="col col--grow">
|
|
||||||
<span class="icon-link">
|
|
||||||
{% set edit_environment_button %}
|
|
||||||
{{ Icon('edit') }}
|
|
||||||
{% endset %}
|
|
||||||
|
|
||||||
{{
|
|
||||||
ToggleButton(
|
|
||||||
open_html=edit_environment_button,
|
|
||||||
close_html=edit_environment_button,
|
|
||||||
section_name="edit"
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="col col--grow">
|
|
||||||
<span class="icon-link icon-link--danger" alt="Delete environment" v-on:click="openModal('{{ delete_environment_modal_id }}')">
|
|
||||||
{{ Icon('trash') }}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="col col--grow icon-link icon-link--large accordion-table__item__toggler">
|
|
||||||
{% set open_members_button %}
|
|
||||||
{{ "common.members" | translate }} ({{ env['member_count'] }}) {{ Icon('caret_down') }}
|
|
||||||
{% endset %}
|
|
||||||
|
|
||||||
{% set close_members_button %}
|
|
||||||
{{ "common.members" | translate }} ({{ env['member_count'] }}) {{ Icon('caret_up') }}
|
|
||||||
{% endset %}
|
|
||||||
|
|
||||||
{{
|
|
||||||
ToggleButton(
|
|
||||||
open_html=open_members_button,
|
|
||||||
close_html=close_members_button,
|
|
||||||
section_name="members"
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{% call ToggleSection(section_name="members", classes="environment-roles") %}
|
|
||||||
{% include 'fragments/applications/edit_environment_team_form.html' %}
|
|
||||||
{% endcall %}
|
|
||||||
|
|
||||||
{% call ToggleSection(section_name="edit") %}
|
|
||||||
<ul>
|
|
||||||
<li class="accordion-table__item__expanded">
|
|
||||||
<form action="{{ url_for('applications.update_environment', environment_id=env['id']) }}" method="post" v-on:submit="handleSubmit">
|
|
||||||
{{ edit_form.csrf_token }}
|
|
||||||
{{ TextInput(edit_form.name, validation='requiredField') }}
|
|
||||||
{{
|
|
||||||
SaveButton(
|
|
||||||
text=("common.save" | translate)
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
</form>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
{% endcall %}
|
|
||||||
</li>
|
|
||||||
</toggler>
|
|
||||||
|
|
||||||
{% call Modal(name=delete_environment_modal_id) %}
|
|
||||||
<h1>
|
|
||||||
{{ 'fragments.edit_environment_team_form.delete_environment_title' | translate }}
|
|
||||||
</h1>
|
|
||||||
|
|
||||||
{{
|
|
||||||
Alert(
|
|
||||||
level="warning",
|
|
||||||
title=('components.modal.destructive_title' | translate),
|
|
||||||
message=('components.modal.destructive_message' | translate({"resource": "environment"})),
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
|
|
||||||
{{
|
|
||||||
DeleteConfirmation(
|
|
||||||
modal_id=delete_environment_modal_id,
|
|
||||||
delete_text=('portfolios.applications.environments.delete.button' | translate),
|
|
||||||
delete_action= url_for('applications.delete_environment', environment_id=env['id']),
|
|
||||||
form=edit_form
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
{% endcall %}
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@@ -1,76 +0,0 @@
|
|||||||
{% from "components/icon.html" import Icon %}
|
|
||||||
{% from "components/toggle_list.html" import ToggleButton, ToggleSection %}
|
|
||||||
|
|
||||||
<div class="application-list-item">
|
|
||||||
<header>
|
|
||||||
<div class="responsive-table-wrapper__header">
|
|
||||||
<div class='responsive-table-wrapper__title'>
|
|
||||||
<div class='h3'>{{ 'portfolios.applications.environments_heading' | translate }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<div class="accordion-table accordion-table-list">
|
|
||||||
<div class="accordion-table__head">
|
|
||||||
<span>{{ "portfolios.applications.environments.name" | translate }}</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<ul class="accordion-table__items">
|
|
||||||
{% for env in environments_obj %}
|
|
||||||
<toggler inline-template>
|
|
||||||
<li class="accordion-table__item">
|
|
||||||
<div class="accordion-table__item-content">
|
|
||||||
<span>
|
|
||||||
{{ env['name'] }}
|
|
||||||
</span>
|
|
||||||
|
|
||||||
<span class="icon-link icon-link--large accordion-table__item__toggler">
|
|
||||||
{% set open_members_button %}
|
|
||||||
{{ "common.members" | translate }} ({{ env['member_count'] }}) {{ Icon('caret_down') }}
|
|
||||||
{% endset %}
|
|
||||||
|
|
||||||
{% set close_members_button %}
|
|
||||||
{{ "common.members" | translate }} ({{ env['member_count'] }}) {{ Icon('caret_up') }}
|
|
||||||
{% endset %}
|
|
||||||
|
|
||||||
{{
|
|
||||||
ToggleButton(
|
|
||||||
open_html=open_members_button,
|
|
||||||
close_html=close_members_button,
|
|
||||||
section_name="members"
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{% call ToggleSection(section_name="members") %}
|
|
||||||
<ul>
|
|
||||||
{% for member in env['members'] %}
|
|
||||||
<li class="accordion-table__item__expanded">
|
|
||||||
<div class="accordion-table__item__expanded_first">{{ member }}</div>
|
|
||||||
</li>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
{% endcall %}
|
|
||||||
|
|
||||||
{% call ToggleSection(section_name="edit") %}
|
|
||||||
<ul>
|
|
||||||
<li class="accordion-table__item__expanded">
|
|
||||||
<div>
|
|
||||||
<form>
|
|
||||||
<div class="form-row">
|
|
||||||
<div class="form-col form-col--half">
|
|
||||||
Row here
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
{% endcall %}
|
|
||||||
</li>
|
|
||||||
</toggler>
|
|
||||||
{% endfor %}
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@@ -9,6 +9,7 @@
|
|||||||
{% from "components/pagination.html" import Pagination %}
|
{% from "components/pagination.html" import Pagination %}
|
||||||
{% from "components/save_button.html" import SaveButton %}
|
{% from "components/save_button.html" import SaveButton %}
|
||||||
{% from "components/text_input.html" import TextInput %}
|
{% from "components/text_input.html" import TextInput %}
|
||||||
|
{% from "components/toggle_list.html" import ToggleButton, ToggleSection %}
|
||||||
|
|
||||||
{% set secondary_breadcrumb = 'portfolios.applications.existing_application_title' | translate({ "application_name": application.name }) %}
|
{% set secondary_breadcrumb = 'portfolios.applications.existing_application_title' | translate({ "application_name": application.name }) %}
|
||||||
|
|
||||||
@@ -157,22 +158,104 @@
|
|||||||
</section>
|
</section>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
<div id="application-environments">
|
|
||||||
<div class="accordion-table responsive-table-wrapper panel">
|
|
||||||
{% if g.matchesPath("application-environments") %}
|
|
||||||
{% include "fragments/flash.html" %}
|
|
||||||
{% endif %}
|
|
||||||
|
|
||||||
{% if user_can(permissions.EDIT_ENVIRONMENT) %}
|
<div class='subheading'>
|
||||||
{% include "fragments/applications/edit_environments.html" %}
|
Environments
|
||||||
|
|
||||||
{% if user_can(permissions.CREATE_ENVIRONMENT) %}
|
{% if user_can(permissions.CREATE_ENVIRONMENT) %}
|
||||||
{% include "fragments/applications/add_new_environment.html" %}
|
{% include "fragments/applications/add_new_environment.html" %}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
</div>
|
||||||
|
|
||||||
{% elif user_can(permissions.VIEW_ENVIRONMENT) %}
|
|
||||||
{% include "fragments/applications/read_only_environments.html" %}
|
{% if g.matchesPath("application-environments") %}
|
||||||
{% endif %}
|
{% include "fragments/flash.html" %}
|
||||||
|
{% endif %}
|
||||||
|
|
||||||
|
<div class="panel">
|
||||||
|
<div class="panel__content">
|
||||||
|
<div class="accordion-table accordion-table-list">
|
||||||
|
<ul class="accordion-table__items">
|
||||||
|
{% for env in environments_obj %}
|
||||||
|
{% set edit_form = env['edit_form'] %}
|
||||||
|
<toggler inline-template>
|
||||||
|
<li class="accordion-table__item">
|
||||||
|
<div class="accordion-table__item-content form-row">
|
||||||
|
<div class="form-col form-col--two-thirds">
|
||||||
|
<div class="environment-list__item">
|
||||||
|
<span>
|
||||||
|
{{ env['name'] }}
|
||||||
|
</span>
|
||||||
|
<span class="icon-link">
|
||||||
|
{% set edit_environment_button %}
|
||||||
|
{{ Icon('edit') }}
|
||||||
|
{% endset %}
|
||||||
|
|
||||||
|
{{
|
||||||
|
ToggleButton(
|
||||||
|
open_html=edit_environment_button,
|
||||||
|
close_html=edit_environment_button,
|
||||||
|
section_name="edit"
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
<span class="accordion-table__item__toggler icon-link">
|
||||||
|
{% set open_members_button %}
|
||||||
|
{{ env['member_count'] }} members
|
||||||
|
{% endset %}
|
||||||
|
|
||||||
|
{% set close_members_button %}
|
||||||
|
{{ env['member_count'] }} members
|
||||||
|
{% endset %}
|
||||||
|
|
||||||
|
{{
|
||||||
|
ToggleButton(
|
||||||
|
open_html=open_members_button,
|
||||||
|
close_html=close_members_button,
|
||||||
|
section_name="members"
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="form-col form-col--third">
|
||||||
|
<a href='{{ url_for("applications.access_environment", environment_id=env.id)}}' target='_blank' rel='noopener noreferrer' class='application-list-item__environment__csp_link icon-link'>
|
||||||
|
<span>Cloud Service Provider Link {{ Icon('link', classes="icon--tiny") }}</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% call ToggleSection(section_name="members") %}
|
||||||
|
<ul>
|
||||||
|
{% for member in env['members'] %}
|
||||||
|
<li class="accordion-table__item__expanded">
|
||||||
|
{{ member }}
|
||||||
|
</li>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
{% endcall %}
|
||||||
|
|
||||||
|
{% call ToggleSection(section_name="edit") %}
|
||||||
|
<ul>
|
||||||
|
<li class="accordion-table__item__expanded">
|
||||||
|
<form action="{{ url_for('applications.update_environment', environment_id=env['id']) }}" method="post" v-on:submit="handleSubmit">
|
||||||
|
{{ edit_form.csrf_token }}
|
||||||
|
{{ TextInput(edit_form.name, validation='requiredField') }}
|
||||||
|
{{
|
||||||
|
SaveButton(
|
||||||
|
text=("common.save" | translate)
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</form>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
{% endcall %}
|
||||||
|
</li>
|
||||||
|
</toggler>
|
||||||
|
{% endfor %}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user