{% if not opportunites|length %}

    <div class="alert alert-info" role="alert">
        <i class="icon fa fa-info-circle mr-1"></i> {% trans %}Aucune opportunité trouvée{% endtrans %}
    </div>

{% else %}

    {% for opportunity in opportunites %}
        
        <div class="row col-12" {% set updates = [] %}>

            {% for tracability in opportunity.tracabilityCRMs %}

                {% if app.request.get('search_date_debut') != '' and app.request.get('search_date_fin') != '' and ((tracability.dateAction|date('Y-m-d')) >= app.request.get('search_date_debut')) and ((tracability.dateAction|date('Y-m-d')) <= app.request.get('search_date_fin')) %}

                    {% set updates = updates|merge([{
                            objet : tracability.statutAction, 
                            date : tracability.dateAction|date('Y-m-d H:i'),
                            user : tracability.userTracabilityEmetteur.fullName
                        }]) 
                    %}

                {% elseif app.request.get('search_date_debut') == '' and app.request.get('search_date_fin') == '' %}

                    {% set updates = updates|merge([{
                            objet : tracability.statutAction, 
                            date : tracability.dateAction|date('Y-m-d H:i'),
                            user : tracability.userTracabilityEmetteur.fullName
                        }]) 
                    %}

                {% endif %}

            {% endfor %}

            {% for history in opportunity.historyMontantCRMs %}

                {% if app.request.get('search_date_debut') != '' and app.request.get('search_date_fin') != '' and ((history.dateModification|date('Y-m-d')) >= app.request.get('search_date_debut')) and ((history.dateModification|date('Y-m-d')) <= app.request.get('search_date_fin')) %}

                    {% set updates = updates|merge([{
                            objet : history.typeAction, 
                            date : history.dateModification|date('Y-m-d H:i'),
                            user : history.userCreator.fullName
                        }]) 
                    %}
                
                {% elseif app.request.get('search_date_debut') == '' and app.request.get('search_date_fin') == '' %}

                    {% set updates = updates|merge([{
                            objet : history.typeAction, 
                            date : history.dateModification|date('Y-m-d H:i'),
                            user : history.userCreator.fullName
                        }]) 
                    %}

                {% endif %}

            {% endfor %}

            {% for relance in opportunity.relances %}

                {% if app.request.get('search_date_debut') != '' and app.request.get('search_date_fin') != '' and ((relance.dateRelance|date('Y-m-d')) >= app.request.get('search_date_debut')) and ((relance.dateRelance|date('Y-m-d')) <= app.request.get('search_date_fin')) %}

                    {% set updates = updates|merge([{
                            objet : relance.relanceData, 
                            date : relance.dateRelance|date('Y-m-d H:i'),
                            user : relance.userEmetteur ? relance.userEmetteur.fullName : 'Relance Automatique'
                        }]) 
                    %}
                
                {% elseif app.request.get('search_date_debut') == '' and app.request.get('search_date_fin') == '' %}

                    {% set updates = updates|merge([{
                            objet : relance.relanceData, 
                            date : relance.dateRelance|date('Y-m-d H:i'),
                            user : relance.userEmetteur ? relance.userEmetteur.fullName : 'Relance Automatique'
                        }]) 
                    %}

                {% endif %}

            {% endfor %}

            <div class="col-12 m-0 mb-4 p-0">

                <article class="card opportunity-details p-0 mx-0" {% if selected_opportunity == opportunity.id %} style="border: 1px solid #e57112;border-radius: 10px;" {% endif %}>

                    <div id="borderLeftTopOrangeList"></div>
                    <div id="borderLeftBottomOrangeList"></div>
                    <div id="borderLeftBlueList"></div>
                    
                    <div class="card-body">
                        <div class="d-flex flex-md-row align-items-md-start align-items-center flex-column">
                            
                            <div class="thumbnail position-relative mb-md-0 mb-3 mr-2 ml-1">
                                <img src="{{ asset('uploads/logo_client/'~opportunity.client.logo) }}" class="thumbnail" />
                            </div>

                            <div class="w-100">
                                <div class="d-flex flex-md-row">
                                    <h3 class="col-11" style="color:#e57112; text-align: justify;">{{ opportunity.title }}</h3>

                                    <div style='position:absolute; right:65px; top:3px;' class="alarme_relance_{{ opportunity.id }} d-none">
                                        <a class="btn btn-action btn-sm pull-right mt-1" id="relances_opportunity" data-id="{{ opportunity.id }}" data-title="{{ opportunity.title }}" data-toggle="modal" data-target="#modal_relances_opportunity" style="cursor:pointer;" title="Relances">
                                            <i class="fa fa-bell clignote_action" style="color:#e57112;"></i>
                                        </a>
                                    </div>
                                
                                    <div style='position:absolute; right:40px; top:3px;'>
                                        {% if app.user and is_granted('ROLE_TRAITER_OPPORTUNITY_CRM') and opportunity.id in is_next_level and app.request.get('nature') == 'mine' %}
                                            <a class="btn btn-action btn-sm pull-right mt-1" id="next_level_opportunity" data-id="{{ opportunity.id }}" data-title="{{ opportunity.title }}" data-is-qualification="{% if opportunity.id in is_qualification %}true{% else %}false{% endif %}" data-qualification="{{ opportunity.qualification }}" data-toggle="modal" data-target="#modal_next_level" style="cursor:pointer;" title="Passer vers le niveau suivant">
                                                <i class="fa fa-level-down clignote_action" style="color:#e57112;"></i>
                                            </a>
                                        {% elseif app.user and is_granted('ROLE_TRAITER_OPPORTUNITY_CRM') and opportunity.id in is_finish and app.request.get('nature') == 'mine'  %}
                                            <a class="btn btn-action btn-sm pull-right mt-1" id="finish_opportunity" data-id="{{ opportunity.id }}" data-responsable="{{ opportunity.responsableCommerciale.fullName }}" data-title="{{ opportunity.title }}" data-type="{{ opportunity.type }}" data-abreviation="{{ opportunity.client.abreviation }}" data-montant-offre="{{ opportunity.montantOffre }}" data-montant-contractualise="{{ opportunity.montantContractualise }}" 
                                                data-type-soumission="{{ opportunity.typeSoumission }}" data-toggle="modal" data-target="#modal_finish_opportunity" style="cursor:pointer;" title="Clôture l'opportunité">
                                                <i class="fa fa-power-off clignote_action" style="color:#e57112;"></i> 
                                            </a> 
                                        {% endif %}
                                    </div>
                                    
                                    <button type="button" class="btn btn-action btn-sm pull-right mt-1 pr-2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                        <i class="fa fa-ellipsis-v"></i>
                                    </button>

                                    {% include('CRM/OpportunityCRM/tabs/tab_action.html.twig') %}  

                                </div>

                                <div class="col-12 mt-1">
                                    <strong class="btn btn-sm" style="background-color: {{ opportunity.statutColor }};color:#fff;min-width: 80px;">{{ opportunity.statutValue }}</strong>
                                </div>

                                <hr>
                                <div class="container-fluid">
                                    <div class="row">
                                        <div class="col-md-4 col-12">
                                            <ul>
                                                <li><i class="fa fa-flag" style="color: #e57112;"></i> <strong>Type :</strong> {{ opportunity.typeValue }} {% if opportunity.type == 'T02' and opportunity.typeSoumission %}- {{ opportunity.typeSoumissionAbreviation }}{% endif %} </li>
                                                <li><i class="fa fa-user" style="color: #e57112;"></i> <strong>Responsable commercial :</strong> {{ opportunity.responsableCommerciale.fullName }}</li>
                                                <li><i class="fa fa-calendar" style="color: #e57112;"></i> <strong>Date de création :</strong> {{ opportunity.dateCreation|date('Y-m-d') }}</li>
                                                
                                                {% if opportunity.type == 'T02' and opportunity.dateSoumission %} <!-- Soumission -->
                                                    <li><i class="fa fa-calendar" style="color: #e57112;"></i> <strong>Date de soumission :</strong> {{ opportunity.dateSoumission|date('Y-m-d') }}</li>
                                                {% endif %}

                                                <li><i class="fa fa-address-book" style="color: #e57112;"></i> <strong>Client :</strong> {{ opportunity.client.abreviation }} - {{ opportunity.client.paysName }} </li>
                                                {% if opportunity.projet|length %}
                                                    <li><i class="fa fa-folder-open" style="color: #e57112;"></i> <strong {% set cpt = 0 %}>Projet(s) :</strong> 
                                                        {% for projet in opportunity.projet %}
                                                            {% if cpt > 0 %} - {% endif %}{{ projet.intitule }} 
                                                            {% set cpt = cpt + 1 %}
                                                        {% endfor %}
                                                    </li>
                                                {% endif %}
                                            </ul>
                                        </div>

                                        <div class="col-md-3 col-12">
                                            <h3 class="mb-1" style="font-size:15px;"><strong>Montants : </strong></h3>
                                            <ul>

                                                <li><i class="fa fa-usd" style="color: #e57112;"></i> <strong>Budget :</strong> {{ opportunity.budget|number_format(0,'',' ') }}  {{ opportunity.unityAbreviation }}</li>

                                                {% if opportunity.type == 'T02' %} <!-- Soumission -->
                                                    <li><i class="fa fa-usd" style="color: #e57112;"></i> <strong>Montant caution :</strong> {{ opportunity.montantCaution|number_format(0,'',' ') }}  {{ opportunity.unityAbreviation }}</li>
                                                {% endif %}

                                                <li><i class="fa fa-usd" style="color: #e57112;"></i> <strong>Montant d'offre :</strong> {{ opportunity.montantOffre|number_format(0,'',' ') }}  {{ opportunity.unityAbreviation }}</li>

                                                <li><i class="fa fa-usd" style="color: #e57112;"></i> <strong>Montant contractualisé :</strong> {{ opportunity.montantContractualise|number_format(0,'',' ') }}  {{ opportunity.unityAbreviation }}</li>

                                                <li><i class="fa fa-usd" style="color: #e57112;"></i> <strong>Montant part SFM :</strong> {{ opportunity.montantPartSFM|number_format(0,'',' ') }}  {{ opportunity.unityAbreviation }}</li>

                                            </ul>
                                            
                                        </div>

                                        <div class="col-md-5 col-12">
                                            <h3 class="mb-1" style="font-size:15px;"><strong>Dernière mise à jour : </strong></h3>
                                            <ul {% set nb = 0 %}>

                                                {% for update in updates|sort((a, b) => b.date <=> a.date) if nb < 5 %}

                                                    {% set nb = nb + 1 %}

                                                    <li style="text-align: justify;"><i class="fa fa-info-circle"></i> <strong>{{ update.user }} :</strong> {{ update.objet }} ({{ update.date }}) </li>

                                                    {% if nb == 5 %}
                                                        
                                                        <li>...</li>
                                                    {% endif %}

                                                {% endfor %}

                                            </ul>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </article>
            </div>
        </div>

    {% endfor %}

{% endif %}