@extends('template.layout')

@section('styles')
    <link href="{{asset('css/pages/perfil.min.css')}}" rel="stylesheet" type="text/css" />
@endsection

@section('content')
    <h1 class="page-title"> Perfil
        <small>{{ Auth::user()->role }}</small>
    </h1>
    <div class="profile">
        @include('alerts.index')
        <div class="row profile-account">
            <div class="col-md-3">
                <ul class="ver-inline-menu tabbable margin-bottom-10">
                    <li>
                        @if(is_null($usuario->urlimagen))
                            <img src="{{ asset('img/demo/perfil.jpg') }}" class="img-responsive pic-bordered profile-img" alt="img-perfil"/>
                        @else
                            <img src="{{ asset($usuario->urlimagen) }}" class="img-responsive pic-bordered profile-img" alt="img-perfil"/>
                        @endif
                    </li>
                    <li class="active">
                        <a data-toggle="tab" href="#tab_1" class="text-ellipsis">
                            <i class="fa fa-cog"></i> Informaci&oacute;n personal </a>
                        <span class="after"> </span>
                    </li>
                    <li>
                        <a data-toggle="tab" href="#tab_2" class="text-ellipsis">
                            <i class="fa fa-lock"></i> Cambiar contrase&ntilde;a </a>
                    </li>
                    @if(!(auth()->user()->roleid == config('constants.ROLES.APODERADO')))
                        <li>
                            <a data-toggle="tab" href="#tab_3" class="text-ellipsis">
                                <i class="fa fa-eye"></i> Experiencia laboral </a>
                        </li>
                    @endif
                </ul>
            </div>
            <div class="col-md-9">
                <div class="tab-content">
                    <div id="tab_1" class="tab-pane active">
                        <div class="profile-info">
                            <h1 class="font-green sbold uppercase">{{ $usuario->fullName }}</h1>
                            <ul class="list-inline">
                                <li>
                                    <i class="fa fa-user"></i> {{ $usuario->dni }} </li>
                                <li>
                                    <i class="fa fa-genderless"></i> {{ $usuario->genero }} </li>
                                <li>
                                    <i class="fa fa-asterisk"></i> {{ $usuario->estado_civil }} </li>
                                @if(!is_null($alumno) && $alumno->titulado > 0)
                                    <li>
                                        <i class="fa fa-graduation-cap"></i> Titulado </li>
                                @endif
                            </ul>
                        </div>

                        {{ Form::open(array('id' => 'form-datos','route' => 'perfil.datos')) }}
                        <div class="row">
                            {!! Form::hidden('id', $usuario->id) !!}
                            <div class="col-md-6 form-group">
                                <label class="control-label">Tel&eacute;fono</label>
                                {!! Form::text('telefono', null, array('placeholder' => $usuario->telefono,'class' => 'form-control', 'maxlength' => '9')) !!}
                            </div>
                            <div class="col-md-6 form-group">
                                <label class="control-label">Correo</label>
                                {!! Form::email('correo', null, array('placeholder' => $usuario->email,'class' => 'form-control')) !!}
                            </div>
                            <div class="col-md-12 form-group">
                                <label class="control-label">Direcci&oacute;n</label>
                                {!! Form::text('direccion', null, array('placeholder' => $usuario->direccion,'class' => 'form-control', 'maxlength' => '50')) !!}
                            </div>
                            <div class="col-md-12 form-group">
                                <label class="control-label">Descripci&oacute;n</label>
                                {!! Form::textarea('descripcion', null, array('placeholder' => $usuario->descripcion,'class' => 'form-control', 'maxlength' => '500', 'style' => 'resize: none;')) !!}
                            </div>
                        </div>
                        <div class="margin-top-10">
                            {{--<a href="javascript:;" class="btn btn-default"> Cancelar </a>--}}
                            <button type="submit" class="btn btn-primary"> Guardar cambios </button>
                        </div>
                        {!! Form::close() !!}
                    </div>
                    <div id="tab_2" class="tab-pane">
                        {{ Form::open(array('id' => 'form-password','route' => 'perfil.password')) }}
                        <div class="row">
                            {!! Form::hidden('id', $usuario->id) !!}
                            <div class="col-md-12 form-group">
                                <label class="control-label">Contrase&ntilde;a actual</label>
                                {!! Form::password('password', array('class' => 'form-control', 'required' => 'required')) !!}
                            </div>
                            <div class="col-md-12 form-group">
                                <label class="control-label">Nueva Contrase&ntilde;a</label>
                                {!! Form::password('newpassword', array('id' => 'newpassword', 'class' => 'form-control', 'required' => 'required')) !!}
                            </div>
                            <div class="col-md-12 form-group">
                                <label class="control-label">Re-ingrese su nueva contrase&ntilde;a</label>
                                {!! Form::password('repassword', array('id' => 'repassword', 'class' => 'form-control', 'required' => 'required')) !!}
                            </div>
                        </div>
                        <div class="margin-top-10">
                            {{--<a href="javascript:;" class="btn btn-default"> Cancelar </a>--}}
                            <button type="submit" class="btn btn-primary"> Guardar cambios </button>
                        </div>
                        {!! Form::close() !!}
                    </div>
                    @if(!(auth()->user()->roleid == config('constants.ROLES.APODERADO')))
                        <div id="tab_3" class="tab-pane">
                            <div class="portlet">
                                <div class="portlet-title">
                                    <div class="caption">
                                        <i class="fa fa-gift"></i> Experiencia laboral
                                    </div>
                                    <div class="actions">
                                        <a href="{{ url('perfil/experiencia/registrar') }}" class="btn btn-primary">
                                            <i class="fa fa-plus"></i><span class="hidden-xs"> Agregar experiencia laboral </span>
                                        </a>
                                    </div>
                                    <div class="tools" style="margin-right: 5px;">
                                        <a id="reload-exp" href="javascript:;" data-load="true" data-url="{{ url('perfil/experiencias') }}" class="reload"> </a>
                                    </div>

                                </div>
                                <div class="portlet-body portlet-empty"> </div>
                            </div>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    @if(!(auth()->user()->roleid == config('constants.ROLES.APODERADO')))
        <script src="{{ asset('plugins/jquery-slimscroll/jquery.slimscroll.min.js') }}" type="text/javascript"></script>
    @endif
    <script>
        $('#form-datos').validate({
            rules: {
                telefono: {
                    pattern: '^[0-9]{7,9}$'
                },
            }
        });
        $('#form-password').validate({
            rules: {
                newpassword : {
                    minlength : 5,
                },
                repassword : {
                    equalTo : "#newpassword"
                },
            }
        });
        function reload() {
            var el = $('#reload-exp').closest(".portlet").children(".portlet-body");
            var url = $('#reload-exp').attr("data-url");
            var error = $('#reload-exp').attr("data-error-display");
            if (url) {
                App.blockUI({
                    target: el,
                    animate: true,
                    overlayColor: 'none'
                });
                $.ajax({
                    type: "GET",
                    cache: false,
                    url: url,
                    dataType: "html",
                    success: function(res) {
                        App.unblockUI(el);
                        el.html(res);
                        App.initAjax() // reinitialize elements & plugins for newly loaded content
                    },
                    error: function(xhr, ajaxOptions, thrownError) {
                        App.unblockUI(el);
                        var msg = 'Error on reloading the content. Please check your connection and try again.';
                        if (error == "toastr" && toastr) {
                            toastr.error(msg);
                        } else if (error == "notific8" && $.notific8) {
                            $.notific8('zindex', 11500);
                            $.notific8(msg, {
                                theme: 'ruby',
                                life: 3000
                            });
                        } else {
                            alert(msg);
                        }
                    }
                });
            }
        }
        function eliminarExp(id) {
            swal({
                    title: "¿Está seguro?",
                    text: "Se eliminará la experiencia laboral seleccionada",
                    type: "warning",
                    confirmButtonText: "Si",
                    cancelButtonText: " No",
                    showCancelButton: true,
                    closeOnConfirm: false,
                    showLoaderOnConfirm: true,
                },
                function () {
                    {{--post('{{ url('perfil/experiencia/eliminar') }}'+"/"+ id);--}}
                    $.ajax({
                        url: '{{ url('perfil/experiencia/eliminar') }}',
                        type: "POST",
                        data: {
                            id: id
                        },
                        success: function (result) {
                            if (result) {
                                swal({
                                    title: 'Experiencia laboral eliminada',
                                    text: "El registro se eliminó exitosamente!",
                                    type: 'success',
                                    showCancelButton: false,
                                    showConfirmButton: true,
                                    showLoaderOnConfirm: true,
                                })
                                reload();
                            }
                            else {
                                swal("El anuncio ya ha sido enviado!", "No se puede eliminar el anuncio!", "error");
                            }
                        }
                    });
                });
        };

    </script>
@endsection