86 lines
3.8 KiB
HTML
86 lines
3.8 KiB
HTML
{% from "components/empty_state.html" import EmptyState %}
|
|
{% from "components/icon.html" import Icon %}
|
|
|
|
<div>
|
|
<h2>Funds Expended per Application and Environment</h2>
|
|
{% set current_month_index = current_month.strftime('%m/%Y') %}
|
|
{% set prev_month_index = prev_month.strftime('%m/%Y') %}
|
|
|
|
{% if not portfolio.applications %}
|
|
|
|
{% set can_create_applications = user_can(permissions.CREATE_APPLICATION) %}
|
|
{% set message = ('portfolios.reports.empty_state.sub_message.can_create_applications' | translate)
|
|
if can_create_applications
|
|
else ('portfolios.reports.empty_state.sub_message.cannot_create_applications' | translate)
|
|
%}
|
|
|
|
{{ EmptyState(
|
|
('portfolios.reports.empty_state.message' | translate),
|
|
action_label= ('portfolios.reports.empty_state.action_label' | translate) if can_create_applications else None,
|
|
action_href=url_for('applications.create_new_application_step_1', portfolio_id=portfolio.id) if can_create_applications else None,
|
|
icon='chart',
|
|
sub_message=message,
|
|
add_perms=can_create_applications
|
|
) }}
|
|
{% else %}
|
|
<spend-table
|
|
v-bind:applications='{{ monthly_totals['applications'] | tojson }}'
|
|
v-bind:environments='{{ monthly_totals['environments'] | tojson }}'
|
|
current-month-index='{{ current_month_index }}'
|
|
prev-month-index='{{ prev_month_index }}'
|
|
inline-template>
|
|
<div class="responsive-table-wrapper">
|
|
<table class="atat-table">
|
|
<thead>
|
|
<tr>
|
|
<th>Applications and Environments</th>
|
|
<th class="table-cell--align-right">Current Month</th>
|
|
<th class="table-cell--align-right">Last Month</th>
|
|
<th class="table-cell--align-right">Total Spent</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<template v-for='(application, name) in applicationsState'>
|
|
<tr>
|
|
<td>
|
|
<button v-on:click='toggle($event, name)' class='icon-link icon-link--large'>
|
|
<span v-html='name'></span>
|
|
<template v-if='application.isVisible'>{{ Icon('caret_down') }}</template>
|
|
<template v-else>{{ Icon('caret_up') }}</template>
|
|
</button>
|
|
</td>
|
|
<td class="table-cell--align-right">
|
|
<span v-html='formatDollars(application[currentMonthIndex] || 0)'></span>
|
|
</td>
|
|
<td class="table-cell--align-right">
|
|
<span v-html='formatDollars(application[prevMonthIndex] || 0)'></span>
|
|
</td>
|
|
<td class="table-cell--align-right">
|
|
<span v-html='formatDollars(application["total_spend_to_date"])'></span>
|
|
</td>
|
|
</tr>
|
|
<tr
|
|
v-for='(environment, envName, index) in environments[name]'
|
|
v-show='application.isVisible'
|
|
v-bind:class="[ index == Object.keys(environments[name]).length -1 ? 'reporting-spend-table__env-row--last' : '']"
|
|
>
|
|
<td>
|
|
<span class="reporting-spend-table__env-row-label" v-html='envName'></span>
|
|
</td>
|
|
<td class="table-cell--align-right">
|
|
<span v-html='formatDollars(environment[currentMonthIndex] || 0)'></span>
|
|
</td>
|
|
<td class="table-cell--align-right">
|
|
<span v-html='formatDollars(environment[prevMonthIndex] || 0)'></span>
|
|
</td>
|
|
<td class="table-cell--align-right">
|
|
<span v-html='formatDollars(environment["total_spend_to_date"])'></span>
|
|
</td>
|
|
</tr>
|
|
</template>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</spend-table>
|
|
{% endif %}
|
|
</div> |