@extends('template.layout')

@section('styles')
@endsection

@section('content')
    <h1 class="page-title">
        Gestión de Expedientes
    </h1>
    <div class="portlet light bordered">
        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject bold uppercase">Lista de expedientes derivados</span>
                <span class="caption-helper"></span>
            </div>
        </div>
        <div class="portlet-body">
            <table id="dataTable" class="table table-striped table-bordered table-hover table-bg" style="text-align: center;">
                <thead>
                <tr>
                    <th style="text-align: center">C&oacute;digo Unico</th>
                    <th style="text-align: center">Estado</th>
                    <th style="text-align: center">Asunto</th>
                    <th style="text-align: center">Plazo del tramite</th>
                    <th style="text-align: center">&Aacute;rea derivada</th>
                    <th style="text-align: center">N° Folios</th>
                    <th style="text-align: center">Solicitante</th>
                    <th style="text-align: center">Fecha de ingreso</th>
                    <th style="text-align: center">Detalle</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>

    <div id="detalle_datos" class="modal fade" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
            </div>
        </div>
    </div>
@endsection

@section('scripts')
    <script>
        var urlBase = "{{ url('admin/tramite/listado/expediente') }}";
    </script>
    <script>

        var sTable = $("#dataTable").DataTable({
            "language": {
                "sProcessing":     "Procesando...",
                "sLengthMenu":     "Mostrar _MENU_ registros",
                "sZeroRecords":    "No se encontraron resultados",
                "sEmptyTable":     "No existen registros creados",
                "sInfo":           "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
                "sInfoEmpty":      "Mostrando registros del 0 al 0 de un total de 0 registros",
                "sInfoFiltered":   "(filtrado de un total de _MAX_ registros)",
                "sInfoPostFix":    "",
                "sSearch":         "Busqueda por Código, Solicitante y Área derivada: ",
                "sUrl":            "",
                "sInfoThousands":  ",",
                "sLoadingRecords": "Cargando...",
                "oPaginate": {
                    "sFirst":    "Primero",
                    "sLast":     "Último",
                    "sNext":     "Siguiente",
                    "sPrevious": "Anterior"
                },
                "oAria": {
                    "sSortAscending":  ": Activar para ordenar la columna de manera ascendente",
                    "sSortDescending": ": Activar para ordenar la columna de manera descendente"
                }
            },
            processing: true,
            serverSide: true,
            destroy: true,
            responsive:true,
            ajax:{
                url: "{{ route('admin.tramite.expediente.post') }}",
                method: 'POST',
                error: function(error){
                }
            },
            columns:[
                {
                    data:'codigo',
                    name:'codigo',
                    "searchable": true
                },
                {
                    data:'estado',
                    name:'estado',
                    "searchable": false,
                    render: function (data, type, row) {
                        switch (data)
                        {
                            case '0':
                                return "<span class='label label-primary'>EN PROCESO</span>";
                            case '1':
                                return "<span class='label label-warning'>OBSERVADO</span>";
                            case '2':
                                return "<span class='label label-success'>FINALIZADO</span>";
                            default:
                                return '- - -';
                        }
                    }
                },
                {
                    data:'asunto',
                    name:'asunto',
                    "searchable": true
                },
                {
                    data:'plazo',
                    name:'plazo',
                    "searchable": true,
                    render: function (data, type, row) {
                        if(data > 1){
                            return data+' dias';
                        }else{
                            return data+' dia';
                        }
                    }
                },
                {
                    data:'nombre',
                    name:'nombre',
                    "searchable": true
                },
                {
                    data:'numero_folio',
                    name:'numero_folio',
                    "searchable": true
                },
                {
                    data:'solicitante',
                    name:'solicitante',
                    "searchable": true
                },
                {
                    data:'fecha_ingreso',
                    name:'fecha_ingreso',
                    "searchable": false,
                    render: function(data,type,row){
                        if(data == ''){
                            return '---';
                        }
                        else{
                            var dateAr = data.split('-');
                            var newDate = dateAr[2] + '-' + dateAr[1] + '-' + dateAr[0];
                            return newDate;

                        }
                    }
                },
                {
                    data:'id',
                    name:'id',
                    "searchable": true,
                    render: function (data, type, row) {
                        var render = "";
                        render += "<td class='td_center'>";
                        render += " <a href='"+urlBase+"/seguimiento/"+data+"' title='Detalle' class='btn btn-outline btn-circle dark btn-sm blue'>";
                        render += "     <i class='icon-eye'></i> Seguimiento";
                        render += " </a>";
                        render += "</td>";

                        return render;
                    }
                }
            ],
            "pageLength": 8,
            "columnDefs": [
                {
                    'targets': 0,
                    'className': 'dt-head-center dt-body-center',
                    'checkboxes': {
                        'selectRow': true
                    }
                },
                {
                    'orderable': false,
                    'targets': [0]
                }, {
                    "searchable": true,
                    "targets": [0]
                }
            ],
            'select': {
                'style': 'multi'
            },
            'order': [[1, 'asc']],
            "bInfo": false,
            "bLengthChange": false,
            "ordering": false
        });


        function tableRefresh() {
            sTable.draw();
        }

    </script>
@endsection