<div class="invoice-modern">
	<?= message_box('success') ?>
	<?= message_box('error') ?>

	<div class="space-y-4">
		<div class="rounded-2xl border border-border bg-card shadow-sm">
			<div class="table-responsive p-4">
				<table class="table table-striped DataTables" id="DataTables" cellspacing="0" width="100%">
					<thead>
					<tr>
						<th><?= lang('payment_date') ?></th>
						<th><?= lang('invoice_date') ?></th>
						<th><?= lang('invoice') ?></th>
						<th><?= lang('client') ?></th>
						<th><?= lang('amount') ?></th>
						<th><?= lang('payment_method') ?></th>
						<th class="col-options no-sort hidden-print text-right"><?= lang('action') ?></th>
					</tr>
					</thead>
					<tbody></tbody>
				</table>
			</div>
		</div>
	</div>

	<script>
		list = base_url + "client/invoice/paymentList";

		function reloadClientPayments(filter, searchType) {
			var url = list;
			if (filter) {
				url += "/" + filter;
				if (searchType) {
					url += "/" + searchType;
				}
			}
			if (typeof table_url !== "undefined") {
				table_url(url);
			} else if (typeof fire_datatable === "function") {
				fire_datatable(url, "DataTables");
			}
		}

		if (document.readyState === "loading") {
			document.addEventListener("DOMContentLoaded", function () {
				if (typeof fire_datatable === "function") {
					fire_datatable(list, "DataTables");
				}
			});
		} else if (typeof fire_datatable === "function") {
			fire_datatable(list, "DataTables");
		}
	</script>
</div>
