<%~ E.includeFile("partials/head.eta.html", {"title": "Dashboard"}) %> <%~ E.includeFile("partials/controls.eta.html", {"active": "Dashboard"}) %>

<h1>Good evening, ${user}</h1>
<div class="container text-center">
	<div class="row">
		<div class="card col m-2">
			<div class="card-body">
				<h5 class="card-title">+10</h5>
				<p class="card-text">New Stock</p>
			</div>
		</div>
		<div class="card col m-2">
			<div class="card-body">
				<h5 class="card-title"><%= it.stats.total %></h5>
				<p class="card-text">Items in total</p>
			</div>
		</div>
		<div class="card col m-2">
			<div class="card-body">
				<h5 class="card-title">Everything ok</h5>
				<p class="card-text">Instance Status</p>
			</div>
		</div>
	</div>
</div>


<!-- TODO: Center table content -->
<h2>Recent items</h2>
<div class="container">
	<table class="table">
		<thead>
			<tr>
				<th scope="col">SKU</th>
				<th scope="col">Name</th>
				<th scope="col">Status</th>
				<!--<th scope="col">Actions</th>-->
			</tr>
		</thead>
		<tbody>
			<% it.recents.forEach(function(user){ %>
			<tr>
				<th scope="row" data-bs-toggle="tooltip" data-bs-placement="left" data-bs-title="ID: <%= user.id %>"><%= user.SKU %></th>
				<td><%= user.name %></td>
				<td><span class="badge text-bg-success"><%= user.status %></span></td>
				<!--<td><a href="#" class="btn btn-primary">Edit</a></td>-->
			</tr>
			<% }) %>
		</tbody>
	</table>
</div>

<%~ E.includeFile("partials/controlsFoot.eta.html") %> <%~ E.includeFile("partials/foot.eta.html") %>