{% extends 'App/_include/_layout.main.html.twig' %}
{% block page_content %}
    <div class="cell small-12">
        <div class="grid-x header_title_and_action">
            <div class="cell small-12  medium-auto header_title">
                <h1><i class="fa fa-user-circle-o"></i>{{ 'manager.title.list'|trans }}</h1>
            </div>
        </div>
    </div>
    <div class="cell small-12">
        <div id="dt_container" class="grid-x"></div>
        {% if dt_settings.data.data_set|length < 1 %}
            <p class="mt-2 text-center">{{ 'emptyData'|trans }}</p>
        {% endif %}
    </div>
{% endblock %}
{% block javascript_footer %}
    {{ parent() }}
    <script>
        $(document).ready(function(){
            {% if dt_settings.data.data_set|length > 0 %}
                let dtToolbar_manager = new dtToolbar(document.getElementById('dt_container'),  {{ dt_settings|json_encode|raw }});

                $(dtToolbar_manager).on('row.click_action', function(e, data){
                    let item_id = data.id;
                    if(data.target.classList.contains('editManager')){

                    }
                    else if(data.target.classList.contains('btnOpenModalDeleteManager')){

                    }
                });
            {% endif %}
        });

        </script>
{% endblock %}