@extends('layouts.menu')

@section('tittle')
    DASHBOARD
@endsection


@section('contenido')
    <h3 class="page-tittle">BIENVENIDO {{ Session::get('fullName') }} - <i
            class="text-uppercase">{{ Session::get('userProfile') }}</i></h3>

    <br>
    <div class="row">

        <div class="col d-flex text-nowrap p-2">
            <a href="{{ url('/admin/abrir/tickets/comunes') }}" class="w-100">
                <button type="button" class="btn btn-primary w-100 text-center" id="abrirTicket">Abrir Ticket</button>
            </a>
        </div>

        <div class="col d-flex text-nowrap p-2">

            <a href="#modalVerFila" type="button" class="btn btn-primary btnModalFila w-100" id="btnModalFila"
                title="Ver Fila" data-bs-toggle="modal" data-bs-target="#modalVerFila">
                Ver Fila&nbsp;<i class="fas fa-list-ul ml-2"></i>
            </a>

        </div>

        @if (Session::get('resuelveTicketComun') == 1)
            <div class="col d-flex text-nowrap p-2">
                <a href="{{ url('/admin/abrir/tickets/admin') }}" class="w-100">
                    <button type="button" class="btn btn-warning w-100 text-center">Abrir Ticket
                        Admin</button>
                </a>
            </div>
        @endif

        @if (Session::get('adminIT') == 'adminIT' or Session::get('firstCallIT') == 1101030)
            <div class="col d-flex text-nowrap p-2">
                <a href="#modalFirstCall" id="startFirstCall" class="w-100" data-dismiss="modal"
                    data-target="#modalFirstCall">
                    <button type="button" class="btn btn-dark w-100 text-center">Iniciar First Call
                        </button>
                </a>
            </div>

            <div class="col d-flex text-nowrap p-2">
                <a href="{{ url('/admin/indicadores/firstCallIT') }}" class="w-100">
                    <button type="button" class="btn btn-danger w-100 text-center">First Call
                        </button>
                </a>
            </div>
        @endif

        @if (Session::get('adminIT') == 'adminIT')
            <div class="col d-flex text-nowrap p-2">
                <a href="#modalOnSiteSupport" id="startONSITESupport" class="w-100" data-dismiss="modal"
                    data-target="#modalOnSiteSupport">
                    <button type="button" class="btn btn-success w-100 text-center">Iniciar Support IT</button>
                </a>
            </div>

            <div class="col d-flex text-nowrap p-2">
                <a href="{{ url('/admin/indicadores/onsite/support') }}" class="w-100">
                    <button type="button" class="btn btn-warning w-100 text-center">Support IT</button>
                </a>
            </div>
        @endif

        {{-- <div class="col d-flex text-nowrap p-2">
            <a href="#modalCola" class="w-100" data-target="#modalCola" data-dismiss="modal">
                <button type="button" class="btn btn-info w-100 text-center" id="listColaTickets"
                    data-dismiss="modal">Lista de Tickets</button>
            </a>
        </div> --}}

        @if (Session::get('aceptarSolicitudes') == 1101190 or Session::get('adminIT') == 'adminIT')
            <div class="col d-flex text-nowrap p-2">
                <a href="{{ url('/admin/aprobar/tickets/comunes') }}" class="w-100">
                    <button type="button" class="btn btn-secondary w-100 text-center">Aprobar
                        Ticket</button>
                </a>
            </div>
        @endif

        @if (Session::get('resuelveTicketComun') == 1)
            <div class="col d-flex text-nowrap p-2">
                <a href="{{ url('/admin/resolver/tickets/comunes') }}" class="w-100">
                    <button type="button" class="btn w-100 text-center text-black" style="background-color: #f88e68 !important">Resolver
                        Ticket</button>
                </a>
            </div>
        @endif

    </div>
    <hr>

    {{-- USUARIOS ACTIVOS ASISTENCIA AND INFRAESTRUCTURAS EN FALLA --}}
    <div class="row">

        <div class="col-lg-6 rightBorderStyle">
            <div class="row">
                <div class="row">
                    <span><b>Usuarios Activos Asistencia</b></span>
                </div>
                <div class="row">
                    <b>Llamar a la línea: 606</b>
                </div>
                <div class="row">
                    <b>Hora Final: <b id="last_hour"></b> </b>
                </div>
            </div>
            <div class="row" id="usuariosAsistencia">

            </div>
            <br>
            <div id="asistenciaButtons">
                @if (Session::get('adminIT') == 'adminIT')
                    <button type="button" class="btn btn-primary startAsistencia" id="startAsistencia">Iniciar
                        Asistencia</button>
                    <button type="button" class="btn btn-warning endAsistencia" id="endAsistencia">Finalizar
                        Asistencia</button>
                @else
                    <button type="button" class="btn btn-warning text-center" id="btnSolicitarAsistencia">Solicitar
                        Asistencia</button>
                @endif
            </div>
        </div>


        <div class="col-lg-6">
            <div class="row">
                <div class="row">
                    <span><b>Infraestructuras en Falla</b></span>
                </div>
            </div>
            <div class="row" id="infraestructurasCaidas">

            </div>
            <br>
        </div>


    </div>

    <hr>
    <div class="row">
        <br>
        <span><b>Anuncios Importantes</b></span>
        <br>
    </div>
    <br>
    <div class="wrapper" id="anunciosImportantes">

    </div>
    <br>

    <hr>
    <div class="row">
        <br>
        <span><b>Resumen Mis Tickets</b></span>
        <br>
    </div>
    <br>

    {{-- DASHBOARD MAIN CARDS --}}
    <div class="row">

        <div class="col d-flex">
            <div class="card bg-comman shadow-lg dashboardConteoCards w-100 ">
                <div class="card-body">
                    <div class="db-widgets d-flex justify-content-between align-items-center">
                        <div class="db-info">
                            <h6 class="text-center">Total</h6>
                            <h3 class="text-center" id="cantAll"> 0</h3>
                        </div>
                        <div class="db-icon">
                            <img src="https://www.svgrepo.com/show/104705/counting.svg" class="dashIcon"
                                alt="Dashboard Icon">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        @if (Session::get('userProfile') != 'adminIT')
            <div class="col d-flex">
                <div class="card bg-comman shadow-lg dashboardConteoCards w-100">
                    <div class="card-body">
                        <div class="db-widgets d-flex justify-content-between align-items-center">
                            <div class="db-info">
                                <h6 class="text-center">Pendientes</h6>
                                <h3 class="text-center" id="esperaAprobacion"> 0</h3>
                            </div>
                            <div class="db-icon">
                                <img src="https://www.svgrepo.com/show/411770/wait.svg" class="dashIcon"
                                    alt="Dashboard Icon">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col d-flex">
                <div class="card bg-comman shadow-lg dashboardConteoCards w-100">
                    <div class="card-body">
                        <div class="db-widgets d-flex justify-content-between align-items-center">
                            <div class="db-info">
                                <h6 class="text-center">Aprobadas</h6>
                                <h3 class="text-center" id="cantAprobadas"> 0</h3>
                            </div>
                            <div class="db-icon">
                                <img src="https://img.icons8.com/fluency/256/checked.png" class="dashIcon"
                                    alt="Dashboard Icon">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        @endif

        <div class="col d-flex">
            <div class="card bg-comman shadow-lg dashboardConteoCards w-100">
                <div class="card-body">
                    <div class="db-widgets d-flex justify-content-between align-items-center">
                        <div class="db-info">
                            <h6 class="text-center">Asignadas</h6>
                            <h3 class="text-center" id="cantAsignada"> 0</h3>
                        </div>
                        <div class="db-icon">
                            <img src="https://img.icons8.com/external-flaticons-lineal-color-flat-icons/256/external-assignment-online-education-flaticons-lineal-color-flat-icons-3.png"
                                class="dashIcon" alt="Dashboard Icon">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col d-flex">
            <div class="card bg-comman shadow-lg dashboardConteoCards w-100">
                <div class="card-body">
                    <div class="db-widgets d-flex justify-content-between align-items-center">
                        <div class="db-info">
                            <h6 class="text-center">Proceso</h6>
                            <h3 class="text-center" id="cantProceso"> 0</h3>
                        </div>
                        <div class="db-icon">
                            <img src="https://img.icons8.com/external-flaticons-lineal-color-flat-icons/256/external-process-productivity-flaticons-lineal-color-flat-icons-2.png"
                                class="dashIcon" alt="Dashboard Icon">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col d-flex">
            <div class="card bg-comman shadow-lg dashboardConteoCards w-100">
                <div class="card-body">
                    <div class="db-widgets d-flex justify-content-between align-items-center">
                        <div class="db-info">
                            <h6 class="text-center">Pausa</h6>
                            <h3 class="text-center" id="cantPausa"> 0</h3>
                        </div>
                        <div class="db-icon">
                            <img src="https://img.icons8.com/external-prettycons-lineal-color-prettycons/256/external-pause-essentials-prettycons-lineal-color-prettycons.png"
                                class="dashIcon" alt="Dashboard Icon">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col d-flex">
            <div class="card bg-comman shadow-lg dashboardConteoCards w-100">
                <div class="card-body">
                    <div class="db-widgets d-flex justify-content-between align-items-center">
                        <div class="db-info">
                            <h6 class="text-center">Finalizadas</h6>
                            <h3 class="text-center" id="cantFinalizada"> 0</h3>
                        </div>
                        <div class="db-icon">
                            <img src="https://img.icons8.com/external-prettycons-lineal-color-prettycons/256/external-completed-education-prettycons-lineal-color-prettycons.png"
                                class="dashIcon" alt="Dashboard Icon">
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col d-flex">
            <div class="card bg-comman shadow-lg dashboardConteoCards w-100">
                <div class="card-body">
                    <div class="db-widgets d-flex justify-content-between align-items-center">
                        <div class="db-info">
                            <h6 class="text-center">Rechazadas</h6>
                            <h3 class="text-center" id="cantRechazadas"> 0</h3>
                        </div>
                        <div class="db-icon">
                            <img src="https://www.svgrepo.com/show/395697/cancel-remove-delete-cross.svg" class="dashIcon"
                                alt="Dashboard Icon">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- TICKETS LAST 15 DAYS --}}
    <div class="row">
        <hr>
    </div>
    <div class="row">
        <div class="row">
            <span><b>Tickets Últimos 15 días</b></span>
            <br>
        </div>
    </div>
    <br>
    <div class="row">
        <div class="col-lg-2">
            <label for=""><b>Filtrar</b></label>
            <input type="text" class="form-control form-control-sm" name="search_15_days" id="search_15_days"
                placeholder="">
        </div>
    </div>
    <br>

    <div class="row">
        <div class="col-lg-12">
            <div class="wrapper" id="cards15Días">

            </div>
        </div>
    </div>


    {{-- SOLICITUDES Y CONSULTAS EN PROCESO POR FINALIZAR --}}
    <div class="row">
        <hr>
    </div>
    <div class="row">
        <div class="row">
            <span><b>Tickets Sin Asignar, Asignados, En Proceso y Pausados</b></span>
            <br>
        </div>
    </div>
    <br>
    <div class="row">
        <div class="col-lg-2">
            <label for=""><b>Filtrar</b></label>
            <input type="text" class="form-control form-control-sm" name="search" id="search" placeholder="">
        </div>
    </div>
    <br>
    <div class="row">
        <div class="row">
            <div class="col-lg-6">
                <span><b>Tickets sin Asignar</b></span>
                <div class="wrapper" id="cardsSinAsignar">

                </div>
            </div>
            <div class="col-lg-6">
                <span><b>Tickets Asignados</b></span>
                <div class="wrapper" id="cardsAsignados">

                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-lg-6">
                <span><b>Tickets en Proceso</b></span>
                <div class="wrapper" id="cardsFinalizar">

                </div>
            </div>
            <div class="col-lg-6">
                <span><b>Tickets Pausados</b></span>
                <div class="wrapper" id="cardsPausados">

                </div>
            </div>
        </div>
    </div>

    {{-- SOLICITUDES POR APROBAR --}}
    <br>

    <div class="row">
        <hr>
    </div>

    <br>

    <div class="row">
        @if (Session::get('ticketsPendientes') == '1101270' or Session::get('resuelveTicketComun') == '1')
            <div class="row">
                <br>
                <span><b>Tickets Pendientes</b></span>
                <br>
            </div>
            <br>

            @if (Session::get('adminIT') == 'adminIT')
                <div class="col-lg-6">
                @elseif (Session::get('resuelveTicketComun') == '1' and Session::get('ticketsPendientes') == '1101270')
                    <div class="col-lg-6">
                    @elseif (Session::get('resuelveTicketComun') != '1' and Session::get('ticketsPendientes') == '1101270')
                        <div class="col-lg-6">
                        @elseif (Session::get('resuelveTicketComun') == '1' and Session::get('ticketsPendientes') != '1101270')
                            <div class="col-lg-6" style="display: none">
                            @else
                                <div style="display: none;">
            @endif
            <div class="" id="solicitudesSection">
                <div class="card card-table comman-shadow shadow-lg bg-solicitudes ">
                    <div class="card-body">
                        <div class="row align-items-center">
                            <div class="col">
                                <h3 class="page-title">Tickets por Aceptar</h3>
                            </div>
                        </div>
                        <div class="table-responsive">
                            <table id="solicitudesXaprobar"
                                class="table table-hover table-center table-bordered table-striped" style="width:100%">
                                <thead class="thead-light">
                                    <tr>
                                        <th class="text-center">#</th>
                                        <th class="text-center">Asunto</th>
                                        <th class="text-center">Descripción</th>
                                        <th class="text-center">Solicitado por</th>
                                        <th class="text-center">Fecha Solicitado</th>
                                        <th class="text-center">Prioridad</th>
                                    </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
    </div>

    @if (Session::get('adminIT') == 'adminIT')
        <div class="col-lg-6">
        @elseif (Session::get('resuelveTicketComun') != '1' and Session::get('ticketsPendientes') != '1101270')
            <div class="col-lg-6" style="display: none">
            @elseif (Session::get('resuelveTicketComun') == '1' and Session::get('ticketsPendientes') != '1101270')
                <div class="col-lg-12">
                @elseif (Session::get('resuelveTicketComun') == '1' and Session::get('ticketsPendientes') == '1101270')
                    <div class="col-lg-6">
                    @elseif (Session::get('resuelveTicketComun') != '1' and Session::get('ticketsPendientes') == '1101270')
                        <div class="col-lg-6">
    @endif

    <div class="card card-table comman-shadow shadow-lg bg-solicitudes ">
        <div class="card-body">
            <div class="row align-items-center">
                <div class="col">
                    <h3 class="page-title">Tickets en Espera Aprobación</h3>
                </div>
            </div>
            <div class="table-responsive">
                <table id="ticketsEspera" class="table table-hover table-center table-bordered table-striped"
                    style="width:100%">
                    <thead class="thead-light">
                        <tr>
                            <th class="text-center">#</th>
                            <th class="text-center">Asunto</th>
                            <th class="text-center">Descripción</th>
                            <th class="text-center">Solicitado por</th>
                            <th class="text-center">Autoriza | Rechaza</th>
                            <th class="text-center">Fecha Solicitado</th>
                            <th class="text-center">Prioridad</th>
                        </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>
            </div>
        </div>
    </div>
    </div>
    @endif
    {{-- </div> --}}

    {{-- MODAL COLA TICKETS --}}
    <div class="modal fade" id="modalCola" data-bs-keyboard="false" data-bs-backdrop="static" role="dialog"
        aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-fullscreen">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel"></h5>
                    <button type="button" class="btn btn-secondary btnCerrar" id="btnCerrar"
                        data-dismiss="modal">Cerrar</button>
                </div>
                <div class="modal-body">

                    <div class="row">
                        <div class="table-responsive">
                            <table id="tablaCola" class="table table-hover table-center table-bordered table-striped"
                                style="width:100%">
                                <thead class="thead-light">
                                    <tr>
                                        <th class="text-center"># Cola</th>
                                        <th class="text-center">Asunto</th>
                                        <th class="text-center">Descripción</th>
                                        <th class="text-center">Prioridad</th>
                                        <th class="text-center">Estado</th>
                                        <th class="text-center">Enviada Por</th>
                                        <th class="text-center">Asignada Por</th>
                                        <th class="text-center">Fecha Aprobada</th>
                                        <th class="text-center">Fecha Asignada</th>
                                        <th class="text-center">Fecha Proceso</th>
                                        <th class="text-center">Fecha Pausa</th>
                                        <th class="text-center">Comentario Pausa</th>
                                        <th class="text-center">Fecha Reanudado</th>
                                        <th class="text-center">Fecha Estimada</th>
                                    </tr>
                                </thead>
                                <tbody>

                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary btnCerrar" id="btnCerrar"
                            data-dismiss="modal">Cerrar</button>
                    </div>
                </div>
            </div>
        </div>
    </div>

    @php
        use Illuminate\Support\Facades\DB;
        use Illuminate\Support\Facades\Session;

        $gruposDataNew = DB::connection('universalConn')->select('CALL SDK_GET_GRUPOS_X_USER_APROBAR(?)', [
            Session::get('user_id'),
        ]);

        $sucursalesData = DB::connection('universalConn')->select('CALL SDK_GET_SUCURSALES()');

        $gruposDataAll = DB::connection('universalConn')->select('CALL SDK_GET_GROUPS_X_ACCESS(?, ?)', [
            Session::get('user_id'),
            0,
        ]);
    @endphp

    {{-- MODAL SOLICITAR ASISTENCIA --}}
    <div class="modal fade" id="modalTicketAsistenciaDirecta" data-bs-keyboard="false" data-bs-backdrop="static"
        role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">SOLICITUD DE ASISTENCIA</h5>
                </div>
                <div class="modal-body">

                    <div class="row">
                        <div class="col-lg-4">
                            <div class="form-group">
                                <label for="" class="col-form-label" for="asuntoBox">Asunto:</label>
                                <input type="text" class="form-control form-control-sm textControls" name="asuntoBox"
                                    id="asuntoBox" value="SOLICITUD DE ASISTENCIA" readonly>
                            </div>
                        </div>

                        <div class="col-lg-4">
                            <div class="row">
                                <div class="form-group">
                                    <label for="" class="col-form-label" for="grupoSelectTicket">Área:</label>
                                    <select type="text" class="form-select form-select-sm selectControls"
                                        name="grupoSelectTicket" id="grupoSelectTicket">
                                        <option value="0">Seleccione una opción</option>
                                        @foreach ($gruposDataNew as $grupo)
                                            <option value="{{ $grupo->id_grupo }}">{{ $grupo->nombre }}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                        </div>

                        <div class="col-lg-4">
                            <div class="form-group">
                                <label for="" class="col-form-label" for="sucursalBox">Sucursal:</label>
                                <select type="text" class="form-select form-select-sm selectControls"
                                    name="sucursalBox" id="sucursalBox">
                                    <option value="0">Seleccione una opción</option>
                                    @foreach ($sucursalesData as $sucursal)
                                        <option value="{{ $sucursal->id }}">{{ $sucursal->sucursal }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                    </div>

                    <div class="row">
                        <div class="col-lg-12">
                            <div class="form-group">
                                <label for="" class="col-form-label textControls"
                                    for="descripcionBox">Descripción o
                                    Requisitos:</label>
                                <textarea name="descripcionBox" id="descripcionBox" class="form-control textControlsArea" cols="8"
                                    rows="3"></textarea>
                                <div class="requisitosTXT">

                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="row">
                        <div class="form-group">
                            <label for="" class="col-form-label textControls"
                                for="justificacionBox">Justificación:</label>
                            <textarea name="justificacionBox" id="justificacionBox" class="form-control textControlsArea" cols="8"
                                rows="3"></textarea>
                        </div>
                    </div>

                    <div class="modal-footer">

                        <input type="hidden" id="auto_directo" class="form-control form-control-sm" value="1">
                        <input type="hidden" id="escala_val" class="form-control form-control-sm" value="0">
                        <input type="hidden" id="location_val" class="form-control form-control-sm" value="0">

                        <input type="hidden" id="id_ticket_comun" class="form-control form-control-sm" value="159">

                        <button type="submit" id="btnM_Save_SolicitarAsistencia"
                            class="btn btn-success">Guardar</button>
                        <button type="button" class="btn btn-secondary" id="btnM_Cerrar_SolicitarAsistencia"
                            data-dismiss="modal">Cancelar</button>
                    </div>


                </div>
            </div>
        </div>
    </div>

    @include('layouts.modalFirstCall')

    @include('layouts.modal_fila_tickets')

@endsection

@section('scripts')
    <script>
        $(document).ready(function() {
            $('#dashboardMenu').addClass('active');

            $('#modalFirstCall').on('shown.bs.modal', function(e) {
                $(".usuario_solicita").chosen({
                    width: "100%"
                });
            });


            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token',
                                $(
                                    'meta[name="csrf-token"]'
                                ).attr('content'));
                        }
                    },
                    url: "{{ url('/api/notification/comentarios/dashboard') }}",
                    success: function(data) {
                        if (data.save == 1) {
                            if (data.conteo >= 1) {
                                Swal.fire({
                                    title: "TICKETS CON COMENTARIOS PENDIENTES",
                                    text: "Responde los comentarios pendientes para continuar con la Gestión de los Tickets!",
                                    icon: "warning",
                                    showCancelButton: true,
                                    confirmButtonColor: '#3085d6',
                                    cancelButtonColor: '#d33',
                                    confirmButtonText: 'Ver Tickets'
                                }).then((result) => {
                                    if (result.isConfirmed) {

                                        window.location =
                                            "{{ url('/user/solicitudes/gestionUser/comment') }}";

                                    }
                                });
                            }
                        }
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }

            /* SOLICITAR ASISTENCIA ACTIVA */
            $('#btnSolicitarAsistencia').click(function(e) {
                e.preventDefault();

                $('#descripcionBox').css('display', 'none');
                $('.requisitosTXT').css('display', 'contents');

                try {
                    $.ajax({
                        beforeSend: function(xhr, type) {
                            if (!type.crossDomain) {
                                xhr.setRequestHeader('X-CSRF-Token', $(
                                    'meta[name="csrf-token"]').attr('content'));
                            }
                        },
                        url: "{{ url('/api/get/input/requisitos') }}",
                        method: "POST",
                        data: {
                            id_ticket_comun: 159
                        },
                        success: function(data) {
                            $('.requisitosTXT').html(data);
                        }
                    });
                } catch (error) {
                    Swal.fire("", "Error: " + error, "error");
                }

                $('#modalTicketAsistenciaDirecta').modal("show");
            });

            $('#btnM_Save_SolicitarAsistencia').click(function(e) {
                e.preventDefault();

                var count = 0,
                    count_requisito_vacio = 0;

                var assignedRequisitos = [];


                $('.requisitoTXT').each(function() {
                    count += 1;

                    var requisitoLabel = $('#requisitoLabel' + count).val();
                    var requisitoEntry = $('#requisitoEntry' + count).val();

                    if (!$('#requisitoEntry' + count).val()) {
                        count_requisito_vacio += 1;
                    }

                    var requisito = requisitoLabel + ': ' + requisitoEntry;

                    assignedRequisitos.push(requisito + ' ~');
                });

                var requisitos_char = JSON.stringify(assignedRequisitos);

                var char1 = requisitos_char.replace(/~","/g, "\r\n");
                var char2 = char1.replace('["', '\r\n');
                var char3 = char2.replace('~"]', '\r\n');

                var descripcionRequisitos = char3;
                $('#descripcionBox').val('REQUISITOS: \r\n' + descripcionRequisitos);

                var asuntoBox = $('#asuntoBox').val();
                var descripcionBox = $('#descripcionBox').val();
                var justificacionBox = $('#justificacionBox').val();
                var grupoSelectTicket = $('#grupoSelectTicket').val();
                var sucursalBox = $('#sucursalBox').val();

                if (!$('#asuntoBox').val() || !$('#justificacionBox').val() || count_requisito_vacio >= 1 ||
                    sucursalBox == 0 || grupoSelectTicket == 0) {
                    Swal.fire("", "Debe llenar todos los campos!", "warning");
                } else {


                    $.ajax({
                        beforeSend: function(xhr, type) {
                            if (!type.crossDomain) {
                                xhr.setRequestHeader('X-CSRF-Token', $(
                                        'meta[name="csrf-token"]')
                                    .attr(
                                        'content'));
                            }
                        },
                        async: false,
                        type: "POST",
                        url: "{{ url('/api/solicitar/asistencia/directa') }}",
                        data: {
                            asuntoBox: asuntoBox,
                            descripcionBox: descripcionBox,
                            justificacionBox: justificacionBox,
                            grupoSelectTicket: grupoSelectTicket,
                            sucursalBox: sucursalBox,

                            id_ticket_comun: 159
                        },
                        success: function(data) {
                            if (data.save == 1) {
                                Swal.fire("", "Asistencia Directa Solicitada!", "success");
                                window.location.reload();
                            } else {
                                Swal.fire("", "Error L: " + data.error, "error");
                            }
                        }
                    });

                }


            });

            $('#btnM_Cerrar_SolicitarAsistencia').click(function(e) {
                e.preventDefault();

                $('#modalTicketAsistenciaDirecta').modal("hide");
            });


            $.ajax({
                beforeSend: function(xhr, type) {
                    if (!type.crossDomain) {
                        xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]')
                            .attr(
                                'content'));
                    }
                },
                type: "GET",
                url: "{{ url('/api/get/firstCall/options') }}",
                success: function(data) {
                    $('#tipo_first_call').html(data);
                }
            });
            $.ajax({
                beforeSend: function(xhr, type) {
                    if (!type.crossDomain) {
                        xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]')
                            .attr(
                                'content'));
                    }
                },
                type: "GET",
                url: "{{ url('/api/get/onsite/support/tipos') }}",
                success: function(data) {
                    $('#tipo_onsite_support').html(data);
                }
            });
            $.ajax({
                beforeSend: function(xhr, type) {
                    if (!type.crossDomain) {
                        xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]')
                            .attr(
                                'content'));
                    }
                },
                type: "GET",
                url: "{{ url('/api/get/usuarios') }}",
                success: function(data) {
                    $('.usuario_solicita').html(data);
                }
            });

            /* GET CONTEO SOLICITUDES + CONSULTAS */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/api/get/conteo/solicitudes') }}",
                    method: "GET",
                    success: function(data) {
                        $('#cantAll').text(data.cantAll);
                        $('#esperaAprobacion').text(data.esperaAprobacion);
                        $('#cantAprobadas').text(data.cantAprobadas);
                        $('#cantAsignada').text(data.cantAsignada);
                        $('#cantProceso').text(data.cantProceso);
                        $('#cantPausa').text(data.cantPausa);
                        $('#cantFinalizada').text(data.cantFinalizada);
                        $('#cantRechazadas').text(data.cantRechazadas);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }

            /* FILL SOLICITUDES POR FINALIZAR */


            /* SIN ASIGNAR / APROBADOS */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/api/list/cards/last/15/days/tickets') }}",
                    method: "GET",
                    success: function(data) {
                        $('#cards15Días').html(data);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }
            /* SIN ASIGNAR / APROBADOS */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/notification/card/ticket/aprobados') }}",
                    method: "GET",
                    success: function(data) {
                        $('#cardsSinAsignar').html(data);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }
            /* SIN ASIGNAR / APROBADOS */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/notification/card/ticket/asignados') }}",
                    method: "GET",
                    success: function(data) {
                        $('#cardsAsignados').html(data);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }
            /* PROCESO */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/notification/card/ticket/pausa') }}",
                    method: "GET",
                    success: function(data) {
                        $('#cardsPausados').html(data);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }
            /* FINALIZAR */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/notification/card/ticket/proceso') }}",
                    method: "GET",
                    success: function(data) {
                        $('#cardsFinalizar').html(data);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }

            /* FILL ASISTENCIAS ACTIVAS CARD */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/api/get/asistencias/activas/it') }}",
                    method: "GET",
                    success: function(data) {
                        $('#usuariosAsistencia').html(data.asistencia);
                        $('#last_hour').text(data.last_hour);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }

            /* GET ANUNCIOS IMPORTANTES */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/api/get/anuncios/importantes') }}",
                    method: "GET",
                    success: function(data) {
                        $('#anunciosImportantes').html(data);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }

            /* FILL INFRAESTRUCTURAS EN FALLA CARDS */
            try {
                $.ajax({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $(
                                'meta[name="csrf-token"]').attr('content'));
                        }
                    },
                    url: "{{ url('/api/get/infraestructuras/caidas') }}",
                    method: "GET",
                    success: function(data) {
                        $('#infraestructurasCaidas').html(data);
                    }
                });
            } catch (error) {
                Swal.fire("", "Error: " + error, "error");
            }

            /* NOT ADMIN IT DASH TABLES */
            if ("{{ Session::get('resuelveTicketComun') }}" == "1") {
                $('.dashboardConteoCards').click(function(e) {
                    e.preventDefault();

                    window.location = "{{ url('/admin/resolver/tickets/comunes') }}";
                });
            }

            if ("{{ Session::get('resuelveTicketComun') == 1 }}") {
                var opcFilter = 0;
            } else {
                var opcFilter = 1;
            }

            if ("{{ Session::get('ticketsPendientes') }}" == "1101270" ||
                "{{ Session::get('resuelveTicketComun') }}" == "1") {
                /* SOLICITUDES TABLE */
                solicitudesXaprobar = $("#solicitudesXaprobar").DataTable({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr(
                                'content'));
                        }
                    },
                    ajax: {
                        method: "GET",
                        url: "{{ url('/api/get/tickets/realizados/aprobar') }}" + "/7/" + 1,
                    },
                    language: {
                        url: "{{ asset('json/es-ES.json') }}",
                    },
                    dom: "t",
                    columns: [{
                            data: "id_secuencia"
                        },
                        {
                            data: "asunto",
                            className: "text-wrap"
                        },
                        {
                            data: "descripcion",
                            className: "text-wrap"
                        },
                        {
                            data: "fullName_creado_por",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_creado",
                            className: "text-wrap"
                        },
                        {
                            data: "prioridad",
                            render: function(data, type, row) {
                                var badge = "";
                                if (data == "URGENTE") {
                                    badge +=
                                        '<span class="badge badge-pill badge-danger">' +
                                        data +
                                        "</span>";
                                } else if (data == "ALTA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "MEDIA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-success">' + data +
                                        "</span>";
                                } else if (data == "BAJA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-info">' +
                                        data +
                                        "</span>";
                                } else if (data == "NULA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-light">' +
                                        data +
                                        "</span>";
                                }

                                return badge;
                            },
                        },
                    ],
                    pageLength: 5,
                    order: [
                        [0, "DESC"]
                    ]
                });
                ticketsEspera = $("#ticketsEspera").DataTable({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr(
                                'content'));
                        }
                    },
                    ajax: {
                        method: "GET",
                        url: "{{ url('/api/get/tickets/dashboard/realizados/aprobar') }}" + "/7/" + 0,
                    },
                    language: {
                        url: "{{ asset('json/es-ES.json') }}",
                    },
                    dom: "t",
                    columns: [{
                            data: "id_secuencia"
                        },
                        {
                            data: "asunto",
                            className: "text-wrap"
                        },
                        {
                            data: "descripcion",
                            className: "text-wrap"
                        },
                        {
                            data: "fullName_creado_por",
                            className: "text-wrap"
                        },
                        {
                            data: "apruebaRechaza",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_creado",
                            className: "text-wrap"
                        },
                        {
                            data: "prioridad",
                            render: function(data, type, row) {
                                var badge = "";
                                if (data == "URGENTE") {
                                    badge +=
                                        '<span class="badge badge-pill badge-danger">' +
                                        data +
                                        "</span>";
                                } else if (data == "ALTA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "MEDIA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-success">' + data +
                                        "</span>";
                                } else if (data == "BAJA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-info">' +
                                        data +
                                        "</span>";
                                } else if (data == "NULA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-light">' +
                                        data +
                                        "</span>";
                                }

                                return badge;
                            },
                        },
                    ],
                    pageLength: 5,
                    order: [
                        [0, "DESC"]
                    ]
                });

                /* CONSULTAS TABLE */
                /* consultasXaprobar = $("#consultasXaprobar").DataTable({
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr(
                                'content'));
                        }
                    },
                    ajax: {
                        method: "GET",
                        url: "{{ url('/api/get/aceptar/solicitudes') }}" + "/7/13",
                    },
                    language: {
                        url: "{{ asset('json/es-ES.json') }}",
                    },
                    dom: "t",
                    columns: [{
                            data: "id_secuencia"
                        },
                        {
                            data: "asunto",
                            className: "text-wrap"
                        },
                        {
                            data: "descripcion",
                            className: "text-wrap"
                        },
                        {
                            data: "fullName_creado_por",
                            className: "text-wrap"
                        },
                        {
                            data: "prioridad",
                            render: function(data, type, row) {
                                var badge = "";
                                if (data == "URGENTE") {
                                    badge +=
                                        '<span class="badge badge-pill badge-danger">' +
                                        data +
                                        "</span>";
                                } else if (data == "ALTA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "MEDIA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-success">' + data +
                                        "</span>";
                                } else if (data == "BAJA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-info">' +
                                        data +
                                        "</span>";
                                } else if (data == "NULA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-light">' +
                                        data +
                                        "</span>";
                                }

                                return badge;
                            },
                        },
                    ],
                    pageLength: 5,
                    order: [
                        [0, "DESC"]
                    ]
                }); */

                $('#solicitudesSection').click(function(e) {
                    e.preventDefault();

                    window.location = "{{ url('/admin/aprobar/tickets/comunes') }}";
                });
                /* $('#consultasSection').click(function(e) {
                    e.preventDefault();

                    window.location = "{{ url('/admin/consultas/aprobar/rechazar') }}";
                }); */

                $('.dashboardConteoCards').click(function(e) {
                    e.preventDefault();

                    window.location = "{{ url('/admin/abrir/tickets/comunes') }}";
                });
            }

            if ("{{ Session::get('adminIT') == 'adminIT' }}") {
                getAsistenciaBTN();
            }

            /* DISPLAY ASISTENCIA BUTTON */
            function getAsistenciaBTN() {

                try {
                    $.ajax({
                        beforeSend: function(xhr, type) {
                            if (!type.crossDomain) {
                                xhr.setRequestHeader('X-CSRF-Token', $(
                                    'meta[name="csrf-token"]').attr('content'));
                            }
                        },
                        async: false,
                        url: "{{ url('/asistencia/usuarios/it') }}",
                        method: "GET",
                        success: function(data) {
                            //$('#asistenciaButtons').html(data);
                            if (data.btn == 1) {
                                $('#startAsistencia').css('display', 'none');
                                $('#endAsistencia').css('display', 'content');
                            } else {
                                $('#startAsistencia').css('display', 'content');
                                $('#endAsistencia').css('display', 'none');
                            }
                        }
                    });
                } catch (error) {
                    Swal.fire("", "Error: " + error, "error");
                }
            }

            $(document).on("click", ".startAsistencia", function(e) {
                e.preventDefault();

                Swal.fire({
                    title: "Estás Seguro de Iniciar Asistencia?",
                    text: "",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Confirmar!'
                }).then((result) => {
                    if (result.isConfirmed) {
                        try {
                            $.ajax({
                                beforeSend: function(xhr, type) {
                                    if (!type.crossDomain) {
                                        xhr.setRequestHeader('X-CSRF-Token',
                                            $(
                                                'meta[name="csrf-token"]'
                                            ).attr('content'));
                                    }
                                },
                                url: "{{ url('/gestion/asistencia/usuarios/it') }}",
                                //async: false,
                                data: {
                                    opcion: 0
                                },
                                method: "POST",
                                success: function(data) {
                                    if (data.asist == 0) {
                                        location.reload();
                                        Swal.fire("", "Asistencia a Usuarios Iniciada!",
                                            "success");
                                    }
                                }
                            });
                        } catch (error) {
                            Swal.fire("", "Error: " + error, "error");
                        }
                    }
                });
            });

            $(document).on("click", ".endAsistencia", function(e) {
                e.preventDefault();

                Swal.fire({
                    title: "Estás Seguro de Finalizar esta Asistencia?",
                    text: "",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    confirmButtonText: 'Confirmar!'
                }).then((result) => {
                    if (result.isConfirmed) {
                        try {
                            $.ajax({
                                beforeSend: function(xhr, type) {
                                    if (!type.crossDomain) {
                                        xhr.setRequestHeader('X-CSRF-Token',
                                            $(
                                                'meta[name="csrf-token"]'
                                            ).attr('content'));
                                    }
                                },
                                url: "{{ url('/gestion/asistencia/usuarios/it') }}",
                                //async: false,
                                data: {
                                    opcion: 1
                                },
                                method: "POST",
                                success: function(data) {
                                    if (data.asist == 1) {
                                        location.reload();
                                        Swal.fire("",
                                            "Asistencia a Usuarios Finalizada!",
                                            "success");
                                    }
                                }
                            });
                        } catch (error) {
                            Swal.fire("", "Error: " + error, "error");
                        }
                    }
                });
            });

            /* GET VALUE OF ID_SECUENCIA INSIDE DIV */
            $(document).on("click", ".item", function(e) {
                e.preventDefault();

                var id_secuencia = $(this).closest(".item").find('input[name="idSecuencia"]').val();
                var asuntoCard = $(this).closest(".item").find('input[name="asuntoCard"]').val();
                var descripcionCard = $(this).closest(".item").find('input[name="descripcionCard"]').val();
                var creadoPorCard = $(this).closest(".item").find('input[name="creadoPorCard"]').val();
                var asignadoPorCard = $(this).closest(".item").find('input[name="asignadoPorCard"]').val();
                var finalizaCard = $(this).closest(".item").find('input[name="finalizaCard"]').val();
                var textCards = $(this).closest(".item").find('input[name="textCards"]').val();

                Swal.fire({
                    title: asuntoCard,
                    html: descripcionCard + '<br><br><b>' + finalizaCard + '</b>',
                    showCloseButton: true,
                });
            });

            var $search = $("#search").on('input', function() {
                var matcher = new RegExp($(this).val(), 'gi');
                $('.item').show().not(function() {
                    return matcher.test($(this).find(
                        '.asuntoText, .creadaPor, .asignadaPor, .fechaFinal').text())
                }).hide();
            });

            var $search15days = $("#search_15_days").on('input', function() {
                var matcher15days = new RegExp($(this).val(), 'gi');
                $('.15days').show().not(function() {
                    return matcher15days.test($(this).find(
                        '.asuntoText, .creadaPor, .asignadaPor, .fechaFinal'
                    ).text())
                }).hide();
            });

            $('#listColaTickets').click(function(e) {
                e.preventDefault();

                getColaTickets();

                $(".modal-header").css("background-color", "#17a2b8");
                $(".modal-title").css({
                    "color": "white",
                    "font-weight": "900",
                });
                $(".modal-title").text("Lista de Tickets");
                $("#modalCola").modal("show");
            });

            $('.btnCerrar').click(function(e) {
                e.preventDefault();


                $("#modalCola").modal("hide");
            });


            function getColaTickets() {
                var tablaCola = $("#tablaCola").DataTable({
                    initComplete: function() {
                        tablaCola.on('order.dt search.dt', function() {
                            let i = 1;

                            tablaCola.cells(null, 0).every(function(cell) {
                                this.data('Ticket # ' + i++);
                            });
                        }).draw();
                    },
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr(
                                'content'));
                        }
                    },
                    ajax: {
                        url: "{{ url('/api/get/cola/tickets/consultas') }}",
                        method: "GET",
                    },
                    ordering: false,
                    language: {
                        url: "{{ asset('json/es-ES.json') }}",
                    },
                    columns: [{
                            data: "numeroCola"
                        },
                        {
                            data: "asunto",
                            className: "text-wrap"
                        },
                        {
                            data: "descripcion",
                            className: "text-wrap"
                        },
                        {
                            data: "prioridadIT",
                            render: function(data, type, row) {
                                var badge = "";
                                if (data == "URGENTE") {
                                    badge +=
                                        '<span class="badge badge-pill badge-danger">' +
                                        data +
                                        "</span>";
                                } else if (data == "ALTA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "MEDIA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-success">' + data +
                                        "</span>";
                                } else if (data == "BAJA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-info">' +
                                        data +
                                        "</span>";
                                } else if (data == "NULA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-light">' +
                                        data +
                                        "</span>";
                                } else {
                                    badge +=
                                        '<span class="badge badge-pill badge-dark">NO DEFINIDO</span>';
                                }

                                return badge;
                            },
                        },
                        {
                            data: "estado_solicitud",
                            render: function(data, type, row) {
                                var badge = "";
                                if (data == "ASIGNADO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "EN PROCESO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-info">' +
                                        data +
                                        "</span>";
                                } else if (data == "PAUSADO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-primary">' + data +
                                        "</span>";
                                } else if (data == "APROBADO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-dark">SIN ASIGNAR</span>';
                                }

                                return badge;
                            },
                        },
                        {
                            data: "fullName_creado_por",
                            className: "text-wrap"
                        },
                        {
                            data: "fullName_asignado_por",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_aceptado",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_asignado",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_proceso",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_pausa",
                            className: "text-wrap"
                        },
                        {
                            data: "comentario_pausa",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_reanudado",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_estimada",
                            className: "text-wrap"
                        }
                    ],
                    columnDefs: [{
                        orderable: false,
                        targets: 0
                    }]
                });
            }

            $("#startFirstCall").click(function() {
                opcion = 1;
                actionTrigg = 1;
                secuencia_id = null;

                $('.FirstCallDiv').css('display', 'block');
                $('.FirstCallDiv').css('display', 'contents');
                $('.SupportONSITEDiv').css('display', 'none');
                $('.comentarioAnuncioDiv').css('display', 'none');

                $(".modal-header").css("background-color", "#17a2b8");
                $(".modal-header").css({
                    color: "white",
                    "font-weight": "900",
                });
                $(".modal-title").text("Nuevo First Call IT");
                $("#modalFirstCall").modal("show");
            });
            $("#startONSITESupport").click(function() {
                opcion = 1;
                actionTrigg = 1;
                secuencia_id = null;

                $('.FirstCallDiv').css('display', 'none');
                $('.SupportONSITEDiv').css('display', 'block');
                $('.SupportONSITEDiv').css('display', 'contents');
                $('.comentarioAnuncioDiv').css('display', 'none');

                $(".modal-header").css("background-color", "#17a2b8");
                $(".modal-header").css({
                    color: "white",
                    "font-weight": "900",
                });
                $(".modal-title").text("Nuevo Support IT");
                $("#modalFirstCall").modal("show");
            });

            /*
             * --------------------------- FUNCTION CLOSE MODAL ---------------------------
             */
            $("#btnCancelar, .close_modal, #btnCancelarONSITE, #btnCancelarAnuncio").click(function() {
                $("#modalFirstCall").modal("hide");
            });

            $("#formFirstCall").submit(function(e) {
                e.preventDefault();

                tipo_first_call = $.trim($("#tipo_first_call").val());
                tipo_first_call_select = $("#tipo_first_call option:selected").text();

                usuario_solicita_fcal = $.trim($("#usuario_solicita_fcal").val());
                usuario_solicita_select_fcal = $("#usuario_solicita_fcal option:selected").text();

                var idUsuarioActual = $.trim($("#idUsuarioActual").val());
                var usuarioActual = $.trim('{{ Session::get('userName') }}');
                var firstCallTextArea = $.trim($("#firstCallTextArea").val());

                if ($.trim(tipo_first_call).length > 0) {
                    try {
                        $.ajax({
                            url: "{{ URL::asset('php/firstCallAPI.php') }}",
                            type: "POST",
                            datatype: "json",
                            data: {
                                secuencia_id: secuencia_id,
                                tipo_first_call: tipo_first_call,
                                tipo_first_call_select: tipo_first_call_select,
                                idUsuarioActual: idUsuarioActual,
                                firstCallTextArea: firstCallTextArea,
                                usuarioActual: usuarioActual,
                                usuario_solicita: usuario_solicita_fcal,
                                usuario_solicita_select: usuario_solicita_select_fcal,
                                opcion: opcion,
                            },
                            success: function(data) {
                                if (data.result == "Existe") {
                                    Swal.fire("", "Ya iniciaste una First Call!", "warning");
                                } else {
                                    if (opcion == 1) {
                                        Swal.fire("", "First Call Creada!", "success");
                                    } else if (opcion == 2) {
                                        Swal.fire("", "First Call Finalizada!", "success");
                                    }
                                    $("#modalFirstCall").modal("hide");
                                }
                            },
                        });
                    } catch (error) {
                        Swal.fire("", "Error: " + error, "error");
                    }
                } else {
                    Swal.fire("", "¡Llene todos los Campos!", "error");
                }
            });

            $("#formSupportONSITE").submit(function(e) {
                e.preventDefault();

                tipo_onsite_support = $.trim($("#tipo_onsite_support").val());
                tipo_onsite_support_select = $("#tipo_onsite_support option:selected").text();

                usuario_solicita = $.trim($("#usuario_solicita").val());
                usuario_solicita_select = $("#usuario_solicita option:selected").text();

                dificultad = '';

                var OnSiteSupportTextArea = '';

                if (opcion == 1 && (tipo_onsite_support == 0 || usuario_solicita == 0)) {
                    Swal.fire("", "¡Llene todos los Campos!", "error");
                } else if (opcion == 2 && (!$("#OnSiteSupportTextArea").val() || dificultad == 0)) {
                    Swal.fire("", "¡Llene todos los Campos!", "error");
                } else {
                    try {
                        $.ajax({
                            beforeSend: function(xhr, type) {
                                if (!type.crossDomain) {
                                    xhr.setRequestHeader('X-CSRF-Token', $(
                                        'meta[name="csrf-token"]').attr(
                                        'content'));
                                }
                            },
                            url: "{{ url('/api/save/finish/onsite/support') }}",
                            type: "POST",
                            datatype: "json",
                            data: {
                                secuencia_id: secuencia_id,
                                tipo_onsite_support: tipo_onsite_support,
                                tipo_onsite_support_select: tipo_onsite_support_select,
                                usuario_solicita: usuario_solicita,
                                usuario_solicita_select: usuario_solicita_select,
                                OnSiteSupportTextArea: OnSiteSupportTextArea,
                                dificultad: dificultad,
                                opcion: opcion,
                            },
                            success: function(data) {
                                if (data.save == 1) {
                                    if (data.existe == 1) {
                                        Swal.fire("", "Ya iniciaste un Support IT!",
                                            "warning");
                                    } else {
                                        if (opcion == 1) {
                                            Swal.fire("", "Support IT Creado!", "success");
                                        } else if (opcion == 2) {
                                            Swal.fire("", "Support IT Finalizado!",
                                                "success");
                                        }

                                        $("#modalFirstCall").modal("hide");
                                    }
                                } else if (data.save == 0) {
                                    Swal.fire("", "Error L: " + data.error, "error");
                                }
                            },
                        });
                    } catch (error) {
                        Swal.fire("", "Error: " + error, "error");
                    }
                }
            });

            $("#formCommentAnunio").submit(function(e) {
                e.preventDefault();

                hidden_id_anuncio = $("#hidden_id_anuncio").val();
                hidden_estado_anuncio = $("#hidden_estado_anuncio").val();
                anuncioComentario = $("#anuncioComentario").val();

                try {
                    $.ajax({
                        beforeSend: function(xhr, type) {
                            if (!type.crossDomain) {
                                xhr.setRequestHeader('X-CSRF-Token',
                                    $(
                                        'meta[name="csrf-token"]'
                                    ).attr('content'));
                            }
                        },
                        url: "{{ url('/api/confirm/rechazar/asistencia') }}",
                        data: {
                            id_anuncio: hidden_id_anuncio,
                            estado: hidden_estado_anuncio,
                            anuncioComentario: anuncioComentario
                        },
                        method: "POST",
                        success: function(data) {
                            if (data.save == 1) {
                                location.reload();
                            }
                        }
                    });
                } catch (error) {
                    Swal.fire("", "Error: " + error, "error");
                }


            });


            $(document).on("click", ".btnAceptarAsistencia", function(e) {
                e.preventDefault();

                var id_anuncio = $(this).closest(".anuncio").find('input[name="idAnuncio"]').val();

                Swal.fire({
                    title: "Quieres agregar un Comentario antes de Aceptar el Anuncio?",
                    text: "",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonColor: '#3085d6',
                    cancelButtonColor: '#d33',
                    cancelButtonText: 'NO',
                    confirmButtonText: 'SI'
                }).then((result) => {

                    if (result.isConfirmed) {

                        $('.FirstCallDiv').css('display', 'none');
                        $('.SupportONSITEDiv').css('display', 'none');
                        $('.comentarioAnuncioDiv').css('display', 'block');
                        $('.comentarioAnuncioDiv').css('display', 'contents');

                        $(".modal-header").css("background-color", "#17a2b8");
                        $(".modal-header").css({
                            color: "white",
                            "font-weight": "900",
                        });
                        $(".modal-title").text("Comentario de Anuncio");
                        $("#modalFirstCall").modal("show");

                        $('#hidden_id_anuncio').val(id_anuncio);
                        $('#hidden_estado_anuncio').val(1);

                    } else {

                        try {
                            $.ajax({
                                beforeSend: function(xhr, type) {
                                    if (!type.crossDomain) {
                                        xhr.setRequestHeader('X-CSRF-Token',
                                            $(
                                                'meta[name="csrf-token"]'
                                            ).attr('content'));
                                    }
                                },
                                url: "{{ url('/api/confirm/rechazar/asistencia') }}",
                                data: {
                                    id_anuncio: id_anuncio,
                                    estado: 1,
                                    anuncioComentario: ''
                                },
                                method: "POST",
                                success: function(data) {
                                    if (data.save == 1) {
                                        location.reload();
                                    }
                                }
                            });
                        } catch (error) {
                            Swal.fire("", "Error: " + error, "error");
                        }

                    }
                });


            });

            $(document).on("click", ".btnRechazarAsistencia", function(e) {
                e.preventDefault();

                var id_anuncio = $(this).closest(".anuncio").find('input[name="idAnuncio"]').val();

                $('.FirstCallDiv').css('display', 'none');
                $('.SupportONSITEDiv').css('display', 'none');
                $('.comentarioAnuncioDiv').css('display', 'block');
                $('.comentarioAnuncioDiv').css('display', 'contents');

                $(".modal-header").css("background-color", "#17a2b8");
                $(".modal-header").css({
                    color: "white",
                    "font-weight": "900",
                });
                $(".modal-title").text("Comentario de Anuncio");
                $("#modalFirstCall").modal("show");

                $('#hidden_id_anuncio').val(id_anuncio);
                $('#hidden_estado_anuncio').val(3);
            });


            $("#filaTable").DataTable();

            $('#numFilaAreaFilter').change(function(e) {
                e.preventDefault();

                varArea = $(this).val();


                $("#filaTable").DataTable().clear().destroy();

                filaTable = $("#filaTable").DataTable({
                    scrollX: true,
                    scrollCollapse: true,
                    scrollY: '400px',
                    pageLength: 50,
                    fixedColumns: {
                        left: 3
                    },
                    ordering: false,
                    beforeSend: function(xhr, type) {
                        if (!type.crossDomain) {
                            xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]')
                                .attr(
                                    'content'));
                        }
                    },
                    initComplete: function() {
                        var api = this.api();
                    },
                    dom: 'frtlip',
                    ajax: {
                        method: "GET",
                        url: "{{ url('/api/data/numero/fila/tickets') }}" + "/" + varArea,
                    },
                    language: {
                        url: "{{ asset('json/es-ES.json') }}",
                    },
                    columns: [{
                            data: "id_secuencia"
                        },
                        {
                            data: 'numero_fila',
                            createdCell: function(td, cellData, rowData, row, col) {
                                $(td).addClass('calificacion-cell-blue');
                            },
                            render: function(data, type, row) {
                                var badge = "";

                                if (row.estado_solicitud == "PAUSADO") {
                                    badge +=
                                        '<div class="text-center text-wrap">PAUSADO, AL SER RENOVADO TENDRA UN NUEVO NUMERO DE FILA!</div>';
                                } else {
                                    badge +=
                                        '<div class="text-center fs-3 fw-bold">' + data +
                                        '</div>';
                                }

                                return badge;
                            }
                        },
                        {
                            data: "asunto",
                            className: "text-wrap"
                        },
                        {
                            data: "descripcion",
                            className: "text-wrap"
                        },
                        {
                            data: "justificacion",
                            className: "text-wrap"
                        },
                        {
                            data: "fullName_creado_por",
                            className: "text-wrap"
                        },
                        {
                            data: "fullName_asignado_por",
                            className: "text-wrap"
                        },
                        {
                            data: "estado_solicitud",
                            render: function(data, type, row) {
                                var badge = "";
                                if (data == "ASIGNADO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "EN PROCESO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-info">' +
                                        data +
                                        "</span>";
                                } else if (data == "PAUSADO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-primary">' +
                                        data +
                                        "</span>";
                                } else if (data == "FINALIZADA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-success">' +
                                        data +
                                        "</span>";
                                } else if (data == "RECHAZADA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-danger">' +
                                        data +
                                        "</span>";
                                } else if (data == "RECHAZADA IT") {
                                    badge +=
                                        '<span class="badge badge-pill badge-danger">' +
                                        data +
                                        "</span>";
                                } else if (data == "SOLICITADO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "APROBADO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-success">' +
                                        data +
                                        "</span>";
                                }

                                return badge;
                            },
                        },
                        {
                            data: "prioridad",
                            render: function(data, type, row) {
                                var badge = "";
                                if (data == "URGENTE") {
                                    badge +=
                                        '<span class="badge badge-pill badge-danger">' +
                                        data +
                                        "</span>";
                                } else if (data == "ALTA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "MEDIA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-success">' +
                                        data +
                                        "</span>";
                                } else if (data == "BAJA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-info">' +
                                        data +
                                        "</span>";
                                } else if (data == "NULA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-light">' +
                                        data +
                                        "</span>";
                                }

                                return badge;
                            },
                        },
                        {
                            data: "tipo_solicitud",
                            render: function(data, type, row) {
                                var badge = "";
                                if (data == "PROYECTO") {
                                    badge +=
                                        '<span class="badge badge-pill badge-warning">' +
                                        data +
                                        "</span>";
                                } else if (data == "CAMBIOS SISTEMA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-primary">' +
                                        data +
                                        "</span>";
                                } else if (data == "SOPORTE") {
                                    badge +=
                                        '<span class="badge badge-pill badge-success">' +
                                        data +
                                        "</span>";
                                } else if (data == "SISTEMAS") {
                                    badge +=
                                        '<span class="badge badge-pill badge-info">' +
                                        data +
                                        "</span>";
                                } else if (data == "AUDITORIA") {
                                    badge +=
                                        '<span class="badge badge-pill badge-danger">' +
                                        data +
                                        "</span>";
                                } else {
                                    badge +=
                                        '<span class="badge badge-pill badge-dark">NINGUNO</span>';
                                }

                                return badge;
                            },
                        },
                        {
                            data: "sucursal",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_creado",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_aceptado",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_asignado",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_proceso",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_pausa",
                            className: "text-wrap"
                        },
                        {
                            data: "comentario_pausa",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_reanudado",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_estimada",
                            className: "text-wrap"
                        },
                        {
                            data: "fecha_hora_finalizado",
                            className: "text-wrap"
                        },
                        {
                            data: "comentario_finalizado",
                            className: "text-wrap"
                        },
                    ],
                    rowCallback: function(row, data, index) {

                    }
                });
            });


        });
    </script>
@endsection