{% import "forms-macro/popup.html.twig" as macro %}
<script type="application/javascript">
    let resumeServiceUserURI = "{{ path('service_created_on_project_start', {'id': 'idServiceC'}) }}";
</script>
<div class="container-fluid">
    {% if not is_granted('ROLE_LECTURE_SEULE') %}
        <div class="row rubrique">
            <div class="rubrique_titre">
                <span>Ajouter un service</span>
            </div>
            <div class="col-sm-12 col-md-12 col-lg-12 containerServicesList">
                {% for serviceRE in serviceListCollection %}
                    {% set backgroundContainerS = "transparent" %}
                    {% set notAvailableTxt = "" %}
                    {% set serviceAvailable = true %}
                    {% set serviceAlreadyInProgress = false %}
                    {% if serviceRE.slug not in availableServices %}
                        {% set backgroundContainerS = "#ddd" %}
                        {% set notAvailableTxt = "Non disponible pour votre licence" %}
                        {% set serviceAvailable = false %}
                    {% endif %}

                    {% set manageModal = "" %}
                    {% set idServiceC = "null" %}
                    {% if not serviceAvailable %}
                        {% set manageModal = 'data-toggle=modal data-target=#modal-access-service-not-available' %}
                    {% else %}
                        {% for serviceCustomer in project.serviceCreatedOnProjects %}
                            {% if serviceCustomer.serviceRE.slug == serviceRE.slug %}
                                {% if serviceCustomer.status != "ANOMALY_DETECTED" and serviceCustomer.status != "OBSOLETE_FROM_PREREQUISITE" and serviceCustomer.status != "OBSOLETE" %}
                                    {% set idServiceC = serviceCustomer.id %}
                                    {% set serviceAlreadyInProgress = true %}
                                    {% set manageModal = 'onclick=window.location.href=resumeServiceUserURI.replace("idServiceC",' ~ idServiceC ~ ');' %}
                                {% endif %}
                            {% endif %}
                        {% endfor %}
                    {% endif %}
                    {% set departmentForbidden = false %}
{#                    {% if ('aac_cdc' in serviceRE.getSlug() or 'moninstallation' in serviceRE.getSlug()) and project.defaultAddress.postalCode[:2] | intval > 95 %}#}
{#                        {% set departmentForbidden = true %}#}
{#                    {% endif %}#}
                    <div class="containerService {{ departmentForbidden ? 'departmentForbidden' : '' }}"
                         style=" background-color: {{ backgroundContainerS }}" {{ manageModal }}>
                        {% set scStatut = "DISABLED" %}
                        {% set break = false %}
                        {% for serviceCustomer in project.serviceCreatedOnProjects %}
                            {% if serviceCustomer.serviceRE.slug == serviceRE.slug %}
                                {% set scStatut = serviceCustomer.status %}
                                {% break %}
                            {% endif %}
                        {% endfor %}
                        {% if scStatut == "COMPLETED" or scStatut == "VALIDATED" %}
                            {% set classBtnService = "btnServCompleted" %}
                        {% elseif scStatut == "IN_PROGRESS" %}
                            {% set classBtnService = "btnServInProgress" %}
                        {% else %}
                            {% set classBtnService = "btnServDisabled" %}
                        {% endif %}
                        <a
                                {% if serviceAvailable and not serviceAlreadyInProgress and scStatut !== "COMPLETED" %}
                                    style="z-index: 1;" title="Service : {{ serviceRE.label }}"
                                    href="{{ path('service_created_on_project_new_blank', { "projectId" : project.id, "serviceListId" : serviceRE.id , "tabContainer" : "tabServices" }) }}"
                                {% endif %}
                        >
                            <div style="flex:3;">
                                <div class="service-img">
                                    <img src="{{ serviceRE.logoFilepath != null ? asset(serviceRE.logoFilepath) : asset('install-bois/icon/service/default_settings_icon.png') }}"
                                         alt="" class="{{ classBtnService }}">
                                    {% if scStatut == "COMPLETED" or scStatut == "VALIDATED" %}
                                        <span class="check" aria-hidden="true"><i style="font-size: 20px;"
                                                                                  class="fas fa-check"></i></span>
                                    {% endif %}
                                </div>
                            </div>
                            <div class="serviceName">
                                <span>{{ serviceRE.label }}</span>
                            </div>
                            {% if is_granted('ROLE_ADMIN') %}
                                <div class="serviceVersion">
                                <span style="flex: 1;font-style: italic;font-size: 13px;">
                                    {% if departmentForbidden %}
                                        Votre département n’est pas éligible
                                    {% elseif serviceAvailable %}
                                        Version {{ serviceRE.version }}
                                    {% else %}
                                        {{ notAvailableTxt }}
                                    {% endif %}
                                </span>
                                </div>
                            {% endif %}
                        </a>
                    </div>
                    {% if 'aac_cdc' in serviceRE.slug and project.techDataValueForService('displayWet') %}
                        <div class="containerService" style="background-color: {{ backgroundContainerS }}">
                            {% for serviceCustomer in project.serviceCreatedOnProjects %}
                                {% if serviceCustomer.serviceRE.slug == serviceRE.slug %}
                                    {% set idServiceC = serviceCustomer.id %}
                                    {% break %}
                                {% endif %}
                            {% endfor %}
                            <a style="z-index: 1;" title="Service : {{ serviceRE.label }}"
                               href="{{ path('service_created_on_project_show_result_diameter', {'id': idServiceC, 'displayWet': true}) }}">
                                <div style="flex:3;">
                                    <div class="service-img">
                                        <img src="{{ serviceRE.logoFilepath != null ? asset(serviceRE.logoFilepath) : asset('install-bois/icon/service/default_settings_icon.png') }}"
                                             alt="" class="btnServCompleted">
                                        <span class="check" aria-hidden="true"><i style="font-size: 20px;"
                                                                                  class="fas fa-check"></i></span>
                                    </div>
                                </div>
                                <div class="serviceName">
                                    <span>{{ serviceRE.label }} consultatif WET</span>
                                </div>
                                <div class="serviceVersion">
                                <span style="flex: 1;font-style: italic;font-size: 13px;">
                                    Version {{ serviceRE.version }}
                                </span>
                                </div>
                            </a>
                        </div>
                    {% endif %}
                {% endfor %}
            </div>
        </div>
    {% endif %}
    <div class="row rubrique">
        <div class="rubrique_titre">
            <span>Les services de mon étude</span>
        </div>
        <div class="col-sm-12 col-md-12 col-lg-12">
            <table id="services-list" class="row-border " style="width: 100%">
                <thead>
                <tr>
                    <th style="text-align: center">Accéder</th>
                    <th class="hideOnSmartphone">Créé par</th>
                    <th>Créé le</th>
                    <th class="hideOnSmartphone">État</th>
                    <th>Service</th>
                    {% if  is_granted('ROLE_ADMIN') %}
                        <th class="hideOnSmartphone">Version</th>
                    {% endif %}
                </tr>
                </thead>
                <tbody>
                {% for service in project.serviceCreatedOnProjects %}
                    <tr data-scop-id="{{ service.id }}">
                        <td class="actionServices">
                            {% if service.status !== "OBSOLETE_FROM_PREREQUISITE" and service.status !== "OBSOLETE" %}
                                {% if not is_granted('ROLE_LECTURE_SEULE') %}
                                    <form action="{{ path('service_created_on_project_start', {'id': service.id}) }}"
                                          method="post">
                                        <input type="hidden" name="tabContainer" value="tabServices"/>
                                        <input type="hidden" name="serviceCustomerId" value="{{ service.id }}"/>
                                        <button type="submit" class="boutonAction"
                                                style="float: right;width: 25px;padding-right: 0px;padding-left: 0px;">
                                            <img title="Consulter le service"
                                                 src="{{ asset('install-bois/icon/tab_action_consulter.png') }}"/>
                                        </button>
                                    </form>
                                {% endif %}
                                {% if is_granted("ROLE_ADMIN") %}
                                    <a title="Voir les résultats du service"
                                       href="{{ path('service_created_on_project_show_response', { 'id': service.id}) }}">
                                        <button type="submit" class="boutonAction"
                                                style="width: 25px;padding-right: 0;padding-left: 0;">
                                            <i class="fas fa-poll"></i>
                                        </button>
                                    </a>
                                {% endif %}
                            {% endif %}
                            {% if service.status !== "COMPLETED" and service.status !== "VALIDATED" and is_granted('ROLE_ADMIN') %}
                                <a title="Supprimer le service" id="removeServiceBtn" type="button" class="boutonAction"
                                   onclick="initDeleteForm({{ service.id }})"
                                   data-toggle="modal" data-target="#popup-danger-service"
                                   style="background-color: transparent!important;padding:0;margin: 0">
                                    <img alt="Supprimer"
                                         src="{{ asset('install-bois/icon/tab_action_supprimer.png') }}"/>
                                </a>
                            {% endif %}
                            {% if  is_granted('ROLE_ADMIN') %}
                                <a title="Importer XML" id="importXMLBtn" type="button"
                                   onclick="initImportForm({{ service.id }})"
                                   data-toggle="modal" data-target="#modal_import_xml_file"
                                   style="background-color: transparent!important;padding:0;margin: 0">
                                    <button type="submit" class="boutonAction"
                                            style="width: 25px;padding-right: 0;padding-left: 0;">
                                        XML
                                    </button>
                                </a>
                            {% endif %}
                        </td>

                        <td class="hideOnSmartphone">{{ service.createdByUser.lastName|capitalize ~ " " ~ service.createdByUser.firstName|capitalize }} </td>
                        <td style="width: 10%">{{ service.createdAt|date('d/m/Y') }}</td>
                        {% if service.status == "IN_PROGRESS" %}
                            {% set backgroundC = "#FFF2CC" %}
                            {% set color = "#7F7F7F;" %}
                        {% elseif service.status == "COMPLETED" or service.status == "VALIDATED" %}
                            {% set backgroundC = "#92D050" %}
                            {% set color = "#7F7F7F;" %}
                        {% else %}
                            {% set backgroundC = "#FC971F" %}
                            {% set color = "#FFFFFF;" %}
                        {% endif %}

                        {% set tdwidth = "10%" %}
                        {% if service.status == "ANOMALY_DETECTED" or  service.status == "OBSOLETE_FROM_PREREQUISITE" or service.status == "OBSOLETE" %}
                            {% set tdwidth = "15%" %}
                        {% endif %}
                        <td class="hideOnSmartphone"
                            style="width: {{ tdwidth }};background-color: {{ backgroundC }}; color: {{ color }}">
                            {% if is_granted("ROLE_ADMIN") %}
                                <select class="changeScopStatus" style="height: 50%;width:50%;color: #7F7F7F!important">
                                    <option value="">{{ service.statusName(service.status) }}</option>
                                    {% for key,status in stateForAdmin %}
                                        {% if key!=service.status and (key!="VALIDATED" or service.serviceRE.slug =="p_aac_cdc") %}
                                            <option value="{{ key }}">{{ status }}</option>
                                        {% endif %}
                                    {% endfor %}
                                </select>
                            {% else %}
                                {% if service.status == "ANOMALY_DETECTED" or  service.status == "OBSOLETE_FROM_PREREQUISITE" or service.status == "OBSOLETE" %}
                                    <i class="fas fa-exclamation-circle"></i>
                                {% endif %}
                                {{ service.statusName(service.status) }}
                            {% endif %}
                        </td>
                        <td>{{ service.serviceRE.label }}</td>

                        {% if  is_granted('ROLE_ADMIN') %}
                            <td class="hideOnSmartphone">{{ service.serviceRE.version }}</td>
                        {% endif %}
                    </tr>
                    {% if 'aac_cdc' in service.serviceRE.slug and project.techDataValueForService('displayWet') == 1 %}
                        <tr>
                            <td class="actionServices">
                                {% if not is_granted('ROLE_LECTURE_SEULE') %}
                                    <a href="{{ path('service_created_on_project_show_result_diameter', {'id': service.id, 'displayWet': true}) }}"
                                       class="boutonAction"
                                       style="float: right;width: 25px;padding-right: 0;padding-left: 0;">
                                        <img title="Consulter le service"
                                             src="{{ asset('install-bois/icon/tab_action_consulter.png') }}"/>
                                    </a>
                                {% endif %}
                            </td>
                            <td class="hideOnSmartphone">{{ service.createdByUser.lastName|capitalize ~ " " ~ service.createdByUser.firstName|capitalize }} </td>
                            <td style="width: 10%">{{ service.createdAt|date('d/m/Y') }}</td>

                            <td class="hideOnSmartphone" style="width: 10%;background-color: #92D050; color: #7F7F7F">
                                {{ service.statusName(service.status) }}
                            </td>
                            <td>{{ service.serviceRE.label }} consultatif WET</td>
                            <td class="hideOnSmartphone">{{ service.serviceRE.version }}</td>
                        </tr>
                    {% endif %}
                {% else %}
                    <tr>
                        <td colspan="6">Aucun service n'a été créé</td>
                    </tr>
                {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>

{# Popup container #}
<div>
    {{ macro.popup("danger","form-delete-service" ,path('service_created_on_project_delete', {'id': 'id'}),'service', "Vous êtes sur le point d'effacer définitivement ce service.", 'delete') }}
    {{ macro.popup("info","form-update-scop-status" ,path('service_created_on_project_change_status', {'id': 'id','slug':'slug'}),'service', "Vous êtes sur le point de changer le status du service.") }}
    {{ include('project/_modal/_form_not_available_service_licence.html.twig') }}
    {{ include('project/_modal/_service_already_in_progress.html.twig') }}
    {{ include('project/_modal/_add_xml_files_for_test.html.twig') }}
</div>

<script type="application/javascript">
    let params = {
        "searching": false,
        "info": false,
        order: [[1, "DESC"]],
        "columnDefs": [
            {"type": "date-eu", "targets": [1]},
        ]
    };
    if ({{ project.serviceCreatedOnProjects|length }} >
    0
    )
    {
        initDatatable('#services-list', params, [5]);
    }
    let currentServiceCreatedUserId = null;
    $(document).ready(function () {
        $(".containerService").on("click", function (e) {
            if (e.currentTarget.dataset.idservicec !== 'undefined') {
                currentServiceCreatedUserId = e.currentTarget.dataset.idservicec;
            }
        });
        $("#btnModalResumeCompletedS").on("click", function (e) {
            if (e.currentTarget.dataset.idservicec !== 'undefined') {
                currentServiceCreatedUserId = e.currentTarget.dataset.idservicec;
            }
        });
        $("#boutonOuiResumeService").on("click", function () {
            if (currentServiceCreatedUserId !== null) {
                window.location.href = resumeServiceUserURI.replace('idServiceC', currentServiceCreatedUserId);
            }
        });
        $("#boutonOuiServiceLicence").on("click", function () {
            window.location.href = "{{ path('subscription_index') }}";
        });

        $("#boutonOuiResumeCompletedService").on("click", function (e) {
            if (currentServiceCreatedUserId !== null) {
                window.location.href = resumeServiceUserURI.replace('idServiceC', currentServiceCreatedUserId);
            }
        });
    });

    function initDeleteForm(serviceId) {
        let url = '{{ path("service_created_on_project_delete", {'id': 'service_id'}) }}';
        url = url.replace("service_id", serviceId);
        $("#form-delete-service")[0].action = url;
    }

    function initImportForm(serviceId) {
        let url = '{{ path("service_created_on_project_test_xml", {'id': 'service_id'}) }}';
        url = url.replace("service_id", serviceId);
        $("#form_import")[0].action = url;
    }

    let changeStatusURI = "{{ path('service_created_on_project_change_status', {'id': 'id','slug':'slug'}) }}"
    $('.changeScopStatus').on('change', function () {
        let selectedOption = $(this).find('option:selected');
        if (selectedOption.val() !== "") {
            $('#popup-info-service').modal();
            let tr = $(this).closest('tr');

            let newUrl = changeStatusURI.replace('id', tr.data('scop-id')).replace('slug', selectedOption.val());
            $('#form-update-scop-status')[0].action = newUrl
            console.log(newUrl);
        }
    });

</script>
<script type="text/javascript" src="{{ asset('install-bois/datepickerCompanyConfig.js') }}"></script>
<script type="text/javascript" src="{{ asset('externalJS/datepicker-fr.js') }}"></script>
<script type="text/javascript">
    initDatePicker("0d", null);
</script>