{% extends 'base.html.twig' %}

{% block title %}EshColonias index{% endblock %}

{% block body %}
    <div class="row mt-5">
        <div class="col-md-12 mt-5">
            <div class="row align-items-center">
                <div class="col-md-8">
                    <h1>Listado de Colonias</h1>
                </div>
                <div class="col-md-4">
                    <a href="{{ path('app_catalogos_area_geografica_colonias_esh_colonias_new') }}" class="btn btn-primary btn-sm" title="Agregar Nueva Colonia"><i class="fa-solid fa-plus"></i> Agregar Nueva Colonia</a>
                </div>
            </div>
            <div class="table-responsive mt-5">
                <table id="myTable" class="table table-striped">
                    <thead>
                        <tr class="table-primary">
                            <th>Id</th>
                            <th>CP</th>
                            <th>Colonia</th>
                            <th>Alcaldia / Municipio</th>
                            <th>Ver Colonia</th>
                            <th>Acciones</th>
                        </tr>
                    </thead>
                    {#<tbody class="table-group-divider">
                     {% for esh_colonia in esh_colonias %}
                        <tr>
                            <td>{{ esh_colonia.id}}</td>
                            <td>{{ esh_colonia.cp }}</td>
                            <td>{{ esh_colonia.colonia }}</td>
                            <td>{{ esh_colonia.municipiodeleg }}</td>
                            <td>
                                <a href="{{ path('app_catalogos_area_geografica_colonias_esh_colonias_show', {'id': esh_colonia.id}) }}" class="btn btn-sm btn-primary" title="Ver Colonia"><i class="fa-solid fa-eye"></i></a>
                            </td>
                            <td>
                                <a href="{{ path('app_catalogos_area_geografica_colonias_esh_colonias_edit', {'id': esh_colonia.id}) }}" class="btn btn-sm btn-warning" title="Editar"><i class="fa-solid fa-pencil"></i></a>
                                <a href="{{ path('app_catalogos_area_geografica_colonias_esh_colonias_delete', {'id': esh_colonia.id}) }}" class="btn btn-sm btn-danger" title="Eliminar"><i class="fa-solid fa-trash"></i></a>
                            </td>
                        </tr>
                    {% else %}
                        <tr>
                            <td colspan="5">no records found</td>
                        </tr>
                    {% endfor %} 
                    </tbody>#}
                </table>
            </div>
        </div>
    </div>
    <script>
        function eliminar(url){
                Swal.fire({
                    title: "¿Esta usted seguro de eliminar el registro?",
                    icon: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#3085d6",
                    cancelButtonColor: "#d33",
                    confirmButtonText: "Eliminar",
                    cancelButtonText: "Cancelar"
                    }).then((result) => {
                    if (result.isConfirmed) {
                        $.ajax({
                            url: url,
                            type: 'POST',
                            
                            success: function(response) {
                                // Al eliminar correctamente, eliminar la fila de la tabla
                                Swal.fire(
                                    '¡Eliminado!',
                                    'El registro ha sido eliminado.',
                                    'success'
                                ).then(function() {
                                    // Recargar la página
                                    location.reload();
                                });
                            },
                            error: function() {
                                Swal.fire(
                                    'Error',
                                    'Hubo un problema al intentar eliminar.',
                                    'error'
                                );
                            }
                        });
                    }
                });
            }
        $(document).ready(function () {
            var url_from_twig_ajax = '{{ path("ajax_colonies") }}';
            $('#myTable').DataTable({
                serverSide: true,
                ajax: url_from_twig_ajax,
                columns: [
                    { data: 'id' },
                    { data: 'cp' },
                    { data: 'colonia' },
                    { data: 'municipiodeleg' },
                    {
                        data: null, // No extraer datos, se usará contenido personalizado.
                        orderable: false, // Desactiva el ordenamiento para esta columna.
                        searchable: false, // Desactiva la búsqueda en esta columna.
                        render: function (data, type, row) {
                            return `
                                <a href="/catalogos/area/geografica/colonias/esh/colonias/${row.id}" 
                                class="btn btn-sm btn-primary" 
                                title="Ver Colonia">
                                    <i class="fa-solid fa-eye"></i>
                                </a>
                            `;
                        }
                    },
                    {
                        data: null, // No extraer datos, se usará contenido personalizado.
                        orderable: false, // Desactiva el ordenamiento para esta columna.
                        searchable: false, // Desactiva la búsqueda en esta columna.
                        render: function (data, type, row) {
                            console.log(row);
                            // Aquí Twig generará el token al momento de renderizar
                 
                            return `
                                <a href="/catalogos/area/geografica/colonias/esh/colonias/${row.id}/edit" 
                                class="btn btn-sm btn-warning" 
                                title="Editar">
                                    <i class="fa-solid fa-pencil"></i>
                                </a>
                                <a class="btn btn-sm btn-danger delete-link" title="Eliminar" onclick="eliminar('/catalogos/area/geografica/colonias/esh/colonias/${row.id}')">
                                    <i class="fa-solid fa-trash"></i>
                                </a>
                            `;
                        }
                    }

                ],
                language: {
                    url: 'https://cdn.datatables.net/plug-ins/1.13.6/i18n/es-ES.json'
                },
                paging: true,
                searching: true,
                ordering: false,
                destroy: true
            });
        });
    </script>

{% endblock %}