@extends('template.layout')

@section('styles')
@endsection

@section('content')
    <h1 class="page-title">
        Gestión de Trámites TUPA
    </h1>
    <div class="portlet light bordered">
        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject bold uppercase"> Lista de Trámites TUPA </span>
                <span class="caption-helper"></span>
            </div>
            <div class="actions" style="padding-bottom: 0">
                <a onclick="Agregar()" class="btn btn-primary Crear">
                    <i class="fa fa-plus"></i>
                    <span class="hidden-xs"> A&ntilde;adir </span>
                </a>
            </div>
        </div>
        <div class="row">
            <div class="form-group col-md-2 col-xs-12 {{ $errors->has('responsableExp') ? ' has-error' : '' }}" style="margin-right: 10px;">
                {!! Form::label('lablTipoUser', 'Tipo Usuario:', ['class' => 'control-label']) !!}
                {!! Form::select('type_user[]',['0' => 'Todos','1' => 'Mesa de Partes','2' => 'Dependencia'], null, ['id'=>'selectTypeRegister','class' => 'select2','style'=>'width:100%']) !!}
            </div>
        </div>
        <div class="portlet-body">
            <table class="table table-hover nowrap dataTable dtr-inline" id="dataTable">
                <thead>
                    <tr>
                        <th>Nombre</th>
                        <th>Categoría</th>
                        <th>Calificación</th>
                        <th>Duración del Trámite</th>
                        <th>Estado</th>
                        <th>Rol Creador</th>
                        <th>Opciones</th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
@endsection

@section('scripts')
    <script>
        var tramiteCalificacion = JSON.parse('{!! json_encode(config('constants.TRAMITE_CALIFICACION')) !!}');
        var tramiteEstado = JSON.parse('{!! json_encode(config('constants.TRAMITE_ESTADO_NOMBRE')) !!}');
        var tramiteProcedimiento = JSON.parse('{!! json_encode(config('constants.TRAMITE_PROCEDIMIENTO')) !!}');

       $("#selectTypeRegister").select2();
        $("#selectTypeRegister").change(function () {
            dataTable.draw();
        });
        var dataTableLanguage = {
            "sProcessing":     "Procesando...",
            "sLengthMenu":     "Mostrar _MENU_ registros",
            "sZeroRecords":    "No se encontraron resultados",
            "sEmptyTable":     "Ningún dato disponible en esta tabla",
            "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":         "Buscar:",
            "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"
            }
        };


        var dataTable = $("#dataTable").DataTable({
            language: dataTableLanguage,
            processing: true,
            serverSide: true,
            destroy: true,
            responsive: true,
            ajax: {
                type: "POST",
                url: "{{ route('admin.tramite.index.post') }}",
                data: function(d){
                    d.type_register = $("#selectTypeRegister").val();
                },
                error: function (jqXHR, textStatus, errorThrown) {
                }
            },
            columns: [
                {
                    data: "nombre",
                    name: "nombre"
                },
                {
                    data: "tramite_categoria_nombre",
                    name: "tramite_categoria_nombre",
                    render: function(data, type, row) {
                        var render = "";

                        if (data != "") {
                            render = "<td>" + data + "</td>";
                        } else {
                            render = "<td>---</td>";
                        }

                        return render;
                    }
                },
                {
                    data: "id_tramite_calificacion",
                    name: "id_tramite_calificacion",
                    render: function(data, type, row) {
                        var render = "";

                        if (data != "") {
                            render = "<td>" + tramiteCalificacion[data] + "</td>";
                        } else {
                            render = "<td>---</td>";
                        }

                        return render;
                    }
                },
                {
                    data: "plazo_resolucion",
                    name: "plazo_resolucion",
                    render: function(data, type, row) {
                        var render = "";

                        if (data != "") {
                            render = "<td>" + data + (data != "1" ? " días" : " día") + "</td>";
                        } else {
                            render = "<td>---</td>";
                        }

                        return render;
                    }
                },
                {
                    data: "id_tramite_estado",
                    name: "id_tramite_estado",
                    render: function(data, type, row) {
                        var render = "";

                        if (data != "") {
                            render = "<td>" + tramiteEstado[data] + "</td>";
                        } else {
                            render = "<td>---</td>";
                        }

                        return render;
                    }
                },
                {
                    data: "user_register",
                    name: "user_register",
                    render: function(data, type, row) {
                        var render = "";

                        if (data == 1) {
                            render = "<td>Mesa de Partes</td>";
                        }else if(data == 2){
                            render = "<td>Dependencia</td>";
                        }else{
                            render = "<td>- - -</td>";
                        }

                        return render;
                    }
                },
                {
                    data: "id",
                    name: "id",
                    render: function(data, type, row) {
                        var render = "";
                        render += "<td class=\"td_center\">";
                        render += " <a onclick=\"Detalle(" + data + ")\" title=\"Detalle\" class=\"btn btn-outline btn-circle btn-sm green\">";
                        render += "     <i class=\"fa fa-eye\"></i> Detalle";
                        render += " </a>";
                        render += " <a onclick=\"Editar(" + data + ")\" title=\"Editar\" class=\"btn btn-outline btn-circle btn-sm purple\">";
                        render += "     <i class=\"fa fa-edit\"></i> Editar";
                        render += " </a>";

                        var tramiteProcedimientoValues = Object.values(tramiteProcedimiento);
                        if (tramiteProcedimientoValues.indexOf(data * 1) < 0) {
                            render += " <a onclick=\"Eliminar(" + data + ")\" title=\"Eliminar\" class=\"btn btn-outline btn-circle dark btn-sm black\">";
                            render += "     <i class=\"fa fa-trash-o\"></i> Eliminar";
                            render += " </a>";
                        }

                        render += "</td>";

                        return render;
                    }
                }
            ],
            order: [
                [1, "asc"]
            ]
        });

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        function CargarDataTables(index, args) {
            index = index || -1;
            args = args || null;

            if (index < 0) {
                var dataTableLength = dataTable.length;
                for (var i = 0; i < dataTableLength; i++) {
                    dataTable[i](args);
                }
            } else {
                dataTable[index](args);
            }
        }

        function Detalle(id) {
            window.location.href = "{{ url('admin/tramite/detalle/') }}" + "/" + id;
        }

        function Agregar() {
            window.location.href = "{{ url('admin/tramite/agregar/') }}";
        }

        function Editar(id) {
            window.location.href = "{{ url('admin/tramite/editar/') }}" + "/" + id;
        }

        function Eliminar(id) {
            swal({
                cancelButtonColor: "#dd3333",
                cancelButtonText: "No",
                confirmButtonColor: "#3085d6",
                confirmButtonText: "Sí",
                showCancelButton: true,
                showConfirmButton: true,
                text: "Una vez borrado no se podrá recuperar",
                title: "¿Está seguro de querer eliminar este registro?",
                type: "warning"
            },
            function (isConfirm) {
                if (isConfirm) {
                    EliminarResult(id);
                }
            });
        }

        function EliminarResult(id) {
            var data = {
                id: id
            };

            $.ajax({
                data: data,
                type: "POST",
                url: "{{ route('admin.tramite.eliminar.post') }}",
                beforeSend: function (jqXHR, settings) {
                    /*console.log(jqXHR);
                     console.log(settings);*/
                },
                complete: function (jqXHR, textStatus) {
                    /*console.log(jqXHR);
                     console.log(textStatus);*/
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    /*console.log(jqXHR);
                     console.log(textStatus);
                     console.log(errorThrown);*/
                },
                success: function (data, jqXHR, settings) {
                    /*console.log(data);
                     console.log(jqXHR);
                     console.log(settings);*/

                    if (data) {
                        swal({
                            showCancelButton: false,
                            showConfirmButton: true,
                            text: "El registro se eliminó exitosamente",
                            title: "Éxito",
                            type: "success"
                        }, function (isConfirm) {
                            //location.reload();
                        });

                        dataTable.draw();
                        CargarDataTables();
                    } else {
                        swal({
                            showCancelButton: false,
                            showConfirmButton: true,
                            text: "No se pudo eliminar el registro",
                            title: "Error",
                            type: "success"
                        }, function (isConfirm) {
                            //location.reload();
                        });
                    }
                }
            });
        }

        window.onload = function() {
            CargarDataTables();
        };
    </script>
@endsection