{% extends "base.html" %}

{% block title %}
	Gas Contracts &raquo; {{g_batch.g_contract.name}} &raquo; Batches &raquo;
 	{{g_batch.reference}} &raquo; Add Bill
{% endblock %}

{% block inside_head %}
	<style>
		label {
			width: 6em;
			float: left;
		}
	</style>
{% endblock %}

{% block nav %}
	<a href="/g_contracts">Gas Contracts</a> &raquo;
	<a
			href="/g_contracts/{{g_batch.g_contract.id}}"
			>{{g_batch.g_contract.name}}</a> &raquo;
	<a
	 		href="/g_batches?g_contract_id={{g_batch.g_contract.id}}"
			>Batches</a> &raquo;
	<a href="/g_batches/{{g_batch.id}}">{{g_batch.reference}}</a>
 	&raquo; Add Bill
{% endblock %}

{% block content %}
	<!-- Layer Section -->
	<div class="layer-section">
		<!-- Section Header -->
		<div class="section-header">
			<h2>Add A Bill</h2>
		</div>

		<!-- End Section Header -->
		<!-- Section Content -->
		<div class="section-content">
			<div class="section-data">
				<form action="/g_batches/{{g_batch.id}}/add_bill" method="post">
					<fieldset>
						<div class="standardForm">
							<div class="row">
								<div class="col-sm-2">
									<label>MPRN</label>
								</div>
								<div class="col-sm-4">
									{{input_text('mprn')}}
								</div>
							</div>
							<div class="row">
								<div class="col-sm-2">
									<label>Bill Type</label>
								</div>
								<div class="col-sm-4">
									<select name="bill_type_id">
										{% for bill_type in bill_types %}
											{{
												input_option(
													'bill_type_id', bill_type.id, bill_type.code + ' : ' +
													bill_type.description)
											}}
										{% endfor %}
									</select>
								</div>
							</div>
							<div class="row">
								<div class="col-sm-2">
									<label>Reference</label>
								</div>
								<div class="col-sm-4">
									{{input_text('reference')}}
								</div>
							</div>
							<div class="row">
								<div class="col-sm-2">
									<label>Account</label>
								</div>
								<div class="col-sm-4">
									{{input_text('account', '')}}
								</div>
							</div>
							<div class="standardForm textWidthAuto">
								<fieldset>
									<div class="row">
										<div class="col-sm-2">
											<legend>Issue Date</legend>
										</div>
										<div class="col-sm-4">
											{{input_date('issue')}}
										</div>
									</div>
								</fieldset>
							</div>
							<div class="standardForm textWidthAuto">
								<fieldset>
									<div class="row">
										<div class="col-sm-2">
											<legend>Start Date</legend>
										</div>
										<div class="col-sm-4">
											{{input_date('start')}}
										</div>
									</div>
								</fieldset>
							</div>
							<div class="standardForm textWidthAuto">
								<fieldset>
									<div class="row">
										<div class="col-sm-2">
											<legend>Finish Date</legend>
										</div>
										<div class="col-sm-4">
											{{input_date('finish')}}
										</div>
									</div>
								</fieldset>
							</div>
							<div class="row">
								<div class="col-sm-2">
									<label>kWh</label>
								</div>
								<div class="col-sm-4">
									{{input_text('kwh', '0')}}
								</div>
							</div>
							<div class="row">
								<div class="col-sm-2">
									<label>Net</label>
								</div>
								<div class="col-sm-4">
									{{input_text('net', '0')}}
								</div>
							</div>
							<div class="row">
								<div class="col-sm-2">
									<label>VAT</label>
								</div>
								<div class="col-sm-4">
									{{input_text('vat', '0')}}
								</div>
							</div>
							<div class="row">
								<div class="col-sm-2">
									<label>Gross</label>
								</div>
								<div class="col-sm-4">
									{{input_text('gross', '0')}}
								</div>
							</div>
							<div class="row">
								<div class="col-sm-2">
									<label>Breakdown</label>
								</div>
								<div class="col-sm-4">
									{{input_text('breakdown', '{}')}}
								</div>
							</div>
						<br>
						<input type="submit" value="Add">
					</fieldset>
				</form>
			</div>
		</div>
	</div>
{% endblock %}
