<div class="widget">
	<div class="widget-content">
		<div class="headline">
			<h4>Staff Allocated</h4>
		</div>
		<br>

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

		<div class="row">
			<div class="col-sm-4">
				<ul class="list-group">
				 	 <li ng-repeat="user in users" class="list-group-item" ng-class="{'active' : selectedUser.id == user.id }" ng-click="selectUser(user)">
					    <span class="badge" ng-if=" user.parts.length > 0">{[{ user.parts.length }]}</span>
					    {[{ user.name }]}
					  </li>
				</ul>
			</div>
			<div class="task-group col-sm-8" ng-if="selectedUser">
				<div>
					<div widget-parts="selectedUser" related-type="user" ></div>
				</div>
			</div>
			<div class="col-sm-8" ng-hide="selectedUser || loading">
				<h1 class="muted">No user selected</h1>
			</div>
		</div>

	</div>
</div>

<script type="text/ng-template" id="widgets/parts.html">
	@include('stock::templates.parts')
</script>
