@extends('header_nuevo_generico')
@section('main')
<script type="text/javascript" src="{{ URL::asset('/js/vis.min.js') }}"></script>
<link rel="stylesheet" href="{{ asset('/components/trumbowyg.2.18.0/ui/trumbowyg.css') }}">
<link rel="stylesheet" href="{{ asset('/css/vis.min.css') }}">
<link rel="stylesheet" href="{{ asset('/Libreria_CA/css/fancy_fidelitas_theme.css') }}?v=2">
<style>
    .modal-header--sticky {
        position: sticky;
        top: 0;
        background-color: inherit; /* [1] */
        z-index: 1055; /* [2] */
    }
</style>
<!-- -->
<input type="hidden" id="_token" value="{{ csrf_token() }}">
<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_Usuarios_Teams','Panel Usuarios Teams')</h2>
        </div>
    </div>
    <!-- -->   
    <div class="row justify-content-center my-1">
        @foreach( $teams as $team => $usuarios )
            <div class="col-sm-12">
                <input type="hidden" class="teams" value="{{ $team }}">
                <!-- -->
                <div class="row justify-content-center my-2">
                    <div class="col-md-6 col-sm-9 border-top border-bottom border-fidelitas">
                        <h5 class="text-fidelitas text-center">{{ $usuarios->nombre_team }}</h5>
                    </div>
                </div>
                <!-- -->
                <div class="accordion" id="accordion-{{$team}}">
                    <div class="row justify-content-end">
                        <div class="col col-md-6">
                            <table class="table table-bordered table-primary my-0">
                                <thead>
                                    <tr>
                                        <th>Users</th>
                                    </tr>
                                </thead>
                            </table>
                        </div>
                        <!-- -->
                        <div class="col col-md-6">
                            <table class="table table-bordered table-primary my-0">
                                <thead>
                                    <tr>
                                        <th style="width:25%;">@traducir('Totales','Totales'): </th>
                                        <th style="width:25%;">@traducir('Listas_para_iniciar','Listas para iniciar'): </th>
                                        <th style="width:25%;">@traducir('En_proceso','En proceso'): </th>
                                        <th style="width:25%;">@traducir('En_pausa','En pausa'): </th>
                                    </tr>
                                </thead>
                            </table>
                        </div>
                    </div>
                    <!-- -->
                    @foreach( $usuarios->tareas as $user_data )
                        <div class="accordion-item" id="user-item-{{$team}}-{{$user_data->user_id}}">
                            <h2 class="accordion-header">
                                <div class="row justify-content-center">
                                    <div class="col col-md-6">
                                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-{{$team}}-{{$user_data->user_id}}" aria-expanded="false" aria-controls="collapse-{{$team}}-{{$user_data->user_id}}">
                                            {{ $user_data->first_name.' '.$user_data->last_name }} 
                                        </button>
                                    </div>
                                    <!-- -->
                                    <div class="col col-md-6">
                                        <table class="table table-bordered table-primary my-0">
                                            <thead>
                                                @if( $user_data->total_tareas && !$user_data->ready2start && !$user_data->proceso )
                                                <tr class="table-warning">
                                                @elseif( $user_data->total_tareas && $user_data->ready2start && !$user_data->proceso )
                                                <tr class="table-danger">
                                                @elseif( !$user_data->total_tareas )
                                                <tr class="table-secondary">
                                                @endif
                                                    <th style="width:25%;"><h5>{{ $user_data->total_tareas ?? '0' }}</h5> </th>
                                                    <th style="width:25%;"><h5>{{ $user_data->ready2start ?? '0' }}</h5> </th>
                                                    <th style="width:25%;"><h5>{{ $user_data->proceso ?? '0' }}</h5> </th>
                                                    <th style="width:25%;"><h5>{{ $user_data->pausa ?? '0' }}</h5> </th>
                                                </tr>
                                            </thead>
                                        </table>
                                    </div>
                                </div>
                            </h2>
                            <!-- -->
                            <div id="collapse-{{$team}}-{{$user_data->user_id}}" class="accordion-collapse collapse" data-bs-parent="#accordion-{{$team}}">
                                <div class="accordion-body">
                                    @if( !is_null($user_data->total_tareas) )
                                        <input type="hidden" class="users-{{ $team }}" value="{{$user_data->user_id}}">
                                        <div class="row justify-content-center">
                                            <div class="col-12 d-none" id="cargando-{{$team}}-{{$user_data->user_id}}">
                                                <span class="spinner-border spinner-border-sm"></span> @traducir('Cargando','Cargando') ...
                                            </div>
                                            <div class="col-12 d-none" id="datos-{{$team}}-{{$user_data->user_id}}"></div>
                                            <div class="col-12 d-none" id="error-{{$team}}-{{$user_data->user_id}}">
                                                <div class="alert alert-danger" role="alert">
                                                    <i class="bi bi-exclamation-triangle-fill"></i> @traducir('error_tabla_usuario','Ocurrió un error')
                                                </div>
                                            </div>
                                        </div>
                                    @else
                                        @traducir('sin_tareas','Sin tareas asignadas').
                                    @endif
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        @endforeach
    </div>
    <!-- -->
    <div class="row justify-content-start my-2">
        <div class="col-md-6 col-sm-9">
            <small class="text-muted">@traducir('texto_panel_usuarios','Se visualizan los usuarios de la plataforma y las tareas que tienen asignadas').</small>
            <br>
            <small class="text-muted">@traducir('visualizar','Lo que se visualizan en') <span class="text-danger">@traducir('rojo','rojo')</span> @traducir('tienen tareas','tienen tareas') <span class="text-dark">@traducir('Listas_para_iniciar','Listas para iniciar')</span> @traducir('pero ninguna','pero ninguna') <span class="text-dark">@traducir('En_proceso','En proceso')</span>. </small>
            <br>
            <small class="text-muted">@traducir('visualizar','Lo que se visualizan en') <span class="text-warning">@traducir('amarillo','amarillo')</span> @traducir('no tienen tareas','no tienen tareas') <span class="text-dark">@traducir('Listas_para_iniciar','Listas para iniciar')</span> @traducir('ni','ni') <span class="text-dark">@traducir('En_proceso','En proceso')</span>. </small>
            <br>
            <small class="text-muted">@traducir('visualizar','Lo que se visualizan en') <b class="text-secondary">@traducir('gris','gris')</b> @traducir('no tienen ninguna tareas','no tienen ninguna tareas'). </small>
        </div>
    </div>
</div>
<!-- MODAL DE EDICION TAREA INFORME -->
<div class="modal fade" id="modalTarea">
    <div class="modal-dialog modal-xl" style="max-width:1600px;">
        <div class="modal-content">
            <div class="modal-header modal-header--sticky">
                <h6 class="modal-title" id="titulo-edicion-tarea-informe"></h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="cuerpo-edicion-tarea-informe"></div>
            <!-- -->
            <div class="modal-body d-none" id="cargando-edicion-tarea-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-edicion-tarea-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>
<!-- MODAL DE DOCUMENTOS INFORME -->
<div class="modal fade" id="modalDocumentosInforme" data-bs-backdrop="static">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="titulo-informe-documentos"></h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="cuerpo-informe-documentos"></div>
            <!-- -->
            <div class="modal-body d-none" id="cargando-informe-documentos">
                <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-informe-documentos">
                <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>
<!-- MODAL DE EDICION DEL DOCUMENTO DEL INFORME -->
<div class="modal fade" id="modalEdicionDocumentoInforme" data-bs-backdrop="static">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="titulo-edicion-informe-documento"></h6>
            </div>
            <div class="modal-body" id="cuerpo-edicion-informe-documento"></div>
            <!-- -->
            <div class="modal-body d-none" id="cargando-edicion-informe-documento">
                <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-documento">
                <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-documento">
                <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" target="_blank">
    {{ 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">
    <input type="hidden" name="de_informe_tareas" value='1'>
</form>
<!-- FORMULARIO EDICION TAREA -->
<form id="frmTarea">
    {{ csrf_field() }}
    <input type="hidden" name="informe">
    <input type="hidden" name="tarea">
</form>
<!-- FORMULARIO LISTA DOCUMENTOS -->
<form id="frmDocumentosInforme">
    {{ csrf_field() }}
    <input type="hidden" name="contraparte">
    <input type="hidden" name="gestion">
</form>
@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/Js/funciones_panel_informes_blue.js') }}?v={{rand()}}"></script>
    <script src="{{ asset('/Libreria_CA/Js/funciones_panel_usuarios.js') }}?v={{rand()}}"></script>
    <script>
        $(document).ready(function(){
            PanelUsuarios();
        });
    </script>
@endsection