{% extends 'admin/layouts/base.html.twig' %}
{% set active = 'app_admin_ticket_categories' %}
{% set actions = [
    {
        'link': path('app_ticket_category_new'),
        'title': 'Add New Ticket Category'|trans,
    }
] %}
{% set breadcrumbs = [
    {
        'link': path('app_admin_dashboard'), 'title': 'Home'
    },
    {
		'title':'Support Ticket Management'
	},
    {
        'title': 'Ticket Categories',
    }
]%}

{% block content %}
<div class="row">
        <!-- Left Section -->
        <div class="col-md-12">
            <div class="card">
                <div class="card-header bg-secondary text-white border-bottom-0">
                    <h6 class="mb-0">Search</h6>
                </div>
                <div class="card-body">
                    <form action="{{ path('app_admin_ticket_categories') }}" method="get">
                        <div class="form-row col-12 col-sm-6 col-md-6 col-lg-8 col-xl-6"style="float:right;"  >
                            <div class="form-group mb-2 col-12 col-sm-6 col-md-6 col-lg-8 col-xl-8" style="float:left;margin-right: 5px;">
                                <input type="text" class="form-control" name="search_value" id="search_value" placeholder="Search by Name " value="{{ app.request.query.get('search_value') }}">
                            </div>
                            <button class="btn btn-primary" name="is_filter" type="submit" value="true">Search</button>
                            <a class="btn btn-secondary" href="{{ path('app_admin_ticket_categories') }}">Reset</a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
</div>
    <div class="card">
        <div class="table-responsive">
            <table class="table table-bordered table-striped text-center">
                <thead>
                <tr>
                    <th>{{ knp_pagination_sortable(ticket_categories, 'Id', 'tc.id') }}</th>
                    <th>{{ knp_pagination_sortable(ticket_categories, 'Name', 'tc.name') }}</th>
                    <th>{{ knp_pagination_sortable(ticket_categories, 'Description', 'tc.description') }}</th>
                    <th class="table-actions">Actions</th>
                </tr>
                </thead>
                <tbody>
                {% for tc in ticket_categories %}
                    {% include 'admin/ticket_category/row.html.twig' %}
                {% else %}
                    <tr class="w-100 text-center">
                        <td class="border-none" colspan="4">No Records found</td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
        {{ include('helper/pagination_card_footer.html.twig', {'knp_result_set': ticket_categories}) }}
    </div>

    <div id="delete_popup" class="modal fade" tabindex="-1">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-header bg-danger">
                    <h6 class="modal-title text-white">Delete Ticket Category</h6>
                    <button aria-label="Close" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <h6 class="font-weight-semibold">Are you sure you want to delete this Ticket Category?</h6>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-link" data-bs-dismiss="modal">Close</button>
                    <button type="button" class="btn bg-danger text-white" id="confirm-delete">Approve the Deletion</button>
                </div>
            </div>
        </div>
    </div>

{% endblock %}

{% block javascripts %}
    <script>
        $(document).ready(function() {
            var currentId; // Temporary storage for the ticket category ID
            $('.delete-ticket-category').click(function() {
                currentId = $(this).data('id'); // Store the ticket category ID when the delete button is clicked
                $('#delete_popup').modal('show');
            });
            $('#confirm-delete').click(function() {
                if (!currentId) return; // Exit if no ticket category ID is set
                // Adjust the URL path to your actual deletion route
                // If using Symfony, you might generate this URL in your Twig template using the path() function
{#                var deleteUrl = `/admin/ticket-category/${currentId}/delete`;#}
                
                let deleteUrl = "{{ path('app_admin_ticket_category_delete', {id: '_currentId'}) }}";
                deleteUrl = deleteUrl.replace('_currentId', currentId);
                
                $.ajax({
                    type: "POST",
                    url: deleteUrl, // Your endpoint for deletion
                    data: {
                        id: currentId,
                        csrf: '{{ csrf_token('usercsrf') }}' // Assuming you're passing CSRF token for security
                    },
                    success: function(response) {
                        $('#delete_popup').modal('hide');
                        if (response.status) { // Assuming the response object has a status property
                            // Handle successful deletion, e.g., remove the category element or refresh
                            location.reload(); // or $(`#product-${currentProductId}`).remove(); to remove the product from the list without reloading
                        } else {
                            // Handle failure
                            console.log("Ticket Category could not be deleted. ");
                        }
                    },
                });
            });
            // Reset currentProductId when the modal is closed or dismissed
            $('#delete_popup').on('hidden.bs.modal', function () {
                currentId = null;
            });
        });
    </script>


{% endblock  %}