pbmc-cmod/app/Views/dashboard.php

<?= $this->extend('layouts/main.php') ?>

<?= $this->section('content') ?>
<style>
#table_dashboard tr { cursor: pointer; }
</style>

<!--
<div class="d-flex justify-content-between p-0">
	<div class="custom-card">
		<div class="custom-card-content">
			<div class="row p-0 d-flex justify-content-between">
				<div class="col-3 text-start text-orange"> <h5 class="m-0"><i class="bi bi-clock-history"></i></h5> </div>
				<div class="col-9 text-end pe-3"> <h2 class="m-0 custom-card-title">345</h2> </div>
			</div>
			<hr class="text-orange">
			<h3 class="custom-card-text m-0 p-0 text-orange">Pending</h3>
		</div>
	</div>
	<div class="custom-card">
		<div class="custom-card-content">
			<div class="row p-0 d-flex justify-content-between">
				<div class="col-3 text-start text-peach"> <h5 class="m-0"><i class="bi bi-tv"></i></h5> </div>
				<div class="col-9 text-end pe-3"> <h2 class="m-0 custom-card-title">333</h2> </div>
			</div>
			<hr class="text-peach">
			<h3 class="custom-card-text m-0 p-0 text-peach">Part. Collect</h3>
		</div>
	</div>
	<div class="custom-card">
		<div class="custom-card-content">
			<div class="row p-0 d-flex justify-content-between">
				<div class="col-3 text-start text-pink"> <h5 class="m-0"><i class="bi bi-collection"></i></h5> </div>
				<div class="col-9 text-end pe-3"> <h2 class="m-0 custom-card-title">542</h2></div>
			</div>
			<hr class="text-pink">
			<h3 class="custom-card-text m-0 p-0 text-pink">Collected</h3>
		</div>
	</div>
	<div class="custom-card">
		<div class="custom-card-content">
			<div class="row p-0 d-flex justify-content-between">
				<div class="col-3 text-start text-soft-blue"> <h5 class="m-0"><i class="bi bi-file-medical"></i></h5> </div>
				<div class="col-9 text-end pe-3"> <h2 class="m-0 custom-card-title">436</h2> </div>
			</div>
			<hr class="text-soft-blue">
			<h3 class="custom-card-text m-0 p-0 text-soft-blue">Part. Rcv.</h3>
		</div>
	</div>
	<div class="custom-card">
		<div class="custom-card-content">
			<div class="row p-0 d-flex justify-content-between">
				<div class="col-3 text-start text-blue"> <h5 class="m-0"><i class="bi bi-journal-medical"></i></h5> </div>
				<div class="col-9 text-end pe-3"> <h2 class="m-0 custom-card-title">567</h2> </div>
			</div>
			<hr class="text-blue">
			<h3 class="custom-card-text m-0 p-0 text-blue">Received</h3>
		</div>
	</div>
	<div class="custom-card">
		<div class="custom-card-content">
			<div class="row p-0 d-flex justify-content-between">
				<div class="col-3 text-start text-grey"> <h5 class="m-0"><i class="bi bi-calendar3-week"></i></h5> </div>
				<div class="col-9 text-end pe-3"> <h2 class="m-0 custom-card-title">321</h2> </div>
			</div>
			<hr class="text-grey">
			<h3 class="custom-card-text m-0 p-0 text-grey">Inprocess</h3>
		</div>
	</div>
	<div class="custom-card">
		<div class="custom-card-content">
			<div class="row p-0 d-flex justify-content-between">
				<div class="col-3 text-start text-soft-green"> <h5 class="m-0"><i class="bi bi-check2"></i></h5> </div>
				<div class="col-9 text-end pe-3"> <h2 class="m-0 custom-card-title">432</h2> </div>
			</div>
			<hr class="text-soft-green">
			<h3 class="custom-card-text m-0 p-0 text-soft-green">Part. Val.</h3>
		</div>
	</div>
	<div class="custom-card">
		<div class="custom-card-content">
			<div class="row p-0 d-flex justify-content-between">
				<div class="col-3 text-start text-green"> <h5 class="m-0"><i class="bi bi-clipboard-check"></i></h5> </div>
				<div class="col-9 text-end pe-3"> <h2 class="m-0 custom-card-title">321</h2></div>
			</div>
			<hr class="text-green">
			<h3 class="custom-card-text m-0 p-0 text-green">Validated</h3>
		</div>
	</div>
</div>
-->

<div class="card border-0">
	<div class="body-card">
		<div class="table-responsive">
			<table id="table_dashboard" class="table">
				<thead>
					<tr >
						<th>Order</th>
						<th>MR</th>
						<th>Patient</th>
						<th>Request</th>
						<th>Hosp</th>
						<th>Test</th>
						<th>Status</th>
					</tr>
				</thead>
				<tbody>
					<?php
					$i = 1;
					foreach ($data as $row) {
						$colldate = $row['COLLECTIONDATE'];
						$colldate = substr($colldate,0,10);
						$patnumber = $row['PATNUMBER'];
						$patnumber = substr($patnumber,-16);
						$accessnumber = $row['SP_ACCESSNUMBER'];
					?>
					<tr class="table-row viewAccess" data-bs-toggle="modal" data-bs-target="#modal" data-access='<?=$accessnumber;?>'>
						<td class="text-start text-nowrap"><?=$colldate;?></td>
						<td class="text-start text-nowrap"><?=$patnumber;?></td>
						<td class="text-start"><?=$row['NAME'];?></td>
						<td class="text-start"><?=$accessnumber;?></td>
						<td class="text-start"><?=$row['HOSTORDERNUMBER'];?></td>
						<td class="text-start"><?=$row['TESTS'];?></td>
						<td class="bg-orange text-center align-middle">Pending</td>
					</tr>
					<?php
					}
					?>
				</tbody>
			</table>
		</div>
	</div>
</div>	

<div class="modal fade" id="modal" aria-hidden="true" tabindex="-1">
	<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable">
		<div class="modal-content">
			hello from modal
		</div>
	</div>
</div>

<?= $this->endSection() ?>

<?= $this->section('script') ?>
<script>
$(document).ready(function() {
	$('#table_dashboard').DataTable({
		order: [],
		pageLength: 25
	});
});

$('.viewAccess').on('click',function(){
	const access = $(this).data('access');
	$('.modal-content').load('<?=base_url();?>dashboard/viewAccess/'+access, function(){
		$('#modal').modal('show');
	});
});
</script>
<?= $this->endSection() ?>