<div>
	
	<div class="card">
		<div class="card-header">
		    <div class="col-12">
		  		<div class="form-group">
					<input wire:model="buscar" type="search" class="form-control" placeholder="Buscar" />
		  		</div>
		  	</div>
		</div>
		<div class="card-body">
		    <table class="table table-bordered" id="example">
		        <thead>
		            <tr>
		                <th>ID</th>
		                <th>Jugador</th>
						<th>Rango</th>
		                <th>Acciones</th>
		            </tr>
		        </thead>
		        <tbody>
		            @foreach($matriculas as $value)
		            <tr>
		                <td>{{ $value->id }}</td>
		                <td>{{ $value->name }}</td>
		                <td>
		                	@if ($value->rango == 1)
		                		Capitan
		                	@else
		                		Jugador
		                	@endif 
		                </td>
		                <td>
			                <button wire:click="edit({{ $value->id }})" type="button" class="btn btn-info btn-sm" data-toggle="modal" data-target="#exampleModaledit"><i class="fas fa-edit"></i></button>

			                <button wire:click="edit({{ $value->id }})" type="button" class="btn btn-success btn-sm" data-toggle="modal" data-target="#exampleModalPass"><i class="fas fa-key"></i></button>

			                <button type="button" class="btn btn-danger btn-sm" data-toggle="modal" data-target="#exampleModal{{ $value->id }}"><i class="fas fa-trash-alt"></i></button>
			                

							<!-- Modal -->
							<div class="modal fade" id="exampleModal{{ $value->id }}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
							  	<div class="modal-dialog" role="document">
							    	<div class="modal-content">
							      		<div class="modal-header">
							        		<h5 class="modal-title" id="exampleModalLabel">Eliminar usuario del equipo</h5>
									        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
									          	<span aria-hidden="true">&times;</span>
									        </button>
							      		</div>
							      		<div class="modal-body">
							        		<p>¿Realmente quiere eliminar al usuario del equipo {{ $value->nombre }}?</p>
							      		</div>
							      		<div class="modal-footer">
							        		<button type="button" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
							        		<button type="button" wire:click="delete({{ $value->id }})" class="btn btn-danger" data-dismiss="modal">Eliminar</button>
							      		</div>
							    	</div>
							  	</div>
							</div>
		                </td>
		            </tr>
		            @endforeach
		        </tbody>
		    </table>
		</div>
	</div>
	<div class="modal fade" wire:ignore.self id="exampleModaledit" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel2" aria-hidden="true">
		<div class="modal-dialog" role="document">
			<div class="modal-content"> 
			  	<div class="modal-header">
			    	<h3 class="modal-title" id="exampleModalLabel2">Editar usuario: {{ $usuario }}</h3>
			    	<button type="button" class="close" data-dismiss="modal" aria-label="Close">
				      	<span aria-hidden="true">&times;</span>
				    </button>
			  	</div>
				<div class="modal-body">
					<form>
						<div class="form-group" align="center">
						  	<label for="">Foto</label><br>
						  	@if ($foto)
						        <img src="{{ $foto->temporaryUrl() }}" width="200px;">
						    @else
						    	<img src="{{ asset('/images/perfil/'.$fotoactual) }}" width="200px;">
						    @endif

						    <input type="file" wire:model="foto">
						</div>
						<div class="form-group">
						  	<label for="">Equipo</label>
						  	<select class="form-control" wire:model="equipo_id2">
						  		@foreach($equipos as $equipo)
						  			<option value="{{ $equipo->id }}">{{ $equipo->nombre }}</option>
						  		@endforeach
						  	</select>
						    @error('nombre') <span class="text-danger">{{ $message }}</span>@enderror
						</div>
						<div class="form-group">
						  	<label for="">Rango</label>
						    <select class="form-control" wire:model="rango">
						    	<option value="0">Jugador</option>
						    	<option value="1">Capitan</option>
						    </select>
						    @error('rango') <span class="text-danger">{{ $message }}</span>@enderror
						</div>
						<input type="hidden" wire:model="matricula_id" >
						<div class="modal-footer">
							<button type="button" wire:click="cancel()" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
							<button type="button" wire:click.prevent="update()" class="btn btn-success">Guardar Cambios</button>
						</div>
			  		</form>
				</div>
			</div>
		</div>
	</div>
	<div class="modal fade" wire:ignore.self id="exampleModalPass" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel2" aria-hidden="true">
		<div class="modal-dialog" role="document">
			<div class="modal-content"> 
			  	<div class="modal-header">
			    	<h3 class="modal-title" id="exampleModalLabel2">Editar usuario: {{ $usuario }}</h3>
			    	<button type="button" class="close" data-dismiss="modal" aria-label="Close">
				      	<span aria-hidden="true">&times;</span>
				    </button>
			  	</div>
				<div class="modal-body">
					<form>
						<div class="form-group">
					        <label>Contraseña:</label>
					        <input type="password" class="form-control" placeholder="Contraseña" wire:model="password">
					        @error('password') <span class="text-danger">{{ $message }}</span>@enderror

					    </div>
					     <div class="form-group">
					        <label>Confirme su Contraseña:</label>
					        <input type="password" class="form-control" placeholder="Confirmación de Contraseña" wire:model="password_confirmation">
					        @error('password_confirmation') <span class="text-danger">{{ $message }}</span>@enderror
					    </div>
						<input type="hidden" wire:model="matricula_id" >
						<div class="modal-footer">
							<button type="button" wire:click="cancel()" class="btn btn-secondary" data-dismiss="modal">Cerrar</button>
							<button type="button" wire:click.prevent="updatepass()" class="btn btn-success">Guardar Cambios</button>
						</div>
			  		</form>
				</div>
			</div>
		</div>
	</div>
	<div class="col-12">
	    @if($matriculas->count())
	        	{{ $matriculas->links() }}
	    @else
	        	No hay resultados para la búsqueda "{{ $buscar }}"
	    @endif
	</div>



</div>