{% block body %}
    <div class="bs-col clearfix" id="divParam">
        <div class="divParam clearfix mb-base">
            <div class="single">
                <div class="border_form clearfix">
                    <h2 class="separateur_bottom" style="padding-bottom:5px;">
                        {{ 'Groupes' | trad }}
                    </h2>
                    <table id="groups_table" class="table table-hover">
                        <thead class="thead-dark">
                            <tr>
                                <th width="15px"></th>
                                <th scope="col" width="">{{ 'Groupes' | trad }}</th>
                                <th scope="col" width="">
                                    <a class="ajouter_blanc_v2 white-tooltip" 
                                        onclick="editGroup();" 
                                        style="float: right;background-position: 50% 5px;height: 21px !important;">
                                        <span class="infos_tooltip left" style="font-weight: normal;">
                                            {{ 'Ajouter un groupe de contributeurs' | trad }}
                                        </span>
                                    </a>
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for group in groupsOfContributors %}
                                <tr id="node_{{ loop.index }}">
                                    <td class="loupe"></td>
                                    <td>{{ group.GROUPE_CONTRIB }}</td>
                                    <td align="right">
                                        {{ hover_action(
                                            'node_' ~ loop.index, 'Supprimer_v2', 
                                            "popupConfirmation(
                                                '" ~ path('Ajax.Erreur.popupConfirmationSuppresion') ~ "','', 
                                                '" ~ path('Consultation.GroupOfContributors.delete',
                                                        {idAO: idAO, group: group.GROUPE_CONTRIB}) ~ "',
                                                '" ~ 'Voulez-vous supprimer le groupe ?'|e('js')|raw ~ "',
                                                'divParam', '" ~ group.GROUPE_CONTRIB ~ "', '', '', '', 'deleteGroup', '', '', '', '', 
                                                '" ~ ('Suppression contributeur'|trad|e('js')|raw) ~ "'
                                            )", 'float: right;'
                                        ) }}
                                        {{ hover_action(
                                            'node_' ~ loop.index, 'modifier_v2', 
                                            "editGroup('" ~ group.GROUPE_CONTRIB ~ "');", 'float: right;margin-right:5px;'
                                        ) }}
                                        <div class="icone">
                                            {{ menuContextuel('node_' ~ loop.index | replaceInID, false, group.menuContextuel, 6) }}
                                        </div>
                                    </td>
                                </tr>
                                <tr id="node_{{ loop.index }}detail" class="detail_ligne hide_detail">
                                    <td colspan="3">
                                        <div id="groups{{ loop.index }}" class="tab-pane active in clearfix border_form">
                                            <div class="single">
                                                <div class="tab-content">
                                                    <table class="table table-hover">
                                                        {% include '@Consultation/Consultation/GroupsOfContributors/raters_table_for_group.twig' with {
                                                            contributors: group.contributors,
                                                            groupName: group.GROUPE_CONTRIB
                                                        } %}
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            {% endfor %}
                        </tbody>
                    </table>                            
                </div>
            </div>
        </div>
    </div>
    <script>
        function editGroup(group = '') {
            activeLoader();
            $.ajax({
                url: {{ path(
                    'Consultation.GroupOfContributors.creatEdit',
                    {idAO: idAO, group: group}
                ) | json }},
                type: 'POST',
                data: {'group': group},
                dataType: 'html',
                success: function (data) {
                    desactiveLoader();
                    $("#divParam").html(data);
                },
            });
        }

        function deleteGroup(group) {
            activeLoader();
            $.ajax({
                url: {{ path(
                    'Consultation.GroupOfContributors.delete',
                    {idAO: idAO, group: group}
                ) | json }},
                type: 'POST',
                data: {'group': group},
                dataType: 'html',
                success: function (data) {
                    desactiveLoader();
                    $("#divParam").html(data);
                },
            });
        }

        function contributorsList(param) {
        activeLoader();
        $.ajax({
            url: {{ path(
                'Consultation.Contributor.contributorsListForGroup',
                {idAO: idAO}
            ) | json }},
            type: 'POST',
            data: {'group': param},
            dataType: 'html',
            success: function (data) {
                desactiveLoader();
                $("#divParam").html(data);
            },
        });
    }
	</script>
{% endblock %}
