mirror of
https://github.com/GSA/notifications-admin.git
synced 2026-08-23 15:57:23 -04:00
Merge pull request #675 from alphagov/fix-table-display
Fix table display
This commit is contained in:
Chris Hill-Scott
@@ -26,6 +26,16 @@
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.big-number-smallest {
|
||||||
|
|
||||||
|
@extend %big-number;
|
||||||
|
|
||||||
|
.big-number-number {
|
||||||
|
@include bold-24();
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
.big-number-with-status {
|
.big-number-with-status {
|
||||||
|
|
||||||
@extend %big-number;
|
@extend %big-number;
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
.table {
|
.table {
|
||||||
margin-bottom: $gutter;
|
margin-bottom: $gutter;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
table-layout: fixed;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.table-heading {
|
.table-heading {
|
||||||
@@ -9,24 +8,32 @@
|
|||||||
margin: 40px 0 $gutter-half 0;
|
margin: 40px 0 $gutter-half 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.table-field-headings {
|
.dashboard-table {
|
||||||
th {
|
|
||||||
padding: 0 0 5px 0;
|
.table {
|
||||||
|
table-layout: fixed;
|
||||||
}
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.table-row {
|
.table-field-headings {
|
||||||
th {
|
th {
|
||||||
display: table-cell;
|
padding: 0 0 5px 0;
|
||||||
width: 52.5%;
|
|
||||||
font-weight: normal;
|
|
||||||
|
|
||||||
.hint {
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.table-row {
|
||||||
|
th {
|
||||||
|
display: table-cell;
|
||||||
|
width: 52.5%;
|
||||||
|
font-weight: normal;
|
||||||
|
|
||||||
|
.hint {
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
%table-field,
|
%table-field,
|
||||||
@@ -105,7 +112,7 @@
|
|||||||
|
|
||||||
.table-field-heading {
|
.table-field-heading {
|
||||||
|
|
||||||
&-first {
|
.dashboard-table &-first {
|
||||||
width: 52.5%;
|
width: 52.5%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,11 +1,11 @@
|
|||||||
{% macro big_number(number, label, label_link=None, currency='', smaller=False) %}
|
{% macro big_number(number, label, label_link=None, currency='', smaller=False, smallest=False) %}
|
||||||
<div class="big-number{% if smaller %}-smaller{% endif %}">
|
<div class="big-number{% if smaller %}-smaller{% endif %}{% if smallest %}-smallest{% endif %}">
|
||||||
<div class="big-number-number">
|
<div class="big-number-number">
|
||||||
{% if number is number %}
|
{% if number is number %}
|
||||||
{% if currency %}
|
{% if currency %}
|
||||||
{{ "{}{:,.2f}".format(currency, number) }}
|
{{ "{}{:,.2f}".format(currency, number) }}
|
||||||
{% else %}
|
{% else %}
|
||||||
{{ "{}{:,}".format(currency, number) }}
|
{{ "{:,}".format(number) }}
|
||||||
{% endif %}
|
{% endif %}
|
||||||
{% else %}
|
{% else %}
|
||||||
{{ number }}
|
{{ number }}
|
||||||
|
|||||||
@@ -1,35 +1,37 @@
|
|||||||
{% from "components/table.html" import list_table, field, right_aligned_field_heading, row_heading %}
|
{% from "components/table.html" import list_table, field, right_aligned_field_heading, row_heading %}
|
||||||
{% from "components/big-number.html" import big_number %}
|
{% from "components/big-number.html" import big_number %}
|
||||||
|
|
||||||
{% call(item, row_number) list_table(
|
<div class='dashboard-table'>
|
||||||
jobs,
|
{% call(item, row_number) list_table(
|
||||||
caption="Recent batch jobs",
|
jobs,
|
||||||
caption_visible=False,
|
caption="Recent batch jobs",
|
||||||
empty_message='You haven’t sent any batch messages yet',
|
caption_visible=False,
|
||||||
field_headings=[
|
empty_message='You haven’t sent any batch messages yet',
|
||||||
'File',
|
field_headings=[
|
||||||
'Sending',
|
'File',
|
||||||
'Delivered',
|
'Sending',
|
||||||
'Failed'
|
'Delivered',
|
||||||
],
|
'Failed'
|
||||||
field_headings_visible=True
|
],
|
||||||
) %}
|
field_headings_visible=True
|
||||||
{% call row_heading() %}
|
) %}
|
||||||
<div class="file-list">
|
{% call row_heading() %}
|
||||||
<a class="file-list-filename" href="{{ url_for('.view_job', service_id=current_service.id, job_id=item.id) }}">{{ item.original_file_name }}</a>
|
<div class="file-list">
|
||||||
<span class="file-list-hint">Uploaded {{ item.created_at|format_datetime_short }}</span>
|
<a class="file-list-filename" href="{{ url_for('.view_job', service_id=current_service.id, job_id=item.id) }}">{{ item.original_file_name }}</a>
|
||||||
</div
|
<span class="file-list-hint">Uploaded {{ item.created_at|format_datetime_short }}</span>
|
||||||
|
</div
|
||||||
|
{% endcall %}
|
||||||
|
{% call field() %}
|
||||||
|
{{ big_number(
|
||||||
|
item.get('notifications_sent', 0) - item.get('notifications_delivered', 0) - item.get('notifications_failed', 0),
|
||||||
|
smallest=True
|
||||||
|
) }}
|
||||||
|
{% endcall %}
|
||||||
|
{% call field() %}
|
||||||
|
{{ big_number(item.get('notifications_delivered', 0), smallest=True) }}
|
||||||
|
{% endcall %}
|
||||||
|
{% call field(status='error' if 0 else '') %}
|
||||||
|
{{ big_number(item.get('notifications_failed', 0), smallest=True) }}
|
||||||
|
{% endcall %}
|
||||||
{% endcall %}
|
{% endcall %}
|
||||||
{% call field() %}
|
</div>
|
||||||
{{ big_number(
|
|
||||||
item.get('notifications_sent', 0) - item.get('notifications_delivered', 0) - item.get('notifications_failed', 0),
|
|
||||||
smaller=True
|
|
||||||
) }}
|
|
||||||
{% endcall %}
|
|
||||||
{% call field() %}
|
|
||||||
{{ big_number(item.get('notifications_delivered', 0), smaller=True) }}
|
|
||||||
{% endcall %}
|
|
||||||
{% call field(status='error' if 0 else '') %}
|
|
||||||
{{ big_number(item.get('notifications_failed', 0), smaller=True) }}
|
|
||||||
{% endcall %}
|
|
||||||
{% endcall %}
|
|
||||||
|
|||||||
@@ -41,38 +41,40 @@
|
|||||||
</p>
|
</p>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
|
|
||||||
{% call(item, row_number) list_table(
|
<div class='dashboard-table'>
|
||||||
notifications,
|
{% call(item, row_number) list_table(
|
||||||
caption="Recent activity",
|
notifications,
|
||||||
caption_visible=False,
|
caption="Recent activity",
|
||||||
empty_message='No messages found',
|
caption_visible=False,
|
||||||
field_headings=['Recipient', 'Started', 'Status'],
|
empty_message='No messages found',
|
||||||
field_headings_visible=False
|
field_headings=['Recipient', 'Started', 'Status'],
|
||||||
) %}
|
field_headings_visible=False
|
||||||
|
) %}
|
||||||
|
|
||||||
|
{% call row_heading() %}
|
||||||
|
<p>
|
||||||
|
{{ item.to }}
|
||||||
|
</p>
|
||||||
|
<p class="hint">
|
||||||
|
{% if item.job %}
|
||||||
|
From <a href="{{ url_for(".view_job", service_id=current_service.id, job_id=item.job.id) }}">{{ item.job.original_file_name }}</a>
|
||||||
|
{% else %}
|
||||||
|
<a href="{{ url_for('.view_template_version', service_id=current_service.id, template_id=item.template.id, version=item.template_version) }}">{{ item.template.name }}</a>
|
||||||
|
from an API call
|
||||||
|
{% endif %}
|
||||||
|
</p>
|
||||||
|
{% endcall %}
|
||||||
|
|
||||||
|
{{ date_field(
|
||||||
|
(item.updated_at or item.created_at)|format_datetime_short
|
||||||
|
) }}
|
||||||
|
|
||||||
|
{% call field(status=item.status|format_notification_status_as_field_status, align='right') %}
|
||||||
|
{{ item.status|format_notification_status(item.template.template_type) }}
|
||||||
|
{% endcall %}
|
||||||
|
|
||||||
{% call row_heading() %}
|
|
||||||
<p>
|
|
||||||
{{ item.to }}
|
|
||||||
</p>
|
|
||||||
<p class="hint">
|
|
||||||
{% if item.job %}
|
|
||||||
From <a href="{{ url_for(".view_job", service_id=current_service.id, job_id=item.job.id) }}">{{ item.job.original_file_name }}</a>
|
|
||||||
{% else %}
|
|
||||||
<a href="{{ url_for('.view_template_version', service_id=current_service.id, template_id=item.template.id, version=item.template_version) }}">{{ item.template.name }}</a>
|
|
||||||
from an API call
|
|
||||||
{% endif %}
|
|
||||||
</p>
|
|
||||||
{% endcall %}
|
{% endcall %}
|
||||||
|
</div>
|
||||||
{{ date_field(
|
|
||||||
(item.updated_at or item.created_at)|format_datetime_short
|
|
||||||
) }}
|
|
||||||
|
|
||||||
{% call field(status=item.status|format_notification_status_as_field_status, align='right') %}
|
|
||||||
{{ item.status|format_notification_status(item.template.template_type) }}
|
|
||||||
{% endcall %}
|
|
||||||
|
|
||||||
{% endcall %}
|
|
||||||
|
|
||||||
{{ previous_next_navigation(prev_page, next_page) }}
|
{{ previous_next_navigation(prev_page, next_page) }}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user