{% extends "base.html" %}

{% block title %}
	&raquo; Supplies &raquo; {{supply.id}} &raquo; Hh Data
{% endblock %}

{% block inside_head %}
	<style>
		table.hh_data tr td {
			white-space: nowrap;
			text-align: right;
			background-color: white;
		}
	</style>
{% endblock %}

{% block nav %}
	<a href="/supplies">Supplies</a> &raquo;
	<a href="/supplies/{{supply.id}}">{{supply.name}}</a> &raquo; HH Data
{% endblock %}

{% block content %}
	<div class="layer-section">
		<div class="section-header">
			<h2>Supply</h2>
		</div>
		<div class="section-content">		
			<div class="section-data">
				<div class="noWrap">
					<table class="DataTable widthAuto">
						<tr>
							<th>Name</th>
							<td>{{supply.name}}</td>
						</tr>
						<tr>
							<th>Import MPAN core</th>
							<td>{{era.imp_mpan_core}}</td>
						</tr>
						<tr>
							<th>Export MPAN core</th>
							<td>{{era.exp_mpan_core}}</td>
						</tr>
						<tr>
							<th>Source Code</th>
							<td>{{supply.source.code}}</td>
						</tr>
					</table>			
				</div>
			</div>
		</div>
	</div>
	<div class="layer-section">
		<div class="section-header">
			<h2>Show HH Data</h2>
		</div>
		<div class="section-data">
			<form action="/supplies/{{supply.id}}/hh_data">
				<fieldset>
					For {{ input_text('months', months, 2, 2) }} month(s)
					finishing at the end of
					{{input_date('finish', finish_date, 'month')}}
					<input type="submit" value="Show">
				</fieldset>
			</form>
			<br>
			<table class="etheling etheling_sticky hh_data">
				<caption>HH Data</caption>
				<thead>
					<tr>
						<th>HH Starting (clock time)</th>
						<th colspan="3">
							Imp<br> ACTIVE<br> kWh, Status, Modified
						</th>
						<th colspan="3">
							Imp<br> REACTIVE_IMP<br> kVArh, Status, Modified
						</th>
						<th colspan="3">
							Imp<br> REACTIVE_EXP<br> kVArh, Status, Modified
						</th>
						<th colspan="3">
							Exp<br> ACTIVE<br> kWh, Status, Modified
						</th>
						<th colspan="3">
							Exp<br> REACTIVE_IMP<br> kVArh, Status, Modified
						</th>
						<th colspan="3">
							Exp<br> REACTIVE_EXP<br> kVArh, Status, Modified
						</th>
					</tr>
				</thead>
				<tbody>
				{% for hh_line in hh_lines %}
					<tr>
						<td>
							{{hh_line.timestamp|hh_format}}
						</td>
					{% if hh_line.import_active %}
						{% set hh = hh_line.import_active %}
						<td><a href="/hh_data/{{hh.id}}/edit">{{hh.value}}</a></td>
						<td>{{hh.status}}</td>
						<td>{{hh.last_modified|hh_format}}</td>
					{% else %}
						<td></td>
						<td></td>
						<td></td>
					{% endif %}
					{% if hh_line.import_reactive_imp %}
						{% set hh = hh_line.import_reactive_imp %}
						<td><a href="/hh_data/{{hh.id}}/edit">{{hh.value}}</a></td>
						<td>{{hh.status}}</td>
						<td>{{hh.last_modified|hh_format}}</td>
					{% else %}
						<td></td>
						<td></td>
						<td></td>
					{% endif %}
					{% if hh_line.import_reactive_exp %}
						{% set hh = hh_line.import_reactive_exp %}
						<td><a href="/hh_data/{{hh.id}}/edit">{{hh.value}}</a></td>
						<td>{{hh.status}}</td>
						<td>{{hh.last_modified|hh_format}}</td>
					{% else %}
						<td></td>
						<td></td>
						<td></td>
					{% endif %}
					{% if hh_line.export_active %}
						{% set hh = hh_line.export_active %}
						<td><a href="/hh_data/{{hh.id}}/edit">{{hh.value}}</a></td>
						<td>{{hh.status}}</td>
						<td>{{hh.last_modified|hh_format}}</td>
					{% else %}
						<td></td>
						<td></td>
						<td></td>
					{% endif %}
					{% if hh_line.export_reactive_imp %}
						{% set hh = hh_line.export_reactive_imp %}
						<td><a href="/hh_data/{{hh.id}}/edit">{{hh.value}}</a></td>
						<td>{{hh.status}}</td>
						<td>{{hh.last_modified|hh_format}}</td>
					{% else %}
						<td></td>
						<td></td>
						<td></td>
					{% endif %}
					{% if hh_line.export_reactive_exp %}
						{% set hh = hh_line.export_reactive_exp %}
						<td><a href="/hh_data/{{hh.id}}/edit">{{hh.value}}</a></td>
						<td>{{hh.status}}</td>
						<td>{{hh.last_modified|hh_format}}</td>
					{% else %}
						<td></td>
						<td></td>
						<td></td>
					{% endif %}
					</tr>
					{% endfor %}
				</tbody>
			</table>
		</div>
	</div>
{% endblock %}
