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

{% block title %} {% trans %}COSAP - Organigramme de CRM{% endtrans %} {% endblock %}

{% block stylesheets %}
{{ parent() }}

<link href="{{ asset('template/assets/css/organigramme.css') }}" rel="stylesheet">

{% endblock %}

{% block body %}

{{ parent() }}

    <section class="row">
        <div class="col-12">
          
            <div class="card">
                <div class="card-header">
                    <strong> {% trans %}Processus de CRM{% endtrans %} </strong> : {{ version.processCRM.name }} - {{ version.dateCreation|date('Y-m-d H:i') }} 
                    
                    <span><a class="btn btn-warning btn-sm pull-right ml-1" href="{{ path('organigramme_crm_page',{id_version: version.id}) }}" title="{% trans %}Actualiser{% endtrans %}"><i class="fa fa-refresh white"></i></a></span>

                    <span><a class="btn btn-primary btn-sm pull-right ml-1" href="{{ path('version_process_crm_details_page',{id: version.processCRM.id, id_version:version.id}) }}" style="color:white;" title="{% trans %}Retour en arrière{% endtrans %}"><i class="fa fa-arrow-circle-left"></i></a></span>

                    {% if app.user and (is_granted('ROLE_VALIDER_ORGANIGRAMME_CRM') and organigrammes|length) %}
                        <span><a class="btn btn-success btn-sm pull-right ml-1" href="{{ path('validate_organigramme_crm',{id_version: version.id}) }}" style="color:white;" title="{% trans %}Valider l'ordinogramme{% endtrans %}"><i class="fa fa-check"></i> </a></span>
                    {% endif %}
                    {% if app.user and (is_granted('ROLE_AJOUTER_ORGANIGRAMME_CRM') and not organigrammes|length) %}
                        <span><a class="btn btn-success btn-sm pull-right" id="add_first_bloc" data-version="{{ version.id }}" data-toggle="modal" data-target="#modal_add_first_bloc_organigramme" style="color:white;" title="{% trans %}Nouveau{% endtrans %}"><i class="fa fa-plus"></i></a></span>
                    {% endif %}
                    <hr>
                </div>
                <div class="card-content">
                    <div class="card-body">

                        <ul class="nav nav-tabs nav-top-border no-hover-bg nav-justified" role="tablist">
                            <li class="nav-item">
                                <a class="btn-not-load nav-link active" id="link-tab1" data-toggle="tab" href="#organigramme" aria-controls="organigramme" role="tab" aria-selected="false">{% trans %}Organigramme{% endtrans %}</a>
                            </li>
                            <li class="nav-item">
                                <a class="btn-not-load nav-link" id="active-tab1" data-toggle="tab" href="#details" aria-controls="description" role="tab" aria-selected="true">{% trans %}Description{% endtrans %}</a>
                            </li>
                        </ul>
                        <div class="tab-content px-1 pt-1">
                            <div class="tab-pane active in" id="organigramme" aria-labelledby="link-tab1" role="tabpanel">
                                
                                {{ include('ParametrageCRM/OrganigrammeCRM/tabs/organigramme.html.twig') }}
                                {{ include('ParametrageCRM/OrganigrammeCRM/modals/add_bloc.html.twig') }}
                                {{ include('ParametrageCRM/OrganigrammeCRM/modals/option_bloc.html.twig') }}
                                {{ include('ParametrageCRM/OrganigrammeCRM/modals/edit_bloc.html.twig') }}
                                {{ include('ParametrageCRM/OrganigrammeCRM/modals/delete_bloc.html.twig') }}
                            
                            </div>
                            
                            <div class="tab-pane" id="details" aria-labelledby="active-tab1" role="tabpanel">

                                {{ include('ParametrageCRM/OrganigrammeCRM/tabs/description.html.twig') }}

                            </div>
                        </div>

                    </div><!-- en div card body -->
                </div>
            </div>
        </div>
    </section>

    {{ include('ParametrageCRM/OrganigrammeCRM/modals/add_first_bloc.html.twig') }}

{% endblock %}

{% block javascripts %}
   {{ parent() }}

   <script type="text/javascript">

        {% for flash_message in app.session.flashBag.get('success') %}

            toastr.success('{{ flash_message }}', {positionClass: 'toast-top-center', containerId: 'toast-top-center'});

        {% endfor %}

        {% for flash_message in app.session.flashBag.get('info') %}

            toastr.info('{{ flash_message }}', {positionClass: 'toast-top-center', containerId: 'toast-top-center'});

        {% endfor %}

        {% for flash_message in app.session.flashBag.get('warning') %}

            toastr.warning('{{ flash_message }}', {positionClass: 'toast-top-center', containerId: 'toast-top-center'});

        {% endfor %}

        {% for flash_message in app.session.flashBag.get('error') %}

            toastr.error('{{ flash_message }}', {positionClass: 'toast-top-center', containerId: 'toast-top-center'});

        {% endfor %}

   </script>

    {% include('ParametrageCRM/OrganigrammeCRM/ajax/generate_organigramme.html.twig') %}

    {% include('ParametrageCRM/OrganigrammeCRM/ajax/add_first_bloc.html.twig') %}

    {% include('ParametrageCRM/OrganigrammeCRM/ajax/add_bloc.html.twig') %}

    {% include('ParametrageCRM/OrganigrammeCRM/ajax/option_bloc.html.twig') %}

    {% include('ParametrageCRM/OrganigrammeCRM/ajax/edit_bloc.html.twig') %}

    {% include('ParametrageCRM/OrganigrammeCRM/ajax/delete_bloc.html.twig') %}

{% endblock %}