@section('header')
	@include('common.header')
@stop

@section('js')
	@parent

	<script type="text/ng-template" id="hr/modals/approve-decline-time.html">
		@include('hr::templates.approve-decline')
	</script>

	<script type="text/ng-template" id="hr/modals/generate_timesheet.html">
		@include('hr::templates.generate-timesheet')
	</script>

	<script type="text/ng-template" id="hr/modals/generate_individual_timesheet.html">
		@include('hr::templates.generate_individual_timesheet')
	</script>
@stop

@section('content')

	<div class="row task-beta">
		<div class="col-sm-5">
			<div class="widget widget-classic" ng-controller="HrUsersCtrl" ng-cloak>
				<div class="widget-content">

					<div class="headline">
						<h4><i class="fa fa-user"></i> Users</h4>
					</div>

					<table class="table table-no-header table-striped table-hover table-condensed">
						<tbody>
							<tr ng-repeat="user in users">
								<td>
									<small><i class="fa fa-circle" ng-class="{'text-success': user.latest_time_log.type == 'in', 'text-danger': ! user.latest_time_log || user.latest_time_log.type == 'out'}"></i></small> &nbsp; <a ng-href="{!! URL::to('hr/admin/users') !!}/{[{ user.id }]}">{[{ user.user.name }]}</a>
								</td>
								<td>{[{ user.default_start_time }]} <em>to</em> {[{ user.default_end_time }]}</td>
								<td>{[{ user.rate_per_hour | currency:"£" }]}</td>
								<td><span class="badge badge-warning pull-right" ng-show="user.pending_change_requests.length > 0">{[{ user.pending_change_requests.length }]}</span></td>
							</tr>
						</tbody>
						<tfoot>
							<tr>
								<td>
									Total: {[{ users.length }]} <br>
									Current running costs: {[{ runningCosts() | currency:"£" }]} per hour
								</td>
								<td colspan="3">
									<button class="btn btn-default pull-right" data-ng-click="generateTimesheet()">Generate Timesheet</button>
								</td>
							</tr>
						</tfoot>
					</table>

				</div>
			</div>
		</div>

		<div class="col-sm-7">
			<div class="widget widget-classic" ng-controller="TimeLogPendingRequestsCtrl" ng-cloak>
				<div class="widget-content">

					<div class="headline">
						<h4><i class="fa fa-refresh"></i> Pending changes requests</h4>
					</div>

					<table class="table table-no-header table-striped-odd">
						<tbody>
							<tr ng-repeat="request in requests">
								<td><a ng-href="{!! URL::to('hr/admin/users') !!}/{[{ request.user.id }]}">{[{ request.user.name }]}</a></td>
								<td>
									<span ng-show="request.time_log.new_record_request == '1'">New record</span>
									<span ng-show="request.time_log.new_record_request == '0'">Update record</span>
								</td>
								<td>
									<span ng-show="request.time_log"><em>From</em> <span class="label label-info">{[{ request.time_log.time.format("DD/MM/YYYY HH:mm") }]}</span> <em>to</em> <span class="label label-info">{[{ request.time.format("DD/MM/YYYY HH:mm") }]}</span></span>
									<span ng-hide="request.time_log" class="label label-info">{[{ request.time.format("DD/MM/YYYY HH:mm") }]}</span>
								</td>
								<td>
									<span ng-show="request.time_log.type == 'in'">Clock in</span>
									<span ng-show="request.time_log.type == 'out'">Clock out</span>
								</td>
								<td><span uib-tooltip="{[{ request.ip_address }]}">IP <i class="fa fa-question-circle"></i></span></td>
								<td>
									<div class="text-right">
										<div class="btn-group btn-group-sm">
											<span class="btn btn-default" ng-click="edit(request)">Edit</span>
											<span class="btn btn-success" ng-click="approve(request)">Approve</span>
											<span class="btn btn-danger" ng-click="decline(request)">Decline</span>
										</div>
									</div>
								</td>
							</tr>
						</tbody>
					</table>

				</div>
			</div>


			<div class="widget widget-classic" ng-controller="AdminHolidayRequestsCtrl">
				<div class="widget-content">

					<div class="headline">
						<h4><i class="fa fa-plane"></i> Holiday Requests</h4>
					</div>

					<small ng-show="holidays.length == 0">No holiday requests at the moment</small>

					<table class="table table-no-header table-striped-odd">
						<tbody>
							<tr ng-repeat="holiday in holidays">
								<td><a ng-href="{!! URL::to('hr/admin/users') !!}/{[{ holiday.user.id }]}">{[{ holiday.user.name }]}</a></td>
								<td>{[{ holiday.description }]}</td>
								<td>{[{ holiday.start_date | moment:"DD/MM/YYYY" }]}</td>
								<td>{[{ holiday.end_date | moment:"DD/MM/YYYY" }]}</td>
								<td>{[{ holiday.total_days }]} days</td>
								<td>{[{ holiday.paid == '1' ? 'Paid' : '' }]}</td>
								<td><span uib-tooltip="{[{ holiday.ip_address }]}">IP <i class="fa fa-question-circle"></i></span></td>
								<td><span uib-tooltip="{[{ holiday.created_at }]}">{[{ holiday.created_at | fromNow }]}</span></td>
								<td>
									<div class="text-right">
										<div class="btn-group btn-group-sm">
											<span class="btn btn-success" ng-click="approve(holiday)">Approve</span>
											<span class="btn btn-danger" ng-click="decline(holiday)">Decline</span>
										</div>
									</div>
								</td>
							</tr>
						</tbody>
					</table>

				</div>
			</div>

			<div class="widget widget-classic" ng-controller="HolidaysCalendarCtrl">
				<div class="widget-content">

					<div class="headline">
						<h4><i class="fa fa-calendar"></i> Upcoming holidays</h4>
					</div>

					<div calendar="fullCalendar" ui-calendar="calendar" ng-model="eventSources"></div>

				</div>
			</div>
		</div>
	</div>

@stop