@extends('adminlte.app')

@section('content')
    <div class="content-wrapper pb-3">

        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                <h1 class="m-0">Cliente</h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
                
                </div><!-- /.col -->
            </div><!-- /.row -->
            </div><!-- /.container-fluid -->
        </div>
        <!-- /.content-header -->
      
        @if ($message = Session::get('success'))
            <div class="alert alert-success">
                <p>{{ $message }}</p>
            </div>
        @elseif($message = Session::get('danger'))
                <div class="alert alert-danger">
                    <p>{{ $message }}</p>
                </div>
        @endif

        <div class="card mx-3 mt-3">
            
            <div class="card-header ">
                <div class="row">
                    <div class="col-md-6">
                        Novo Relacionamento 
                    </div>
                    <div class="col-md-6 text-right">
                        
                        <a href="javascript:history.back()"><button type="button" id="voltar" class="btn btn-primary d-print-none">Voltar</button></a>
                    </div>
                </div>
            </div>

            <script>
                function copiarTexto() {
                    textoCopiado = document.getElementById("link");
                    textoCopiado.select();
                    document.execCommand("Copy");
                    alert("Link copiado: " + textoCopiado.value);
                }
            </script>
            <script>
                $(document).ready(function(){
                    document.getElementById("link").value = window.location.href;
                });
            </script>
 
            <form action="/relacionamento" method="POST" id="formclientes" class="pt-4" enctype="multipart/form-data">
                @csrf
                <input id="cliente_id" type="text" class="form-control d-none @error('cliente_id') is-invalid @enderror" name="cliente_id" value="{{ old('cliente_id') ?? $cliente->id ?? ""  }}" required autofocus>

                <div class="pl-2 pb-2 ml-3 mt-3 mr-3 bg-dark text-white">
                    Dados do Cliente - {{$cliente->id}} <br>
                    {{-- <input type="text" id="link" name="link"> <button type="button" class ="btn btn-primary pull-right" onClick="copiarTexto()" title="Copiar Link"><i class="fas fa-link"></i></button> --}}
                    <div class="input-group">
                        <div class="input-group-append">
                            <button type="button" class="btn btn-dark pull-right" onclick="copiarTexto()" title="Copiar Link"><i class="fas fa-link"></i></button>
                        </div>
                        <input type="text" style="font-size: 11px" id="link" name="link" class="form-control border-dark bg-dark pl-0 ml-0">
                    </div>

                </div>

            
                <div  class="border pt-3 pl-3 pr-3 ml-3 mr-3 mb-3 bg-light ">
                    <div style="font-size: 11px" >
                        <div  class="form-group row pd-1">
                            <div class="col-md-2 pt-3">
                                Nome : <br> <strong>{{$cliente->nome}}</strong>
                            </div>
                            <div class="col-md-2 pt-3">
                                Telefone : <br><strong> {{$cliente->telefone}}</strong>
                            </div>
                            <div class="col-md-2 pt-3">
                                Telemóvel : <br><strong> {{$cliente->telemovel}}</strong>
                            </div>
                            <div class="col-md-2 pt-3">
                                E-mail : <br> <strong>{{$cliente->email_cliente}}</strong>
                            </div>
                        
                        </div>
                        <div  class="form-group row pd-1">
                            <div class="col-md-2 pt-3">
                                TFuel - Plafond : <br> <strong>{{$cliente->tfuel_plafond}}</strong>
                            </div>
                            <div class="col-md-2 pt-3">
                                IM - Plafond : <br><strong> {{$cliente->im_plafond}}</strong>
                            </div>
                        
                        </div>
                    </div>
                </div>


                <div id="createvalorleads" class="row">
                    <div class="col-12">
                        <div class="pl-3 ml-3 mr-3 bg-dark text-white">
                            Dados Relacionamento
                        </div>
                        <div class="border pt-3 ml-3 mr-3 mb-3 bg-light ">

                            {{-- <div class="form-group row mb-0 pl-3 pr-3">
                                <div class="col-md-12">
                                    
                                    <button type="button" id="primeiro_contato" class="btn btn-primary d-print-none " onclick="func_primeiro_contato()"   >Primeiro contato</button>
                                    <button id="resgate" class="btn btn-primary d-print-none ml-3" onclick="document.getElementById('whatsapp').value ='2' , window.open('https://api.whatsapp.com/send?phone=55{{$cel_tratado}}&text=Olá%20{{$cliente_nome}},%20aqui%20é%20{{$vendedor}}%20da%20Grid%20Tie%20Solar.%20Você%20nos%20pediu%20um%20orçamento%20há%20algum%20tempo.%20E%20ai,%20vamos%20continuar%20com%20o%20projeto?', '_blank') ">Resgate</button>
                                    <button id="followup" class="btn btn-primary d-print-none ml-3" onclick="document.getElementById('whatsapp').value ='3' , window.open('https://api.whatsapp.com/send?phone=55{{$cel_tratado}}&text=Olá%20{{$cliente_nome}},%20aqui%20é%20{{$vendedor}}%20da%20Grid%20Tie%20Solar.%20Você%20recebeu%20nossa%20proposta.%20%20O%20que%20achou?', '_blank') ">FollowUp</button>
                                    <input id="whatsapp" type="number" class="form-control @error('whatsapp') is-invalid @enderror d-none" name="whatsapp"  value="{{ old('whatsapp') ?? 0  }}"  >   
                                </div>
                            </div>    --}}

                            {{-- <script>
                                function func_primeiro_contato(){
                                    document.getElementById('whatsapp').value ='1';
                                    document.getElementById('form').submit();
                                
                                window.open('https://api.whatsapp.com/send?phone=55{{$cel_tratado}}&text=Olá%20{{$cliente_nome}},%20aqui%20é%20{{$vendedor}}%20da%20Grid%20Tie%20Solar.%20Você%20nos%20solicitou%20um%20orçamento%20de%20energia%20solar%20e%20será%20um%20prazer%20atendê-lo.%20Você%20já%20sabe%20como%20funciona?', '_blank');
                                };
                            </script> --}}
                            <div class="form-group row mb-0 pl-3 pr-3">
                                    
                                <div class="col-md-3">
                                    <label for="data_interacao" class="col-form-label" style="text-align: center">Data Interação</label>
                                    <input id="data_interacao" max="{{date('Y-m-d')}}" type="date" class="form-control @error('data_interacao') is-invalid @enderror" name="data_interacao"  value="{{ old('data_interacao') ?? date('Y-m-d') ?? ""  }}" required autofocus>
                                    @error('data_interacao')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                    
                                </div>

                                <div class="col-md-3">
                                    <label for="tipo_interacao" class="col-form-label" style="text-align: center">Tipo de Interação</label>
                                    <select class="form-control"  name="tipo_interacao" id="tipo_interacao">

                                        
                                        <option value="Ligação">Ligação</option>
                                        <option value="Visita">Visita</option>
                                        {{-- <option value="Enviar extrato pendentes">Enviar extrato pendentes</option> --}}
                                        <option @if($tipo_interacao == "Promessa de Pagamento") selected @endif value="Promessa de Pagamento">Promessa de Pagamento</option>
                                        <option @if($tipo_interacao == "Pagamento") selected @endif value="Pagamento">Pagamento</option>
                                            
                                    </select>
                                    
                                </div>

                                <div class="col-md-3 d-none" id="div_data_promessa_pagamento">
                                    <label for="data_promessa_pagamento" class="col-form-label" style="text-align: center">Data Promessa de Pagamento</label>
                                    <input id="data_promessa_pagamento" type="date" class="form-control @error('data_promessa_pagamento') is-invalid @enderror" name="data_promessa_pagamento" value="{{ old('data_promessa_pagamento') ??  date('Y-m-d') ?? ""  }}"  autofocus>
                                    @error('data_promessa_pagamento')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror

                                </div>

                                    
                                <div class="col-md-3 d-none" id="div_prorrogar_seguro_credito">
                                    <label for="prorrogar_seguro_credito" class="col-form-label" style="text-align: center">Prorrogar Seguro de Crédito</label>
                                    <select class="form-control"  name="prorrogar_seguro_credito" id="prorrogar_seguro_credito">

                                        <option></option>
                                        <option value="Sim">Sim</option>
                                        <option value="Não">Não</option>
                                        
                                    </select>
                                    
                                </div>

                                <div class="col-md-4 d-none" id="anexos_2">
                                    <label for="fileanexo2" id="label_fileanexo2" class="col-form-label ">Cheque/agendamento de Transferência Bancária</label><br>
                                    <input id='fileanexo2' type="file" name="image2[]" > 
                                    <div class="progress mb-2 mt-2 position-relative">
                                        {{-- <div class="progress-bar" style="background-color: #B4F5B4; width:0%; height:25px; border-radius: 3px;"></div > --}}
                                        <div class="progress-bar" id="progress-bar2"></div>
                                        <div class="percent py-2" id="percent2" style="position:absolute; display:inline; left:48%; color: #000000;">0%</div >
                                    </div>
                                    <input type="hidden" name="controle_anexo2" id="controle_anexo2" value="0">
                                    <button type="button" id="carregar2" class="btn btn-primary pull-right">CARREGAR</button>
                                    <button type="button" id="limpar_anexo2" class="btn btn-primary d-none pull-right">LIMPAR</button>
                                </div>


                                <div class="col-md-3" id="div_forma_pagamento">
                                    <label for="forma_pagamento" class="col-form-label" style="text-align: center">Forma de Pagamento</label>
                                    <select class="form-control" name="forma_pagamento" id="forma_pagamento" required>
                                        <option value=""></option>
                                        @foreach ($formas_pagamentos as  $forma)
                                            <option value="{{ $forma->id }}">{{ $forma->nome_forma_pagamento }}</option>
                                        @endforeach
                                    </select>
                                </div>


                                <div class="col-md-3" id="div_data_proxima_interacao">
                                    <label for="data_proxima_interacao" class="col-form-label" style="text-align: center">Data Próxima Interação</label>
                                    <input id="data_proxima_interacao" type="date" class="form-control @error('data_proxima_interacao') is-invalid @enderror" name="data_proxima_interacao" value="{{ old('data_proxima_interacao') ??  date('Y-m-d') ?? ""  }}" required autofocus>
                                    @error('data_proxima_interacao')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                    {{-- @if($cliente->data_proxima_interacao!= "")
                                        <span style="font-size: 9px">Mínimo {{$cliente->data_proxima_interacao}}</span>
                                    @endif --}}
                                </div>

        
                                <div class="col-md-4 d-none" id="anexos">
                                    <label for="fileanexo" id="label_cnh" class="col-form-label ">Comprovativo</label><br>
                                    <input id='fileanexo' type="file" name="image1[]" >
                                    <div class="progress mb-2 mt-2 position-relative">
                                        {{-- <div class="progress-bar" style="background-color: #B4F5B4; width:0%; height:25px; border-radius: 3px;"></div > --}}
                                        <div class="progress-bar" id="progress-bar1"></div>
                                        <div class="percent py-2" id="percent1" style="position:absolute; display:inline; left:48%; color: #000000;">0%</div >
                                    </div>
                                    <input type="hidden" name="controle_anexo" id="controle_anexo" value="0">
                                    <button type="button" id="carregar" class="btn btn-primary pull-right">CARREGAR</button>
                                    <button type="button" id="limpar_anexo" class="btn btn-primary d-none pull-right">LIMPAR</button>
                                </div>

                            </div>

                            <div class="row pl-3 ml-3 pb-0 pt-0 mt-3 mr-3 bg-dark text-white">
                                <div class="col-sm-12">
                                    Associar Fatura
                                </div> 
                    
                            </div>
            
                            <div class="border pt-3 ml-3 mr-3 mb-3 bg-light ">
                                <div class="form-group row mb-0 pl-3 pr-3">
                                    <div class="col-md-2">
                                        <button type="button" id="chama_modal" class="btn btn-primary"data-toggle="modal" data-target="#modal_mao_obra" >Adicionar Faturas</button>
                                    </div>
                                    
                                </div>  
            
                                <div class="form-group row pl-3 pr-3 d-none">   
                                    <div class="col-md-2 input-group mb-3">
                                        <input id="mao__obras_id" type="text" class=" pr-0 form-control @error('mao__obras_id') is-invalid @enderror" name="mao__obras_id" value="{{ old('mao__obras_id') }}" autocomplete="mao__obras_id"  readonly>
                                                
                                        @error('mao__obras_id')
                                            <span class="invalid-feedback" role="alert">
                                                <strong>{{ $message }}</strong>
                                            </span>
                                        @enderror
                                        <!-- Button trigger modal -->
                                        <div class="input-group-append">
                                            <button type="button" class="btn btn-outline-secondary"data-toggle="modal" data-target="#modal_mao_obra" >...</button>
                                        </div>
                                    
                                        
                                
                                    </div>
                                            
                                    <div class="col-md-6">
                                        <input id="faturas_id" type="text" class="form-control @error('faturas_id') is-invalid @enderror" name="faturas_id" value="{{ old('faturas_id') }}"  autocomplete="faturas_id" readonly >
                                            
                                            @error('faturas_id')
                                                <span class="invalid-feedback" role="alert">
                                                    <strong>{{ $message }}</strong>
                                                </span>
                                            @enderror
                                    </div>
                            
                                    <div class="col-md-2">
                                        <input id="canal" type="text" class="form-control @error('canal') is-invalid @enderror" name="canal" value="{{ old('canal') }}"  autocomplete="canal"  readonly>
                                        <input id="num_documento" type="text" class="form-control @error('num_documento') is-invalid @enderror" name="num_documento" value="{{ old('num_documento') }}"  autocomplete="num_documento"  readonly>
                                        <input id="valor_total" type="text" class="form-control @error('valor_total') is-invalid @enderror" name="valor_total" value="{{ old('valor_total') }}"  autocomplete="valor_total"  readonly>
                                        <input id="dt_emissao" type="text" class="form-control @error('dt_emissao') is-invalid @enderror" name="dt_emissao" value="{{ old('dt_emissao') }}"  autocomplete="dt_emissao"  readonly>
                                        <input id="dt_vencimento" type="text" class="form-control @error('dt_vencimento') is-invalid @enderror" name="dt_vencimento" value="{{ old('dt_vencimento') }}"  autocomplete="dt_vencimento"  readonly>
                                        <input id="status" type="text" class="form-control @error('status') is-invalid @enderror" name="status" value="{{ old('status') }}"  autocomplete="status"  readonly>
                                        <input id="fatura_origem" type="text" class="form-control @error('fatura_origem') is-invalid @enderror" name="fatura_origem" value="{{ old('fatura_origem') }}"  autocomplete="fatura_origem"  readonly>
                                        <input id="seguro_credito_cliente" type="text" class="form-control @error('seguro_credito_cliente') is-invalid @enderror" name="seguro_credito_cliente" value="{{ old('seguro_credito_cliente') }}"  autocomplete="seguro_credito_cliente"  readonly>
                                    </div>
                                </div>
                                <div class="form-group row  pl-3 pr-3">
                                        <div class="col-md-10">
                                            <span id="linha" class="d-none">0</span> 
                                            <input id="linhas_mo" type="text" class="form-control d-none" value="0" name="linhas_mo">
                                        </div>
                                        <!-- <div class="col-md-2">
                                            <button onclick="addTabelaMaoObra()" type="button" class="btn btn-primary rounded mx-auto d-block">Adicionar</button>   
                                        </div> -->
                                </div>  

                                <script>

                                    function func_seguro_credito(){
                                        if($('#fatura_origem').val()=="TFUEL" ){

                                            $('#seguro_credito_cliente').val({{$cliente->tfuel_plafond}});
                                        }else{
                                            $('#seguro_credito_cliente').val({{$cliente->im_plafond}});

                                        }   
                                        
                                        if("{{$data_limite_seguro}}"!=null && $('#seguro_credito_cliente').val() > 0){        
                                            if($('#data_promessa_pagamento').val() > "{{$data_limite_seguro}}"){
                                        
                                                $('#prorrogar_seguro_credito').val("Sim");

                                            }
                                        }                                
                                    }

                                </script>
            
                                <script>
            
                                    var check_mao = [];
            
            
                                    function addTabelaMaoObra(){
            
                                        if (!check_mao.includes(document.getElementById('faturas_id').value)){
                                            check_mao.push(document.getElementById('faturas_id').value);

                                        

            
                                            var tabelaRef = document.getElementById('tabela_mao_obra');
                                            var newRow = tabelaRef.insertRow();
                                            
                                            var btn = document.createElement("BUTTON");
                                            var txt_id = document.createElement("INPUT");
                                            var txt_canal = document.createElement("INPUT");
                                            var txt_num_documento = document.createElement("INPUT");
                                            var txt_valor_total = document.createElement("INPUT");
                                            var txt_dt_emissao = document.createElement("INPUT");
                                            var txt_dt_vencimento = document.createElement("INPUT");
                                            var txt_status = document.createElement("INPUT");
                        
                
                                            document.getElementById('linha').innerHTML = parseFloat(document.getElementById('linha').innerHTML) + 1;
                                            linha= document.getElementById('linha').innerHTML;   
                
                                            txt_id.id= "mao_id" + linha;
                                            txt_id.style="width: 50px; border:0; box-shadow: none;";
                                            txt_id.setAttribute("class","bg-light");
                                            txt_id.setAttribute("readonly","");
                                            txt_id.setAttribute("name", "id" + linha);
                
                                            txt_canal.id="canal" + linha;
                                            txt_canal.style="border:0; box-shadow: none;";
                                            txt_canal.setAttribute("class", "bg-light form-control");
                                            txt_canal.setAttribute("readonly","");
                                            txt_canal.setAttribute("name", "canal" + linha);
                
                                            txt_num_documento.id="num_documento" + linha;
                                            txt_num_documento.style="border:0; box-shadow: none;";
                                            txt_num_documento.setAttribute("class", "bg-light form-control");
                                            txt_num_documento.setAttribute("readonly","");
                                            txt_num_documento.setAttribute("name", "num_documento" + linha);

                                            txt_valor_total.id="valor_total" + linha;
                                            txt_valor_total.style="border:0; box-shadow: none;";
                                            txt_valor_total.setAttribute("class", "bg-light form-control");
                                            txt_valor_total.setAttribute("readonly","");
                                            txt_valor_total.setAttribute("name", "valor_total" + linha);

                                            txt_dt_emissao.id="dt_emissao" + linha;
                                            txt_dt_emissao.style="border:0; box-shadow: none;";
                                            txt_dt_emissao.setAttribute("class", "bg-light form-control");
                                            txt_dt_emissao.setAttribute("readonly","");
                                            txt_dt_emissao.setAttribute("name", "dt_emissao" + linha);

                                            txt_dt_vencimento.id="dt_vencimento" + linha;
                                            txt_dt_vencimento.style="border:0; box-shadow: none;";
                                            txt_dt_vencimento.setAttribute("class", "bg-light form-control");
                                            txt_dt_vencimento.setAttribute("readonly","");
                                            txt_dt_vencimento.setAttribute("name", "dt_vencimento" + linha);

                                            txt_status.id="status" + linha;
                                            txt_status.style="border:0; box-shadow: none;";
                                            txt_status.setAttribute("class", "bg-light form-control");
                                            txt_status.setAttribute("readonly","");
                                            txt_status.setAttribute("name", "status" + linha);
                
                                            
                
                                            btn.innerHTML = "Remover";
                                            btn.className = "btn btn-outline-secondary";
                                            btn.type = "button";
                
                                            var c0 = newRow.insertCell(0);
                                            var c1 = newRow.insertCell(1);
                                            var c2 = newRow.insertCell(2);
                                            var c3 = newRow.insertCell(3);
                                            var c4 = newRow.insertCell(4);
                                            var c5 = newRow.insertCell(5);
                                            var c6 = newRow.insertCell(6);
                                            var c7 = newRow.insertCell(7);
                
                                            c0.appendChild(txt_id);
                                            txt_id.value = document.getElementById('faturas_id').value;
                                            
                                            c1.appendChild(txt_canal);
                                            txt_canal.value = document.getElementById('canal').value;

                                            c2.appendChild(txt_num_documento);
                                            txt_num_documento.value = document.getElementById('num_documento').value;

                                            c3.appendChild(txt_valor_total);
                                            txt_valor_total.value = document.getElementById('valor_total').value;
                
                                            c4.appendChild(txt_dt_emissao);
                                            txt_dt_emissao.value = document.getElementById('dt_emissao').value;

                                            c5.appendChild(txt_dt_vencimento);
                                            txt_dt_vencimento.value = document.getElementById('dt_vencimento').value;  
                                            
                                            
                                            c6.appendChild(txt_status);
                                            txt_status.value = document.getElementById('status').value; 

                                            c7.appendChild(btn);
                
                                            linha = newRow.rowIndex - 1;
                
                                            btn.setAttribute("onclick", "deleteRowMaoObra(this.parentNode.parentNode.rowIndex-1);");

                                            $('#fatura-linha' + txt_id.value).addClass('d-none');
                
                                            document.getElementById('linhas_mo').value = document.getElementById("tabela_mao_obra").rows.length;
                                            
                                        };
                                    };
            
                                    function deleteRowMaoObra(i){
            
                                        a = document.getElementById('tabela_mao_obra').rows[i].cells[0].firstChild.value;
                                        index = check_mao.indexOf(a);
                                        check_mao.splice(index, 1);
                                        document.getElementById('tabela_mao_obra').deleteRow(i);
                                        document.getElementById('linhas_mo').value = document.getElementById("tabela_mao_obra").rows.length;

                                        $('#fatura-linha' + a).removeClass('d-none');

            
                                    };
            
            
                                </script>
            
                                <div class="row mb-3 pl-3 pr-3">
                                    <div class="table-responsive">
                                        <table  class="table table-bordered">
                                            <thead>
                                                <tr>
                                                    <th>ID</th>
                                                    <th>Canal</th>
                                                
                                                    <th>Fatura</th>
                                                    <th>Valor</th>
                                                    <th>Emissão</th>
                                                    <th>Vencimento</th>
                                                    <th>Status</th>

                                                <th>Remover</th>
                                                </tr>
                                            </thead>
                                            <tbody id="tabela_mao_obra">
                                            
                                            </tbody>
                                                
                                        </table>
                                    </div>
                                </div>  
            
                            </div>

                            <div class="form-group row mb-0 pl-3 pr-3">

                                <div class="col-md-12">
                                    <label for="descricao_interacao" class="col-form-label" style="text-align: center">Descrição da Interação</label>
                                    <textarea class="form-control" id="descricao_interacao"  name="descricao_interacao" rows="3" value="{{ old('descricao_interacao') ?? ""  }}"></textarea>
                                    @error('descricao_interacao')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                    
                                </div>
            
                            </div>
                            

                        
                            <div class="row pt-2 pb-3">
                                <button onclick="return func_verifica_anexos()"  class="btn btn-primary rounded mx-auto d-block">Cadastrar</button>
                            </div>
                            <script>                                           
                                function func_verifica_anexos( ){
                                
                                    var tipo_interacao = $("#tipo_interacao");
                                    var linhas_mo = $('#linhas_mo');
                                    var controle_anexo = $('#controle_anexo')
                                    var controle_anexo2 = $('#controle_anexo2')
                                    var prorrogar_seguro_credito = $('#prorrogar_seguro_credito')

            
                                    if (tipo_interacao.val() == "Pagamento") {
                                        
                                        if (controle_anexo.val()!=1)  {
                                            
                                            alert('O Comprovativo é obrigatório' );
                                            return false;
                                        }
                                        
                                        if (linhas_mo.val()==0)  {
                                            alert('É obrigatório associar pelo menos uma fatura' );
                                            return false;
                                        }
                    
                                    }

                                    if (tipo_interacao.val() == "Promessa de Pagamento") {
                                        
                                    
                                        if (prorrogar_seguro_credito.val()=="")  {
                                            alert('É obrigatório informar Prorrogar Seguro de Crédito Sim ou Não' );
                                            return false;
                                        }

                                        if (prorrogar_seguro_credito.val()=="Sim")  {
                                            if (controle_anexo2.val()!=1)  {
                                            
                                            alert('Cheque/agendamento de Transferência Bancária é obrigatório' );
                                            return false;
                                            }                                      
                                            
                                            
                                        }

                                        
                                        if (linhas_mo.val()==0)  {
                                            alert('É obrigatório associar pelo menos uma fatura' );
                                            return false;
                                        }

                    
                                    }
                    
                    
                                    
                                }
                            </script>
                        </div>
                    </div>
                </div>
                <input type="hidden" name="limpaanexo" id="limpaanexo">
            </form>
            
            <div class="px-3 pb-1">
                <br>
                <div class="table-responsive">
                    <table id="tabelashownao" class="table table-striped table-bordered table-hover">
                        <thead>
                            <tr>
                                <th style="width: 100px">Ações</th>
                            
                                <th><div style="width: 150px;">Data Interação</div></th>
                                <th><div style="width: 150px;">Próxima Interação</div></th>
                                <th><div style="width: 150px;">Tipo Interação</div></th>
                                <th><div style="width: 150px;">Descrição Interação</div></th>
                                <th><div style="width: 150px;">Usuário da Interação</div></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($registro_relacionamento as $fatura)
                                <tr>
                                    <td class="d-flex" align="center">
                                        <button title="Exibir faturas associadas" type="button" class="mr-1 btn btn-sm btn-primary" data-toggle="collapse" data-target=".cliente_{{ $loop->index }}" onclick="ativarLinha('{{ $loop->index }}')">
                                            <i class="fas fa-bars"></i>
                                        </button>
                                        {{-- 
                                            <form method="GET" action="/relacionamento/{{ $fatura->id }}/edit">
                                                <button class="btn btn-success btn-sm" type="submit"><i class="fas fa-pencil-alt" title="Editar" aria-hidden="true"></i></button>
                                            </form> 
                                        --}}
                                        <form method="POST" onclick="return confirm('Deseja realmente excluir o relacionamento?')" action="/relacionamento/{{ $fatura->id }}">
                                            @csrf
                                            @method('DELETE')
                                            <button class="btn btn-danger ml-1 btn-sm" type="submit"><i class="fa fa-trash" title="Excluir" aria-hidden="true"></i></button>
                                        </form>
                                    </td>
                                    <td><span style="display:none;">{{$fatura->data_interacao}}  -   </span>   {{ date( 'd', strtotime( $fatura->data_interacao ) ).'/'.date( 'm', strtotime( $fatura->data_interacao ) ).'/'.date( 'Y', strtotime( $fatura->data_interacao ) )}}</td>
                                    <td><span style="display:none;">{{$fatura->data_proxima_interacao}}  -   </span>   {{ date( 'd', strtotime( $fatura->data_proxima_interacao ) ).'/'.date( 'm', strtotime( $fatura->data_proxima_interacao ) ).'/'.date( 'Y', strtotime( $fatura->data_proxima_interacao ) )}}</td>
                                    <td>{{$fatura->tipo_interacao }}</td>
                                    <td>{{$fatura->descricao_interacao }}</td>
                                    <td> {{  $vendedor_interacao[$fatura->user_id]->name}} </td>
                                </tr>
                                <tr class="cliente_{{ $loop->index }} collapse out ">
                                    <td colspan="100%" class="px-0">
                                        <table class="table table-bordered">
                                            <thead>
                                                <tr class="bg-dark">
                                                
                                                    <th>Canal</th>
                                                    <th>Fatura</th>
                                                    <th>Valor</th>
                                                    {{-- <th>Mvalor</th> --}}
                                                    <th>Emissão</th>
                                                    <th>Vencimento</th>
                                                    <th>Idade</th>
                                                    <th>Vencido</th>
                                                    <th>Atraso</th>
                                                    <th>Status</th>
                                                    <th>Data Promessa de Pagamento</th>
                                                    <th>Anexo Promessa de Pagamento</th>
                                                    <th>Comprovativo</th>

                                                </tr>
                                            </thead>
                                            <tbody>
                                                @foreach ($faturas as $item)
                                                    @if($fatura->faturas_id != null)
                                                        {{-- @if (in_array($item->id, $fatura->faturas_id ) ) --}}
                                                        @if(str_contains($fatura->faturas_id,$item->faturas_id))
                                                        <tr>
                                                            
                                                            <td>@if(isset($item->canal->nome_canal)){{ $item->canal->nome_canal }}@endif</td>
                                                            <td>{{ $item->num_documento }}</td>
                                                            <td>{{ number_format($item->valor_total, 2, ',', '.') }}</td>
                                                            {{--<td>
                                                                Perguntar o que é mvalor, se é calculado 
                                                            </td>--}}
                                                            <td>{{ date('d/m/Y', strtotime($item->dt_emissao)) }}</td>
                                                            <td>{{ date('d/m/Y', strtotime($item->dt_vencimento)) }}</td>
                                                            <td>{{ \Carbon\Carbon::now()->diffInDays($item->dt_emissao) }}</td>
                                                            @if ($item->status == "Pendente")
                                                                @if($item->dt_vencimento < \Carbon\Carbon::now()) 
                                                                    <td class="bg-danger">
                                                                        Sim
                                                                    </td>
                                                                @else
                                                                    <td>
                                                                        Não
                                                                    </td>
                                                                @endif
                                                            @else
                                                                <td></td>
                                                            @endif
                                                            </td>
                                                            <td>
                                                                @if ($item->status == "Pendente")
                                                                    @if(\Carbon\Carbon::parse($item->dt_vencimento)->diffInDays(null, false) < 1)
                                                                        <i class="fas fa-check-circle text-success"></i>
                                                                    @elseif(\Carbon\Carbon::parse($item->dt_vencimento)->diffInDays(null, false) < 30)
                                                                        <i class="fas fa-exclamation-circle text-warning"></i>
                                                                    @else
                                                                        <i class="fas fa-times-circle text-danger"></i>
                                                                    @endif
                                                                    {{ \Carbon\Carbon::parse($item->dt_vencimento)->diffInDays(null, false) }}
                                                                    {{-- @if(\Carbon\Carbon::now()->diffInDays($item->dt_vencimento) < 1) --}}
                                                                    {{-- {{ \Carbon\Carbon::now()->diffInDays($item->dt_vencimento) }} --}}
                                                                @else
                                                                @endif
                                                            </td>
                                                            @if ($cliente->sinistro == "Sim")
                                                                <td>
                                                                    Sinistrado
                                                                </td>
                                                            @else
                                                                <td @if ($item->status == "Paga") class="bg-success"  @elseif ($item->status == "PPago") style="background-color: #ffc000;" @endif>
                                                                    {{ $item->status }}
                                                                </td>
                                                            @endif
                                                            <td style="text-align: center">
                                                                @if($item->data_promessa_pagamento)
                                                                    {{date('d/m/Y', strtotime($item->data_promessa_pagamento))}}
                                                                @endif
                                                            </td>
                                                            <td style="text-align: center">
                                                                @if($item->cheque_transferencia  and $item->cheque_transferencia  != "noimage.png" )
                                                                    <a href="/storage/faturas/{{$item->cheque_transferencia }}"> <button  class="  btn btn-primary btn-sm" type="button"  title="Anexo1"><i class="fa fa-file" aria-hidden="true"></i></button></a> 
                                                                @endif 
                                                            </td>

                                                            <td style="text-align: center">
                                                                @if($item->comprovante_pagamento  and $item->comprovante_pagamento  != "noimage.png" )
                                                                <a href="/storage/faturas/{{$item->comprovante_pagamento }}"> <button  class="  btn btn-primary btn-sm" type="button"  title="Anexo1"><i class="fa fa-file" aria-hidden="true"></i></button></a> 
                                                                @endif 
                                                            </td>
                                                        </tr>
                                                    @endif
                                                @endif
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    
              
    <!-- Modal 2 Mão de Obra-->
    <div class="modal fade" id="modal_mao_obra" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden= "true" >
        <div class="modal-dialog modal-dialog-centered modal-xl" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Faturas</h5>
                    <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="table-responsive">
                        <table id="tabelashow" class="table table-sm table-bordered table-hover">
                           <thead>
                                <tr>
                                    <th>Canal</th>
                                    {{-- <th><div style="width:100px;">Nome Cliente</div></th> --}}
                                    <th>Fatura</th>
                                    <th>Valor</th>
                                    <th>Emissão</th>
                                    <th>Vencimento</th>
                                    <th>Idade</th>
                                    <th>Vencido</th>
                                    <th>Atraso</th>
                                    <th>Status</th>
                                    <th>Data Promessa de Pagamento</th>
                                    <th>Promessa de Pagamento</th>
                                    <th>Comprovativo</th>

                                    <th></th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($faturas as $fatura)
                                    <tr id="fatura-linha{{ $fatura->faturas_id }}">
                                        <td>@if(isset($fatura->canal->nome_canal)){{ $fatura->canal->nome_canal }}@endif</td>
                                        {{-- @if($fatura->origem == "IM" and isset($fatura->cliente_im->nome))
                                                <td>{{ $fatura->cliente_im->nome }}</td>
                                        @elseif($fatura->origem =="TFUEL"  and isset($fatura->cliente_tfuel->nome))
                                                <td>{{ $fatura->cliente_tfuel->nome }}</td>
                                        @else
                                                <td>Cliente Não encontrado</td>
                                        @endif --}}
                                        <td>{{ $fatura->num_documento }}</td>
                                        <td>{{ number_format($fatura->valor_total, 2, ',', '.') }}</td>
                                        {{--<td>
                                            Perguntar o que é mvalor, se é calculado 
                                        </td>--}}
                                        <td>{{ date('d/m/Y', strtotime($fatura->dt_emissao)) }}</td>
                                        <td>{{ date('d/m/Y', strtotime($fatura->dt_vencimento)) }}</td>
                                        <td>{{ \Carbon\Carbon::now()->diffInDays($fatura->dt_emissao) }}</td>
                                        @if ($fatura->status == "Pendente")
                                            @if($fatura->dt_vencimento < \Carbon\Carbon::now()) 
                                                <td class="bg-danger">
                                                    Sim
                                                </td>
                                            @else
                                                <td>
                                                    Não
                                                </td>
                                            @endif
                                        @else
                                            <td></td>
                                        @endif
                                        </td>
                                        <td>
                                            @if ($fatura->status == "Pendente")
                                                @if(\Carbon\Carbon::parse($fatura->dt_vencimento)->diffInDays(null, false) < 1)
                                                    <i class="fas fa-check-circle text-success"></i>
                                                @elseif(\Carbon\Carbon::parse($fatura->dt_vencimento)->diffInDays(null, false) < 30)
                                                    <i class="fas fa-exclamation-circle text-warning"></i>
                                                @else
                                                    <i class="fas fa-times-circle text-danger"></i>
                                                @endif
                                                {{ \Carbon\Carbon::parse($fatura->dt_vencimento)->diffInDays(null, false) }}
                                                {{-- @if(\Carbon\Carbon::now()->diffInDays($fatura->dt_vencimento) < 1) --}}
                                                {{-- {{ \Carbon\Carbon::now()->diffInDays($fatura->dt_vencimento) }} --}}
                                            @else
                                            @endif
                                        </td>
                                        @if ($cliente->sinistro == "Sim")
                                            <td>
                                                Sinistrado
                                            </td>
                                        @else
                                            <td @if ($fatura->status == "Paga") class="bg-success" @endif>
                                                {{ $fatura->status }}
                                            </td>
                                        @endif

                                        <td>
                                            @if($fatura->data_promessa_pagamento)
                                                {{ date('d/m/Y', strtotime($fatura->data_promessa_pagamento))  }}
                                            @endif
                                        </td>
                                        <td style="text-align: center">
                                            @if($fatura->cheque_transferencia  and $fatura->cheque_transferencia  != "noimage.png" )
                                                <a href="/storage/faturas/{{$fatura->cheque_transferencia }}"> <button  class="  btn btn-primary btn-sm" type="button"  title="Anexo1"><i class="fa fa-file" aria-hidden="true"></i></button></a> 
                                            @endif 
                                        </td>
            
                                        <td style="text-align: center">
                                        @if($fatura->comprovante_pagamento  and $fatura->comprovante_pagamento  != "noimage.png" )
                                            <a href="/storage/faturas/{{$fatura->comprovante_pagamento }}"> <button  class="  btn btn-primary btn-sm" type="button"  title="Anexo1"><i class="fa fa-file" aria-hidden="true"></i></button></a> 
                                        @endif 
                                        </td>


                                        <td><button type="button"
                                        onclick="document.getElementById('faturas_id').value = {{ $fatura->faturas_id }};
                                        document.getElementById('canal').value = '@if(isset($fatura->canal->nome_canal)){{ $fatura->canal->nome_canal }}@endif';
                                        document.getElementById('num_documento').value = '{{ $fatura->num_documento }}';
                                        document.getElementById('valor_total').value = '{{ $fatura->valor_total }}';
                                        document.getElementById('dt_emissao').value = '{{ $fatura->dt_emissao }}';
                                        document.getElementById('dt_vencimento').value = '{{ $fatura->dt_vencimento }}';
                                        document.getElementById('status').value = '{{ $fatura->status }}';
                                        document.getElementById('fatura_origem').value = '{{ $fatura->origem }}';

                                        

                                        addTabelaMaoObra(); func_seguro_credito()">Selecionar</button>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-primary" data-dismiss="modal">Fechar</button>
                    <!--<button type="button" class="btn btn-primary">Save changes</button> -->
                </div>
            </div>
        </div>
    </div>
    {{-- fim modal --}}

    <!-- DataTables  & Plugins -->
    <script src={{ asset('/plugins/datatables/jquery.dataTables.min.js') }}></script>
    <script src={{ asset('/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js') }}></script>
    <script src={{ asset('/plugins/datatables-responsive/js/dataTables.responsive.min.js') }}></script>
    <script src={{ asset('/plugins/datatables-responsive/js/responsive.bootstrap4.min.js') }}></script>
    <script src={{ asset('/plugins/datatables-buttons/js/dataTables.buttons.min.js') }}></script>
    <script src={{ asset('/plugins/datatables-buttons/js/buttons.bootstrap4.min.js') }}></script>
    <script src={{ asset('/plugins/jszip/jszip.min.js') }}></script>
    <script src={{ asset('/plugins/pdfmake/pdfmake.min.js') }}></script>
    <script src={{ asset('/plugins/pdfmake/vfs_fonts.js') }}></script>
    <script src={{ asset('/plugins/datatables-buttons/js/buttons.html5.min.js') }}></script>
    <script src={{ asset('/plugins/datatables-buttons/js/buttons.print.min.js') }}></script>
    <script src={{ asset('/plugins/datatables-buttons/js/buttons.colVis.min.js') }}></script>
        
    <!-- Page specific script -->
    <script>
        $('#tabelashow').DataTable( {
            
                "paging": true,
                "lengthChange": true,
                "searching": false,
                "ordering": true,
                "info": true,
                "autoWidth": false,
                "responsive": true,
                "order": [[ 2, "desc" ]],
                "buttons": [ "csv", "excel", "pdf", {"extend":"print","text":"Imprimir"}, {"extend":"colvis","text":"Colunas"}],
                "lengthMenu": [[8, 10, 25, 50, -1], [8, 10, 25, 50, "All"]],
                        "bJQueryUI": true,
                        "oLanguage": {
                            "sProcessing":   "Processando...",
                            "sLengthMenu":   "Registros _MENU_ ",
                            "sZeroRecords":  "Não foram encontrados resultados",
                            "sInfo":         "Mostrando de _START_ até _END_ de _TOTAL_ registros",
                            "sInfoEmpty":    "Mostrando de 0 até 0 de 0 registros",
                            "sInfoFiltered": "",
                            "sInfoPostFix":  "",
                            "sSearch":       "Buscar:",
                            "sUrl":          "",
                            "oPaginate": {
                                "sFirst":    "Primeiro",
                                "sPrevious": "Anterior",
                                "sNext":     "Seguinte",
                                "sLast":     "Último"
                            }
                        }
        
        } ).buttons().container().appendTo('#tabelashow_wrapper .col-md-6:eq(0)');
    </script>
    
    <script >
        
        
        $("#telefone").mask("(00) 0000-0000");
        $("#celular").mask("(00) 00000-0000");
        
            $('.money').mask('#.##9,99', { reverse: true });   
        
        </script>

    <script>
        $(document).ready(function(){
            var tipo_interacao = $('#tipo_interacao');

            if(tipo_interacao.val() == "Pagamento" || tipo_interacao.val() == "Enviar extrato pendentes" ){
            
                $('#div_data_proxima_interacao').addClass('d-none');
                $('#div_hora_proxima_interacao').addClass('d-none');

                                
                $('#div_forma_pagamento').removeClass('d-none');
                $('#forma_pagamento').attr('disabled', false);

                // $('#div_liquida_total').removeClass('d-none');
                // $('#div_liquida_total').addClass('d-flex');
                // $('#liquida_total').attr('disabled', false);
                
                // $('#div_valor_liquidado').removeClass('d-none');
                // $('#valor_liquidado').attr('disabled', false);


            } else {
                $('#div_data_proxima_interacao').removeClass('d-none');
                $('#div_hora_proxima_interacao').removeClass('d-none');
                
                $('#div_forma_pagamento').addClass('d-none');
                $('#forma_pagamento').attr('disabled', true);
                
                // $('#div_liquida_total').removeClass('d-flex');
                // $('#div_liquida_total').addClass('d-none');
                // $('#liquida_total').attr('disabled', true);
                
                // $('#div_valor_liquidado').addClass('d-none');
                // $('#valor_liquidado').attr('disabled', true);

            }

            if(tipo_interacao.val() == "Pagamento" ){
                $('#anexos').removeClass('d-none');
            }else{
                $('#anexos').addClass('d-none');
            
            }

            if(tipo_interacao.val() == "Promessa de Pagamento" ){
                
                $('#div_data_promessa_pagamento').removeClass('d-none');
                $('#div_prorrogar_seguro_credito').removeClass('d-none');
                $('#anexos_2').removeClass('d-none');
                $('#div_data_proxima_interacao').addClass('d-none');

            }else{
                $('#div_data_promessa_pagamento').addClass('d-none');
                $('#div_prorrogar_seguro_credito').addClass('d-none');
                $('#anexos_2').addClass('d-none');
                $('#div_data_proxima_interacao').removeClass('d-none');
            }

        })
        $('#tipo_interacao').on('change', function() {
            if(this.value =="Pagamento" || this.value == "Enviar extrato pendentes" ){
            
                $('#div_data_proxima_interacao').addClass('d-none');
                $('#div_hora_proxima_interacao').addClass('d-none');

                $('#div_forma_pagamento').removeClass('d-none');
                $('#forma_pagamento').attr('disabled', false);

                // $('#div_liquida_total').removeClass('d-none');
                // $('#div_liquida_total').addClass('d-flex');
                // $('#liquida_total').attr('disabled', false);
                // $('#liquida_total').attr('checked', false);

                // $('#div_valor_liquidado').removeClass('d-none');
                // $('#valor_liquidado').val('');
                // $('#valor_liquidado').attr('disabled', false);


            } else {
                $('#div_data_proxima_interacao').removeClass('d-none');
                $('#div_hora_proxima_interacao').removeClass('d-none');
                
                $('#div_forma_pagamento').addClass('d-none');
                $('#forma_pagamento').attr('disabled', true);
                
                // $('#div_liquida_total').addClass('d-none');
                // $('#div_liquida_total').removeClass('d-flex');
                // $('#liquida_total').attr('disabled', true);
                // $('#liquida_total').attr('checked', false);
                
                // $('#div_valor_liquidado').addClass('d-none');
                // $('#valor_liquidado').val('');
                // $('#valor_liquidado').attr('disabled', true);
            }

            if(this.value =="Pagamento" ){
                $('#anexos').removeClass('d-none');
            } else {
                $('#anexos').addClass('d-none');
            }

            if(this.value =="Promessa de Pagamento" ){
            
                $('#div_data_promessa_pagamento').removeClass('d-none');
                $('#div_prorrogar_seguro_credito').removeClass('d-none');
                $('#anexos_2').removeClass('d-none');
                $('#div_data_proxima_interacao').addClass('d-none');

            }else{
                $('#div_data_promessa_pagamento').addClass('d-none');
                $('#div_prorrogar_seguro_credito').addClass('d-none');
                $('#anexos_2').addClass('d-none');
                $('#div_data_proxima_interacao').removeClass('d-none');
            }

        });
    
        //seguro de credito

        $('#data_promessa_pagamento').on('change',function(){

        
            if("{{$data_limite_seguro}}"!=null && $('#seguro_credito_cliente').val() > 0 ){        
                if(this.value > "{{$data_limite_seguro}}"){
            
                    $('#prorrogar_seguro_credito').val("Sim");

                }
            }
        
        });


            $('#prorrogar_seguro_credito').on('change',function(){

        
            if("{{$data_limite_seguro}}"!=null && $('#seguro_credito_cliente').val() > 0){        
                if($('#data_promessa_pagamento').val() > "{{$data_limite_seguro}}"){
            
                    $('#prorrogar_seguro_credito').val("Sim");

                }
            }
        
        });


            $('#seguro_credito_cliente').on('change',function(){

        
            if("{{$data_limite_seguro}}"!=null && $('#seguro_credito_cliente').val() > 0){        
                if($('#data_promessa_pagamento').val() > "{{$data_limite_seguro}}"){
            
                    $('#prorrogar_seguro_credito').val("Sim");

                }
            }
        
        });    
    
    // fim seguro de credito
    </script>

<script type="text/javascript">

    function validate(formData, jqForm, options) {
        var form = jqForm[0];
        var $fileUpload = $("#fileanexo");
        if (parseInt($fileUpload.get(0).files.length)>3){
            alert("Você só pode anexar até 3 arquivos");
            return false;
        }

        if (parseInt($fileUpload.get(0).files.length)<=0){
            alert("Nenhum arquivo anexado");
            return false;
        }
        
    }

    $(document).ready(function(){

        $('#carregar').click(function(e){

            e.preventDefault();

            var bar = $('#progress-bar1');
            var percent = $('#percent1');
            var status = $('#status');

            let token = $('meta[name="csrf_token"]').attr('content');

            formData = new FormData(document.getElementById('formclientes'));

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                }
            });

            $.ajax({
                xhr: function() {
                    var xhr = new window.XMLHttpRequest();
                    xhr.upload.addEventListener("progress", function(evt) {
                        if (evt.lengthComputable) {
                            var percentComplete = (evt.loaded / evt.total) * 100;
                            // Place upload progress bar visibility code here

                            var percentVal = percentComplete + '%';
                            bar.width(percentVal)
                            percent.html(percentVal);
                        }
                    }, false);
                    return xhr;
                },

                type: 'POST',
                url: '{{ route('relacionamento_clientes_carregaranexo') }}',
                data: formData,
                cache:false,
                contentType: false,
                processData: false,
                dataType: 'json',
                beforeSend: function() {
                    validate;
                    status.empty();
                    var percentVal = '0%';

                    bar.width(percentVal)
                    percent.html(percentVal);
                },
                success: function(result) {
                    var percentVal = 'Concluído';
                    bar.width(percentVal)
                    percent.html(percentVal);
                    if(result.index > 0){
                        for(var i = 1; i < result.index + 1; i++){
                            $('#formclientes').append('<input id="document'+ i + '" type="hidden" name="document'+ i + '" value="' + result.nome_imagens[i] + '">');
                        }
                        $('#controle_anexo').val(1);
                        $('#limpar_anexo').removeClass('d-none');
                        $('#carregar').addClass('d-none');
                        $('#fileanexo').addClass('d-none');
                        $('#fileanexo').val(null);
                    } else {
                        alert('Erro ao carregar arquivo. O tamanho não pode ultrapassar 2mb.');

                        $('#fileanexo').val(null);
                        $('#percent1').html('0%');
                        $('#controle_anexo').val(0);
                        bar.width(0)
                        percent.html(0);

                        bar.width(percentVal)
                        percent.html(percentVal);
                    }
                },
                complete: function(xhr) {
                    status.html(xhr.responseText);
                }
            })

        });

        $('#limpar_anexo').click(function(e){

            e.preventDefault();

            var bar = $('#progress-bar1');
            var percent = $('#percent1');
            var status = $('#status');

            let token = $('meta[name="csrf_token"]').attr('content');

            $('#limpaanexo').val($('#document1').val());

            formData = new FormData(document.getElementById('formclientes'));

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                }
            });

            

            $.ajax({
                xhr: function() {
                    var xhr = new window.XMLHttpRequest();
                    xhr.upload.addEventListener("progress", function(evt) {
                        if (evt.lengthComputable) {
                            var percentComplete = (evt.loaded / evt.total) * 100;
                            // Place upload progress bar visibility code here

                            var percentVal = percentComplete + '%';
                            bar.width(percentVal)
                            percent.html(percentVal);
                        }
                    }, false);
                    return xhr;
                },
                
                type: 'POST',
                url: '{{ route('relationamento_clientes_apagaranexo') }}',
                data: formData,
                cache:false,
                contentType: false,
                processData: false,
                dataType: 'json',
                success: function(result) {

                    $("#document1").remove();
                    $('#limpar_anexo').addClass('d-none');
                    $('#carregar').removeClass('d-none');
                    $('#fileanexo').removeClass('d-none');
                    $('#fileanexo').val(null);
                    $('#percent1').html('0%');
                    $('#controle_anexo').val(0);
                    $('limpaanexo').val('');

                    bar.width(0)
                    percent.html(0);
                },
                complete: function(xhr) {
                    status.html(xhr.responseText);
                }
            });

        });
    })
   
</script>

{{-- // Anexo 2 --}}

<script type="text/javascript">

    function validate2(formData, jqForm, options) {
        var form = jqForm[0];
        var $fileUpload = $("#fileanexo2");
        if (parseInt($fileUpload.get(0).files.length)>3){
            alert("Você só pode anexar até 3 arquivos");
            return false;
        }

        if (parseInt($fileUpload.get(0).files.length)<=0){
            alert("Nenhum arquivo anexado");
            return false;
        }
        
    }

    $(document).ready(function(){
        $('#carregar2').click(function(e){
            e.preventDefault();

            var bar = $('#progress-bar2');
            var percent = $('#percent2');
            var status = $('#status2');

            let token = $('meta[name="csrf_token"]').attr('content');

            formData = new FormData(document.getElementById('formclientes'));

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                }
            });

            $.ajax({
                xhr: function() {
                    var xhr = new window.XMLHttpRequest();
                    xhr.upload.addEventListener("progress", function(evt) {
                        if (evt.lengthComputable) {
                            var percentComplete = (evt.loaded / evt.total) * 100;
                            // Place upload progress bar visibility code here

                            var percentVal = percentComplete + '%';
                            bar.width(percentVal)
                            percent.html(percentVal);
                        }
                    }, false);
                    return xhr;
                },

                type: 'POST',
                url: '{{ route('relacionamento_clientes_carregaranexo2') }}',
                data: formData,
                cache:false,
                contentType: false,
                processData: false,
                dataType: 'json',

                beforeSend: function() {
                    validate2;
                    status.empty();
                    var percentVal = '0%';

                    bar.width(percentVal)
                    percent.html(percentVal);
                },

                success: function(result) {
                    var percentVal = 'Concluído';
                    bar.width(percentVal)
                    percent.html(percentVal);
                    for(var i = 1; i < result.index + 1; i++){
                        $('#formclientes').append('<input id="document_promessa' + '" type="hidden" name="document_promessa' + '" value="' + result.nome_imagens[i] + '">');
                    }
                    $('#controle_anexo2').val(1);
                    $('#limpar_anexo2').removeClass('d-none');
                    $('#carregar2').addClass('d-none');
                    $('#fileanexo2').addClass('d-none');
                    $('#fileanexo2').val(null);
                },

                complete: function(xhr) {
                    status.html(xhr.responseText);
                }

            });

        });


        $('#limpar_anexo2').click(function(e){

            e.preventDefault();

            var bar = $('#progress-bar2');
            var percent = $('#percent2');
            var status = $('#status');

            let token = $('meta[name="csrf_token"]').attr('content');

            $('#limpaanexo').val($('#document_promessa').val());

            formData = new FormData(document.getElementById('formclientes'));

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                }
            });

            

            $.ajax({
                xhr: function() {
                    var xhr = new window.XMLHttpRequest();
                    xhr.upload.addEventListener("progress", function(evt) {
                        if (evt.lengthComputable) {
                            var percentComplete = (evt.loaded / evt.total) * 100;
                            // Place upload progress bar visibility code here

                            var percentVal = percentComplete + '%';
                            bar.width(percentVal)
                            percent.html(percentVal);
                        }
                    }, false);
                    return xhr;
                },
                
                type: 'POST',
                url: '{{ route('relationamento_clientes_apagaranexo') }}',
                data: formData,
                cache:false,
                contentType: false,
                processData: false,
                dataType: 'json',
                success: function(result) {

                    $("#document_promessa").remove();
                    $('#limpar_anexo2').addClass('d-none');
                    $('#carregar2').removeClass('d-none');
                    $('#fileanexo2').removeClass('d-none');
                    $('#fileanexo2').val(null);
                    $('#percent2').html('0%');
                    $('#controle_anexo2').val(0);
                    $('limpaanexo').val('');

                    bar.width(0)
                    percent.html(0);

                },
                complete: function(xhr) {
                    status.html(xhr.responseText);
                }
            });

        });

    });
   
</script>

@endsection