{% extends '../template.html' %}
{% block subcontent %}
<h2>Stock Obat</h2>
<br>
<div>
	<div class="card shadow mb-4">
		<div class="card-header py-3">
			<div class="row">
				<div class="col" style="display:flex;align-items:center">
					<h5 class="m-0">Status Ketersediaan Obat</h5>
				</div>
				<div class="col" style="display:flex;justify-content:end">
					<a href="{% nav apotek_obat_stock %}?xls=y" class="btn btn-success linkxls"><i class="fas fa-file-excel"></i></a>
				</div>
			</div>
		</div>
		<div class="card-body">
			<div class="table-responsive">
				<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
					<thead>
						<tr>
							<th>Nama Obat</th>
							<th style="max-width:150px">Jumlah Tersedia</th>
							<th>Satuan</th>
							<th>Status</th>
						</tr>
					</thead>
					<tbody>
						{% for row in data %}
						<tr>
							<td>{{row.nama}}</td>
							<td>{{row.jumlah}}</td>
							<td>{{row.satuan}}</td>
							<td>
								{% if row.jumlah > 10 %}
								<span class="text-success">Aman</span>
								{% else %}{% if row.jumlah > 0 %}
								<span class="text-warning">Menipis</span>
								{% else %}
								<span class="text-danger">Habis</span>
								{% endif %}
								{% endif %}
							</td>
						</tr>
						{% endfor %}
					</tbody>
				</table>
			</div>
		</div>
	</div>
	<br><br>
</div>
{% endblock %}
{% block script %}
<script>
	$(document).ready(function () {
		menuSelected("mInventory","smStockObat");
	});
	function refreshEvent() {
		
	}
</script>
{% endblock %}