Add Read Only version of Application Environments table

This commit is contained in:
Montana 2019-04-25 14:47:18 -04:00
parent d5b4566b15
commit 0371ecbd99
3 changed files with 92 additions and 10 deletions

View File

@ -0,0 +1,77 @@
{% 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>
<span class="float-right">{{ "portfolios.applications.environments.members" | translate }}</span>
</div>
<ul class="accordion-table__items">
{% for name, members_list in environments_obj.items() %}
<toggler inline-template>
<li class="accordion-table__item">
<div class="accordion-table__item-content">
<span>
{{ name }}
</span>
<span class="icon-link icon-link--large accordion-table__item__toggler">
{% set open_environments_button %}
{{ "common.show" | translate }} Environments ({{ members_list | length }}) {{ Icon('caret_down') }}
{% endset %}
{% set close_environments_button %}
{{ "common.hide" | translate }} Environments ({{ members_list | length }}) {{ Icon('caret_up') }}
{% endset %}
{{
ToggleButton(
open_html=open_environments_button,
close_html=close_environments_button,
section_name="environments"
)
}}
</span>
</div>
{% call ToggleSection(section_name="environments") %}
<ul>
{% for member in members_list %}
<li class="accordion-table__item__expanded">
<div class="accordion-table__item__expanded_first">{{ member.name }}</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>

View File

@ -78,16 +78,21 @@
</form>
<div class="accordion-table responsive-table-wrapper panel">
{% include "fragments/applications/environments.html" %}
<div class="panel__footer">
<div class="action-group">
<button class="usa-button usa-button-primary" tabindex="0" type="submit">{{ 'portfolios.applications.update_button_text' | translate }}</button>
<a class='icon-link'>
{{ "portfolios.applications.add_environment" | translate }}
{{ Icon('plus-circle-solid') }}
</a>
</div>
</div>
{% if user_can(permissions.EDIT_APPLICATION) %}
{% include "fragments/applications/edit_environments.html" %}
<div class="panel__footer">
<div class="action-group">
<button class="usa-button usa-button-primary" tabindex="0" type="submit">{{ 'portfolios.applications.update_button_text' | translate }}</button>
<a class='icon-link'>
{{ "portfolios.applications.add_environment" | translate }}
{{ Icon('plus-circle-solid') }}
</a>
</div>
</div>
{% elif user_can(permissions.VIEW_ENVIRONMENT) %}
{% include "fragments/applications/read_only_environments.html" %}
{% endif %}
</div>
{% if user_can(permissions.DELETE_APPLICATION) %}
{% call Modal(name="delete-application") %}