<div uib-tabset>
	<div uib-tab heading="All" select="active_tab = -1">
		<div class="repair-tab bookings-content" stock-takes-table category-id="all" categories="categories"></div>
	</div>
	<div uib-tab ng-repeat="cat in categories" heading="{[{ cat.name }]}" select="active_tab = $index">
		<div class="repair-tab bookings-content" stock-takes-table category-id="{[{ cat.id }]}" active-tab="active_tab" index="{[{ $index }]}" categories="categories"></div>
	</div>
</div>
<script type="text/ng-template" id="stock/stock-takes-table.html">
	<div>
		<div class="form-inline">
			<div class="radio-inline">
				<strong class="muted">Records: </strong>
				<select name="items" ng-model="filters.limit" class="form-control">
					<option value="10">10</option>
					<option value="20">20</option>
					<option value="50">50</option>
					<option value="100">100</option>
				</select>
			</div>


			<label class="checkbox-inline">
				<input type="checkbox" name="under_buffer" value="1" ng-model="filters.under_buffer" class="ng-pristine ng-untouched ng-valid ng-empty"> <span class="muted">Under Buffer</span>
			</label>

			<select name="status_id" ng-model="filters.last_report_date" class="form-control">
            	<option value="">All products </option>
            	<option value="this_week">Products reported last week</option>
            	<option value="last_week">Products reported the previous week</option>
            	<option value="more_than_two_weeks">Products with no repor within the last two weeks</option>
            </select>

			<div class="input-group pull-right">
				<input type="text" class="form-control" placeholder="Search" ng-model="filters.search" />
				<span class="input-group-addon">
					<i class="fa fa-search"></i>
				</span>
			</div>
		</div>
		<br>

		<div class="row">
			<div ng-show="loading">
				<i class="fa fa-spinner fa-spin"></i> Loading products, please be patient...
			</div>
		</div>

		<table class="table table-striped">
			<thead class="table-header">
				<th></th>
				<th width="20%">Name</th>
				<th>EAN</th>
				<th>Last Report</th>
				<th class="centered">In Stock</th>
				<th class="centered">Actual Value</th>
				<th></th>
			</thead>
			<tbody>
				<tr ng-repeat="item in products">
					<td>
						<i ng-class="{'fa fa-circle text-success': item.last_report && (item.last_report.created_at | diff:'days') < 7 ,'fa fa-circle text-warning': item.last_report && 14 > (item.last_report.created_at | diff:'days') < 7  ,'fa fa-circle text-danger': !item.last_report || (item.last_report.created_at | diff:'days') > 14 }" class="fa fa-circle"></i>
					</td>
					<td>{[{ item.name }]}</td>
					<td>{[{ item.model_number }]}</td>
					<td>{[{ item.last_report ? (item.last_report.created_at | fromNow) : 'No reports' }]}</td>
					<td class="centered">{[{ item.quantity }]}</td>
					<td class="centered">
						<input type="number" ng-model="item.new_quantity" style="width: 80px;" class="form-control" min="0">
					</td>
					<td class="text-right">
						<div class="btn-group">
							<a ng-href="{!! URL::to('stock/barcode') !!}/{[{ item.id }]}" target="_blank" class="btn btn-default" tooltip="Print barcode"><i class="fa fa-barcode"></i></a>
							<span class="btn" ng-class="{ 'btn-warning' : item.new_quantity, 'btn-success': !item.new_quantity}" ng-click="updateQuantity(item)">
						 		{[{ item.new_quantity ? 'Save' : 'Correct'}]}
							</span>
						</div>
					</td>
				</tr>
			</tbody>
		</table>
		<div paginator="paginator"></div>

	</div>
</script>