@extends('layouts.app')

@section('vendor-style')
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/flag-icon/css/flag-icon.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/data-tables/css/jquery.dataTables.min.css') }}">
    <link rel="stylesheet" type="text/css"
          href="{{ asset('vendors/data-tables/extensions/responsive/css/responsive.dataTables.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/data-tables/css/select.dataTables.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/sweetalert/sweetalert.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/flag-icon/css/flag-icon.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/quill/quill.snow.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/select2/select2.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('vendors/select2/select2-materialize.css') }}">
@endsection
@section('title', 'Solicitudes')
{{-- page style --}}
@section('page-style')
    <link rel="stylesheet" type="text/css" href="{{ asset('css/pages/data-tables.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/pages/app-sidebar.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('css/pages/app-todo.css') }}">
    <style>
        .todo-list li.active{
            height: 40px !important;
            background-color: #9b0048 !important;
            box-shadow: 0 0 8px 0 #bf5c8a !important;
            margin-right: 50px !important;
        }
    </style>
@endsection

@section('content')

    <div class="breadcrumbs pb-0 pt-4" id="breadcrumbs-wrapper">
        <!-- Search for small screen-->
        <div class="container">
            <div class="row">
                <div class="col s10 m6 l6">
                    <h5 class="breadcrumbs-title mt-0 mb-0"><span>SOLICITUDES</span></h5>
                    <ol class="breadcrumbs mb-0">
                        <li class="breadcrumb-item">
                            <a href="{{ url('/') }}">Home</a>
                        </li>
                        <li class="breadcrumb-item">
                            <a href="#">Solicitudes</a>
                        </li>
                    </ol>
                </div>
            </div>
        </div>
    </div>

    <div class="seaction">
        <div class="row">
            <div id="button-trigger2" class="card card card-default scrollspy">
                <div class="card-content">
                    <div class="row">
                        <h4 class="card-title">Listado de Solicitudes</h4>
                    </div>
                    <!-- /.Menú para el listado -->
                    <div class="row">


                    <!-- /.Validacion de espacio del div -->

                                        <table id="data-table-row-grouping" class="display datablees">
                                            <thead>
                                            <tr>
                                                <th>NUS</th>
                                                <th>Asunto</th>
                                                <th>Tipo atención</th>
                                                <th>Estatus</th>
                                                <th>Semáforo</th>
                                                <th>Acciones</th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            @foreach ($registros as $registro)
                                                <tr>
                                                    <td>{{$registro->folio}}</td>
                                                    <td>Documento: {{$registro->titulo_doc}} <br> {{$registro->descripcion_doc}}</td>
                                                    <td>{{$registro->tipo->tipo}}</td>
                                                    <td></td>
                                                    <td>
                                                        @php
                                                            $fecha_aprovacion = new \Carbon\Carbon($registro->fecha_limite_atencion);
                                                            $hoy = now();
                                                            $diferencia = $hoy->diffInDays($fecha_aprovacion);
                                                            if ($diferencia <= 5) {
                                                                $color = 'yellow';
                                                            } elseif ($diferencia >5) {
                                                                $color = 'green';
                                                            } elseif ($diferencia <= 3) {
                                                                $color = 'orange';
                                                            } else {
                                                                $color = 'red';
                                                            }
                                                        @endphp
                                                        <i class="material-icons" style="color:{{ $color }}; font-size: 40px">fiber_manual_record</i>
                                                    </td>
                                                    <td>
                                                            <a title="Suspención de terminos" class="tooltipped"
                                                               data-position="bottom" data-tooltip="Suspención de terminos"
                                                               onclick="cargarSuspenciones('solicitud',{{ $registro->id }})"><i
                                                                    class="material-icons iconlegislatura">timer_off</i></a>
                                                            <a title="Regenerar documentos" class="tooltipped"
                                                               data-position="bottom" data-tooltip="Regenerar documentos"
                                                               onclick="regenerarDocumentos({{ $registro->id }})"><i
                                                                    class="material-icons iconlegislatura">filter_none</i></a><br>
                                                            <a title="Ver" class="tooltipped" data-position="bottom" data-tooltip="Ver"
                                                               href="{{ route('solicitud.edit', [$registro->id]) }}">
                                                                <i class="material-icons iconlegislatura">visibility</i>
                                                            </a>
                                                            <a title="Ficha técnica" class="tooltipped" data-position="bottom"
                                                               data-tooltip="Ficha técnica" style="cursor: pointer !important;"
                                                               onclick="window.open('','_blank')">
                                                                <i class="material-icons iconlegislatura">picture_as_pdf</i>
                                                            </a>
                                                    </td>
                                                </tr>
                                            @endforeach

                                            </tbody>
                                            <tfoot>
                                            <tr>
                                                <th>NUS</th>
                                                <th>Beneficiario</th>
                                                <th>Solicitante</th>
                                                <th>Fecha de solictud</th>
                                                <th>Estatus</th>
                                                <th>Semáforo</th>
                                                <th>Acciones</th>
                                            </tr>
                                            </tfoot>
                                        </table>
                                    </div>
                            </div>
                    </div>
                </div>
            </div>
        </div>
{{--        @include('solicitudes._suspenciones')--}}
        @endsection

        {{-- vendor scripts --}}
        @section('vendor-script')
            <script src="{{ asset('vendors/data-tables/js/jquery.dataTables.min.js') }}"></script>
            <script src="{{ asset('vendors/data-tables/extensions/responsive/js/dataTables.responsive.min.js') }}"></script>
            <script src="{{ asset('vendors/data-tables/js/dataTables.select.min.js') }}"></script>
            <script src="{{ asset('vendors/sweetalert/sweetalert.min.js') }}"></script>
        @endsection

        {{-- page script --}}
        @push('page-script')
            <script>
                $(document).ready(function() {
                    $('.tooltipped').tooltip();
                    $("#data-table-row-grouping").DataTable({
                        language: datablees,
                        "order": []
                    });
                });


            </script>
        <!--<script src="{{ asset('js/scripts/data-tables.js') }}"></script>-->
    @endpush