@extends('layouts.app')

@section('content')
    <section class="section">
        <div class="section-header">
            <h3 class="page__heading">Alta de Usuarios</h3>
        </div>
        <div class="section-body">
            <div class="row">
                <div class="col-lg-12">
                    <div class="card">
                        <div class="card-body">    

                        @if ($errors->any())                                                
                            <div class="alert alert-dark alert-dismissible fade show" role="alert">
                            <strong>¡Revise los campos!</strong>                        
                                @foreach ($errors->all() as $error)                                    
                                    <span class="badge badge-danger">{{ $error }}</span>
                                @endforeach                        
                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                            </div>
                        @endif

                        {!! Form::open(array('route' => 'usuarios.store','method'=>'POST')) !!}
                        <div class="row">
                            <div class="col-xs-12 col-sm-12 col-md-12">
                                <div class="form-group">
                                    <label for="name">Nombre</label>
                                    <input class="form-control" name="name" type="text">
                                 
                                </div>
                            </div>
                            <div class="col-xs-12 col-sm-12 col-md-12">
                                <div class="form-group">
                                    <label for="email">E-mail</label>
                                    <input class="form-control" name="email" type="text">
                                </div>
                            </div>
                            <div class="col-xs-12 col-sm-12 col-md-12">
                                <div class="form-group">
                                    <label for="password">Password</label>
                                    <input class="form-control" name="password" type="password" value="">
                                </div>
                            </div>
                            <div class="col-xs-12 col-sm-12 col-md-12">
                                <div class="form-group">
                                    <label for="confirm-password">Confirmar Password</label>
                                    <input class="form-control" name="confirm-password" type="password" value="">
                                </div>
                            </div>

                            <div class="col-xs-12 col-sm-12 col-md-12">
                                <div class="form-group">
                                    <label for="">Roles</label>
                                    <select class="form-control" id="roles" name="rol">
                            <option value="Administrador">Administrador</option>
                            <option value="Ingeniero">Ingeniero</option>
                            <option value="Tecnico">Tecnico</option>
                        </select>
                                </div>
                            </div>

                            <div class="col-xs-12 col-sm-12 col-md-12" id="departamentos">
                                <div class="form-group">
                                    <label for="">Área</label>
                                    <select class="form-control" name="area">
                                <option value="Avionics">Avionics</option>
                                <option value="Planeador Hangar">Planeador Hangar</option>
                                <option value="Baterias">Baterias</option>
                                <option value="Hidraulicos">Hidraulicos</option>
                                <option value="Helicopteros">Helicopteros</option>
                                <option value="Laboratorio">Laboratorio</option>
                                <option value="Linea">Linea</option>
                                <option value="Propeller">Propeller</option>
                                <option value="Vestiduras">Vestiduras</option>
                                <option value="Motores Reciprocos">Motores Reciprocos</option>
                                <option value="Estructuras">Estructuras</option>
                                    </select>
                                </div>
                            </div>


                           <!--Ejemplo-->
                           
                          


                            <div class="col-xs-12 col-sm-12 col-md-12">
                                <button type="submit" class="btn btn-primary">Guardar</button>
                            </div>
                        </div>
                        {!! Form::close() !!}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <script>
     jQuery("#roles").click(function(){       
        var valor_rol= jQuery("#roles").val();

        if(valor_rol == 'Tecnico'){
            jQuery("#departamentos").show();
        }else {
            jQuery("#departamentos").hide();
        }
    });
</script>  

@endsection