@extends('bucketadmin.master')
@section('pageTitle', 'Usuarios')
@push('styles')
@endpush
@section('template-content')
@include('partials.messages')
	<div class="row">
		<div class="col-sm-12 col-md-12">
			<section class="panel">
			    <header class="panel-heading">
			    	<i class="fa fa-users"></i> Listado de Usuarios
				</header>
			    <div class="panel-body">
			    	<div class=".col-md-4 col-offset-md-8">
			        	<a href="{{ url('/users/create') }}"  class="btn btn-primary pull-right" style="margin-bottom: 5px;">
			        		<span class="glyphicon glyphicon-plus" aria-hidden="true">
			        		</span>
			        	 Crear Usuario</a>
			       	</div>
			    	 @if ($users->count() > 0)
			        <table  class="table table-hover general-table table-striped">
			        	<thead>
			        		<tr>
			        			<th>Nombre</th>
			        			<th>Correo</th>
			        			<th>Perfil</th>
			        		</tr>
			        	</thead>
			        	<tbody>
			        		@foreach($users as $user)
			        		<tr>
			        			<td><a href="{{ url('/users/edit', ['id' => $user->id]) }}" style="color:#167787">{{ $user->full_name }}</a></td>
			        			<td><a href="mailto:{{ $user->email }}" style="color:#167787">{{ $user->email }}</a></td>
			        			<td>{{ $user->role }}</td>
			        		</tr>
			        		@endforeach
			        	</tbody>		
			        </table>
			        {{$users->links()}}
			        @else
			      	<div class="alert alert-info m-t">
				        No hay usuarios que mostrar
			      	</div>
				    @endif
			    </div>
			</section>			
		</div>
	</div>
@endsection
@push('scripts')
<style>
.pagination {
    float: right;
}
.pagination>.active>span{
    background-color: #167787;
    border-color: #167787;
}
.label-info {
    background-color: #8175c7;
}
.jambo_table tbody tr:hover td {
    background: #fff1d0;
    border-top: 1px solid #ffdc8c;
    border-bottom: 1px solid #ffc848
}
.pagination>.active>span:hover {
    background-color: #167787;
    border-color: #167787;
}
.pagination li a {
    color: #32323a !important;
}
</style>
@endpush