@extends('fragments.fullTemplate')
@php
    $id_usuario = session('id_usuario');
    if (! session('id_usuario')) {
            header('location: /');
            die();
    }
    
    $count_estatus = 0;

@endphp
@section('contenido')

<style>
    .bootstrap-tagsinput {
        width: 100%
    }
    .bootstrap-tagsinput .tag {
        background-color: #2185D0;
        padding: 2px 5px;
        border-radius: 5px;
    }
</style>
<style>
    
#loader {
  position: relative;
  left: 60%;
  top: 100%;
  z-index: 1;
  width: 60px;
  height: 60px;
  margin: -6px 0 5px -120px;
  border: 8px solid #f3f3f3;
  border-radius: 50%;
  border-top: 8px solid #3498db;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
  display: none;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}

#myDiv {
    position: relative;
    left: 40%;
    top: 50%;
    z-index: 1;
    width: 250px;
    height: 120px;
    display: none;
    text-align: center;
}
/*.tales {
  width: 100%;
}
.carousel-inner{
  width:100%;
  max-height: 250px !important;
}*/
.tales {
  width: 100%;
}
.carousel-inner{
  width:100%;
  max-height: 250px !important;
}

</style>


    <div class="ui big breadcrumb">
        <div class="section">SEATSA Internacional</div>
        <i class="right chevron icon divider"></i>
        <div class="section">Reportes de clientes</div>
        <i class="right chevron icon divider"></i>
        <div class="active section">Detalles informe de resultados</div>
    </div>

    <div class="ui divider"></div>
    <div data-module-notifications-anchor></div>
    <div class="col-lg-12" id="loader"></div>  
    <div style="display:none;" id="myDiv" class="animate-bottom col-lg-12 text-center">
        
        <h2>Descargando</h2>
        <p style="display:none;" id="text_1">Analizando el informe...</p>
        <p style="display:none;" id="text_2">Detectando el idioma del informe...</p>
        <p style="display:none;" id="text_3">Traduciendo el informe...</p>
        <p style="display:none;" id="text_4">Comparando los incisos de ambos informes...</p>
        <p style="display:none;" id="text_5">Extrayendo las imágenes...</p>
        <p style="display:none;" id="text_6">Extrayendo los datos...</p>
        <p style="display:none;" id="text_7">Generando el informe...</p>
    </div>
    <div class="content">
        <div class="col-lg-12 col-md-12 col-sm-12">
            @if(session()->has('success'))
                <div class="alert alert-success text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('success') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if(session()->has('warning'))
                <div class="alert alert-warning text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('warning') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if(session()->has('error'))
                <div class="alert alert-danger text-center alert-dismissible" role="alert">
                    <strong>{{ session()->get('error') }}</strong>
                    <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                </div>
            @endif
            @if (count($errors) > 0)
            <div class="alert alert-danger alert-dismissible" role="alert">
                <strong>¡Error!</strong> Revise los campos obligatorios.<br><br>
                <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <ul>
                @foreach ($errors->all() as $error)
                <li>{{ $error }}</li>
                @endforeach
                </ul>
            </div>
            @endif
        </div>
    </div>
    {{--
    @foreach ($notificaciones_reporte_analista as $notificacion)
        <div id="{{$notificacion->id_notificacion}}_div_notificacion" class="alert alert-danger alert-dismissible fade show" role="alert">
            <strong>Notificación</strong><br>
            El siguiente informe de línea de pruebas requiere su atención<br><br>
            <a href="{{url('linea_de_pruebas/'.$notificacion->id_programacion_muestra)}}"><strong>{{$notificacion->numero_informe}}</strong></a><br>
            {{$notificacion->mensaje}}
            <button id="{{$notificacion->id_notificacion}}" class="ui button fluid red mt-3 notificacion_analista" data-id_notificacion="{{$notificacion->id_notificacion}}">
                Sin Revisar
            </button>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">&times;</span>
            </button>
            
        </div> 
    @endforeach
    @foreach ($notificaciones_reporte_jefe as $notificacion)
        <div id="{{$notificacion->id_notificacion}}_div_notificacion" class="alert alert-primary alert-dismissible fade show" role="alert">
            <strong>Notificación</strong><br>
            Su notificación con el siguiente mensaje ha sido atendida<br><br>
            <a href="{{url('linea_de_pruebas/'.$notificacion->id_programacion_muestra)}}"><strong>{{$notificacion->numero_informe}}</strong></a><br>
            {{$notificacion->mensaje}}
            <button id="{{$notificacion->id_notificacion}}" class="ui button fluid blue mt-3 notificacion_jefe" data-id_notificacion="{{$notificacion->id_notificacion}}">
                <i class="eye icon"></i> No volver a mostrar
            </button>
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
            <span aria-hidden="true">&times;</span>
            </button>
            
        </div> 
    @endforeach
    --}}
   
    
    @if ($datos_reporte_internacional->datos_evaluacion_linea_pruebas->count() == 0)
        <button class="ui button fluid primary create_report"
        data-id_international_portal_report="{{$datos_reporte_internacional->id_international_portal_report}}" 
        >
            <i class="pencil alternate icon"></i> Crear informe resultados
        </button> 
    @else
    {{--
    @if (count($datos_fotografia_reporte) >= 1)
    <div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
        <h5><strong>Imágenes de la muestra</strong></h5>
        
        <ol class="carousel-indicators">
            @php
                $i=0;
            @endphp
            @foreach ($datos_fotografia_reporte as $datos_fotografia)
                <li data-target="#carouselExampleIndicators" data-slide-to="{{$i}}" 
                @if ($i==0)
                    class="active"
                @endif
                ></li>
            @php
                $i++;
            @endphp
            @endforeach
        </ol>
        @php
            $i=0;
        @endphp
        <div class="carousel-inner">
            @foreach ($datos_fotografia_reporte as $datos_fotografia)
                <div
                @if ($i==0)
                    class="carousel-item active"
                @else
                    class="carousel-item"
                @endif
                >
                <img class="d-block img-fluid" src="{{ asset('storage/linea_pruebas_fotografias/'.$datos_fotografia->fotografia)}}" alt="First slide">
            </div>
            @php
                $i++;
            @endphp
            @endforeach
        </div>
        <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
          <span class="carousel-control-prev-icon" aria-hidden="true"></span>
          <span class="sr-only">Previous</span>
        </a>
        <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
          <span class="carousel-control-next-icon" aria-hidden="true"></span>
          <span class="sr-only">Next</span>
        </a>
    </div>
    <div class="ui divider"></div>
    @endif
   --}}
    <div class="row">
        @if($permisos->actualizar == 1 || $permisos->gerente == 1)
        <div class="col-md-8 mb-1">
            <button class="ui button fluid green edit_report"
            data-id_international_portal_report="{{$datos_reporte_internacional->id_international_portal_report}}">
                <i class="pencil alternate icon"></i>Editar reporte de línea de pruebas
            </button> 
        </div>
        @endif
        @if($permisos->gerente == 1 || $permisos->actualizar == 1)
        <div class="col-md-2">
           
            <button class="ui button fluid blue {{ $datos_reporte_internacional->estatus != 2 ? 'disabled' : 'enabled' }} "           
                data-id_international_portal_report="{{$datos_reporte_internacional->id_international_portal_report}}" 
                data-toggle="modal" data-target="#send_mail_report_modal">
                        <i class="mail icon"></i>Enviar Correo
            </button>    
        </div>
        @endif
        @if($permisos->gerente == 1 || $permisos->eliminar == 1)
        <div class="col-md-2">
            <button class="ui button fluid red delete_report_details"
            data-id_international_portal_report="{{$datos_reporte_internacional->id_international_portal_report}}" 
            data-nombre_reporte="{{$datos_reporte_internacional->nombre_reporte}}">
                    <i class="trash alternate icon"></i>Eliminar
            </button> 
        </div>
        @endif
    </div>
    
    @endif
    
    <div class="ui divider"></div>

    <div class="sx-autorender">
        <div class="sx-scroll-x">
            {{--<p class="text-center" >{{ $datos_reporte_linea_pruebas->count() }}</strong> resultados en esta p&aacute;gina</p>--}}
            <table class="ui celled table unstackable">
                <thead>
                    <tr>
                        <th>Folio de informe ARM</th>
                        <th>Cliente Factura</th>
                        <th>Cliente Informe</th>
                        <th>Nombre archivo</th>
                        <th>Fecha</th>
                        
                        <th class="collapsing">Estatus</th>
                        <th class="collapsing">Estatus Jefe de línea</th>
                        <th class="collapsing">Reporte (ES)</th>
                        <th class="collapsing">Reporte (EN)</th>
                        <th class="collapsing">Línea de pruebas</th>
                        
                        {{--
                        @if ($datos_reporte_linea_pruebas)
                            @if ($datos_reporte_linea_pruebas->informe_resultados_pdf != NULL)
                                <th class="text-center">Informe de resultados PDF</th>
                            @endif
                        @endif
                        @if ($usuario_jefe_linea)
                            <th class="text-center">Estatus Jefe de linea</th>
                        @endif
                        --}}
                        
                    </tr>
                </thead>
                <tbody>
                    @if ($datos_reporte_internacional->datos_evaluacion_linea_pruebas->count() > 0)
                        <tr>
                            <td>{{$datos_reporte_internacional->numero_informe}}</td>
                            <td>{{$datos_reporte_internacional->company_name_invoice}}</td>
                            <td>{{$datos_reporte_internacional->company_name_report}}</td>
                            <td>{{$datos_reporte_internacional->nombre_reporte_archivo}}</td>
                            <td>{{$datos_reporte_internacional->fecha}}</td>
                            <td>
                                @switch($datos_reporte_internacional->estatus)
                                    @case(0)
                                        <span class="btn btn-danger">Whitout data</span>
                                        @break
                                    @case(1)
                                        <span class="btn btn-warning">In progress</span>
                                        @break
                                    @case(2)
                                        <span class="btn btn-success">Ready</span>
                                        @break
                                    @default
                                        
                                @endswitch
                                
                            </td>
                            <td class="text-center">
                                        
                                    @switch($datos_reporte_internacional->estatus_jefe)

                                        @case(0)
                                        <a id="{{$datos_reporte_internacional->id_international_portal_report}}" class="btn btn-danger text-white estatus_jefe" data-estatus_jefe="{{$datos_reporte_internacional->estatus_jefe}}">
                                
                                            Rechazado
                                        </a>
                                            @break
                                        @case(1)
                                        <a id="{{$datos_reporte_internacional->id_international_portal_report}}" class="btn btn-warning estatus_jefe" data-estatus_jefe="{{$datos_reporte_internacional->estatus_jefe}}">
                                
                                            Pendiente
                                        </a>
                                            @break
                                        @case(2)
                                        <a id="{{$datos_reporte_internacional->id_international_portal_report}}" class="btn btn-success text-white estatus_jefe" data-estatus_jefe="{{$datos_reporte_internacional->estatus_jefe}}">
                                
                                            Aprobado
                                        </a>
                                            @break
                                        @default
                                            
                                    @endswitch
                                
                            </td>
                            <td >
                                @if($permisos->gerente == 1 || $permisos->verqr == 1)
                                <div class="ui icon buttons">
                                    @if ($datos_reporte_linea_pruebas != null)
                                    <form action={{url('informe_general_linea_de_pruebas_international_report')}} method="post">
                                        {{csrf_field()}}
                                        <input type="hidden" id="id_international_portal_report" name="id_international_portal_report" value="{{$datos_reporte_internacional->id_international_portal_report}}">
                                        <input type="hidden" id="idioma_reporte" name="idioma_reporte" value="es">
                                        
                                        <button id="{{$datos_reporte_internacional->id_international_portal_report}}" class="ui button blue fluid downloadButton" type="submit">
                                            <span class="d-none spinner spinner-border spinner-border-sm" id="spinner" role="status" aria-hidden="true"></span>
                                            Informe de resultados
                                            <i class="ui download icon"></i> 
                                        </button>
                                    </form>  
                                    @endif
                                    
                                </div>
                                @endif
                            </td>  
                            <td >
                                @if($permisos->gerente == 1 || $permisos->verqr == 1)
                                <div class="ui icon buttons">
                                    @if ($datos_reporte_linea_pruebas != null)
                                    <form action={{url('informe_general_linea_de_pruebas_international_report')}} method="post">
                                        {{csrf_field()}}
                                        <input type="hidden" id="id_international_portal_report" name="id_international_portal_report" value="{{$datos_reporte_internacional->id_international_portal_report}}">
                                        <input type="hidden" id="idioma_reporte" name="idioma_reporte" value="eng_">
                                        
                                        <button id="{{$datos_reporte_internacional->id_international_portal_report}}" class="ui button blue fluid downloadButton" type="submit">
                                            <span class="d-none spinner spinner-border spinner-border-sm" id="spinner" role="status" aria-hidden="true"></span>
                                            Test Report
                                            <i class="ui download icon"></i> 
                                        </button>
                                    </form>  
                                    @endif
                                    
                                </div>
                                @endif
                            </td>
                            <td>
                            @if($permisos->gerente == 1 || $permisos->verqr == 1)
                                <div class="ui icon buttons text-center">
                                    <a href="{{url('reportes_clientes_internacional/linea_de_pruebas/'.$datos_reporte_internacional->id_international_portal_report)}}" class="ui button blue fluid" type="submit">
                                        Línea de pruebas
                                        <i class="ui right arrow icon"></i> 
                                    </a>
                                </div>
                                 @endif
                            </td>
                            
                        </tr>
                    @endif
                    
                </tbody>
            </table>
            {{--$datos_reporte_linea_pruebas->links("pagination::bootstrap-4")--}}
        </div>
        
        
        
        <div class="ui divider"></div>
        
        <div class="row">
            <div class="col-md-12">
                <div class="ui big breadcrumb">
                    
                    <div class="section">Seguimiento</div>
                    <i class="right chevron icon divider"></i>
                    <div class="active section">Comentarios</div>
                </div>
            </div>
            
            <div class="col-md-12 mt-3">
                <label class="font-weight-bold" >Nuevo comentario</label>
                <textarea class="form-control" name="comentario_box" id="comentario_box" cols="30" rows="5"></textarea>
                <div class="text-right mt-2">
                    <button id="enviar_comentario" class="btn btn-primary">Enviar</button>
                </div>
            </div>
            <div class="col-md-12 mt-3" style="height: 400px; overflow-y: auto;">
               <div id="comment_section"></div>
                @foreach ($comentarios as $item)
                    <div class="card mb-2"  id="card_comment_{{$item->id_comentario}}" >
                        <div class="card-body">
                            <div class="row">
                            
                                @php
                                    
                                @endphp
                                <div class="col-md-10">
                                    <p>
                                        @if ($item->rol_comentario_emisor_linea_pruebas() == "Jefe de linea")
                                            <span class="badge badge-info"> Jefe de línea</span>
                                        @else
                                            <span class="badge badge-primary"> Analista</span>
                                        @endif
                                        |<strong> {{$item->datos_usuario_emisor->nombre}} {{$item->datos_usuario_emisor->apellidos}} </strong>|<small> {{$item->fecha_formateada}}</small> 
                                        
                                    </p>
                                </div>
                                <div class="col-md-2 text-right">
                                    <div class="dropdown">
                                        <i id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="ellipsis horizontal icon"></i>
                                        
                                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                            <a class="dropdown-item delete_comentario" data-id_comentario="{{$item->id_comentario}}"><i class="trash icon"></i> Eliminar</a>
                                        </div>
                                    </div>
                                    
                                </div>
                                
                                <div class="col-md-12 mt-3">
                                    <p>{{$item->mensaje}}</p>
                                
                                </div>
                            </div>
                            
                        </div>
                    </div>
                @endforeach
                
            </div>
            
            
        </div>
        {{--
        @if ($datos_reporte_linea_pruebas >= 2 && $count_estatus >= 2)
        <div class="form-group">
            <form action="devolucion_de_muestras_general_pdf" method="post">
                {{csrf_field()}}
                
                <button id="pdf_button_recibo" class="ui button green" type="submit">
                    <span class="d-none spinner spinner-border spinner-border-sm" id="spinner" role="status" aria-hidden="true"></span>
                    <i class="download icon"></i>Devolución de muestras general
                </button>
            </form>
        </div>
        @endif
        --}}
        <div class="row">
            <div class="col-xs-12 col-sm-6 col-md-6">
                {{--<input type="submit" value="Guardar" class="ui button primary">--}}
                <a href="{{ route('reportes_clientes_internacional.index') }}" class="ui button gray"><i class="arrow circle left icon"></i>Atrás</a>
            </div>
        </div>
        {{--<div class="form-group">
            <form action="recibo_de_inspeccion_pdf" method="post">
                {{csrf_field()}}
                <input type="hidden" name="id_recibo_muestra" id="id_recibo_muestra" value="{{$datos_empresa->id_recibo_muestra}}">
                <input type="hidden" name="id_empresa" id="id_empresa" value="{{$datos_empresa->id_empresa}}">
                
                <button class="ui button green" type="submit">
                    <i class="download icon"></i>Descargar recibo de inspección muestra
                </button>
            </form>
        </div>--}}
    </div>
    @include('International_Customer_Portal_Reports.modals.send_mail_report_modal')

    <script>
        $('.downloadButton').click(function() {
           
            $('#myDiv').css('display', 'block');
            $('#loader').css('display', 'block');

            number = 1;
            number_hide = -1;
            var myVar = setInterval(setText, 1000);

            function setText() {
               
                $('#text_'+number).show(500);
                $('#text_'+number_hide).hide(500);

                if (number == 8) {
                    stopText();
                }
                number++;
                number_hide++;
               
                
            }

            function stopText() {
                clearInterval(myVar);
            }
            
            
            setInterval(function(){ 
                $('#loader').css('display', 'none');
                $('#myDiv').css('display', 'none');
               
            }, 11000);
            
        });
        
        
    </script>
    @if ($datos_reporte_internacional->datos_evaluacion_linea_pruebas->count() == 0)
        @include('International_Customer_Portal_Reports.create_informe_detalles_modal')
        <script>
            $(document).on('click','.create_report',function(){
                $('#create_international_customer_report_modal').modal('show'); 

                datos_reporte_internacional = @json($datos_reporte_internacional);
                console.log(datos_reporte_internacional);
                $('#create_international_customer_report_modal #id_estandar_internacional').val(datos_reporte_internacional.id_estandar_internacional); 

                estandar_x_norma(datos_reporte_internacional.id_estandar_internacional,"create_international_customer_report_modal")
            });

            function estandar_x_norma(id_estandar_internacional,modal_id) {
                //id_estandar_internacional = $(this).val();
                
                $.ajax({
                        url:"{{route('show_norma_correlacion_international_portal_report')}}",
                        method:"POST",
                        data:{'id_estandar_internacional': id_estandar_internacional, '_token': _token = $('input[name="_token"]').val()},
                        success:function(response){
                            
                            //alert(response);
                            result = JSON.parse(response); 
                            resultData = result.data;
                            
                            $("#"+modal_id).find('#nombre_norma').val(resultData['datos_norma']['nombre_norma']);
                            $("#"+modal_id).find('#update_id_norma').val(resultData['datos_norma']['id_norma']);

                        }
                });
            }
            $(".change_standar").change(function(){

                id_estandar_internacional = $(this).val();
                var modal = $(this).closest('.modal');
                var modal_id = modal.attr('id');

                estandar_x_norma(id_estandar_internacional,modal_id);
            });
            
        </script>
    @endif
    
    @include('International_Customer_Portal_Reports.delete_informe_detalles_modal')
    <script>
        $(document).on('click','.delete_report_details',function(){
            var id_international_portal_report=$(this).attr('data-id_international_portal_report');
            var nombre_reporte=$(this).attr('data-nombre_reporte');
           
            $('#id_international_portal_report_delete').val(id_international_portal_report);
            $('#nombre_reporte_delete').html(nombre_reporte);

            $('#delete_international_customer_report_details_modal').modal('show'); 
        });
    </script>
    
    @include('International_Customer_Portal_Reports.modify_informe_detalles_modal')
    <script>
        var resultData = {};
        $(document).ready(function(){
            $('.edit_report').on('click', function(){
                
                id_international_portal_report = $(this).data('id_international_portal_report');
                $("#update_id_international_portal_report").val(id_international_portal_report);
                
                $.ajax({
                    url:"{{url('show_international_customer_report_data')}}",
                    method:"POST",
                    data:{'id_international_portal_report': id_international_portal_report, '_token': _token = $('input[name="_token"]').val()},
                    success:function(response){
                        //alert(response);
                        result = JSON.parse(response); 
                        resultData = result.data;
                        
                        console.log(resultData);
                        $('#edit_international_customer_report_details_modal').modal('show');
                    }
                });
        
            });
        });
        
        $('#edit_international_customer_report_details_modal').on('show.bs.modal', function () {
            

            $("#modal-form-detalles-modify :input").each(function(){
                
                input = $(this).attr('id'); // This is the jquery object of the input, do what you will
                //console.log(input);
                if(input in resultData['datos_reporte']){
                    $('#modal-form-detalles-modify #'+input).val(resultData['datos_reporte'][input]);
                    console.log(resultData['datos_reporte'][input]);
                    //$('#modal-form-detalles-modify #'+input).selectpicker('val',resultData['datos_reporte'][input]);
                    if (resultData['datos_reporte']['id_norma'] != null) {
                        $('#id_estandar_internacional').val(resultData['datos_reporte']['id_estandar_internacional']);
                        $('#id_estandar_internacional').prop("disabled", true);
                        $('#nombre_norma').val(resultData['datos_norma']['nombre_norma']);
                        $('#update_id_norma').val(resultData['datos_norma']['id_norma']);
                    }else{
                        $('#id_estandar_internacional').prop("disabled", false);
                        $('#nombre_norma').val('');
                        $('#update_id_norma').val('');
                    }
                }
            });
        });
    </script>
    

    @include('International_Customer_Portal_Reports.delete_imagenes_reporte_modal')
    <script>
        id_international_portal_report_image = 0;
        $(document).on('click','.delete_imagen_muestra',function(){
            
            id_international_portal_report_image=$(this).data('id');

            $('#delete_imagenes_reporte_details_modal').modal('show'); 
        });
        $('#confirm_delete_imagenes_muestra').click(function(){
            $.ajax({
                    url:"{{url('delete_international_portal_report_image')}}",
                    method:"POST",
                    data:{'id_international_portal_report_image': id_international_portal_report_image, '_token': _token = $('input[name="_token"]').val()},
                    success:function(response){
                        
                        //alert(response);
                        result = JSON.parse(response); 
                        resultData = result.data;
                        
                        $('#id_international_portal_report_image_'+id_international_portal_report_image).remove(); 
                        $('#delete_imagenes_reporte_details_modal').modal('hide'); 
                        
                    }
            });
            
        });
    </script>

<script>
    $(document).ready(function () {
        $(document).on('click','.estatus_jefe',function(){

            element = "#"+$(this).attr('id');

            id_int_portal_report = $(this).attr('id');
            status_val = $(this).attr('data-estatus_jefe');
            new_value_status = (status_val + 1) % 3;
           
            $(this).attr("data-estatus_jefe", new_value_status);
            $.ajax({

                url:"{{ route('update_int_report_estatus_jefe') }}",
                method:"POST",
                data:{
                    'estatus': new_value_status, 
                    'id_int_portal_report': id_int_portal_report, 
                    '_token': _token = $('input[name="_token"]').val()
                },
                success:function(response){
                    console.log("response....   ");
                    console.log(response);
                    
                    $(element).attr("data-status", new_value_status);

                    console.log("new_value_status...");
                    console.log(new_value_status);
                    $(element).removeClass();
                    switch (new_value_status) {
                        case 0:
                            console.log(new_value_status);
                            $(element).text("Rechazado");
                            $(element).addClass('text-white btn btn-danger estatus_jefe');
                            break;
                        case 1:
                            console.log(new_value_status);
                            $(element).text("Pendiente");
                            $(element).addClass('text-dark btn btn-warning estatus_jefe');
                            break;
                        case 2:
                            $(element).text("Aprobado");
                            console.log(new_value_status);
                            $(element).addClass('text-white btn btn-success estatus_jefe');
                            break;

                        default:
                            console.log(new_value_status);
                            $(element).addClass('text-dark btn btn-warning estatus_jefe');
                            break;
                    }

                }
            });

        });
    });
</script>
    <script>
        $(document).ready(function () {
            $('#enviar_comentario').click(function (e) { 
                id_comentario_seccion = 1;
                pk_id = @json($datos_reporte_internacional->id_international_portal_report);
                mensaje = $('#comentario_box').val();
               
                $.ajax({
					type: 'POST',
					url: "{{ route('comentarios.create_comentario') }}",
					data: {
						'id_comentario_seccion': id_comentario_seccion,
						'pk_id': pk_id,
						'mensaje': mensaje,
						'_token': _token = $('input[name="_token"]').val()
					},
					success: function(response) {
						console.log('SUCCESS BLOCK');
						console.log(response);
                        add_comment_card(response);
					},
					error: function(response) {
						console.log('ERROR BLOCK');
						console.log(response);
					}
				});
                
            });

			$(document).on('click', '.delete_comentario', function() {
                var id_comentario = $(this).data('id_comentario');
                delete_comment(id_comentario);
            });

            function add_comment_card(datos_comentario) {
                id_comentario = datos_comentario.id_comentario;
                mensaje = datos_comentario.mensaje;
                nombre_completo = datos_comentario.datos_usuario_emisor.nombre+" "+datos_comentario.datos_usuario_emisor.apellidos;
                fecha = datos_comentario.fecha_formateada;

                rol = datos_comentario.rol_usuario_emisor;
                if (rol == "Analista") {
                    rol_color = 'primary';
                }else{
                    rol_color = 'info';
                }
                span_tipo_tecnico = `<span class="badge badge-${rol_color}"> ${rol}</span>`;

                //span_tipo_tecnico = '<span class="badge badge-info"> Jefe de línea</span>';
                comment_html = "";
                comment_html = `
                <div id="card_comment_${id_comentario}" class="card mb-2" >
                        <div class="card-body">
                            <div class="row">
                            
                                <div class="col-md-10">
                                    <p>
                                        ${span_tipo_tecnico} |<strong> ${nombre_completo} </strong>|<small> ${fecha}</small> 
                                    </p>
                                </div>
                                <div class="col-md-2 text-right">
                                    <div class="dropdown">
                                        <i id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="ellipsis horizontal icon"></i>
                                        
                                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                            <a class="dropdown-item delete_comentario" data-id_comentario="${id_comentario}"><i class="trash icon"></i> Eliminar</a>
                                        </div>
                                    </div>
                                    
                                </div>
                                
                                <div class="col-md-12 mt-3">
                                    ${mensaje}
                                </div>
                            </div>
                            
                        </div>
                    </div>
                `;


                $('#comment_section').prepend(comment_html);
                $('#comentario_box').val('');
            }

            function delete_comment(id_comentario) {
                $.ajax({
					type: 'POST',
					url: "{{ route('comentarios.delete_comentario') }}",
					data: {
						'id_comentario': id_comentario,
						'_token': _token = $('input[name="_token"]').val()
					},
					success: function(response) {
						console.log('SUCCESS DELETE BLOCK');
                        $('#card_comment_'+id_comentario).remove();
                        
					},
					error: function(response) {
						console.log('ERROR delete BLOCK');
						console.log(response);
					}
				});
            }
        });
    </script>
@endsection