EVOLUTION-MANAGER

Edit File: consultar_tramite.blade.php

@extends('layouts.master')
@section('style')
        <link href="{{asset('public/frontend/transparencia/wp-content/themes/jannah/assets/css/style.css')}}" id="tie-css-styles-css" media="all" rel="stylesheet" type="text/css"/>       
        <style>
            @media (max-width: 576px){
                .input_control{
                    display: block;
                    width: 100%;
                    margin-bottom: 10px;
                    text-align: center;
                    font-size: 18px;
                }
                #content_ttt{
                    margin-top: 20px;
                }
            }

#tabla_historial{
                font-size: 13px !important;
            }

#tabla_historial li{
                font-size: 13px !important;
            }

.td_content{
                width: max-content;
            }
            .table_detalle th,td{
                padding: 6px 12px !important;
                font-size: 13px !important;
                line-height: normal;
            }
            .tr_actual{
                background-color: #bff5f3 !important;
            }
            .tr_normal{
                background-color: #ffffff !important;
            }
            .td_titulo{
                background: #ffffff !important;
            }
            .td_texto{
                background: #ffffff !important;
            }
            
        </style>
@endsection
@section('contenido')

<br>
    <div  role="main">
        <article class="container-wrapper post-content" id="the-post">
            <header class="entry-header-outer">                                       
                <div class="entry-header">
                    <h1 class="post-title entry-title">
                        Consultar Trámite
                    </h1>
                </div>
                
            </header>
            
            <div class="entry-content entry clearfix">
                <div class="vc_row wpb_row vc_row-fluid">
                    <div class="wpb_column vc_column_container vc_col-sm-12">
                        <div class="vc_column-inner">
                            <div class="wpb_wrapper">
                                <h3 class="vc_custom_heading" style="font-size: 14px;text-align: left;font-family:Actor;font-weight:400;font-style:normal">
                                    Ingrese el n&uacute;mero de tr&aacute;mite para consultar el historial actual.
                                </h3>
                            </div>
                        </div>
                        <div  class="vc_column-inner" style="text-align: center;">
                            @if(isset($identificacion) && isset($numero_tramite))
                                <input type="number" placeholder="Ingrese la identificaci&oacute;n" name="identificacion" id="identificacion" class="input_control" value="{{ $identificacion }}">
                                <input type="number" placeholder="Ingrese n&uacute;mero de tr&aacute;mite" name="numero_tramite" id="numero_tramite" class="input_control" value="{{ $numero_tramite }}"> 
                            @else
                                <input type="number" placeholder="Ingrese la identificaci&oacute;n" name="identificacion" id="identificacion" class="input_control">
                                <input type="number" placeholder="Ingrese n&uacute;mero de tr&aacute;mite" name="numero_tramite" id="numero_tramite" class="input_control"> 
                            @endif            
                            <button type="submit" onclick="consultar_historial();" id="btn_buscar_historial" class="btn btn-success bnt-lg" data-toggle="tooltip" title="Editar">
                                <i class="fa fa-search" aria-hidden="true"> Buscar</i>
                            </button>
                        </div>
                        
                        <br>

<div class="row justify-content-md-center" id="content_detalle_tramite" style="display: none;">
                            <div class="col col-lg-6 col-md-auto col-sm-12">
                                <table class="table table-bordered table_detalle">
                                    <thead>
                                        <tr>
                                            <th colspan="2"><b><center>DATOS DEL REMITENTE</center></b></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td class="td_titulo"><b>Identificación</b></td>
                                            <td class="td_texto" id="dr_identificacion">--</td>
                                        </tr>
                                        <tr>
                                            <td class="td_titulo"><b>Nombre</b></td>
                                            <td class="td_texto" id="dr_nombre">--</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>

<div class="col col-lg-6 col-md-auto col-sm-12">
                                <table class="table table-bordered table_detalle">
                                    <thead>
                                        <tr>
                                            <th colspan="2"><b><center>DETALLE DEL TR&Aacute;MITE</center></b></th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td class="td_titulo"><b>Fecha y hora de registro</b></td>
                                            <td class="td_texto" id="dt_fecha">--</td>
                                        </tr>
                                        <tr>
                                            <td class="td_titulo"><b>Asunto</b></td>
                                            <td class="td_texto" id="dt_asunto">--</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>

</div>

<div class="vc_column-inner" id="content_tabla_historial" style="display: none; overflow: overlay;">
                            
                            <h4>Historial del Tr&aacute;mite</h4>
                            
                            <table class="table table-bordered" id="tabla_historial">
                                <thead>
                                    <tr>
                                        <th>N°</th>
                                        <th>DE</th>
                                        <th>PARA</th>
                                        <th><div class="td_content">CON COPIA A</div></th>
                                        <th><center><div class="td_content">FECHA RESPUESTA</div></center></th>
                                        <th><center><div class="td_content">TIEMPO TRANSCURRIDO</div></center></th>
                                        <th><center>ESTADO</center></th>
                                    </tr>
                                </thead>
                                <tbody id="tbody_hostorial">	
                                    
                                </tbody>	
                            </table>
                        
                        </div>
                        <h4 id="content_ttt" style="display: none;">Tiempo total transcurrido: <b id="tiempo_total"></b></h4> 
                    </div>
                </div>                       
            </div>
            
        </article>
        
    </div>
    <div class="art-article" style="padding-top: 10px;padding-bottom: 150px;">
        <center>
            <div class="">    
                <div class="col-md-12">
                                 
                                   
                </div>
            </div>
        </center>  
    </div>
     <br>
     <br>
     <br>
     <br>
     <br>
     <br>
     <br>
@endsection
@section('script')

@if(isset($identificacion) && isset($numero_tramite))
        <script type="text/javascript">
            $(document).ready(function () {
                $("#btn_buscar_historial").click();
            });
        </script>
    @endif

function consultar_historial(){

var valor=$('#numero_tramite').val();
            var ident=$("#identificacion").val();
            if(valor==null||valor==''){
                return 1;
            }
            if(ident==null||ident==''){
                ident='123';
            }

$.ajaxSetup({headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}});

FrmData = {
                "numero_tramite":valor,
                "identificacion":ident,
                "_token":"{{ csrf_token() }}" 
            };

carga_ajax('Espere...');
            $.ajax({
                url: "{{url('tramite-ciudadano/consultar-historial')}}",
                method: 'POST',
                data: FrmData,
                dataType: 'json',
                // contentType:false,
                // cache:false,
                // processData:false,
                success: function(retorno){
                    
                    $("#dr_identificacion").html("--");
                    $("#dr_nombre").html("--");
                    $("#dt_fecha").html("--");
                    $("#dt_asunto").html("--");
                    
                    $("#content_tabla_historial").hide();
                    $("#content_detalle_tramite").hide();
                    $("#content_ttt").hide();
                    setTimeout(() => {
                        desaparecer_carga_ajax();
                    }, 500);
                    
                    if(retorno.error==false){
                        if(retorno.historial.length>0){

$("#content_tabla_historial").show();
                            $("#content_detalle_tramite").show();
                            $("#content_ttt").show();
                            $("#tabla_historial tbody").html("");
                            var contador = retorno.historial.length;
                            $.each(retorno.historial, function (i, element) {
                                
                                copia = element.destinatario_copia;
                                if(copia==null || copia==""){ 
                                    copia = "<center>--</center>" 
                                }else{
                                    arr_copia = copia.split(",");
                                    copia = "<ul style='margin: 0px; line-height: normal;'>";
                                    $.each(arr_copia, function (index, item_copia) { 
                                        copia = copia+`<li>${item_copia}</li>`;
                                    });
                                    copia = copia+"</ul>";
                                }

destinatario = element.destinatario;
                                if(destinatario==null || destinatario==""){ destinatario = "<center>--</center>"; }
                                
                                tiempo_transcurrido = element.tiempo_transcurrido;
                                if(tiempo_transcurrido==null || tiempo_transcurrido==""){ tiempo_transcurrido = "--"; }

estado_tramite = element.estado;
                                if(estado_tramite==null || estado_tramite==""){ estado_tramite="--"; }

var clase1 = "tr_normal";
                                if(i==0){ clase1 = "tr_actual"; }

$("#tabla_historial tbody").append(`
                                    <tr class="${clase1}">
                                        <td><center>${contador}</center></td>
                                        <td><div class="td_content">${element.remitente}</div></td>
                                        <td><div class="td_content">${destinatario}</div></td>
                                        <td><div class="td_content">${copia}</div></td>
                                        <td><center><div class="td_content">${element.fecha_respuesta}</div></center></td>
                                        <td><center><div class="td_content">${tiempo_transcurrido}</div></center></td>
                                        <td><center><div class="td_content">${estado_tramite}</div></center></td>
                                    </tr>
                                `);
                                contador--;
                            });
                            
                            //cargamos los datos de remitente y del tramite
                            if(retorno.dato_remitente.cedula){ $("#dr_identificacion").html(retorno.dato_remitente.cedula); }
                            if(retorno.dato_remitente.nombres){ $("#dr_nombre").html(retorno.dato_remitente.nombres); }
                            if(retorno.dato_tramite.fecha_recepcion){ $("#dt_fecha").html(retorno.dato_tramite.fecha_recepcion); }
                            if(retorno.dato_tramite.asunto){ $("#dt_asunto").html(retorno.dato_tramite.asunto); }

$("#tiempo_total").html(retorno.tiempo_transcurrido);

}else{

$("#content_tabla_historial").show();
                            $("#content_ttt").show();
                            $("#tabla_historial tbody").html(`
                                <tr>
                                    <td colspan="7">
                                        <center>No se encontr&oacute informaci&oacuten del tr&aacutemite</center>
                                    </td>
                                </tr>
                            `);
                            $("#tiempo_total").html("");

}
                    }else{

$("#content_tabla_historial").show();
                        $("#content_ttt").show();
                        $("#tabla_historial tbody").html(`
                            <tr>
                                <td colspan="7">
                                    <center>No se pudo obtener los datos del tr&aacutemite</center>
                                </td>
                            </tr>
                        `);
                        $("#tiempo_total").html("");

}
                    
                },
                complete: function(){
                    setTimeout(() => {
                        desaparecer_carga_ajax();
                    }, 500);
                },
                error: function(error){
                    setTimeout(() => {
                        $("#content_tabla_historial").hide();
                        $("#content_detalle_tramite").hide();
                        $("#content_ttt").hide();
                        desaparecer_carga_ajax();
                    }, 500);
                }
            });

}

$("#numero_tramite").on("keyup", function (e) {
            if (e.keyCode === 13) {
                consultar_historial();
            }
        });

</script>

@endsection