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

Merge pull request #190 from dod-ccpo/ui/reports-summary-layout

Browse Source 
Ui/reports summary layout
This commit is contained in:
andrewdds
2018-08-21 10:23:38 -04:00
committed by GitHub
parent 63b498d9db 4618abb085
commit e38bc2fa63
10 changed files with 336 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
templates/components/alert.html
View File

@@ -38,7 +38,22 @@
{% endif %}
{% if actions %}
<div class='alert__actions'>{{ actions | safe }}</div>
<div class='alert__actions'>
{% if actions is string %}
{{ actions | safe }}
{% elif actions is iterable %}
{% for action in actions %}
<a href={{ action["href"] }} class='icon-link'>
{% if 'icon' in action %}{{ Icon(action["icon"]) }}{% endif %}
<span>{{ action["label"] }}</span>
</a>
{% endfor %}
{% endif %}
</div>
{% endif %}
</div>
</div>

2
templates/navigation/workspace_navigation.html
View File

@@ -32,7 +32,7 @@
{{ SidenavItem(
"Funding & Reports",
href='/workspace_reports/123456',
href='/workspaces/123456/reports',
active=g.matchesPath('\/workspaces\/[A-Za-z0-9]*\/reports')
) }}
</ul>

88
templates/workspace_reports.html Normal file
View File

@@ -0,0 +1,88 @@
{% extends "base_workspace.html" %}
{% from "components/alert.html" import Alert %}
{% block workspace_content %}
{{ Alert("Funding Information & Reports for Workspace " + workspace_id,
message="<p>On this screen you'll find detailed reporting information on this workspace. This message needs to be written better and be dismissable.</p>",
actions=[
{"label": "Learn More", "href": "/", "icon": "info"},
{"label": "Dismiss", "href": "/"}
] ) }}
<div class='funding-summary-row'>
<div class='funding-summary-row__col'>
<div class='panel spend-summary'>
<div class='row'>
<h2 class='spend-summary__heading col'>Workspace Total Spend</h2>
<dl class='spend-summary__budget'>
<div>
<dt>Budget </dt>
<dd>$100,000,000</dd>
</div>
<div>
<dt>Remaining</dt>
<dd>$60,000,000</dd>
</div>
</dl>
</div>
<div>
<meter value='40000000' min='0' max='100000000' title='$40,000,000 Total spend to date'></meter>
<dl class='spend-summary__spent'>
<dt>Total spend to date</dt>
<dd>$40,000,00</dd>
</dl>
</div>
</div>
</div>
<div class='funding-summary-row__col'>
<div class='panel to-summary'>
<div class='to-summary__row'>
<div class='to-summary__to'>
<h2 class='to-summary__heading'>Task Order</h2>
<dl class='to-summary__to-number'>
<dt class='usa-sr-only'>Task Order Number</dt>
<dd>1234567890</dd>
</dl>
</div>
<div class='to-summary__expiration'>
<dl>
<div>
<dt>Expires</dt>
<dd>November 1, 2019</dd>
</div>
<div>
<dt>Remaining</dt>
<dd>200 days</dd>
</div>
</dl>
<a href='/' class='icon-link'>
Manage Task Order
</a>
</div>
</div>
<dl class='to-summary__co'>
<dt>Contracting Officer</dt>
<dd>
Pietro Quirines
<a class='icon-link' href='mailto:email@email.com'>email@email.com</a>
</dd>
</dl>
</div>
</div>
</div>
{% endblock %}