@extends('header_nuevo_generico')
@section('main')
<script type="text/javascript" src="{{ URL::asset('/js/vis.min.js') }}"></script>
<link rel="stylesheet" href="{{ asset('/css/vis.min.css') }}">
<link rel="stylesheet" href="{{ asset('/components/trumbowyg.2.18.0/ui/trumbowyg.css') }}">
<style>
    .modal-header--sticky {
        position: sticky;
        top: 0;
        background-color: inherit; /* [1] */
        z-index: 1055; /* [2] */
    }
</style>
<!-- --> 
<div class="container-fluid mt-5 pt-5">
    <!--  -->
    <div class="row justify-content-center my-2">
        <div class="col-md-6 col-sm-9">
            <h2 class="text-fidelitas display-6 text-center">@traducir('Panel de Informes','Panel de Informes')</h2>
        </div>
    </div>
    <!-- -->        
    <form id="frmBuscarInforme" method="POST" class="card shadow p-1">
        <input type="hidden" id='token' name="_token" value="{{ csrf_token() }}" />
        <input type="hidden" name="id_padron" id="id_padron">
        <input type="hidden" name="fech_publicado" id="fech_publicado" value="0">
        <input type="hidden" name="fech_creado" id="fech_creado" value="0">
        <!-- -->
        <div class="row justify-content-start my-2">
            <!-- selector clientes -->
            <div class="text-start col-lg-3 col-md-4">
                <span class="text-muted">@traducir('Elegir el cliente','Elegir el cliente')</span>
                <select style="cursor:pointer;" name="cliente" id="cliente" class="form-select" aria-placeholder="clientes" autocomplete="off" >
                    <option value="">@traducir('Sin definir cliente','Sin definir cliente')</option>
                    @foreach( $clientes as $cliente )
                        <option value="{{ $cliente->cliente }}">{{$cliente->nombre_cliente}}</option>
                    @endforeach
                </select>
            </div>
            <!--  -->
            <!-- selector tipo informes -->
            <div class="text-start col-lg-3 col-md-4">
                <span class="text-muted">@traducir('Elegir el informe','Elegir el informe')</span>
                <select style="cursor:pointer;" name="tipo_informe" id="tipo_informe" class="form-select" aria-placeholder="informes" autocomplete="off" >
                    <option value="">@traducir('Sin definir tipo informe','Sin definir tipo informe')</option>
                    @foreach( $tipos_informes as $informe )
                        <option value="{{ $informe->idTipoInforme }}">{{$informe->nombre_tipo_informe}}</option>
                    @endforeach
                </select>
            </div>
            <!--  -->
            <!-- selector paises -->
            <div class="text-start col-lg-2 col-md-2">
                <span class="text-muted">@traducir('Elegir el país','Elegir el país')</span>
                <select style="cursor:pointer;" name="pais" id="pais" class="form-select" aria-placeholder="país" autocomplete="off" >
                    <option value="">@traducir('Sin definir país','Sin definir país')</option>
                    @foreach( $paises as $pais )
                        <option value="{{ $pais->country_code }}">{{$pais->nombre_pais}}</option>
                    @endforeach
                </select>
            </div>
            <!--  -->
            <!-- selector estado -->
            <div class="text-start col-lg-2 col-md-2">
                <span class="text-muted">@traducir('Elegir el estado','Elegir el estado')</span>
                <select style="cursor:pointer;" name="estado" id="estado" class="form-select" aria-placeholder="estado" autocomplete="off" >
                    <option value="">@traducir('Sin definir estado','Sin definir estado')</option>
                    <option value="N">@traducir('Anulado','Anulado')</option>
                    <option value="K">@traducir('Aprobado','Aprobado')</option>
                    <option value="P">@traducir('En gestión','En gestión')</option>
                    <option value="E">@traducir('En proceso','En proceso')</option>
                    {{--<option value="D">@traducir('en_control','En control')</option>
                    <option value="B">@traducir('en_redaccion','En redacción')</option>--}}
                    <option value="W">@traducir('En espera','En espera')</option>
                    <option value="A">@traducir('No calificado','No calificado')</option>
                    <option value="I">@traducir('Ingresado','Ingresado')</option>
                    <option value="X">@traducir('Carga Comercial','Carga Comercial')</option>
                    <option value="T">@traducir('Respondido','Respondido')</option>
                    <option value="M">@traducir('A Completar','A Completar')</option>
                    <option value="F">@traducir('Finalizado','Finalizado')</option>
                    <option value="R">@traducir('Observado','Observado')</option>
                    <option value="C">@traducir('Rechazado','Rechazado')</option>
                </select>
            </div>
            <!--  -->
            <!-- chekbox doks_ok -->
            {{--<div class="d-flex align-items-end justify-content-start col-lg-1 col-md-1">
                <div class="form-check">
                    <input class="form-check-input" style="cursor:pointer;" type="checkbox" name="docks-ok" id="docks-ok">
                    <label class="form-check-label ps-2" style="cursor:pointer;" for="docks-ok">
                        @traducir('Docs ok','Docs ok')
                    </label>
                </div>
            </div>--}}
            <!--  -->
            <!-- chekbox Publicados -->
            <div class="d-flex align-items-end justify-content-start col-lg-2 col-md-2">
                <div class="form-check">
                    <input class="form-check-input" style="cursor:pointer;" type="checkbox" name="publicado" id="publicado" value="1">
                    <label class="form-check-label ps-2" style="cursor:pointer;" for="publicado">
                        @traducir('Publicado','Publicado')
                    </label>
                </div>
            </div>
            <!--  -->
        </div>
        <!-- -->
        <div class="row d-flex justify-content-start align-items-center my-2">
            <div class="col-lg-6 col-md-6">
                <div class='row justify-content-center mb-1'>
                    <small class="text-secondary text-center">@traducir('Ingrese CUIT CUIL DNI o nombre completo para realizar una búsqueda','Ingrese CUIT CUIL DNI o nombre completo para realizar una búsqueda')</small>
                </div>    
                <div class='input-group'>
                    <input type="text" id='buscarPadron' name='buscarPadron' value='' class='form-control text-center' list='lista_clientes' placeholder='@traducir("Buscar en Padrón","Buscar en Padrón")...' autocomplete='off'>
                    <input type="text" id='padron_static' name='padron_static' value='' class='form-control text-center d-none' autocomplete='off' readonly>
                    <button type="submit" class='btn btn-outline-fidelitas' id="btnIconLupa">
                        <i id="lupaPersona" class="bi bi-search fs-5"></i>
                        <span id="spinnerLoading" class="spinner-border spinner-border-sm fs-4 d-none" role="status" aria-hidden="true"></span>
                    </button>
                    <!--  -->
                    <button type="button" class='input-group-text btn-danger d-none' id="btnIconEquis">
                        <i id="iconXLarge" class="bi bi-x-lg fs-4"></i>
                    </button>
                </div>
                <div id='notificacion' class='mt-2'></div>
                <div id='lista_padron' class='overflow-auto col-12 py-2 list-group'></div>
            </div>
            <div class="col-md-2">
                <div class="input-group" style="cursor:pointer;">
                    <span class="input-group-text" id="texto-desde">@traducir('Desde','Desde'):</span>
                    <input type="hidden" id="fecha_desde_oculto" name="fecha_desde">
                    <input style="cursor:pointer;" type="text" id="fecha_desde" class="form-control" placeholder="Fecha Desde" aria-label="Fecha Desde" aria-describedby="texto-desde">
                </div>
            </div>
            <!-- -->
            <div class="col-md-2">
                <div class="input-group" style="cursor:pointer;">
                    <span class="input-group-text" id="texto-hasta">@traducir('Hasta','Hasta'):</span>
                    <input type="hidden" id="fecha_hasta_oculto" name="fecha_hasta">
                    <input style="cursor:pointer;" type="text" id="fecha_hasta" class="form-control" placeholder="Fecha Hasta" aria-label="Fecha Hasta" aria-describedby="texto-hasta">
                </div>
            </div>
            <!-- radio fecha Publicado -->
            <div class="d-flex align-items-end justify-content-start col-lg-1 col-md-1">
                <div class="form-check">
                    <input class="form-check-input" style="cursor:pointer;" type="radio" name="radiosFechas" id="radio-publicado" checked>
                    <label class="form-check-label ps-2" style="cursor:pointer;" for="radio-publicado">
                        @traducir('Fech. Publicado','Fech. Publicado')
                    </label>
                </div>
            </div>
            <!-- radio fecha Creado -->
            <div class="d-flex align-items-end justify-content-start col-lg-1 col-md-1">
                <div class="form-check">
                    <input class="form-check-input" style="cursor:pointer;" type="radio" name="radiosFechas" id="radio-creado">
                    <label class="form-check-label ps-2" style="cursor:pointer;" for="radio-creado">
                        @traducir('Fech. Creado','Fech. Creado')
                    </label>
                </div>
            </div>
            <!--  -->
        </div>
        <!-- -->
        <div class="row justify-content-center my-2">
            <div class="col-md-4 text-center d-grid">
                <button id="btnPanelBuscar" type="button" class="btn btn-sm btn-fidelitas"><i class="bi bi-search"></i> @traducir('Buscar','Buscar')</button>
            </div>
        </div>
        <!-- ALERTAS -->
        <div class="row justify-content-center my-2 d-none" id="alertFechaMayor">
            <div class="col-md-10 text-center alert alert-danger" role="alert">
                @traducir('La fecha DESDE no puede ser mayor a la fecha HASTA. Por favor vuelva a intentarlo.','La fecha DESDE no puede ser mayor a la fecha HASTA. Por favor vuelva a intentarlo.')
            </div>
        </div>
        <div class="row justify-content-center my-2 d-none" id="alertFechasVacias">
            <div class="col-md-10 text-center alert alert-danger" role="alert">
                @traducir('Es necesario completar los campos fecha. Por favor vuelva a intentarlo.','Es necesario completar los campos fecha. Por favor vuelva a intentarlo.')
            </div>
        </div>
        <div class="row justify-content-center my-2 d-none" id="alertCamposVacios">
            <div class="col-md-10 text-center alert alert-danger" role="alert">
                @traducir('Es necesario completar algun campo (cliente - nombre persona - identificacion). Por favor vuelva a intentarlo.','Es necesario completar algun campo (cliente - nombre persona - identificacion). Por favor vuelva a intentarlo.')
            </div>
        </div>
        <!-- LOADING TABLA -->
        <div id="loadingInformes" class="row mb-3 justify-content-center d-none">
            <div class="col-12 col-md-3 mt-5">
                <div class="spinner-border text-fidelitas"></div><span class="text-fidelitas fs-2 ms-2">@traducir('Cargando','Cargando')...</span>
            </div>
        </div>
        <!-- -->
        <div class="d-none" id="contenido_busqueda_informes">
            <div class="row justify-content-center my-3">
                <div class="col-xl-3 col-lg-4 col-md-6 col-sm-9 border-top border-bottom border-fidelitas">
                    <h4 class="text-fidelitas text-center mb-0">@traducir('Informes de la consulta','Informes de la consulta')</h4>
                </div>
            </div>
            <!-- -->
            <div class="row justify-content-center my-2">
                <div class="col-md-12" id="contenido_informes">
                </div>
            </div>
        </div>
    </form>
</div>

<!-- MODAL DE EDICION DEL INFORME -->
<div class="modal fade" id="modalEdicionInforme" >
    <div class="modal-dialog" style="max-width:1600px;">
        <div class="modal-content">
            <div class="modal-header modal-header--sticky">
                <h6 class="modal-title">
                    <span id="titulo-edicion-informe"></span> &nbsp;&nbsp;-&nbsp;&nbsp;
                    <span id="texto-no-publicado" class="text-danger d-none"> El informe no esta publicado</span>
                    <span id="texto-publicado" class="text-success d-none">El informe esta publicado</span><br>
                    <span id="titulo-data-contraparte" class="text-muted"></span>                            
                </h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="cuerpo-edicion-informe"></div>
            <!-- -->
            <div class="modal-body d-none" id="cargando-edicion-informe">
                <h6 class="lead text-fidelitas text-center">@traducir('Cargando','Cargando')... <div class="spinner-border text-fidelitas"></div></h6>
            </div>
            <!-- -->
            <div class="modal-body d-none" id="exito-edicion-informe">
                <h6 class="text-success lead"><i class="bi bi-check-lg"></i> @traducir('Datos guardados con éxito','Datos guardados con éxito'). </h6>
            </div>
            <!-- -->
            <div class="modal-body d-none" id="error-edicion-informe">
                <div class="alert alert-danger">
                    <i class="bi bi-exclamation-triangle-fill"></i> @traducir('Ocurrio un error','Ocurrio un error')
                </div>
            </div>
            <!-- -->
            <div class="row justify-content-center d-none" id="error-especial-edicion-informe">
                <div class="col-3 alert alert-danger">
                    <i class="bi bi-exclamation-triangle-fill"></i> <span id="texto-error-especial-edicion-informe"></span>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- MODAL DE MAPA INFORMES -->
<div class="modal fade" id="modalMapaInforme">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="titulo-mapa-informe"></h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="cuerpo-mapa-informe">
                <div class="row justify-content-center text-fidelitas">
                    <p class="text-center">@traducir('texto_mapa_informe','Se visualizan los documentos y las tareas del informe y sus correspondientes estados')</p>
                    <small class="text-center text-muted">@traducir('explicacion_mapa_informe','Para visualizar el estado del nodo, apunte el raton sobre el nodo')</small>
                </div>
                <div style="height:400px;width:100%;" id="mapa-informe"></div>
            </div>
            <!-- -->
            <div class="modal-body d-none" id="cargando-mapa-informe">
                <h6 class="lead text-fidelitas text-center">@traducir('Cargando los Documentos','Cargando los Documentos')... <div class="spinner-border text-fidelitas"></div></h6>
            </div>
            <!-- -->
            <div class="modal-body d-none" id="error-mapa-informe">
                <div class="alert alert-danger">
                    <i class="bi bi-exclamation-triangle-fill"></i> @traducir('Ocurrio un error','Ocurrio un error')
                </div>
            </div>
        </div>
    </div>
</div>
<!-- FORMULARIO ACCEDER A INFORME -->
<form id="frmReports" method="post" action="/blue/servicios-contratados-contrapartes-acciones">
    {{ csrf_field() }}
    <input type="hidden" name="accion" value="reportes">
    <input type="hidden" name="contraparte" value="">
    <input type="hidden" name="cli_cuit" value="20111111112">
    <input type="hidden" name="cli_codigo" value="5680">
    <input type="hidden" name="desde_contraparte_generico" value="0">
    <input type="hidden" name="desde_mis_tareas" value="1">
</form>
<!-- FORMULARIO DEL MODAL DE EDITAR INFORME -->
<form id="frmTareasInforme">
    {{ csrf_field() }}
    <input type="hidden" name="informe">
</form>s
<!--  -->
@endsection
@section('funcionesJS')
<script src="{{ asset('/components/trumbowyg.2.18.0/trumbowyg.min.js') }}"></script>
<script src="{{ asset('/components/trumbowyg.2.18.0/langs/es.min.js') }}"></script>
<script src="{{ asset('/components/trumbowyg.2.18.0/plugins/fontfamily/trumbowyg.fontfamily.min.js') }}"></script>
<script src="{{ asset('/components/trumbowyg.2.18.0/plugins/fontsize/trumbowyg.fontsize.min.js') }}"></script>
<!-- -->
<script src="{{ asset('/Libreria_CA/Momentjs-2.29.2/moment.js') }}"></script>
<script src="{{ asset('/Libreria_CA/Momentjs-2.29.2/datetime_moment.js') }}"></script>
<!-- -->
<script src="{{ asset('/Libreria_CA/Js/funciones.js') }}??v={{rand()}}"></script>
<script src="{{ asset('/Libreria_CA/Js/funciones_panel_informes_blue.js') }}?v={{rand()}}"></script>
<script>
    $(document).ready(function(){
        cargarDatePickers();
        buscarPadronPanelInformes();
        panelInformes();
    });
</script>
@endsection