Add messages to the current job’s history

This mocks out a data structure for a job’s messages, and renders this data:
- on the notification page, as a table, which links through to…
- …the page for an indidivual message

app/templates/components/table.html

@@ -32,8 +32,12 @@
   </table>
 {%- endmacro %}
 
-{% macro field(first=False, wide=False, action=False) -%}
-  <td class="table-field{% if first %}-first{% endif %}{% if first and wide %}-wider{% endif %}{% if action %}-with-action{% endif %}">
-    <span>{{ caller() }}</span>
+{% macro field(align='left', status='') -%}
+  <td class="table-field{% if align == 'right' %}-right-aligned{% endif %}">
+    <span class="{{ 'table-field-status-' + status if status }}">{{ caller() }}</span>
   </td>
 {%- endmacro %}
+
+{% macro right_aligned_field_heading(text) %}
+  <span class="table-field-heading-right-aligned">{{ text }}</span>
+{%- endmacro %}

app/templates/views/job.html

@@ -1,4 +1,5 @@
 {% extends "withnav_template.html" %}
+{% from "components/table.html" import table, field, right_aligned_field_heading %}
 
 {% block page_title %}
 GOV.UK Notify | Notifications activity
@@ -6,14 +7,44 @@ GOV.UK Notify | Notifications activity
 
 {% block maincolumn_content %}
 
-		<h1 class="heading-xlarge">Notifications for a specific job</h1>
+    <h1 class="heading-large">
+			{{ uploaded_file_name }} sent with {{ template_used }}
+		</h1>
 
-		<p>This page will be where we list the notifications for a specific job.</p>
+		<p>
+	    {{ counts.total }} text messages
+		</p>
 
-  	<ul>
-  		<li><a href="/jobs/job/notification">view a specific notification</a></li>
-		<li><a href="/jobs">view all the activity for this service</a></li>
-  	</ul>
-	
+		<p>
+	    {{ counts.failed }} failed deliveries
+		</p>
+
+		<p>
+	    {{ cost }} total cost
+		</p>
+
+    {% call(item) table(
+      messages,
+      caption='',
+      caption_visible=False,
+      field_headings=[
+        'To',
+        'Message',
+        right_aligned_field_heading('Delivery status')
+      ]
+    ) %}
+      {% call field() %}
+        <a href="{{ url_for('.shownotification', notification_id=item.id) }}">{{item.phone}}</a>
+      {% endcall %}
+      {% call field() %}
+        <a href="{{ url_for('.shownotification', notification_id=item.id) }}">{{item.message}}</a>
+      {% endcall %}
+      {% call field(
+        align='right',
+        status='error' if item.status == 'Failed' else 'default'
+      ) %}
+				{{ item.status }}&emsp;{{ item.time }}
+			{% endcall %}
+    {% endcall %}
 
 {% endblock %}

app/templates/views/notification.html

@@ -1,4 +1,5 @@
 {% extends "withnav_template.html" %}
+{% from "components/sms-message.html" import sms_message %}
 
 {% block page_title %}
 GOV.UK Notify | Notifications activity
@@ -7,12 +8,14 @@ GOV.UK Notify | Notifications activity
 {% block maincolumn_content %}
 
 
-		<h1 class="heading-xlarge">A specific notification</h1>
+		<h1 class="heading-large">
+			Text message to {{ message.phone }}
+		</h1>
 
-		<p>This page will be where we show what happened for a specific notification.</p>
+		{{ sms_message(message.message) }}
 
   	<p>
-  	<a href="/jobs/job">View other notifications in this job</a>
+	  	<a href="{{ url_for('.showjob') }}">View other notifications in this job</a>
   	</p>