@extends('template.layout')

@section('styles')
    <style>
        @media (min-width: 768px) {
            .modal-xl {
                width: 90%;
                max-width: 95%;
            }
        }
    </style>
@endsection
@section('content')
    <h1 class="page-title">
        Reporte de Tramites no atendidos o fuera de plazo
    </h1>
    <div class="portlet light bordered">
        <div class="portlet-title">
            <div class="caption">Tramites no antendidos o atendidos fuera de plazo</div>
            <div class="actions">
                <div class="btn-group tipo">
                    {{--<button id="add_tipo" class="btn btn-primary periodo">--}}
                    {{--<i class="fa fa-plus"></i> A&ntilde;adir Tipo de Asunto--}}
                    {{--</button>--}}
                </div>
            </div>
        </div>
        <div class="row margin-bottom-40">
            <div class="col-md-2 col-xs-12">
                {!! Form::label('fech_start', 'Fecha de Inicio:', ['class' => 'control-label']) !!}
                <div id="fecha_start" class="input-group date date-picker" data-date-format="dd/mm/yyyy">
                    {!! Form::text('fecha_start', date('d-m-Y', strtotime(\Carbon\Carbon::now('America/Lima'))), array('id' => 'fini','class' => 'form-control' , 'required' => 'required')) !!}
                    <span class="input-group-btn">
                        <button class="btn default" type="button">
                            <i class="fa fa-calendar"></i>
                        </button>
                    </span>
                </div>
            </div>
            <div class="col-md-2 col-xs-12">
                {!! Form::label('fech_end', 'Fecha de Fin:', ['class' => 'control-label']) !!}
                <div id="fecha_end" class="input-group date date-picker" data-date-format="dd/mm/yyyy">
                    {!! Form::text('fecha_end', date('d-m-Y', strtotime(\Carbon\Carbon::now('America/Lima'))), array('id' => 'ffin','class' => 'form-control' , 'required' => 'required')) !!}
                    <span class="input-group-btn">
                        <button class="btn default" type="button">
                            <i class="fa fa-calendar"></i>
                        </button>
                    </span>
                </div>
            </div>
            <div class="col-md-1 margin-top-20">
                <button class="btn green solicitar">Buscar</button>
            </div>
        </div>
        {{--Termino de Filtro--}}

        {{--{!! Form::hidden('invisible', 1, array('id' => 'invisible')) !!}--}}
        <div class="portlet-body">
            @include('alerts.index')

            <div class="row">
                <div class="col-md-6">
                    <div style="font-weight: bold; font-size: 16px; margin-bottom: 30px;">Tramites no atendidos:
                        <a class="btn btn-success" style="float: right;" id="downloadNAExcel" href="#">
                            <i class="fa fa-file-excel-o"></i> Excel
                        </a>
                    </div>
                    <table id="dtTramitesNoAtention" class="table table-striped table-bordered table-hover table-bg" style="text-align: center; width: 100% !important;">
                        <thead>
                        <tr>
                            <th style="text-align: center">Tramite</th>
                            <th style="text-align: center">Area</th>
                            <th style="text-align: center">Fecha Registrada</th>
                            <th style="text-align: center">Estado</th>
                        </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>

                <div class="col-md-6">
                    <div style="font-weight: bold; font-size: 16px;margin-bottom: 30px;">Tramites atendidos fuera de plazo:
                        <a class="btn btn-success" style="float: right;" id="downloadTLExcel" href="#">
                            <i class="fa fa-file-excel-o"></i> Excel
                        </a>
                    </div>
                    <table id="dtTramitesLentos" class="table table-striped table-bordered table-hover table-bg" style="text-align: center; width: 100% !important;">
                        <thead>
                        <tr>
                            <th style="text-align: center">Tramite</th>
                            <th style="text-align: center">Area</th>
                            <th style="text-align: center">Fecha Registrada</th>
                            <th style="text-align: center">Estado</th>
                        </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>

                <div class="col-md-12 margin-top-40">
                    <div style="font-weight: bold; font-size: 16px; margin-bottom: 30px;">Areas identificadas como lentas o pendientes por atender:
                        <a class="btn btn-success" style="float: right;" id="downloadALExcel" href="#">
                            <i class="fa fa-file-excel-o"></i> Excel
                        </a>
                    </div>
                    <table id="dtAreasLentas" class="table table-striped table-bordered table-hover table-bg" style="text-align: center;">
                        <thead>
                        <tr>
                            <th style="text-align: center">Nombres de las Areas</th>
                            <th style="text-align: center">No atendidos</th>
                            <th style="text-align: center">Atendidos fuera de plazo</th>
                        </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
                </div>
            </div>

        </div>
    </div>

@endsection

@section('scripts')
    <script>
        var urlBase = "{{ url('mesadepartes') }}";
        var urlBaseBase = "{{ url('mesadepartes') }}";
        var urlDerivadas = "{{ url('admin/tramite') }}";
        var urlData = "{{ route('mesa.reportnoatention.lista') }}";
        var urlData2 = "{{ route('mesa.reportnoatention.listalenta') }}";
        var urlData3 = "{{ route('mesa.reportnoatention.listaareas') }}";
        var base = "{{ url('/') }}";
    </script>
    <script src="{{asset('js/MesaDePartes/reportes/reportnoatention.js')}}" type="text/javascript"></script>
@endsection