Add conditional empty state modules to Requests, Workspace Members, and Workspace Projects

This commit is contained in:
Andrew Croce
2018-07-30 16:10:28 -04:00
parent a7f49d1299
commit d9d638ab3b
3 changed files with 163 additions and 144 deletions

View File

@@ -1,5 +1,9 @@
{% extends "base.html.to" %}
{% block template_vars %}
{% set requestsEmpty = False %}
{% end %}
{% block modal %}
{% if modalOpen() %}
{% apply modal %}
@@ -31,67 +35,79 @@
{% block content %}
{% if requestsEmpty %}
{% module Alert('Pending Financial Verification',
message="<p>Your next step is to create a Task Order (T.O.) associated with JEDI Cloud. Please consult a Contracting Officer (KO) or Contracting Officer Representative (COR) to help with this step.</p>"
) %}
{% module EmptyState(
'There are currently no active requests for you to see.',
actionLabel='Create a new JEDI Cloud Request',
actionHref='/requests/new',
icon='document'
)%}
<div class="col col--grow">
{% else %}
<form class='search-bar'>
<div class='usa-input search-input'>
<label for='requests-search'>Search requests by Order ID</label>
<input type='search' id='requests-search' name='requests-search' placeholder="Search by Order ID"/>
<button type="submit">
<span class="hide">Search</span>
</button>
</div>
{% module Alert('Pending Financial Verification',
message="<p>Your next step is to create a Task Order (T.O.) associated with JEDI Cloud. Please consult a Contracting Officer (KO) or Contracting Officer Representative (COR) to help with this step.</p>"
) %}
<div class='usa-input'>
<label for='filter-status'>Filter requests by status</label>
<select id="filter-status" name="filter-status">
<option value="" selected disabled>Filter by status</option>
<option value="">Active</option>
<option value="">Pending</option>
<option value="">Denied</option>
</select>
</div>
</form>
<div class="col col--grow">
<div class='responsive-table-wrapper'>
<table>
<thead>
<tr>
<th scope="col">Order ID</th>
<th scope="col">Request Date</th>
<th scope="col">Requester</th>
<th scope="col">Total Apps</th>
<th scope="col">Status</th>
<th scope="col" class="table-cell--shrink">Actions</th>
</tr>
</thead>
<tbody>
{% for r in requests %}
<tr>
<th scope="row">
<a class='icon-link icon-link--large' href="{{ reverse_url('request_form_update', 1, r['order_id']) if r["status"] != "approved" else reverse_url('financial_verification', r['order_id']) }}">{{ r['order_id'] }}</a>
{% if r['is_new'] %}<span class="usa-label">New</span>
</th>
<form class='search-bar'>
<div class='usa-input search-input'>
<label for='requests-search'>Search requests by Order ID</label>
<input type='search' id='requests-search' name='requests-search' placeholder="Search by Order ID"/>
<button type="submit">
<span class="hide">Search</span>
</button>
</div>
<div class='usa-input'>
<label for='filter-status'>Filter requests by status</label>
<select id="filter-status" name="filter-status">
<option value="" selected disabled>Filter by status</option>
<option value="">Active</option>
<option value="">Pending</option>
<option value="">Denied</option>
</select>
</div>
</form>
<div class='responsive-table-wrapper'>
<table>
<thead>
<tr>
<th scope="col">Order ID</th>
<th scope="col">Request Date</th>
<th scope="col">Requester</th>
<th scope="col">Total Apps</th>
<th scope="col">Status</th>
<th scope="col" class="table-cell--shrink">Actions</th>
</tr>
</thead>
<tbody>
{% for r in requests %}
<tr>
<th scope="row">
<a class='icon-link icon-link--large' href="{{ reverse_url('request_form_update', 1, r['order_id']) if r["status"] != "approved" else reverse_url('financial_verification', r['order_id']) }}">{{ r['order_id'] }}</a>
{% if r['is_new'] %}<span class="usa-label">New</span>
</th>
{% end %}
<td>{{ r['date'] }}</td>
<td>{{ r['full_name'] }}</td>
<td>{{ r['app_count'] }}</td>
<td>{{ r['status'] }}</td>
<td class="table-cell--shrink">
<a href="" class='icon-link'>Download</a>
<a href="/request/approval" class='icon-link'>Approval</a>
</td>
</tr>
{% end %}
<td>{{ r['date'] }}</td>
<td>{{ r['full_name'] }}</td>
<td>{{ r['app_count'] }}</td>
<td>{{ r['status'] }}</td>
<td class="table-cell--shrink">
<a href="" class='icon-link'>Download</a>
<a href="/request/approval" class='icon-link'>Approval</a>
</td>
</tr>
{% end %}
</tbody>
</table>
</tbody>
</table>
</div>
</div>
</div>
{% end %}
{% end %}