pk/atst
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use Accordion macro on applications index page

Browse Source
This commit is contained in:
leigh-mil
2019-12-06 15:12:16 -05:00
parent 0166e2fbc7
commit 7671269b7f
5 changed files with 101 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
templates/applications/index.html
View File

@@ -1,6 +1,7 @@
{% from "components/icon.html" import Icon %}
{% from "components/accordion.html" import Accordion %}
{% from "components/empty_state.html" import EmptyState %}
{% from "components/sticky_cta.html" import StickyCTA %}
{% from "components/icon.html" import Icon %}
{% extends "portfolios/base.html" %}
@@ -31,59 +32,49 @@
) }}
{% else %}
<div class='application-list'>
{% for application in portfolio.applications|sort(attribute='name') %}
{% set section_name = "application-{}".format(application.id) %}
<toggler inline-template>
<div class='application-list-item'>
<header class='row'>
<div class='col col-grow'>
<h3 class='icon-link' v-on:click="toggleSection('{{ section_name }}')">{{ application.name }}</h3>
<p class=''>
{{ application.description }}
</p>
<div class=''>
<a class='icon-link' href='{{ url_for("applications.settings", application_id=application.id) }}'>
<span>{{ "portfolios.applications.app_settings_text" | translate }}</span>
</a>
<div class='separator'></div>
{% set has_environments = 0 < (application.environments|length) %}
<a class='icon-link' v-on:click="toggleSection('{{ section_name }}')" disabled="{{ not has_environments }}">
<span>Environments ({{ application.environments|length }})</span>
{% if has_environments %}
<span v-if="selectedSection === '{{ section_name }}'">
{{ Icon('caret_up') }}
</span>
<span v-else>
{{ Icon('caret_down') }}
</span>
<div class="" v-if="selectedSection === '{{ section_name }}'"></div>
{% endif %}
</a>
</div>
</div>
</header>
<ul v-show="selectedSection === '{{ section_name }}'">
{% for environment in application.environments %}
<li class='application-list-item__environment'>
<div class='application-list-item__environment__name'>
<span>{{ environment.displayname }}</span>
</div>
{% if g.current_user in environment.users %}
<a href='{{ url_for("applications.access_environment", environment_id=environment.id)}}' target='_blank' rel='noopener noreferrer' class='application-list-item__environment__csp_link icon-link'>
<span>{{ "portfolios.applications.csp_console_text" | translate }}</span>
</a>
{% endif %}
</li>
{% endfor %}
</ul>
{% for application in portfolio.applications|sort(attribute='name') %}
{% set section_name = "application-{}".format(application.id) %}
{% set title = "Environments ({})".format(application.environments|length) %}
<div class="accordion">
<div class="accordion__header">
<h3>
<a href='{{ url_for("applications.settings", application_id=application.id) }}'>
{{ application.name }} {{ Icon("caret_right", classes="icon--tiny icon--primary") }}
</a>
</h3>
<p>
{{ application.description }}
</p>
</div>
</toggler>
{% endfor %}
</div>
{% call Accordion(
title=title,
id=section_name,
heading_tag="h4"
) %}
{% for environment in application.environments %}
{{ environment.id }}
<div class="accordion__content--list-item">
<div class="row">
<div class="col col--grow">
{% if g.current_user in environment.users %}
<a href='{{ url_for("applications.access_environment", environment_id=environment.id)}}' target='_blank' rel='noopener noreferrer'>
{{ environment.displayname }} {{ Icon('link', classes='icon--medium icon--primary') }}
</a>
{% else %}
{{ environment.displayname }}
{% endif %}
</div>
{% if g.current_user in environment.users %}
<div class="col">
Your env role here!
</div>
{% endif %}
</div>
</div>
{% endfor %}
{% endcall %}
</div>
{% endfor %}
{% endif %}
</div>