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

{% set bodyClass = 'registry_conformite_organisation list' %}
{% set menuItem = 'registry_conformite_organisation' %}
{% set submitValue = submitValue|default('registry.conformite_organisation.action.pilote_submit'|trans) %}

{% block title %}{{ 'registry.conformite_organisation.title.list'|trans }} - {{ parent() }}{% endblock %}

{% block stylesheets %}
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap.min.css">
    <link rel="stylesheet" href="//cdn.datatables.net/buttons/1.6.2/css/buttons.dataTables.min.css">
{% endblock %}

{% block body_head %}
    <h1>{{ 'registry.conformite_organisation.title.list'|trans }}</h1>
{% endblock %}

{% block breadcrumb %}
    {% set breadcrumb = [
        { 'name': 'registry.conformite_organisation.title.list'|trans }
    ] %}
    {% include '_breadcrumb.html.twig' with {'breadcrumb': breadcrumb} %}
{% endblock %}

{% block body %}
    {% if form is not null and not is_granted('ROLE_REFERENT') %}
        {% if is_granted('ROLE_USER') %}
            {{ form_start(form) }}
        {% endif %}
            <div class="row">
                <div class="col-xs-12 mb-1">
                    {% if evaluations is not empty %}
                        <a href="{{ path('registry_conformite_organisation_report', {'id': evaluations[0].id, 'all_actions' : false}) }}" class="btn btn-default">
                            <i aria-hidden="true" class="fa fa-clipboard-list"></i>
                            {{ 'global.action.report'|trans }}
                        </a>
                    {% endif %}
                    {% if is_granted('ROLE_USER') %}
                        <input type="submit" class="btn btn-primary" value="{{ submitValue }}">
                    {% endif %}
                    {% if category and category.documents|length > 0 %}
                        <a href="{{ path('documentation_document_index') }}?category={{ category.id }}" class="btn btn-default pull-right">
                            <i aria-hidden="true" class="fa fa-circle-info"></i>
                            {{ 'global.action.documentation'|trans }}
                        </a>
                    {% endif %}
                </div>
            </div>

            <div class="row">
                <div class="col-xs-12">
                    <div class="box box-solid">
                        <div class="box-body overflow-x-auto">
                            <table class="table table-bordered table-hover">
                                <caption class="sr-only">Liste des pilotes par processus</caption>
                                <thead>
                                    <tr>
                                        <th scope="col">{{ 'registry.conformite_organisation.list.pilote'|trans }}</th>
                                        <th scope="col">{{ 'registry.conformite_organisation.list.processus'|trans }}</th>
                                        <th scope="col">{{ 'registry.conformite_organisation.list.conformite'|trans }}</th>
                                        <th scope="col">{{ 'global.label.linked_mesurement'|trans }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    {% if evaluations is not empty %}
                                        {% for conformite in getConformitesWithProcessusAndQuestions(form.conformites) %}
                                            {% set conformite = conformite[0] %}
                                            <tr>
                                                {% if is_granted('ROLE_USER') %}
                                                    <td style="vertical-align: middle">{{ form_widget(conformite.pilote) }}</td>
                                                {% else %}
                                                    <td style="vertical-align: middle">{{ conformite.vars.value.pilote }}</td>
                                                {% endif %}
                                                <th scope="row" style="vertical-align: middle">{{ conformite.vars.value.processus.nom }}</th>
                                                <td style="vertical-align: middle">
                                                    {% if conformite.vars.value.conformite < 2.5 %}
                                                        {% set type = 'bg-red' %}
                                                    {% elseif conformite.vars.value.conformite < 3.5 %}
                                                        {% set type = 'bg-yellow' %}
                                                    {% else %}
                                                        {% set type = 'bg-green' %}
                                                    {% endif %}
                                                    <span style="width: 50px;" class="badge {{ type }}">{{ conformite.vars.value.conformite }} / 5</span>
                                                </td>
                                                <td style="vertical-align: middle">
                                                    {% if conformite.vars.value.NonAppliedActionProtections|length > 0 %}
                                                        <ul class="ps-1">
                                                            {% for action in conformite.vars.value.NonAppliedActionProtections %}
                                                                <li>
                                                                    <a href="{{ path('registry_mesurement_show', { id: action.id }) }}">
                                                                        {{ action.name }} ({{ action.status|dictionary('registry_mesurement_status') }})
                                                                    </a>
                                                                </li>
                                                            {% endfor %}
                                                        </ul>
                                                    {% endif %}
                                                </td>
                                            </tr>
                                        {% endfor %}
                                    {% endif %}
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        {% if is_granted('ROLE_USER') %}
            {{ form_end(form) }}
        {% endif %}
    {% endif %}

    <div class="row">
        <div class="col-xs-12 mb-1">
            {% if is_granted('ROLE_USER') and app.user.collectivity.hasModuleConformiteOrganisation %}
                <a href="{{ path('registry_conformite_organisation_create') }}" class="btn btn-default">
                    <i aria-hidden="true" class="fa fa-plus"></i>
                    {{ 'registry.conformite_organisation.action.create'|trans }}
                </a>
            {% endif %}
            {% if is_granted('ROLE_REFERENT') and category and category.documents|length > 0 %}
                <a href="{{ path('documentation_document_index') }}?category={{ category.id }}" class="btn btn-default pull-right">
                    <i aria-hidden="true" class="fa fa-circle-info"></i>
                    {{ 'global.action.documentation'|trans }}
                </a>
            {% endif %}
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12">
            <div class="box box-solid">
                <div class="box-body overflow-x-auto">
                    <table id="table" class="table table-bordered table-hover">
                        <caption class="sr-only">Liste des évaluations de la structure</caption>
                        <thead>
                            <tr>
                                <th scope="col" style="min-width:130px;position:relative;">
                                    <input class="daterangepicker form-control" type="text" id="search_created_at" placeholder="{{ 'global.placeholder.date'|trans }}" style="max-width: 100%;left: inherit!important;top: 0;font-size: 14px;border-radius: 0;padding: 0 5px;">
                                </th>
                                {% if is_granted('ROLE_REFERENT') %}
                                    <th scope="col">
                                        <input class="form-control" type="text" id="search_collectivite" placeholder="{{ 'global.label.organization'|trans }}" style="width: 100%;">
                                    </th>
                                {% endif %}
                                <th scope="col">
                                    <input class="form-control" type="number" min="0" id="search_participant" placeholder="{{ 'registry.conformite_organisation.list.nb_participants'|trans }}" style="width: 100%;">
                                </th>
                                <th scope="col">
                                    <select class="form-control" id="search_draft" style="width: 100%;">
                                        <option value="">{{ 'registry.conformite_organisation.list.draft'|trans }}</option>
                                        <option value="1">{{ 'global.label.yes'|trans }}</option>
                                        <option value="0">{{ 'global.label.no'|trans }}</option>
                                    </select>
                                </th>
                                <th scope="col"></th> <!-- Actions -->
                            </tr>
                            <tr>
                                <th scope="col">{{ 'registry.conformite_organisation.label.date'|trans }}</th>
                                {% if is_granted('ROLE_REFERENT') %}
                                    <th scope="col">{{ 'global.label.organization'|trans }}</th>
                                {% endif %}
                                <th scope="col">{{ 'registry.conformite_organisation.list.nb_participants'|trans }}</th>
                                <th scope="col">{{ 'registry.conformite_organisation.list.draft'|trans }}</th>
                                <th scope="col">{{ 'global.label.actions'|trans }}</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery-throttle-debounce/1.1/jquery.ba-throttle-debounce.js"></script>

    {% set collectivityIsVisible = false %}
    {% set collectivityClassname = "noVis" %}
    {% set actionIsVisible = false %}
    {% if is_granted('ROLE_REFERENT') %}
        {% set collectivityIsVisible = true %}
        {% set collectivityClassname = "" %}
    {% endif %}

    {% if is_granted('ROLE_USER') and 'true' != app.request.get('archive') %}
        {% set actionIsVisible = true %}
    {% endif %}

    {% set cols = [
        {"data": "created_at", "className": "noVis"},
        {"data": "participant"},
        {"data": "draft"},
        {"data": "actions", "className": "noVis", "orderable": false, "visible": actionIsVisible},
    ] %}

    {% if is_granted('ROLE_REFERENT') %}
        {% set cols = [
            {"data": "created_at", "className": "noVis"},
            {"data": "collectivite", "className": collectivityClassname, "visible": collectivityIsVisible},
            {"data": "participant"},
            {"data": "draft"},
            {"data": "actions", "className": "noVis", "orderable": false, "visible": actionIsVisible},
        ] %}
    {% endif %}

    {% set dataTableOptions = {
        columns: cols,
        order:  [
            [0, 'desc' ]
        ],
    } %}

    {{ include('_Utils/_serverside_datatable.html.twig') }}

    <script>
        function setEvents() {
            var oTable = $('#table').DataTable();
            var col = 0;
            {% if is_granted('ROLE_REFERENT') %}
            col = 1;
            {% endif %}

            $('#search_created_at').off('change');
            $('#search_created_at').change(function(){
                oTable.column(0).search($(this).val()).draw() ;
            });

            {% if is_granted('ROLE_REFERENT') %}
            $('#search_collectivite').off('keyup');
            $('#search_collectivite').keyup($.debounce(250, function(){
                oTable.column(1).search($(this).val()).draw() ;
            }));
            {% endif %}

            $('#search_participant').off('keyup');
            $('#search_participant').keyup($.debounce(250, function(){
                oTable.column(col + 1).search($(this).val()).draw() ;
            }));

            $('#search_participant').on('click', function(){
                oTable.column(col + 1).search($(this).val()).draw() ;
            });

            $('#search_draft').off('change');
            $('#search_draft').change(function(){
                oTable.column(col + 2).search($(this).val()).draw() ;
            })
        }

        $(document).ready(function() {
            $('#table_filter').hide();
            setEvents();

            let columnButton = $("button.dt-button > span:contains('Colonnes')").parent();
            $( "#custom-buttons" ).prepend( columnButton.css("float", "left").css("margin-right", "0.5em"));
        } );
        $('#table').on('column-visibility.dt', function() {
            setEvents();
        } );
    </script>

{% endblock %}