osb/resources/views/theme/backend/adminlte/r/invoice/widgets/due.blade.php

<!-- Show outstanding invoices for all clients -->
<div class="card card-warning">
	<div class="card-header">
		<h3 class="card-title">Invoices Due</h3>
	</div>

	<div class="card-body">
		@if($o->query_invoice_summary()->having('balance','>',0)->count())
			<table class="table table-bordered w-100" id="reseller_invoices_due">
				<thead>
				<tr>
					<th>Account</th>
					<th>#</th>
					<th>Issued</th>
					<th>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->query_invoice_summary()->having('balance','>',0)->get() as $oo)
					<tr @if ($oo->due_date->isPast()) class="table-danger" @endif>
						<td>{{ $oo->account->name }}</td>
						<td><a href="{{ url('u/invoice',$oo->id) }}">{{ $oo->sid }}</a></td>
						<td>{{ $oo->date_orig->format('Y-m-d') }}</td>
						<td>{{ $oo->due_date->format('Y-m-d') }}</td>
						<td class="text-right">${{ number_format($oo->total,2) }}</td>
						<td class="text-right">${{ number_format($oo->paid,2) }}</td>
						<td class="text-right">${{ number_format($oo->due,2) }}</td>
					</tr>
				@endforeach
				</tbody>
			</table>

		@else
			<p>No invoice due</p>
		@endif
	</div>
</div>

@section('page-scripts')
	@css('//cdn.datatables.net/1.10.25/css/dataTables.bootstrap4.min.css','jq-dt-css')
	@js('//cdn.datatables.net/1.10.25/js/jquery.dataTables.min.js','jq-dt-js')
	@js('//cdn.datatables.net/1.10.25/js/dataTables.bootstrap4.min.js','jq-dt-bs5-js','jq-dt-js')
	@js('//cdn.datatables.net/rowgroup/1.1.3/js/dataTables.rowGroup.min.js','jq-dt-rowgroup-js','jq-dt-js')
	@css('//cdn.datatables.net/rowgroup/1.1.3/css/rowGroup.bootstrap4.min.css','jq-dt-rowgroup-css','jq-dt-jss')

	<script type="text/javascript">
		$(document).ready(function() {
			$('#reseller_invoices_due').DataTable({
				order: [[0,'asc'],[3,'desc']],
				rowGroup: {
					dataSrc: 0,
				},
				columnDefs: [
					{
						targets: [0],
						visible: false,
					}
				],
			});

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