Merge pull request #544 from dod-ccpo/task-order-listing
Portfolio funding screen
This commit is contained in:
@@ -41,8 +41,8 @@
|
||||
{% endif %}
|
||||
|
||||
{{ SidenavItem(
|
||||
("navigation.portfolio_navigation.task_orders" | translate),
|
||||
href=url_for("portfolios.portfolio_task_orders", portfolio_id=portfolio.id),
|
||||
("navigation.portfolio_navigation.portfolio_funding" | translate),
|
||||
href=url_for("portfolios.portfolio_funding", portfolio_id=portfolio.id),
|
||||
active=request.url_rule.rule.startswith('/portfolios/<portfolio_id>/task_order'),
|
||||
subnav=None
|
||||
) }}
|
||||
|
@@ -1,30 +1,142 @@
|
||||
{% from "components/empty_state.html" import EmptyState %}
|
||||
{% from "components/icon.html" import Icon %}
|
||||
|
||||
{% extends "portfolios/base.html" %}
|
||||
|
||||
{% block portfolio_content %}
|
||||
|
||||
{% if not portfolio.task_orders %}
|
||||
{% macro ViewLink(task_order) %}
|
||||
<a href="{{ url_for('portfolios.view_task_order', portfolio_id=portfolio.id, task_order_id=task_order.id) }}" class="icon-link view-task-order-link">
|
||||
<span>View</span>
|
||||
{{ Icon("caret_right") }}
|
||||
</a>
|
||||
{% endmacro %}
|
||||
|
||||
{{ EmptyState(
|
||||
'This portfolio doesn’t have any task orders yet.',
|
||||
action_label='Add a New Task Order',
|
||||
action_href=url_for('task_orders.new', screen=1, portfolio_id=portfolio.id),
|
||||
icon='cloud',
|
||||
) }}
|
||||
{% macro TaskOrderList(task_orders, label='success', expired=False) %}
|
||||
<task-order-list
|
||||
inline-template
|
||||
v-bind:data='{{ task_orders | tojson }}'
|
||||
v-bind:expired='{{ 'true' if expired else 'false' }}'
|
||||
v-cloak
|
||||
>
|
||||
<div class='responsive-table-wrapper'>
|
||||
<table v-cloak>
|
||||
<thead>
|
||||
<tr>
|
||||
<th v-for="col in getColumns()" @click="updateSort(col.displayName)" :width="col.width" :class="col.class" scope="col">
|
||||
!{ col.displayName }
|
||||
<template v-if="col.sortFunc">
|
||||
<span v-if="col.displayName === sortInfo.columnName && sortInfo.isAscending">
|
||||
{{ Icon("caret_down") }}
|
||||
</span>
|
||||
<span v-if="col.displayName === sortInfo.columnName && !sortInfo.isAscending">
|
||||
{{ Icon("caret_up") }}
|
||||
</span>
|
||||
</template>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
{% else %}
|
||||
<tbody>
|
||||
<tr v-for='taskOrder in taskOrders' :key="taskOrder.id">
|
||||
<td>
|
||||
<span class='label label--{{ label }}'>!{ taskOrder.display_status }</span>
|
||||
</td>
|
||||
<td class='table-cell--grow'>
|
||||
<span>
|
||||
<local-datetime
|
||||
v-bind:timestamp="taskOrder.start_date"
|
||||
format="M/D/YYYY">
|
||||
</local-datetime>
|
||||
-
|
||||
<local-datetime
|
||||
v-bind:timestamp="taskOrder.end_date"
|
||||
format="M/D/YYYY">
|
||||
</local-datetime>
|
||||
</td>
|
||||
<td class="table-cell--align-right">
|
||||
<span v-html='formatDollars(taskOrder.budget)'></span>
|
||||
</td>
|
||||
<td v-bind:class="{ 'table-cell--align-right': true, 'unused-balance': expired && taskOrder.balance > 0 }">
|
||||
<span v-html='formatDollars(taskOrder.balance)'></span>
|
||||
</td>
|
||||
<td>
|
||||
<a v-bind:href="taskOrder.url" class="icon-link view-task-order-link">
|
||||
<span>View</span>
|
||||
{{ Icon("caret_right") }}
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</task-order-list>
|
||||
{% endmacro %}
|
||||
|
||||
<ul>
|
||||
{% for task_order in portfolio.task_orders %}
|
||||
<li class='block-list__item'>
|
||||
<a href='{{ url_for("portfolios.view_task_order", portfolio_id=portfolio.id, task_order_id=task_order.id)}}'>
|
||||
<span>{{ task_order.start_date }} - {{ task_order.end_date }}</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<div class="portfolio-funding">
|
||||
|
||||
{% endif %}
|
||||
<div class='panel'>
|
||||
<div class='panel__content portfolio-funding__header row'>
|
||||
<h3>Portfolio Funding</h3>
|
||||
<div class='portfolio-funding__header--funded-through {{ "funded" if funding_end_date is not none }}'>
|
||||
{% if funding_end_date %}
|
||||
{{ Icon('ok') }}
|
||||
Funded through
|
||||
<local-datetime
|
||||
timestamp="{{ funding_end_date }}"
|
||||
format="M/D/YYYY">
|
||||
</local-datetime>
|
||||
{% endif %}
|
||||
</div>
|
||||
<a href="{{ url_for("task_orders.new", screen=1, portfolio_id=portfolio.id) }}" class="usa-button">Start a New Task Order</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% for task_order in pending_task_orders %}
|
||||
<div class='panel'>
|
||||
<div class='panel__content pending-task-order row'>
|
||||
<span class='label label--warning'>Pending</span>
|
||||
<div class="pending-task-order__started col">
|
||||
<dt>Started</dt>
|
||||
<dd>
|
||||
<local-datetime
|
||||
timestamp="{{ task_order.time_created }}"
|
||||
format="M/D/YYYY">
|
||||
</local-datetime>
|
||||
</dd>
|
||||
</div>
|
||||
<div class="pending-task-order__value col">
|
||||
<dt>Value</dt>
|
||||
<dd>{{ task_order.budget | dollars }}</dd>
|
||||
</div>
|
||||
{{ ViewLink(task_order) }}
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
|
||||
{% if not active_task_orders and not pending_task_orders %}
|
||||
{{ EmptyState(
|
||||
'This portfolio doesn’t have any active or pending task orders.',
|
||||
action_label='Add a New Task Order',
|
||||
action_href=url_for('task_orders.new', screen=1, portfolio_id=portfolio.id),
|
||||
icon='cloud',
|
||||
) }}
|
||||
{% endif %}
|
||||
|
||||
{% if active_task_orders %}
|
||||
{{ TaskOrderList(active_task_orders, label='success') }}
|
||||
<div class='panel portfolio-total-balance'>
|
||||
<div class='panel__content row'>
|
||||
<span>{{ total_balance | dollars }}</span>
|
||||
<span class='label label--success'>Total Active Balance</span>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if expired_task_orders %}
|
||||
{{ TaskOrderList(expired_task_orders, label='', expired=True) }}
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
Reference in New Issue
Block a user