@extends('layouts.app')
@section('css')
<style>
    .filter-option,
    .filter-option-inner-inner {
        margin: 0px !important;
        padding: 3px 0 !important;
    }
</style>
@endsection
@section('content')
<ol class="breadcrumb">
    <li class="breadcrumb-item active class_select"><a href="{{ URL('/home') }}">Inicio</a></li>
    <li class="breadcrumb-item">Gerente de sucursal</li>
    <li class="breadcrumb-item active">Transferencia</li>
</ol>
<div class="row justify-content-between">
    <div class="col-12 col-xl-8" style="padding: 0 0 0 20px">
        <h1 class="page-title">Transferencia de <span class="fw-semi-bold">Gerente de sucursal</span></h1>
    </div>
    <div class="col-12 col-xl-4 text-right">

    </div>
</div>

<div class="clearfix"></div>

@include('flash::message')

<div class="clearfix"></div>

<section class="widget" style="padding:0px!important; margin-top:25px!important;">
    <header style="padding:0px 20px!important">
        <div class="content_div">
            <h4 style=" padding: 20px 50px 0!important;">Realiza una tranferencia de un Gerente Sucursal a una Sucursal
            </h4>
            <hr class="divider_tarjet " style="margin-top:15px; margin-bottom:0px;">
        </div>
    </header>
    @include('adminlte-templates::common.errors')
    {!! Form::open(['route' => 'gerenteSucursals.store_transferencia', 'class' => 'form-horizontal','files' => true, 'style' => 'width:100%']) !!}
    <div class="widget-body" style="padding: 0px 50px ">

        <div class="row">
            <div class="form-group col-xl-6 col-lg-6 col-md-12 col-sm-12  class_transferencia_border"
                style="border:none; border-right:1px solid #c9c9c9; padding:20px 20px 50px; margin:0">
                <h4 style="color:#495057; font-size:14px;"> Gerente Sucursal:</h4>
                {!! Form::label('gerente_sucursal', 'Selecciona un Gerente Sucursal a transferir:', ['class'=>'labels'])
                !!}<br />
                <div style="height:15px!important;"></div>
                <select class="selectpicker form-control" data-style="btn-default" data-width="100%"
                    name="gerente_sucursal" tabindex="-1" id="gerente_sucursal">
                    <option value="0" disabled selected>--</option>
                    @foreach($gerenteSucursals as $value)
                    <option data-gerentes="{!! $value->gerentes !!}" value="{!! $value->id !!}">{!! $value->user->name
                        !!}</option>
                    @endforeach
                </select>
                @if($errors->validator->has('name'))
                <div class="alert alert-danger alert-transparent alert-sm">
                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                    {!! $errors->validator->first('name')!!}
                </div>
                @endif
                <div class="row" style="padding-top:50px;display:none; " id="transferencia_gerente">
                    <div class="col-xl-12">
                        <h4 style="color:#495057; font-size:14px;">Información del Gerente Sucursal:</h4>
                    </div>
                    <div class="col-xl-12 ">
                        <label class="labels">Nombre del Gerente:</label><br>
                        <h5 class="fw-normal" style="color:#a2a2a2!important; margin-top:10px!important;" id="Nombre">
                        </h5>
                    </div>
                    <div class="col-xl-6 col-md-6 col-sm-12  " style="float:left; ">
                        <label class="labels" style="margin-top:15px!important;">Sucursal Actual:</label><br>
                        <h5 class="fw-normal" style="color:#a2a2a2!important; margin-top:10px!important;" id="Sucursal">
                        </h5>
                    </div>
                    <div class="col-xl-6 col-md-6 col-sm-12" style="float:right">
                        <label class="labels" style="margin-top:15px!important;">Código:</label><br>
                        <h5 class="fw-normal" style="color:#a2a2a2!important; margin-top:10px!important;" id="Codigo">
                        </h5>
                    </div>
                </div>
            </div>
            <div class="form-group col-xl-6 col-lg-6 col-md-12 col-sm-12 " style="padding:20px ">
                <h4 style="color:#495057; font-size:14px;">Sucursal:</h4>
                {!! Form::label('sucursal', 'Selecciona la Sucursal para transferir:', ['class'=>'labels']) !!}<br />
                <div style="height:15px!important;"></div>
                <select class="selectpicker form-control" data-style="btn-default" data-width="100%" name="sucursal"
                    tabindex="-1" id="sucursal">
                    <option value="0" disabled selected>--</option>
                    @foreach($sucursales as $value)
                    <option value="{!! $value->id !!}">{!! $value->nombre !!}</option>
                    @endforeach
                </select>
                @if($errors->validator->has('name'))
                <div class="alert alert-danger alert-transparent alert-sm">
                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                    {!! $errors->validator->first('name')!!}
                </div>
                @endif
                <div class="row" style="padding-top:50px;display:none; " id="transferencia_Sucursal">
                    <div class="col-xl-12">
                        <h4 style="color:#495057; font-size:14px;">Información de la Sucursal:</h4>
                    </div>
                    <div class="col-xl-12 ">
                        <label class="labels">Nombre de la Sucursal:</label><br>
                        <h5 class="fw-normal" style="color:#a2a2a2!important; margin-top:10px!important;" id="NombreS">
                        </h5>
                    </div>
                    <div class="col-xl-6 col-md-6 col-sm-12  " style="float:left;">
                        <label class="labels" style="margin-top:15px!important;">Dirección:</label><br>
                        <h5 class="fw-normal" style="color:#a2a2a2!important; margin-top:10px!important;"
                            id="DireccionS"></h5>
                    </div>
                    <div class="col-xl-6 col-md-6 col-sm-12 " style="float:right">
                        <label class="labels" style="margin-top:15px!important;">Clave:</label><br>
                        <h5 class="fw-normal" style="color:#a2a2a2!important; margin-top:10px!important;" id="Clave">
                        </h5>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="contnedor_transfer" style="padding:0 20px 15px">
        <div class="row top_line">
            <div class="form-group col-12 class_button_flex" style="margin-top:25px; margin-bottom:0px!important;">
                <button type="button" id="transferir" class="btn5 btnImage" data-toggle="tooltip"
                    title="Selecciona un gerente y una sucursal para transferir">guardar</button>
                <a href="#" id="btnCancel" class="btnDanger btn1">Cancelar</a>
            </div>
        </div>
    </div>
    <div class="modal fade" id="Asignar" tabindex="-1" role="dialog" aria-labelledby="AsignarLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title" id="AsignarLabel">Asigna un Gerente a una Sucursal libre</h3>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="form-group col-sm-12">
                            <h4 style="color:#495057; font-size:14px;">Hey! Para poder realizar la transferencia, es
                                necesario asignar un Gerente sucursal a la Sucursal que ha dejado de tener un Gerente.
                            </h4>
                            {!! Form::label('sucursal', 'Sucursal libre:', ['class'=>'labels']) !!}<br />
                            <label id="sucursal_libre" class="labels" style="margin-top:10px!important;"></label>
                        </div>
                        <div class="form-group col-sm-12" id="hide_gerente">
                            {!! Form::label('gerente_sucursal_2', 'Gerente de sucursal libre:',
                            ['class'=>'labels','style'=>'margin: 15px 0 0!important']) !!}<br />
                            <select class="selectpicker form-control" data-style="btn-default" data-width="100%"
                                name="gerente_sucursal_2" tabindex="-1" id="gerente_sucursal_2">
                                <option value="0" disabled selected>--</option>
                                @foreach($gerente_sucursal_libre as $value)
                                <option value="{!! $value->id !!}">{!! $value->user->name !!}</option>
                                @endforeach
                            </select>
                            @if($errors->validator->has('name'))
                            <div class="alert alert-danger alert-transparent alert-sm">
                                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
                                {!! $errors->validator->first('name')!!}
                            </div>
                            @endif
                        </div>
                        <div class="col-sm-12" style="margin-top:35px;" id="crearGerente">
                            <h4 style="color:#495057; font-size:14px;">Si no exite un Gerente Sucursal libre, puedes
                                crear uno:</h4>
                            <input type="radio" name="pago_radio" id="pago_esperado" value=""
                                onchange="clickRadio(this);">
                                <input type="hidden" name="crear_perfil" id="crear_perfil">
                            <label for="pago_radio" class="labels" style="margin-top:15px!important">Crear un gerente
                                Sucursal:</label>
                            <div id="txt_pago_esperado" style="padding:5px 0 10px;"></div>
                            <div class="row" id="hide_formulario">
                                <div class="col-12" style="position:relative;">
                                    {!! Form::label('name', 'Nombre:', ['class' => 'label_class']) !!}
                                    {!! Form::text('name', (!empty($gerenteSucursal) ? $gerenteSucursal->user->name :
                                    null), ['class' => 'form-control class_input']) !!}
                                </div>
                                <div class="col-md-6 col-12" style="position:relative; margin-top:35px; ">
                                    {!! Form::label('a_paterno', 'Apellido paterno:', ['class' => 'label_class']) !!}
                                    {!! Form::text('a_paterno', (!empty($gerenteSucursal) ?
                                    $gerenteSucursal->user->a_paterno : null), ['class' => 'form-control class_input'])
                                    !!}
                                </div>
                                <div class="col-md-6 col-12" style="position:relative; margin-top:35px;">
                                    {!! Form::label('a_materno', 'Apellido materno:', ['class' => 'label_class']) !!}
                                    {!! Form::text('a_materno', (!empty($gerenteSucursal) ?
                                    $gerenteSucursal->user->a_materno : null), ['class' => 'form-control class_input'])
                                    !!}
                                </div>
                                <div class="col-12" style="position:relative; margin-top:35px;">
                                    {!! Form::label('email', 'Correo electrónico:', ['class' => 'label_class']) !!}
                                    {!! Form::email('email', (!empty($gerenteSucursal) ? $gerenteSucursal->user->email :
                                    null), ['class' => 'form-control class_input']) !!}
                                </div>
                                <div class="col-md-6  col-12" style="position:relative; margin-top:35px;">
                                    {!! Form::label('telefono', 'Teléfono:', ['class' => 'label_class']) !!}
                                    {!! Form::text('telefono', (!empty($gerenteSucursal) ?
                                    $gerenteSucursal->user->telefono : null), ['class' => 'form-control class_input'])
                                    !!}
                                </div>
                                <div class="col-md-6 col-12" style="position:relative; margin-top:35px;">
                                    {!! Form::label('telefono_casa', 'Teléfono de casa:', ['class' => 'label_class'])
                                    !!}
                                    {!! Form::text('telefono_casa', (!empty($gerenteSucursal) ?
                                    $gerenteSucursal->user->telefono_casa : null), ['class' => 'form-control
                                    class_input']) !!}
                                </div>

                                <div class="col-12" style="position:relative; margin-top:35px;">
                                    {!! Form::label('fecha_nacimiento', 'Fecha de nacimiento (YYYY-MM-DD):', ['class' =>
                                    'label_class']) !!}
                                    {!! Form::text('fecha_nacimiento', (!empty($gerenteSucursal) ?
                                    $gerenteSucursal->user->fecha_nacimiento : null), ['class' => 'form-control
                                    class_input','id' => 'fecha_nacimiento']) !!}
                                </div>
                                @if(empty($gerenteSucursal))
                                <div class="col-md-6 col-12" style="position:relative!important; margin-top:35px;">
                                    {!! Form::label('password', 'Contraseña:', ['class' => 'label_class']) !!}
                                    {!! Form::password('password', ['class' => 'form-control class_input']) !!}
                                    @if($errors->has('password'))
                                    <div class="alert alert-danger alert-transparent alert-sm">
                                        <button type="button" class="close" data-dismiss="alert"
                                            aria-hidden="true">×</button>
                                        {!! $errors->first('password')!!}
                                    </div>
                                    @endif
                                </div>
                                @endif
                                <div class="col-md-6 col-12" style="position:relative; margin-top:35px;">
                                    {!! Form::label('codigo_gerente_sucursal', 'Código de supervisor:', ['class' =>
                                    'label_class']) !!}
                                    {!! Form::text('codigo_gerente_sucursal', null, ['class' => 'form-control
                                    class_input']) !!}
                                </div>
                                <input type="hidden" value="Gerente sucursal" name="tipo_usuario">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer" style="margin-top:25px;">
                    <button type="submit" class="btn5 btnImage" id="btnAccept" data-toggle="tooltip"
                        title="Selecciona un Gerente para que sea asignado a una Sucursal libre">guardar</button>
                    <button type="button" class="btnDanger btn1" id="cancel" data-dismiss="modal">cancelar</button>
                </div>
            </div>
        </div>
    </div>

    </div>
    {!! Form::close() !!}
</section>
<div class="modal fade" id="CancelTransfer" tabindex="-1" role="dialog" aria-labelledby="CancelTransferLabel"
    aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h3 class="modal-title" id="CancelTransferLabel">¡Advertencia!</h3>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="form-group col-sm-12">
                        <h5>Al aceptar la Transferencia del Gerente Sucursal será cancelada.</h5>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn2 btnSucces" id="btnCancelTransfer">Aceptar</button>
                <button type="button" class="btnDanger btn1" data-dismiss="modal">cancelar</button>
            </div>
        </div>
    </div>
</div>
@endsection


@section('scripts')
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.12/dist/js/select2.min.js"></script>
<script src="{!! asset('template') !!}/bower_components/bootstrap-select/dist/js/bootstrap-select.min.js"></script>
<script>

    //globales
    var agencia_supervisor = 0;

    $(document).ready(function() {
       /*OBTENGO LA INFORMACION DE UN GERENTE SUCURSAL */
        let url_dinamica = "{!! URL::to('/') !!}";
        $('#gerente_sucursal').on('change', function() {
            let gerentes = $(this).find(':selected').data('gerentes');
            let id = $(this).val();
            if(id != 0){/*VALIDO QUE EL VALUE->ID DEL SELECT NO SEA 0*/
                $.ajax({
                    url:  url_dinamica+"/api/getInfoGerente/"+id,
                    method:"GET",
                    dataType:"json",
                    success:function(value){
                        console.log(value);

                    /*ASIGNO LA INFORMACION DE UN GERENTE SUCURSAL */

                        $('#Nombre').text(value.data.user.name + ' ' + value.data.user.a_paterno + ' ' + value.data.user.a_materno );
                        $('#Codigo').text(value.data.codigo_gerente_sucursal );
                        if(value.data.agencia_id != null){
                            agencia_supervisor = value.data.agencia_id;
                            $('#Sucursal').text(value.data.sucursal.nombre);
                            $('#sucursal_libre').text(value.data.sucursal.nombre);
                        }
                        else{
                            $('#Sucursal').text(value.data.agencia);
                        }
                    },
                });
                $('#transferencia_gerente').css('display','block');
            }
            else{
                $('#transferencia_gerente').css('display','none');
                $('#transferir').attr('type','button');
                $('#transferir').removeClass('btn2 btnSucces');
                $('#transferir').addClass('btn5 btnImage');
                $('#transferir').attr('data-original-title','Selecciona un gerente y una sucursal para transferir');
            }
        });
        /*OBTENGO LA INFORMACION DE UNA SUCURSAL */
        $('#sucursal').on('change', function() {
            let id = $(this).val();
            if(id != 0){
                $.ajax({
                    url:  url_dinamica+"/api/getInfoSucursal/"+id,
                    method:"GET",
                    dataType:"json",
                    success:function(value){
                        $('#NombreS').text(value.data.nombre);
                        $('#DireccionS').text(value.data.direccion );
                        $('#Clave').text(value.data.clave);
                    }
                });
                $('#transferencia_Sucursal').css('display','block');
                $('#transferir').attr('type','submit');
                $('#transferir').removeClass('btn5 btnImage');
                $('#transferir').addClass('btn2 btnSucces');
                $('#transferir').removeAttr('data-original-title');
            }
            else{
                $('#transferencia_Sucursal').css('display','none');
                $('#transferir').attr('type','button');
                $('#transferir').removeClass('btn2 btnSucces');
                $('#transferir').addClass('btn5 btnImage');
                $('#transferir').attr('data-original-title','Selecciona un gerente y una sucursal para transferir');
            }
        });

        $('#transferir').on('click', function(e){
            e.preventDefault()
            var validacion = validarSelects();
            // validar si supervisor esta asignado a algo
            if(validacion && agencia_supervisor != 0){
                $('#Asignar').modal('show');
            }
            else
            {
                $('#formulario_tranferencia_gerente_supervisor').submit();
            }
        });
    });

    function validarSelects(){
        if($('#gerente_sucursal').val() != 0 && $('#sucursal').val()){
            return true;
        }else{
            return false;
        }
    }

    $('#hide_formulario').hide();
    function clickRadio(id){
        $('#hide_gerente').css('display','none');
            $('#hide_formulario').show();
            $('#btnAccept').attr('type','submit');
            $('#btnAccept').removeClass('btn5 btnImage');
            $('#btnAccept').addClass('btn2 btnSucces');
            $('#btnAccept').removeAttr('data-original-title');
            $('#crear_perfil').val('on');
            $(id).bind('touchstart mousedown', function() {
                this.checked = !this.checked;
                if(this.checked == false){
                    $('#crear_perfil').val('off');
                    $('#hide_formulario').hide();
                    $('#btnAccept').attr('type','submit');
                    $('#btnAccept').addClass('btn5 btnImage');
                    $('#btnAccept').removeClass('btn2 btnSucces');
                    $('#btnAccept').attr('data-original-title','Selecciona un Gerente para que sea asignado a una Sucursal libre');
                    $('#hide_gerente').css('display','block');
                }
                else{
                    $('#hide_gerente').css('display','none');
                    $('#hide_formulario').show();
                    $('#btnAccept').attr('type','submit');
                    $('#btnAccept').removeClass('btn5 btnImage');
                    $('#btnAccept').addClass('btn2 btnSucces');
                    $('#btnAccept').removeAttr('data-original-title');
                }
            }).bind('click touchend', function(e) {
                e.preventDefault()
            });
    }

    $('#gerente_sucursal_2').on('change',function(){
            let id = $(this).val();
            if(id != 0){
                $('#btnAccept').attr('type','submit');
                $('#btnAccept').removeClass('btn5 btnImage');
                $('#btnAccept').addClass('btn2 btnSucces');
                $('#btnAccept').removeAttr('data-original-title');
            }
            else{
                $('#btnAccept').attr('type','submit');
                $('#btnAccept').addClass('btn5 btnImage');
                $('#btnAccept').removeClass('btn2 btnSucces');
                $('#btnAccept').attr('data-original-title','Selecciona un Gerente para que sea asignado a una Sucursal libre');
            }
    });

    $(window).load(function() {
        console.log();
        if($('.class_input').val() == ' '){
            $('.class_input').parent().find('.label_class').addClass('active2');
        }
    });

    $('.class_input').on('focusin', function() {
        $(this).parent().find('.label_class').addClass('active2');
    });

    $('.class_input').on('focusout', function() {
        if (!this.value) {
            $(this).parent().find('.label_class').removeClass('active2');
        }
    });

    $('#btnCancel').click(function(){
        if($('#Nombre').text() == ""){

        }
        else{
            $('#CancelTransfer').modal('show');
        }
    });

    $('#btnCancelTransfer').click(function(){
        location.reload();
    })



</script>
@endsection