<table class="table table-bordered w-100" id="invoices">
	<thead>
	<tr>
		<th class="text-right">#</th>
		<th class="text-right">Issued</th>
		<th class="text-right">Due</th>
		<th class="text-right">Total</th>
		<th class="text-right">Payments</th>
		<th class="text-right">Outstanding</th>
	</tr>
	</thead>

	<tbody>
	@foreach ($o->invoices as $io)
		<tr>
			<td class="text-right"><a href="{{ url('u/invoice',$io->id) }}">{{ $io->id }}</a></td>
			<td class="text-right">{{ $io->created_at->format('Y-m-d') }}</td>
			<td class="text-right">{{ $io->due_at->format('Y-m-d') }}</td>
			<td class="text-right">${{ number_format($io->total,2) }}</td>
			<td class="text-right">${{ number_format($io->paid,2) }}</td>
			<td class="text-right">${{ number_format($io->due,2) }}</td>
		</tr>
	@endforeach
	</tbody>
</table>

@section('page-scripts')
	@css(datatables,bootstrap4)
	@js(datatables,bootstrap4|responsive)

	<script type="text/javascript">
		$(document).ready(function() {
			$('#invoices').DataTable( {
				responsive: true,
				order: [1, 'desc']
			});

			$('#invoices tbody').on('click','tr', function () {
				$(this).toggleClass('selected');
			});
		});
	</script>
@append