Add conditional empty state modules to Requests, Workspace Members, and Workspace Projects
This commit is contained in:
Andrew Croce
parent
a7f49d1299
commit
d9d638ab3b
@ -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 %}
|
||||
|
||||
|
||||
@ -1,92 +1,78 @@
|
||||
{% extends "base_workspace.html.to" %}
|
||||
|
||||
{% block template_vars %}
|
||||
{% set membersEmpty = False %}
|
||||
{% end %}
|
||||
|
||||
{% block workspace_content %}
|
||||
|
||||
{% if membersEmpty %}
|
||||
|
||||
<form class='search-bar'>
|
||||
<div class='usa-input search-input'>
|
||||
<label for='members-search'>Search members by name</label>
|
||||
<input type='search' id='members-search' name='members-search' placeholder="Search by name"/>
|
||||
<button type="submit">
|
||||
<span class="hide">Search</span>
|
||||
</button>
|
||||
</div>
|
||||
{% module EmptyState(
|
||||
'There are currently no members in this Workspace.',
|
||||
actionLabel='Invite a new Member',
|
||||
actionHref='/members/new',
|
||||
icon='avatar'
|
||||
)%}
|
||||
|
||||
<div class='usa-input filter-input'>
|
||||
<label for='filter-status'>Filter members 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>
|
||||
|
||||
<div class='usa-input filter-input'>
|
||||
<label for='filter-role'>Filter members by role</label>
|
||||
<select id="filter-role" name="filter-role">
|
||||
<option value="" selected disabled>Filter by role</option>
|
||||
<option value="">Admin</option>
|
||||
<option value="">CCPO</option>
|
||||
<option value="">Developer</option>
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
{% else %}
|
||||
|
||||
{# <div class='panel panel__actions'>
|
||||
<div class='row'>
|
||||
<div class='col col--grow col--pad'>
|
||||
<form class="usa-search usa-search-small">
|
||||
<label class="usa-sr-only" for="search-field-small">Search small</label>
|
||||
<input id="search-field-small" type="search" name="search" placeholder="Search by name">
|
||||
<button type="submit">
|
||||
<span class="usa-sr-only">Search</span>
|
||||
</button>
|
||||
</form>
|
||||
<form class='search-bar'>
|
||||
<div class='usa-input search-input'>
|
||||
<label for='members-search'>Search members by name</label>
|
||||
<input type='search' id='members-search' name='members-search' placeholder="Search by name"/>
|
||||
<button type="submit">
|
||||
<span class="hide">Search</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class='col col--grow col--pad'>
|
||||
<select id="filter_status" name="filter_status" required="">
|
||||
|
||||
<div class='usa-input filter-input'>
|
||||
<label for='filter-status'>Filter members 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>
|
||||
<div class='col col--grow col--pad'>
|
||||
<select id="filter_role" name="filter_role" required="">
|
||||
|
||||
<div class='usa-input filter-input'>
|
||||
<label for='filter-role'>Filter members by role</label>
|
||||
<select id="filter-role" name="filter-role">
|
||||
<option value="" selected disabled>Filter by role</option>
|
||||
<option value="">Admin</option>
|
||||
<option value="">CCPO</option>
|
||||
<option value="">Developer</option>
|
||||
</select>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
|
||||
<div class='responsive-table-wrapper'>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" width="50%">Name</th>
|
||||
<th scope="col" class='table-cell--shrink'> <span class="hide">Status Flag</span></th>
|
||||
<th scope="col">Status</th>
|
||||
<th scope="col">Workspace Role</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for m in members %}
|
||||
<tr>
|
||||
<td><a href="#" class="icon-link icon-link--large">{{ m['first_name'] }} {{ m['last_name'] }}</a></td>
|
||||
<td class='table-cell--shrink'>{% if m['num_projects'] == '0' %} <span class="label label--info">No Project Access</span> {% end %}</td>
|
||||
<td>{{ m['status'] }}</a></td>
|
||||
<td>{{ m['workspace_role'] }}</a></td>
|
||||
</tr>
|
||||
{% end %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div> #}
|
||||
|
||||
|
||||
<div class='responsive-table-wrapper'>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th scope="col" width="50%">Name</th>
|
||||
<th scope="col" class='table-cell--shrink'> <span class="hide">Status Flag</span></th>
|
||||
<th scope="col">Status</th>
|
||||
<th scope="col">Workspace Role</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for m in members %}
|
||||
<tr>
|
||||
<td><a href="#" class="icon-link icon-link--large">{{ m['first_name'] }} {{ m['last_name'] }}</a></td>
|
||||
<td class='table-cell--shrink'>{% if m['num_projects'] == '0' %} <span class="label label--info">No Project Access</span> {% end %}</td>
|
||||
<td>{{ m['status'] }}</a></td>
|
||||
<td>{{ m['workspace_role'] }}</a></td>
|
||||
</tr>
|
||||
{% end %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
{% end %}
|
||||
|
||||
|
||||
{% end %}
|
||||
|
||||
@ -1,32 +1,49 @@
|
||||
{% extends "base_workspace.html.to" %}
|
||||
|
||||
{% block template_vars %}
|
||||
{% set projectsEmpty = False %}
|
||||
{% end %}
|
||||
|
||||
{% block workspace_content %}
|
||||
|
||||
{% for project in projects %}
|
||||
<div class='block-list project-list-item'>
|
||||
<header class='block-list__header'>
|
||||
<h2 class='block-list__title'>{{ project['name'] }} ({{ len(project['environments'])}} environments)</h2>
|
||||
<a class='block-list__header__link' href='/workspaces/123456/projects/789/edit'>
|
||||
{% module Icon('edit') %}
|
||||
<span>edit</span>
|
||||
</a>
|
||||
</header>
|
||||
<ul>
|
||||
{% for environment in project['environments'] %}
|
||||
<li class='block-list__item project-list-item__environment'>
|
||||
<a href='/' target='_blank' rel='noopener noreferrer' class='project-list-item__environment__link'>
|
||||
{% module Icon('link') %}
|
||||
<span>{{ environment["name"]}}</span>
|
||||
</a>
|
||||
{% if projectsEmpty %}
|
||||
|
||||
{% module EmptyState(
|
||||
'There are currently no projects set up for this Workspace.',
|
||||
actionLabel='Create a new Project',
|
||||
actionHref='/project/new',
|
||||
icon='cloud'
|
||||
)%}
|
||||
|
||||
{% else %}
|
||||
|
||||
{% for project in projects %}
|
||||
<div class='block-list project-list-item'>
|
||||
<header class='block-list__header'>
|
||||
<h2 class='block-list__title'>{{ project['name'] }} ({{ len(project['environments'])}} environments)</h2>
|
||||
<a class='block-list__header__link' href='/workspaces/123456/projects/789/edit'>
|
||||
{% module Icon('edit') %}
|
||||
<span>edit</span>
|
||||
</a>
|
||||
</header>
|
||||
<ul>
|
||||
{% for environment in project['environments'] %}
|
||||
<li class='block-list__item project-list-item__environment'>
|
||||
<a href='/' target='_blank' rel='noopener noreferrer' class='project-list-item__environment__link'>
|
||||
{% module Icon('link') %}
|
||||
<span>{{ environment["name"]}}</span>
|
||||
</a>
|
||||
|
||||
<div class='project-list-item__environment__members'>
|
||||
<div class='label'>0</div>
|
||||
<span>members</span>
|
||||
</div>
|
||||
</li>
|
||||
{% end %}
|
||||
</ul>
|
||||
</div>
|
||||
{% end %}
|
||||
|
||||
<div class='project-list-item__environment__members'>
|
||||
<div class='label'>0</div>
|
||||
<span>members</span>
|
||||
</div>
|
||||
</li>
|
||||
{% end %}
|
||||
</ul>
|
||||
</div>
|
||||
{% end %}
|
||||
|
||||
{% end %}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user