@extends('layouts.dashboard')

@section('dashboard')

	@foreach($usuario as $u)

	    @if(session('message'))
	        <div class="alert alert-success mb-3">
	            {{ session('message') }}
	        </div>
	    @endif
	    	<ul class="breadcrumb m-0 p-0">
		        <li><a href="/dashboard">Home</a></li>
		        <li><strong>Editar Perfil de Usuario</strong></li>
		</ul>
	        <h1 class="titulo-h1 mb-4">Editar Perfil de Usuario</h1>
	        <div class="card">
	        	<form class="card-body" action="{{ route('usuario-editado') }}" method="post" id="form-usuario" onsubmit="return validarUsuario(this.id)">
	    		    {{ csrf_field() }}
	                <div class="row my-md-4 align-items-center">
		                <div class="col-auto">
		                    <label class="mt-3 mb-2 mt-md-2 md-lg-0 text-uppercase">Nombre:</label>
		                </div>
		                <div class="col-md">
		                    <input type="text" name="nombre" class="form-control" placeholder="Nombre" required="">
		                </div>
		                <div class="col-auto">
		                    <label class="mt-3 mb-2 mt-md-2 md-lg-0 text-uppercase">Email:</label>
		                </div>
		                <div class="col-md">
		                    <input type="email" name="email" class="form-control" placeholder="Email" required="">
		                </div>
		                <div class="col-auto">
		                    <label class="mt-3 mb-2 mt-md-2 md-lg-0 text-uppercase">Fono:</label>
		                </div>
		                <div class="col-md">
		                    <input type="text" name="fono" class="form-control" placeholder="Fono" required="">
		                </div>
		            </div>
	                <div class="row my-md-4 align-items-center">
		                <div class="col-auto">
		                    <label class="mt-3 mb-2 mt-md-2 md-lg-0 text-uppercase">Contraseña:</label>
		                </div>
		                <div class="col-md">
		                    <input type="password" name="password" class="form-control" placeholder="Contraseña">
		                </div>
		                <div class="col-auto">
		                    <label class="mt-3 mb-2 mt-md-2 md-lg-0 text-uppercase">Repetir Contraseña:</label>
		                </div>
		                <div class="col-md">
		                    <input type="password" name="password2" class="form-control" placeholder="Repetir Contraseña">
		                </div>
		            </div>
		            <div class="row mt-2">
		                <div class="col text-right">
		                    <button type="submit" class="btn btn-primary">Editar usuario</button>
		                </div>
		            </div>
	            </form>
	        </div>

	@endforeach

@endsection

@section('scripts')
	<script>
		function validarUsuario(form) {
		    var pass1 = $('[name=password]').val();
		    var pass2 = $('[name=password2]').val();

		    if(pass1 != '' || pass2 != '') {
		        if(pass1 == pass2) {
		            return true;
		        } else {
		            alert('Las contraseñas ingresadas no coinciden');
		            return false;
		        }
		    } else {
		        return true;
		    }
		}
	</script>
@endsection