@extends('usuarios.funcionarios.master.layout2')

@section('conteudo')
<nav class="d-none">
    {{ $clientes=\App\Models\Cliente::join('departamentosclientes','departamentosclientes.cliente_id','=','clientes.id')->select('clientes.*')->distinct()->get() }}

</nav>

<style>


    .labelEnumering{
    font-family: 'Roboto', sans-serif;
    font-size: 2em;
    }

    body,
    html,
    .wrapper {
    width: 100%;
    height: 100%;
    }
    .wrapper {
    position: relative;
    background: #e7f0f7;
    }
    .progressbar {
    display: block;
    position: absolute;
    z-index: 9;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 400px;
    height: 30px;
    }
    .progressbar::before,
    .progressbar::after {
    content: '';
    display: block;
    position: absolute;
    z-index: 99;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    background-image: linear-gradient(90deg, #06b0ff 20%,   #03a9f4 20%);
    background-position: 0 0;
    background-repeat: repeat-x;
    -webkit-animation: movebar 5s linear infinite;
            animation: movebar 5s linear infinite;
    }
    .progressbar::before {
    box-shadow: 0 6px 10px 0 rgba(0,0,0,0.1);
    }
    .progressbar::after {
    z-index: 9;
    top: 6px;
    filter: blur(16px);
    opacity: 0.7;
    }
    .stylization {
    position: absolute;
    z-index: 999;
    height: 4px;
    width: 90%;
    left: 5%;
    top: 6px;
    opacity: 0.3;
    }
    .stylization::before,
    .stylization::after {
    content: '';
    display: block;
    position: absolute;
    height: 4px;
    top: 0;
    border-radius: 2px;
    }
    .stylization::before {
    background: #fff;
    left: 0;
    right: 10px;
    }
    .stylization::after {
    width: 6px;
    background: #fff;
    right: 0;
    }
    @-webkit-keyframes movebar {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 400px 0;
    }
    }
    @keyframes movebar {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 400px 0;
    }
    }
</style>

        <a href="{{ route('us.armazem.gestao.caixas.ver.reservas') }}"  class="btn btn-sm blue-gradient"><i class="fa fa-bars"></i> Outras reservas</a>
    <div class="mb-5 p-4 bg-white shadow-sm">
        <h3>Nova reserva</h3>
        <div id="stepper2" class="bs-stepper">
          <div class="bs-stepper-header" role="tablist">
            <div class="step" data-target="#test-nl-1">
              <button type="button" class="step-trigger" role="tab" id="stepper2trigger1" aria-controls="test-nl-1">
                <span class="bs-stepper-circle">
                  <span class="fas fa-user" aria-hidden="true"></span>
                </span>
                <span class="bs-stepper-label">Cliente</span>
              </button>
            </div>
            <div class="bs-stepper-line"></div>
            <div class="step" data-target="#test-nl-2">
              <button type="button" class="step-trigger" role="tab" id="stepper2trigger2" aria-controls="test-nl-2">
                <span class="bs-stepper-circle">
                  <span class="fas fa-boxes" aria-hidden="true"></span>
                </span>
                <span class="bs-stepper-label">Caixa</span>
              </button>
            </div>
            <div class="bs-stepper-line"></div>
            <div class="step" data-target="#test-nl-3">
              <button type="button" class="step-trigger" role="tab" id="stepper2trigger3" aria-controls="test-nl-3">
                <span class="bs-stepper-circle">
                  <span class="fas " aria-hidden="true">1</span>
                </span>
                <span class="bs-stepper-label">Numeração</span>
              </button>
            </div>
            <div class="bs-stepper-line"></div>
            <div class="step" data-target="#test-nl-4">
              <button type="button" class="step-trigger" role="tab" id="stepper2trigger3" aria-controls="test-nl-4">
                <span class="bs-stepper-circle">
                  <span class="fas fa-file" aria-hidden="true"></span>
                </span>
                <span class="bs-stepper-label">Resultado</span>
              </button>
            </div>
            
            
            
          </div>
          <div class="bs-stepper-content">
            <form onSubmit="return false" name="formularioReserva" id="formGeneral">
              <div id="test-nl-1" role="tabpanel" class="bs-stepper-pane" aria-labelledby="stepper2trigger1">
                 <br><br>
                <div class="col-md-12  text-center position-relative">

                    <label for="validationTooltip02" class="form-label clienteListCombo">CLIENTE</label>  <br>
                    <select id="Sector" class="position-relative form-control   bg-dark" style="width:400px;" >
                        <option value="0" style="display: none;" class="d-none">Escolha aqui o cliente</option>
                        @foreach($clientes as $cliente)

                            <option value="{{$cliente->id}}"> {{Str::upper( $cliente->getUser->getPessoa->nome)}}</option>
                        @endforeach

                    </select>

                </div>
                <div class="col-md-12  text-center position-relative">
                    <br>
                    <br>

                    <label for="validationTooltip02" class="form-label">DEPARTAMENTO</label>  <br>
                    <select id="Sector2" class="position-relative form-control   bg-dark" style="width:400px;" >

                    </select>
                </div>

                <div class="col-md-12  text-center position-relative">
                      <br><br>


                    <button class="btn btn-primary btn-sm btnProsseguirCliente disabled " >Prosseguir <i class="fa fa-angle-double-right"></i></button>
                </div>
                <!--<button class="btn btn-primary btn-sm" onclick="stepper2.next()">Next</button>-->
                
                
              </div>
              <div id="test-nl-2" role="tabpanel" class="bs-stepper-pane" aria-labelledby="stepper2trigger2">
                 
                <div class="row">
                    <div class="col-6  text-center position-relative">
                        <br>
                        <br>
                        <div class="d-none">
                            {{ $armazens=\App\Models\ArmazemModel::get() }}
                        </div>
                        <label for="validationTooltip02" class="form-label">Armazem</label>  <br>
                        <select id="Sector4" class="position-relative form-control   bg-dark" style="width:400px;" >
                            @foreach($armazens as $armazem)
                                <option value="{{$armazem->id}}"> {{Str::upper( $armazem->nomearmazem )}}</option>
                            @endforeach
    
                        </select>
                    </div>
                    <div class="col-6  text-center position-relative">
                        <br>
                        <br>
                        <div class="d-none">
                            {{ $caixas=\App\Models\ConfCaixa::get() }}
                        </div>
                        <label for="validationTooltip02" class="form-label">Tipo de caixa</label>  <br>
                        <select id="Sector3" class="position-relative form-control   bg-dark" style="width:400px;" >
                            @foreach($caixas as $caixa)
                                <option value="{{$caixa->id}}"> {{Str::upper( $caixa->tipocaixa)}}</option>
                            @endforeach
    
                        </select>
                    </div>
                </div>
                <div class="col-md-12  text-start position-relative">
                    <br>

                    <nav>
                        <br><br>
                        <h4>Última caixa encontrada: <span id="ultimacaixaEncontrada"></span></h4>
                        <br><br>
                    </nav>
                    <nav>
                        <div class="nav nav-tabs" id="nav-tab" role="tablist">
                        <button class="nav-link active" id="nav-home-tab" data-bs-toggle="tab" data-bs-target="#nav-home" type="button" role="tab" aria-controls="nav-home" aria-selected="true">Numeração sequencial a partir da última</button>
                        <button class="nav-link" id="nav-profile-tab" data-bs-toggle="tab" data-bs-target="#nav-profile" type="button" role="tab" aria-controls="nav-profile" aria-selected="false">Numeração com intervalo</button>
                        <button class="nav-link" id="nav-contact-tab" data-bs-toggle="tab" data-bs-target="#nav-contact" type="button" role="tab" aria-controls="nav-contact" aria-selected="false">Caixa única</button> 
                        </div>
                    </nav>
                    <div class="tab-content" id="nav-tabContent">
                        <div class="tab-pane fade text-center text-dark  p-4 show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">

                          
                            <br>

                            <label for="validationTooltip02" class="form-label">Quantidade de caixas</label>  <br>
                            <label for="validationTooltip02" class="form-label resultCaixaQtd">1</label>  <br>
                            <input type="range" class="form-range" min="1" max="2000" value="1" step="1" id="quantidadeCaixa">
                            <br>
                            <button class="btn btn-sm blue-gradient  btnGotoNumeracao"  ><i class="fa fa-cog"></i> Gerar e prosseguir <i class="fa fa-angle-double-right"></i></button>

                            <br><br>  
                        </div>
                        <div class="tab-pane fade text-center text-dark   p-4" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">

                            <br> 
                            <div class="row">

                                <nav class="col-6 p-3">
                                    <label for="">Número inicial</label>
                                    <input type="number" name="" placeholder="Informe o número inicial" class="form-control" id="numeroInicialInputN2">
                                </nav>
                                <nav class="col-6 p-3">
                                    <label for="">Número final</label>
                                    <input type="number" name="" placeholder="Informe o número final" class="form-control" id="numeroFinalInputN2">
                                </nav>
                            </div>

                            <br>
                            <br>
                            

                            <button class="btn  btn-sm blue-gradient  btnGotoNumeracao2"  ><i class="fa fa-cog"></i> Gerar e prosseguir <i class="fa fa-angle-double-right"></i></button>

                            <br><br>  

                        </div>
                        <div class="tab-pane fade text-center text-dark   p-4" id="nav-contact" role="tabpanel" aria-labelledby="nav-contact-tab">

                            <br>  
                            <div class="row text-center justify-content-center">

                                <nav class="col-6 p-3 ">
                                    <label for="">Número da caixa</label>
                                    <input type="number" name="" required placeholder="Informe o número da caixa que deseja reservar" min="1"   class="form-control  "  id="numeroUnicoInput">
                                </nav>
                                 
                            </div>
                            <br><br>
                            <button class="btn  btn-sm blue-gradient   btnGotoNumeracao3" ><i class="fa fa-cog"></i> Gerar e prosseguir <i class="fa fa-angle-double-right"></i></button>

                            <br><br>  

                        </div>
                    </div>
                   
                </div>



                <div class="col-md-12  text-start position-relative">
                    <br>
                    <button class="btn btn-sm btn-outline btn-sm" onclick="stepper2.previous()"><i class="fa fa-angle-double-left"></i> Voltar </button>
                </div>
                 
                 
              </div>
              <div id="test-nl-3" role="tabpanel" class="bs-stepper-pane text-center" aria-labelledby="stepper2trigger3">
                   <div class="col-md-12  text-start position-relative">
                    <label for="">Resultado</label>
                    <hr>
                    <nav class="row">
                        <div class="col-12 text-start">
                            <h4>Quantidade de caixas: <span id="qtdCaixas"></span> cxs</h4>
                            <hr>
                            <nav class="caixasList row">

                            </nav>

                        </div>
                    </nav>
                    <hr>

                </div>

                <div class="col-md-12  text-start position-relative">
                    <br>
                    <button class="btn btn-primary btn-sm" onclick="stepper2.previous()"><i class="fa fa-angle-double-left"></i> Voltar </button>
                    <button class="btn btn-primary btn-sm btnGotoResultado"  onclick="stepper2.next()">Prosseguir <i class="fa fa-angle-double-right"></i></button>
                </div>
                <br>
                    
              </div>
              <div id="test-nl-4" role="tabpanel" class="bs-stepper-pane text-center" aria-labelledby="stepper2trigger4">
                   <div class="col-md-12  text-start position-relative">
                    <label for="">Resultado</label>
                    <hr>
                    <nav class="row">
                        <div class="col-6 text-end">
                            <ul class="list-group">
                                <li class="list-group-item">Armazém</li>
                                <li class="list-group-item">Cliente</li>
                                <li class="list-group-item">Departamento</li>
                                <li class="list-group-item">Tipo de caixa</li>
                                <li class="list-group-item">Quantidade de caixas</li>
                                <li class="list-group-item">Última caixa deste cliente</li>
                                <li class="list-group-item">Numeração das novas caixas (Início)</li>
                                <li class="list-group-item">Numeração das novas caixas (Fim)</li>
                            </ul>

                        </div>
                        <div class="col-6">
                            <ul class="list-group " id="resultadoReserva">
                                <li class="list-group-item">Cliente</li>
                                <li class="list-group-item">Departamento</li>
                                <li class="list-group-item">Tipo de caixa</li>
                                <li class="list-group-item">Quantidade de caixas</li>
                                <li class="list-group-item">Última caixa deste cliente</li>
                                <li class="list-group-item">Numeração das novas caixas (Início)</li>
                                <li class="list-group-item">Numeração das novas caixas (Fim)</li>
                            </ul>
                        </div>
                    </nav>
                    <hr>
                </div>
                <div class="col-md-12  text-start position-relative">
                    <br>
                    <button class="btn btn-primary btn-sm" onclick="stepper2.previous()"><i class="fa fa-angle-double-left "></i> Ver numeração </button>
                    <button class="btn btn-success btn-sm btnReservar" data-bs-toggle="modal" data-bs-target="#staticBackdrop"><i class="fa fa-check"></i> <i class="fa fa-box"></i> Reservar</button>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
 
  <!-- Modal -->
  <div class="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
    <div class="modal-dialog  ">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="staticBackdropLabel">Reserva</h5>
          <button type="button" class="btn-close invisible" data-bs-dismiss="modal" aria-label="Close"></button>
        </div>
        <div class="modal-body justify-content-center text-center">
            <h3 class="textoModal">FAZENDO A RESERVA...</h3> <br><br>
            <div class="d-flex justify-content-center  loadSpinner">
                <div class="spinner-border" role="status">
                </div>
            </div>
            <div class="justify-content-center d-none text-success successModalResult">
                <br>
                <i class=" fa fa-check fa-3x"></i>
                <br>
            </div>
            <div class="justify-content-center d-none text-danger errorModalResult">
                <br>
                <i class=" fa fa-times fa-3x"></i>
                <br>
            </div>
            <br><br><br>
        </div>
        {{-- <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary">Understood</button>
        </div> --}}
      </div>
    </div>
  </div>
  <button type="button" class="btn btnModal btn-primary d-none" data-bs-toggle="modal" data-bs-target="#enumerarCaixasModal">
    Launch static backdrop modal
  </button>

  <div class="modal fade" id="enumerarCaixasModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="enumerarCaixasModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-full-height modal-top" role="document">


        <div class="modal-content">
          <div class="modal-header">
            <h4 class="modal-title w-100" id="myModalLabel">ENUMERANDO CAIXAS</h4> <br>
            <label for="">Quantidade escolhida (<span class="qtdCaixas"></span>)</label> <br>
            <label for="">Quantidade enumerada (<span class="qtdCaixasEnumeradas"></span>)</label>

            {{-- <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button> --}}
            <button type="button" class="btn-close d-none btnCloseModal" data-bs-dismiss="modal" aria-label="Close"></button>

          </div>
          <div class="modal-body">
            <nav class="processingNumeration   text-center">

                    <span class="labelEnumering">

                    </span> <br> <br>
                <div class="wrapper">
                    <div class="progressbar">
                        <div class="stylization"></div>
                    </div>
                </div>
                <br>
                <br>
                <br>

            </nav>
          </div>
          <div class="modal-footer justify-content-end">

            <button class="btn btnOcorrencia btn-warning " data-dismiss="modal"> <i class="fa fa-warning"></i> Ocorrencia</button>
            <button class="btn btnCancelarNumeracao btn-secondary" data-dismiss="modal"> <i class="fa fa-times"></i> Cancelar</button>
            {{-- <button class="btn btn-primary">Save changes</button> --}}
            <button class="btn btn-bd-download blue-gradient  shadow btnFinalizarProcesso" > <i class="fa fa-sort-numeric-asc shadow"></i> Finalizar  &nbsp;&nbsp;&nbsp; <i class=" fa fa-angle-double-right animate__animated animate__infinite animate__fast animate__fadeInLeft"></i></button>

          </div>
        </div>
      </div>
  </div>

    <script>
        $(".btnOcorrencia").hide();
        var stepper2Node = document.querySelector('#stepper2')
        var stepper2 = new Stepper(document.querySelector('#stepper2'))
        console.clear();
        var qtdCx=0;
        var ultimoNumero=0;
        let caixasTotalQtd=0;
        let numInicialGeralCaixa=0;
        let numFinalGeralCaixa=0;
        
        var numeroCaixaOcorrencia=0;
        var numerosCaixasObj=[0];
        $(document).ready(function () {
            
            $(".btnReservar").hide();
            var stepper = new Stepper($('.bs-stepper')[0])
            $("#Sector").select2({
                placeholder: 'Selecione um cliente'
            });
            $("#Sector2").select2({
                placeholder: 'Selecione um departamento'
            });
            $("#Sector3").select2({
                placeholder: 'Selecione um tipo de caixa'
            });
            $("#SectorIntervaloStart").select2({
                placeholder: 'Selecione o valor de início do intervalo'
            });
            $("#SectorIntervaloEnd").select2({
                placeholder: 'Selecione o valor de fim do intervalo'
            });

            $("#SectorIniciandoPor").select2({
                placeholder: 'Escolha o número de inicialização'
            });
            $("#SectorQuantidadeCaixas").select2({
                placeholder: 'Escolha a quantidade de caixas'
            });
            $("#Sector4").select2({
                placeholder: 'Selecione um armazém'
            });

            $("#quantidadeCaixa").on("change click mousemove",function(){
                $(".resultCaixaQtd").text($(this).val());
            });

            // impedir ações nas imputs ao pressionar a tecla enter
            $("input").on("keypress keydown keyup",function(e){
                
                var key = e.keyCode || e.which;
               
                if(key==13){
                    return false;
                }
                    
                
            });
            var prosseguircliente=false;
            $(".btnGotoNumeracao3").click(function(){
                var numeroUnicoInput=$("#numeroUnicoInput").val();
                
  
                console.clear();
                
                var cliente_id= $("#Sector").val();
 
                
                $.post("{{ route('us.armazem.gestao.caixas.reserva.getEqualBoxNumber3') }}",{
                    '_token':'{{ csrf_token() }}',
                    'numerocaixa':numeroUnicoInput , 
                    'cliente_id':cliente_id,
                },function(data){

                     if(data==0){
                     
                        const Toast = Swal.mixin({
                          toast: true,
                          position: 'top-end',
                          showConfirmButton: false,
                          timer: 3000,
                          timerProgressBar: true,
                          didOpen: (toast) => {
                            toast.addEventListener('mouseenter', Swal.stopTimer)
                            toast.addEventListener('mouseleave', Swal.resumeTimer)
                          }
                        })
                        
                        Toast.fire({
                          icon: 'success',
                          title: 'Nenhum problema encontrado com a numeração.'
                        })
                        
                            $("#qtdCaixas").text(1);
                            $(".qtdCaixas").text(1); 
                            stepper2.next();
                             caixasTotalQtd=1;
                             numInicialGeralCaixa=numeroUnicoInput;
                             numFinalGeralCaixa=0;
                            $(".caixasList").empty();
                            $(".caixasList").append(" <div class=\"col m-1 p-2 text-white blue-gradient shadow\">Caixa: "+numeroUnicoInput+"</div>");
                     }else if(data==-1){
                         
                          Swal.fire({
                              icon: 'error',
                              title: 'Ocorência',
                              text: 'Informe um número válido para a caixa',
                            //   footer: '<a href="">?</a>'
                            })
                       
                         
                     }
                     else {
                         
                          Swal.fire({
                              icon: 'error',
                              title: 'Ocorência',
                              text: 'Há um problema com a caixa '+data+', já foi encontrada uma caixa com o mesmo numero no sistema',
                            //   footer: '<a href="">?</a>'
                            })
                       
                         
                     }

                }) ;
                
                 





 
                
            });

            $(".btnGotoNumeracao2").click(function(){

                var valorInicial=parseInt($("#numeroInicialInputN2").val());
                var valorFinal= parseInt($("#numeroFinalInputN2").val());
                // console.log(valorInicial);
                // console.log(valorFinal);
                if($("#numeroInicialInputN2").val()==""){
                   Swal.fire(
                        'Cometeu um erro!',
                        'Não informou qualquer valor inicial',
                        'warning'
                    )
                   
                }else if($("#numeroFinalInputN2").val()==""){
                    Swal.fire(
                        'Cometeu um erro!',
                        'Não informou qualquer valor final',
                        'warning'
                    )
                }else if(valorFinal<valorInicial){
                     Swal.fire(
                        'Cometeu um erro!',
                        'O número final é inferior ao número inicial',
                        'warning'
                    )
                }else{


                    var cliente_id= $("#Sector").val();
                    var contval=valorFinal-valorInicial;
                    if(contval==0) contval=1;
                    var  passarCadT2=true;
                    let timerInterval
                    Swal.fire({
                    title: 'Aguarde um pouco!',
                    html: 'Enquanto verificamos as redundâncias <b></b>.',
                    timer: 2000,
                    timerProgressBar: true,
                    didOpen: () => {
                        Swal.showLoading()
                        timerInterval = setInterval(() => {
                        const content = Swal.getContent()
                        if (content) {
                            const b = content.querySelector('b')
                            if (b) {
                            b.textContent = Swal.getTimerLeft()
                            }
                        }
                        }, 100)
                    },
                    willClose: () => {
                        clearInterval(timerInterval)
                    }
                    }).then((result) => {
                        /* Read more about handling dismissals below */
                        if (result.dismiss === Swal.DismissReason.timer) {

                        }
                    })

                    $.post("{{ route('us.armazem.gestao.caixas.reserva.getEqualBoxNumber2') }}",{
                        '_token':'{{ csrf_token() }}',
                        'cliente_id':cliente_id,
                        'numerocaixa':valorInicial,
                        'quantidade':contval,
                    },function(data){
                        Swal.fire(
                            'Ola'+data,

                        )
                        if (data>0){
                            Swal.fire(
                            'Encontramos um probleminha com a caixa número \"'+data+'\"',
                            'Este cliente já tem uma caixa com o número '+data+' armazenada no sistema. Não podemos duplica-la',
                            'error'
                            )
                        }else{
                            Swal.fire({

                            title:'Parabéns',
                            text:'Nenhum problema encontrado',
                            icon: 'success',
                            confirmButtonColor: '#3085d6',
                            cancelButtonColor: '#d33',
                            confirmButtonText: 'Ok, Prosseguir!',
                            }
                            ).then((result) => {
                                if (result.isConfirmed) {
                                     
                                    $("#qtdCaixas").text(contval+1);
                                    $(".qtdCaixas").text(contval+1);      
                                    caixasTotalQtd=contval+1;
                                    numInicialGeralCaixa=valorInicial;
                                    numFinalGeralCaixa=valorInicial;
                                    $(".caixasList").empty();
                                    let valorAdd=numInicialGeralCaixa;
                                    valorAdd-1;
                                    for(var j=1; j<=caixasTotalQtd;j++){
                                        
                                        $(".caixasList").append(" <div class=\"col m-1 p-2 text-white blue-gradient shadow\">("+j+") Caixa: "+valorAdd+"</div>");valorAdd++;
                                    }
                                    stepper2.next();
                                    
                                  
                                }
                            })
                        }
                         
                    });



                }
            });

            $(".btnProsseguirCliente").click(function(){
                if(prosseguircliente){
                    var cliente_id= $("#Sector").val();

                    $.post("{{ route('us.armazem.gestao.caixas.reserva.getUltimoNumeroCaixa') }}",{
                        '_token':'{{ csrf_token() }}',
                        'cliente_id':cliente_id,
                    },function(data){

                        $("#ultimacaixaEncontrada").text(data)

                        ultimoNumero=parseInt(data) ;
                        
                        stepper2.next();
                    });
                }
                else{
                }
            });

            $(".btnGotoNumeracao").click(function(){
                var qtdCxEscolhida=$("#quantidadeCaixa").val();
                $("#qtdCaixas").text(qtdCxEscolhida);
                $(".qtdCaixas").text(qtdCxEscolhida);
  
                console.clear();
                numerosCaixasObj=[];
               
                
                var cliente_id= $("#Sector").val();

                var numeroAdd=ultimoNumero;
                
                $.post("{{ route('us.armazem.gestao.caixas.reserva.getEqualBoxNumber') }}",{
                    '_token':'{{ csrf_token() }}',
                    'caixaactual':numeroAdd ,
                    'qtdCxEscolhida':qtdCxEscolhida,
                    'cliente_id':cliente_id,
                },function(data){

                     if(data==0){
                     
                        const Toast = Swal.mixin({
                          toast: true,
                          position: 'top-end',
                          showConfirmButton: false,
                          timer: 3000,
                          timerProgressBar: true,
                          didOpen: (toast) => {
                            toast.addEventListener('mouseenter', Swal.stopTimer)
                            toast.addEventListener('mouseleave', Swal.resumeTimer)
                          }
                        })
                        
                        Toast.fire({
                          icon: 'success',
                          title: 'Nenhum problema encontrado com a numeração.'
                        })
                         caixasTotalQtd=qtdCxEscolhida;
                         numInicialGeralCaixa=numeroAdd+1;
                         numFinalGeralCaixa=0;
                         let valorAdd=numeroAdd+1;
                         $(".caixasList").empty();
                         for(var j=1; j<=qtdCxEscolhida;j++){
                            
                            $(".caixasList").append(" <div class=\"col m-1 p-2 text-white blue-gradient shadow\">("+j+") Caixa: "+valorAdd+"</div>");valorAdd++;
                         }
                         stepper2.next();
                     }else{
                         
                          Swal.fire({
                              icon: 'error',
                              title: 'Ocorência',
                              text: 'Há um problema com a caixa '+data+', já foi encontrada uma caixa com o mesmo numero no sistema',
                            //   footer: '<a href="">?</a>'
                            })
                       
                         
                     }

                }) ;
                
                 





 
                
            });
            $(".btnCancelarNumeracao").click(function(){
                $(".btn-close").click();
               
                var qtdCxEscolhida=$("#quantidadeCaixa").val();

            });
            $(".btnFinalizarProcesso").click(function(){
                $(".btn-close").click();

            });




            $("#Sector").on("change mousemove click mouseover",function(){
                var valoractual=$(this).val();
                if (valoractual>0){
                    $("#Sector2").empty();
                    $.post("{{ route('us.armazem.gestao.caixas.reserva.getDepartamentosClientes') }}",{
                        '_token':'{{ csrf_token() }}',
                        'cliente_id':valoractual
                    },function(data){
                        $("#Sector2").append("<option value='0'>Selecione o departamento</option>");
                        $("#Sector2").append(data);
                        // console.log(data);


                    });
                }else{


                }
                $(".btnProsseguirCliente").addClass("disabled");
                    prosseguircliente=false;
            });
            $("#Sector2").on("change mousemove click mouseover",function(){
                var valoractual=$(this).val();
                if (valoractual>0){
                    prosseguircliente=true;
                    $(".btnProsseguirCliente").removeClass("disabled");
                }else{
                    $(".btnProsseguirCliente").addClass("disabled");
                    prosseguircliente=false;

                }
            });
            $(".btnGotoResultado").click(function(){
                var valoractual = $("#Sector2").val();
                var configCaixa = $("#Sector3").val();
                var qtdCaixa=caixasTotalQtd;
                var idArmazem=$("#Sector4").val();
                var valInicial=numInicialGeralCaixa;
                                    
                $("#resultadoReserva").empty();
                $.post("{{ route('us.armazem.gestao.caixas.reserva.getResultado') }}",{
                        '_token':'{{ csrf_token() }}',
                        'depCli_id':valoractual,
                        'configCaixa_id':configCaixa,
                        'idArmazem':idArmazem,
                        'qtdCaixa':qtdCaixa,
                        'valInicial':valInicial,
                    },function(data){
                        // console.log(data);
                        $("#resultadoReserva").append(data);
                        $(".btnReservar").show();
                });

            });

            $(".btnReservar").click(function(){
                var valoractual = $("#Sector2").val();
                var configCaixa = $("#Sector3").val();
                var departamento = $("#Sector2").val();
                $(".btnReservar").hide();
                 
                var idArmazem=$("#Sector4").val();
                var numerosCaixa=JSON.parse(JSON.stringify(numerosCaixasObj));
                // console.log(numerosCaixa)
                
                var qtdCaixa=caixasTotalQtd;
                var valInicial=numInicialGeralCaixa;
                $.post("{{ route('us.armazem.gestao.caixas.reservar') }}",{
                        '_token':'{{ csrf_token() }}',
                        'depCli_id':valoractual,
                        'configCaixa_id':configCaixa,
                        'idArmazem':idArmazem,
                        'qtdCaixa':qtdCaixa,
                        'departamento':departamento,
                        'valInicial':valInicial,
                    },function(data){
                        console.log(data);

                        if (data==1){
                            $(".textoModal").text("RESERVA REALIZADA COM SUCESSO");
                            $(".loadSpinner").addClass('d-none');
                            $(".successModalResult").removeClass('d-none');
                            $(this).animate({
                                value: "3"

                            }, 3000, function() {

                                $(".btn-close").click();

                                window.location.replace("{{ route('us.armazem.gestao.caixas.ver.reservas') }}");

                                $(".successModalResult").addClass('d-none');
                                $(".errorModalResult").addClass('d-none');
                                $(".loadSpinner").removeClass('d-none');
                                $(".textoModal").text("FAZENDO A RESERVA...");

                            });
                        }
                       else{
                            $(".textoModal").text("RESERVA NÃO REALIZADA");
                                $(".loadSpinner").addClass('d-none');
                                $(".errorModalResult").removeClass('d-none');
                            $(this).animate({
                                    value: "3"

                                }, 3000, function() {

                                    $(".btn-close").click();
                                    $(".successModalResult").addClass('d-none');
                                    $(".errorModalResult").addClass('d-none');
                                    $(".loadSpinner").removeClass('d-none');
                                    $(".textoModal").text("FAZENDO A RESERVA...");

                            });
                       }
                        // console.log(data);
                });
            });
        })


    </script>
@endsection