@extends('layouts.admin')

@section('content')

<div class="normalheader transition animated fadeIn">
	
    <div class="hpanel">
		
        <div class="panel-body">
			
            <a class="small-header-action" href="">
                <div class="clip-header">
                    <i class="fa fa-arrow-up"></i>
                </div>
            </a>

            <div id="hbreadcrumb" class="pull-right m-t-lg">
                <ol class="hbreadcrumb breadcrumb">
                    <li>
						<a href="/admin/dashboard">
							<i class="fa fa-dashboard"></i>
							Dashboard
						</a>
					</li>
					<li>
						<a href="/admin/reportes">
							<i class="fa fa-bar-chart"></i>
							Reportes
						</a>
					</li>
					<li class="active">
						BIT&Aacute;CORA DE ACTIVIDADES
					</li>
                </ol>
            </div>
			
            <h2 class="font-light m-b-xs">
				<i class="fa fa-bar-chart"></i>
                Reportes
            </h2>
			
            <small>Reportes y estad&iacute;sticas</small>
			
        </div>
		
    </div>
	
</div>

<div class="content">
	
	<div class="row">
		
		<div class="col-md-12 animated-panel">
			
	        <div class="hpanel">
				
	            <div class="panel-body">
					
					<form class="form-inline" role="search">
						<div class="form-group form-group-sm">
							<input type="hidden" id="fecha_inicio" name="fecha_inicio" />
							<div id="cal-fecha-inicio" class="input-group date">
								<input type="text" class="form-control" placeholder="Desde" value="{{ $filter['fecha_inicio'] }}" />
								<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
							</div>
						</div>
						<div class="form-group form-group-sm">
							<input type="hidden" id="fecha_fin" name="fecha_fin" />
							<div id="cal-fecha-fin" class="input-group date">
								<input type="text" class="form-control" placeholder="Hasta" value="{{ $filter['fecha_fin'] }}" />
								<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
							</div>
						</div>
						<div class="form-group form-group-sm">
							<select id="usuario" name="usuario" class="form-control">
								<option value="">USUARIO</option>
								@foreach($usuarios as $usuario)
								<option value="{{ $usuario->id }}" {{ $filter['usuario'] == $usuario->id ? 'selected' : '' }}>{{ $usuario->display }}</option>
								@endforeach
							</select>
						</div>
						<div class="form-group form-group-sm">
							<select id="actividad" name="actividad" class="form-control">
								<option value="">ACTIVIDAD</option>
								@foreach($actividades as $key => $actividad)
								<option value="{{ $key }}" {{ $filter['actividad'] == $key ? 'selected' : '' }}>{{ $actividad }}</option>
								@endforeach
							</select>
						</div>
						<div class="form-group form-group-sm">
							<button id="btn-consulta" class="btn btn-primary btn-sm">
								Consultar
							</button>
						</div>
					</form>
						
					
					<div class="row">
						
						<div class="col-md-12">
							
							<h2 class="text-primary">Bit&aacute;cora de Actividades</h2>
							
							@if($bitacora->isEmpty())
							
							<div class="alert alert-warning">No hay actividades registradas a&uacute;n.</div>
							
							@else
							<table class="table table-striped">
								
								<tr>
									<th>Fecha</th>
									<th>Usuario</th>
									<th>Actividad</th>
								</tr>
								
								@foreach($bitacora as $actividad)
								<tr>
									<td>{{ $actividad->fechaActividad }}</td>
									<td>{{ $actividad->usuario->display }}</td>
									<td>{{ $actividad->descripcion }}</td>
								</tr>
								@endforeach
								
							</table>
							
							<div class="pagination">
								{!! $bitacora->appends(Request::only([]))->render() !!}
							</div>
							
							@endif
							
						</div>
						
					</div>
					
				</div>

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

@endsection

@section('scripts')
<script>
	
	$( document ).ready(function() {
		
		$( '.date' ).datepicker({
			format: 'dd/mm/yyyy',
			todayHighlight: true
		});
		
		$( "#cal-fecha-inicio" ).on("changeDate", function(event) {
			var date = $(this).datepicker('getDate');
			var dateStr = date.getFullYear() + '-' + (date.getMonth()+1) + '-' + date.getDate();
			$("#fecha_inicio").val( dateStr );
		});
		
		$( "#cal-fecha-fin" ).on("changeDate", function(event) {
			var date = $(this).datepicker('getDate');
			var dateStr = date.getFullYear() + '-' + (date.getMonth()+1) + '-' + date.getDate();
			$("#fecha_fin").val( dateStr );
		});
		
	});
	
</script>
@endsection