Merge pull request #1220 from dod-ccpo/reporting-expired-funding-and-spend-table
Styling for expired funding and spend table sections of reporting
This commit is contained in:
graham-dds
GitHub
commit
699176fc91
@ -308,20 +308,37 @@ class MockReportingProvider(ReportingInterface):
|
||||
return {}
|
||||
|
||||
def get_expired_task_orders(self, portfolio):
|
||||
return [
|
||||
{
|
||||
"id": task_order.id,
|
||||
"number": task_order.number,
|
||||
def sorted_task_orders(to_list):
|
||||
return sorted(to_list, key=lambda to: to["number"])
|
||||
|
||||
def sorted_clins(clin_list):
|
||||
return sorted(clin_list, key=lambda clin: clin["number"])
|
||||
|
||||
def serialize_clin(clin):
|
||||
return {
|
||||
"number": clin.number,
|
||||
"jedi_clin_type": clin.jedi_clin_type,
|
||||
"period_of_performance": {
|
||||
"start_date": task_order.start_date,
|
||||
"end_date": task_order.end_date,
|
||||
"start_date": clin.start_date,
|
||||
"end_date": clin.end_date,
|
||||
},
|
||||
"total_obligated_funds": task_order.total_obligated_funds,
|
||||
"total_value": clin.total_amount,
|
||||
"total_obligated_funds": clin.obligated_amount,
|
||||
"expended_funds": (
|
||||
task_order.total_obligated_funds
|
||||
* Decimal(self.MOCK_PERCENT_EXPENDED_FUNDS)
|
||||
clin.obligated_amount * Decimal(self.MOCK_PERCENT_EXPENDED_FUNDS)
|
||||
),
|
||||
}
|
||||
for task_order in portfolio.task_orders
|
||||
if task_order.is_expired
|
||||
]
|
||||
|
||||
return sorted_task_orders(
|
||||
[
|
||||
{
|
||||
"id": task_order.id,
|
||||
"number": task_order.number,
|
||||
"clins": sorted_clins(
|
||||
[serialize_clin(clin) for clin in task_order.clins]
|
||||
),
|
||||
}
|
||||
for task_order in portfolio.task_orders
|
||||
if task_order.is_expired
|
||||
]
|
||||
)
|
||||
|
||||
@ -87,4 +87,32 @@
|
||||
font-size: $lead-font-size;
|
||||
}
|
||||
}
|
||||
|
||||
.reporting-expended-funding {
|
||||
&__header {
|
||||
margin: 0;
|
||||
}
|
||||
&__content {
|
||||
padding: 0;
|
||||
border-top: 1px solid $color-gray-lighter;
|
||||
}
|
||||
}
|
||||
|
||||
.reporting-spend-table {
|
||||
&__env-row {
|
||||
&-label {
|
||||
margin-left: $gap * 5;
|
||||
}
|
||||
&--last {
|
||||
& > td {
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
&:last-of-type {
|
||||
& > td {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,23 +1,30 @@
|
||||
{% macro Accordion(title, id, heading_level="h2") %}
|
||||
<accordion inline-template>
|
||||
<div>
|
||||
<{{heading_level}}>
|
||||
<button
|
||||
v-on:click="toggle($event)"
|
||||
class="usa-accordion-button"
|
||||
aria-controls="{{ id }}"
|
||||
v-bind:aria-expanded= "isVisible ? 'true' : 'false'"
|
||||
>
|
||||
{{ title }}
|
||||
</button>
|
||||
</{{heading_level}}>
|
||||
<div
|
||||
id="{{ id }}"
|
||||
class="usa-accordion-content"
|
||||
v-bind:aria-hidden="isVisible ? 'false' : 'true'"
|
||||
>
|
||||
{{ caller() }}
|
||||
</div>
|
||||
</div>
|
||||
</accordion>
|
||||
{% macro Accordion(
|
||||
title,
|
||||
id,
|
||||
wrapper_tag="div",
|
||||
wrapper_classes="",
|
||||
heading_tag="h2",
|
||||
heading_classes="",
|
||||
content_tag="div",
|
||||
content_classes="") %}
|
||||
<accordion v-cloak inline-template>
|
||||
<{{wrapper_tag}} class="{{ wrapper_classes }}">
|
||||
<{{heading_tag}} class="{{ heading_classes }}">
|
||||
<button
|
||||
v-on:click="toggle($event)"
|
||||
class="usa-accordion-button"
|
||||
aria-controls="{{ id }}"
|
||||
v-bind:aria-expanded= "isVisible ? 'true' : 'false'"
|
||||
>
|
||||
{{ title }}
|
||||
</button>
|
||||
</{{heading_tag}}>
|
||||
<{{content_tag}}
|
||||
id="{{ id }}"
|
||||
class="usa-accordion-content {{ content_classes }}"
|
||||
v-bind:aria-hidden="isVisible ? 'false' : 'true'">
|
||||
{{ caller() }}
|
||||
</{{content_tag}}>
|
||||
</{{wrapper_tag}}>
|
||||
</accordion>
|
||||
{% endmacro %}
|
||||
@ -59,9 +59,13 @@
|
||||
<span v-html='formatDollars(application["total_spend_to_date"])'></span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr v-for='(environment, envName) in environments[name]' v-show='application.isVisible'>
|
||||
<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 v-html='envName'></span>
|
||||
<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>
|
||||
|
||||
@ -1,34 +1,51 @@
|
||||
{% from "components/accordion.html" import Accordion %}
|
||||
{% from "components/icon.html" import Icon %}
|
||||
|
||||
|
||||
<section>
|
||||
<div class="usa-accordion">
|
||||
{% call Accordion("Expired Task Orders", "expired_task_orders", "h3") %}
|
||||
{% for task_order in expired_task_orders %}
|
||||
<a href="{{ url_for("task_orders.review_task_order", task_order_id=task_order["id"]) }}">
|
||||
Task Order {{ task_order["number"] }}
|
||||
</a>
|
||||
<div>
|
||||
<p>Period of Performance</p>
|
||||
<p>
|
||||
{{ task_order["period_of_performance"].start_date | formattedDate(formatter="%B %d, %Y") }}
|
||||
-
|
||||
{{ task_order["period_of_performance"].end_date | formattedDate(formatter="%B %d, %Y") }}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<p>Total Obligated</p>
|
||||
<p>{{ task_order["total_obligated_funds"] | dollars }}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p>Total Expended</p>
|
||||
<p>{{ task_order["expended_funds"] | dollars }}</p>
|
||||
</div>
|
||||
<div>
|
||||
<p>Total Unused</p>
|
||||
<p>{{ (task_order["total_obligated_funds"] - task_order["expended_funds"]) | dollars }}</p>
|
||||
</div>
|
||||
{% endfor %}
|
||||
{% call Accordion(
|
||||
"Expired funding",
|
||||
"expired_funding",
|
||||
heading_classes="reporting-expended-funding__header",
|
||||
content_tag="table",
|
||||
content_classes="atat-table reporting-expended-funding__content") %}
|
||||
<thead>
|
||||
<tr>
|
||||
<th>TO CLIN</th>
|
||||
<th>PoP</th>
|
||||
<th>CLIN Value</th>
|
||||
<th>Amount Obligated</th>
|
||||
<th>Amount Unspent</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for task_order in expired_task_orders %}
|
||||
<tr>
|
||||
<td colspan="5">
|
||||
<span class="h4 reporting-expended-funding__header">Task Order</span> <a href="{{ url_for("task_orders.review_task_order", task_order_id=task_order.id) }}">
|
||||
{{ task_order.number }} {{ Icon("caret_right", classes="icon--tiny icon--blue" ) }}
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
{% for clin in task_order.clins %}
|
||||
<tr>
|
||||
<td>
|
||||
<div class="h4 reporting-expended-funding__header">{{ clin.number }}</div>
|
||||
<div>{{ ("{}".format(clin.jedi_clin_type) | translate)[15:] }}</div>
|
||||
</td>
|
||||
<td>
|
||||
{{ clin.period_of_performance.start_date | formattedDate(formatter="%b %d, %Y") }}
|
||||
-
|
||||
{{ clin.period_of_performance.end_date | formattedDate(formatter="%b %d, %Y") }}
|
||||
</td>
|
||||
<td>{{ clin.total_value | dollars }}</td>
|
||||
<td>{{ clin.total_obligated_funds | dollars }}</td>
|
||||
<td>{{ (clin.total_obligated_funds - clin.expended_funds) | dollars }}</td>
|
||||
<tr>
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
{% endcall %}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user