var bills_template = `

	<style>
		#main_table_next{
			background-color: #f0962c;
			color: white !important;
		}

		#main_table_previous{
			background-color: #f0962c;
			color: white !important;
		}

		.current{
			background-color: white !important;
			color: white !important;
		}
	</style>

	<div class="container-fluid">
		<div class="row">

			<p>Hier finden Sie eine Auflistung aller Rechnungen zu allen Projekten und Aufträgen. Die Liste lässt sich nach Spaltentiteln sortieren und Rechnungen als PDF herunterladen.</p>

			{{@if(it.bills_array == "")}}

				<p>Noch keine Rechnungen vorhanden.</p>
				<div class="col mb-3">
					<a href="#order" class="btn btn-primary" role="button">Jetzt bestellen</a>
				</div>

			{{#else}}

				<div id="table_wrapper" style="overflow-x: auto;">
					<table id="main_table" class="table" style="min-width:400px;">
						<thead>
						 <tr>
							 <th scope="col">Name</th>
							 <th scope="col">Projekt-Nummer</th>
							 <th scope="col">Projekt</th>
							 <th scope="col">Ort</th>
							 <th scope="col">Datum</th>
							 <th scope="col">Status</th>
							 <th scope="col">Betrag</th>
							 <th scope="col">Pdf</th>
						 </tr>
					 </thead>
					 <tbody>

						{{@each(it.bills_array) => val, index}}

						<tr>
							<td><b>{{val[1]}}</b></td>
							<td>{{val[5]}}</td>
							<td>{{val[7]}}</td>
							<td>{{val[6]}}</td>
							<td>{{val[2]}}</td>
							<td>{{val[3]}}</td>
							<td>{{val[4]}}€</td>
							<td><a href="/dl_bill?id={{val[0]}}" target="_blank" class="text-dark">Download</a></td>
						</tr>

						{{/each}}
						</tbody>
					</table>
				</div>

			{{/if}}

    </div>
  </div>

	<script>

		if( $('#main_table').length )//Table exists
		{
			$('#main_table').DataTable({
			language: {
						search: "",
						lengthMenu: "Einträge _MENU_ pro Seite",
						searchPlaceholder: "Suche...",
						autocomplete: 'off',
						zeroRecords: "Keine Ergebnisse!!",
						info:"_START_ bis _END_ von _TOTAL_ Einträgen",
						responsive: {
						  pagingType: "simple"
						},
						paginate: {
				        "first":      "Erste",
				        "last":       "Letzte",
				        "next":       "Weiter",
				        "previous":   "Zurück"
				    }
					}
			});

			{{@if(it.bills_array.length < 11)}}
				$(".dataTables_paginate").hide();
				$(".dataTables_info").hide();
				$(".dataTables_length").hide();
			{{/if}}
		}

	</script>

`;