{% include 'partials/header.html.twig' %}

<link rel="stylesheet" href="{{ asset('assets/libs/select2/css/select2.min.css') }}">

<script src="{{ asset('assets/libs/jquery/dist/jquery.min.js') }}"></script>
<script src="{{ asset('assets/libs/select2/js/select2.min.js') }}"></script>
<script src="{{ asset('assets/libs/jquery.repeater/jquery.repeater.min.js') }}"></script>


<script src="{{ asset('assets/libs/datatables.net/js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('assets/libs/datatables.net/js/dataTables.buttons.min.js') }}"></script>
<script src="{{ asset('assets/libs/datatables.net/js/buttons.flash.min.js') }}"></script>
<script src="{{ asset('assets/libs/datatables.net/js/buttons.html5.min.js') }}"></script>
<script src="{{ asset('assets/libs/datatables.net/js/buttons.print.min.js') }}"></script>
<script src="{{ asset('assets/libs/jszip/jszip.min.js') }}"></script>
<script src="{{ asset('assets/libs/pdfmake/pdfmake.min.js') }}"></script>
<script src="{{ asset('assets/libs/pdfmake/vfs_fonts.js') }}"></script>

<script src="{{ asset('assets/libs/jquery-ui/jquery-ui.min.js') }}"></script>
<script src="{{ asset('assets/js/global/kanban.js') }}"></script>
<script src="{{ asset('assets/libs/jquery-steps/jquery.steps.min.js') }}"></script>
<script src="{{ asset('assets/libs/jquery-validation/jquery.validate.min.js') }}"></script>

 <script src="{{ asset('assets/libs/magnific-popup/dist/jquery.magnific-popup.min.js') }}"></script>
 <script src="{{ asset('assets/libs/magnific-popup/dist/jquery.magnific-popup.min.js') }}"></script>
  <script src="{{ asset('assets/js/plugins/magnific_popup_init.js') }}"></script>
  <link rel="stylesheet" href="{{ asset('assets/libs/magnific-popup/dist/magnific-popup.css') }}">

    <link rel="stylesheet" href="{{ asset('assets/libs/dropzone/dist/min/dropzone.min.css')}}">
    <script src="{{ asset('assets/libs/dropzone/dist/min/dropzone.min.js') }}"></script>
      <div class="body-wrapper" id="page-projet-root" data-import-pending="{{ projet.import ? '0' : '1' }}" data-projet-id="{{ projet.idtoken }}">
        <div class="container-fluid">
          <div class="row">
            <div class="col-lg-12">
            <div class="col-lg-6">
              <div class="card text-bg-primary">
                <div class="card-body">
                  <div class="row">
                    <div class="col-sm-12">
                      <div class="d-flex flex-column h-100">
                        <div class="hstack gap-3">
                          <span class="d-flex align-items-center justify-content-center round-48 bg-white rounded flex-shrink-0">
                            <iconify-icon icon="solar:clapperboard-text-line-duotone" class="fs-7 text-muted"></iconify-icon>
                          </span>
                          <h5 class="text-white fs-8 mb-0 text-nowrap">{{projet.titre}}</h5>
                        </div>
                        <div class="mt-4 mt-sm-auto">
                          <div class="row">
                            <div class="col-4" style="--bs-border-opacity: .15;">
                              <span class="opacity-75">Date </span>
                              <h4 class="mb-0 text-white mt-1 text-nowrap fs-5 fw-bolder">
                                {{projet.startDate|date('d/m/Y')}}</h4>
                            </div>
                            <div class="col-4 border-start border-light" style="--bs-border-opacity: .15;">
                              <span class="opacity-75">Date limite</span>
                              <h4 class="mb-0 text-white mt-1 text-nowrap fs-5 fw-bolder">
                                {{projet.deadline|date('d/m/Y')}}</h4>
                            </div>
                            <div class="col-4  border-start border-light" style="--bs-border-opacity: .15;">
                              <span class="opacity-75">Créé par</span>
                              <h4 class="mb-0 text-white mt-1 text-nowrap fs-5 fw-bolder">
                                {{projet.createdBy.prenom}} {{projet.createdBy.nom}}</h4>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>


                </div>
              </div>
            </div>
            <div class="col-lg-6">
              <div class="row">
                <div class="col-md-6">
                  <div class="card bg-danger-subtle overflow-hidden shadow-none" style="height: 150px;">
                    <div class="card-body px-4">
                      <div class="d-flex align-items-center justify-content-between mb-8">
                        <div>
                          <span class="text-dark-light fw-semibold fs-12">Résultat</span>
                          <div class="hstack gap-2">
                            <h5 class="card-title fw-semibold mb-0 fs-7">{{ projet.montantPrevu | separate_thousands}}</h5>
                            <span class="fs-11 text-dark-light fw-semibold">€</span>
                          </div>
                        </div>
                        <span class="round-48 d-flex align-items-center justify-content-center bg-white rounded">
                          <iconify-icon icon="solar:euro-broken" class="text-danger fs-6"></iconify-icon>
                        </span>
                      </div>
                      <div class="mt-4 mt-sm-auto">
                        <div class="row">
                          <div class="col-12 text-black">
                            <span>/ {{projet.objectifFinancier | separate_thousands}} €</span>
                            
                          </div>
                          
                        </div>
                      </div>
                    </div>

                  </div>
                </div>
                <div class="col-md-6">
                  <div class="card bg-secondary-subtle overflow-hidden shadow-none" style="height: 150px;">
                    <div class="card-body px-4">
                      <div class="d-flex align-items-center justify-content-between mb-9">
                        <div>
                          <span class="text-dark-light fw-semibold">Partenaires</span>
                          <div class="hstack gap-2">
                            <h5 class="card-title fw-semibold mb-0 fs-7">{{mecenes | length }}</h5>
                          </div>
                        </div>
                        <span class="round-48 d-flex align-items-center justify-content-center bg-white rounded">
                          <iconify-icon icon="solar:user-broken" class="text-secondary fs-6"></iconify-icon>
                        </span>
                      </div>

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

          <div class="card card-body py-3">
            <div class="row align-items-center">
              <div class="col-12">
                <div class="d-sm-flex align-items-center justify-space-between">
                  <a href="{{path('app_index')}}" class="p-2"><iconify-icon icon="solar:home-2-broken" class="fs-6"></iconify-icon> </a> >
                  <a href="{{path('projet_index')}}" class="p-2">Projets </a> >
                  <a href="{{path('projet_view', {'id': projet.idtoken})}}" class="p-2">{{projet.titre}} </a>
                  <nav aria-label="breadcrumb" class="ms-auto">
                    <ol class="breadcrumb">
                      <li class="breadcrumb-item d-flex align-items-center">
                        
                        <button id="btnGroupDrop1" type="button" class="btn btn-rounded btn-outline-primary" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                          <i class="ti ti-playstation-circle fs-4 me-2"></i>
                          Actions
                        </button>
                        <div class="dropdown-menu" aria-labelledby="btnGroupDrop1" style="">
                          <a class="dropdown-item update" data-id="{{projet.idtoken}}" href="javascript:void(0)"><i class="ti ti-edit fs-4 me-2"></i>Modifier le projet</a>
                          {% if projet.statut == 'Ouvert' %}
                            <a class="dropdown-item close" data-id="{{projet.idtoken}}" href="javascript:void(0)"><i class="ti ti-square-rounded-x fs-4 me-2"></i>Clôturer le projet</a>
                          {% else %}
                            <a class="dropdown-item open" data-id="{{projet.idtoken}}" href="javascript:void(0)"><i class="ti ti-reload-x fs-4 me-2"></i>Ré-ouvrir le projet</a>
                          {% endif %}
                          <a class="dropdown-item archive" data-id="{{projet.idtoken}}" href="javascript:void(0)"><i class="ti ti-archive fs-4 me-2"></i>Archiver le projet</a>
                          <a class="dropdown-item delete" href="javascript:void(0)" data-id="{{projet.idtoken}}" data-type="projet"><i class="ti ti-trash fs-4 me-2"></i>Supprimer le projet</a>
                        </div>

                      </li>
                    </ol>
                  </nav>
                </div>
              </div>
            </div>
          </div>

          {% if has_contrepartie | length == 0 %}
            <div class="alert alert-warning text-center text-warning">
                Avant d'ajouter un partenaires, il est indispensable de créer <strong>les contreparties du projet</strong>
                  <div class="text-center mt-6">
                    <a class="btn btn-rounded btn-outline-warning" href="{{ path('projet_view_contreparties', {'id' : projet.idtoken}) }}">Cliquez-ici</a>
                  </div>
            </div>
          {% elseif has_formule | length == 0 %}
            <div class="alert alert-warning text-center text-warning">
                Avant d'ajouter un partenaires, il est indispensable de créer <strong>les formules de partenariat du projet</strong>
                  <div class="text-center mt-6">
                    <a class="btn btn-rounded btn-outline-warning" href="{{ path('projet_view_formules', {'id' : projet.idtoken}) }}">Cliquez-ici</a>
                  </div>
            </div>
          {% endif %}

          <div class="card">
            
            <div class="row">
              <div class="col-12">
                <div class="card">
                  <div class="card-body p-4 pb-0">
                    <div class="row flex-nowrap">
                      <div class="col">
                        <div class="card primary-gradient">
                          <div class="card-body text-center px-9 pb-4">
                            <div class="d-flex align-items-center justify-content-center round-48 rounded text-bg-primary flex-shrink-0 mb-3 mx-auto">
                              <iconify-icon icon="solar:euro-broken" class="fs-7 text-white"></iconify-icon>
                            </div>
                            <h6 class="fw-normal fs-3 mb-1">Montant reçu</h6>
                            <h4 class="mb-3 d-flex align-items-center justify-content-center gap-1">{{ projet.montantPrevu | separate_thousands }} €</h4>
                          </div>
                        </div>
                      </div>
                      <div class="col">
                        <div class="card warning-gradient">
                          <div class="card-body text-center px-9 pb-4">
                            <div class="d-flex align-items-center justify-content-center round-48 rounded text-bg-warning flex-shrink-0 mb-3 mx-auto">
                              <iconify-icon icon="solar:user-broken" class="fs-7 text-white"></iconify-icon>
                            </div>
                            <h6 class="fw-normal fs-3 mb-1">Mécènes / Partenaires</h6>
                            <h4 class="mb-3 d-flex align-items-center justify-content-center gap-1">{{mecenes | length }}</h4>
                          </div>
                        </div>
                      </div>
                      <div class="col">
                        <div class="card secondary-gradient">
                          <div class="card-body text-center px-9 pb-4">
                            <div class="d-flex align-items-center justify-content-center round-48 rounded text-bg-secondary flex-shrink-0 mb-3 mx-auto">
                              <iconify-icon icon="solar:document-broken" class="fs-7 text-white"></iconify-icon>
                            </div>
                            <h6 class="fw-normal fs-3 mb-1">Formules</h6>
                            <h4 class="mb-3 d-flex align-items-center justify-content-center gap-1">{{formules | length }}</h4>
                          </div>
                        </div>
                      </div>
                      <div class="col">
                        <div class="card danger-gradient">
                          <div class="card-body text-center px-9 pb-4">
                            <div class="d-flex align-items-center justify-content-center round-48 rounded text-bg-danger flex-shrink-0 mb-3 mx-auto">
                              <iconify-icon icon="solar:document-add-linear" class="fs-7 text-white"></iconify-icon>
                            </div>
                            <h6 class="fw-normal fs-3 mb-1">Conventions signées</h6>
                            <h4 class="mb-3 d-flex align-items-center justify-content-center gap-1">{{mecenes | length - conventionNonSignes | length }} / {{mecenes | length}}</h4>
                          </div>
                        </div>
                      </div>
                      <div class="col">
                        <div class="card success-gradient">
                          <div class="card-body text-center px-9 pb-4">
                            <div class="d-flex align-items-center justify-content-center round-48 rounded text-bg-success flex-shrink-0 mb-3 mx-auto">
                              <iconify-icon icon="solar:calculator-broken" class="fs-7 text-white"></iconify-icon>
                            </div>
                            <h6 class="fw-normal fs-3 mb-1">Reçus fiscaux édités</h6>
                            <h4 class="mb-3 d-flex align-items-center justify-content-center gap-1">{{recus | length  }} / {{mecenes | length}}</h4>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>  

              <div class="col-4 p-4">
                <div class="card border">
                  <div class="card-body p-4">
                    <h6 class="fw-bold fs-5 mb-1"><iconify-icon icon="solar:user-check-broken" class="me-2"></iconify-icon>Les derniers partenaires</h6>

                    <table class="table text-nowrap mb-0 align-middle"> 
                      <tbody>

                        {% for convention in last5conventions %}
                    
                          <tr>
                            <td>
                              <a href="{{path('projet_view_convention', {'id' : projet.idtoken, 'conventionId': convention.idtoken})}}">
                                <div class="d-flex align-items-center">
                                
                                  {% if convention.mecene.logo is not null %}
                                    <img src="{{asset('uploads/mecenes/logos/' ~ convention.mecene.logo)}}" height="30">
                                  {% endif %}
                                  <div class="ms-3">
                                    <h6 class="fs-4 fw-semibold mb-0">{{convention.mecene.nom}}</h6>
                                    <span class="fw-normal">{{convention.valeur | separate_thousands}} €</span>
                                  </div>
                                
                                </div>
                              </a>
                            </td>
                          </tr>

                        {% endfor %}
                      </tbody>
                    </table>

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

              <div class="col-4 p-4">
                <div class="card border">
                  <div class="card-body p-4">
                    <h6 class="fw-bold fs-5 mb-1"><iconify-icon icon="fluent:target-arrow-20-regular" class="me-2"></iconify-icon>Les dernières propositions</h6>
                  </div>
                </div>
              </div> 

              <div class="col-4 p-4">
                <div class="card border">
                  <div class="card-body p-4">
                    <h6 class="fw-bold fs-5 mb-1"><iconify-icon icon="fluent:signature-16-regular" class="me-2"></iconify-icon>Les dernières conventions signées</h6>
                  </div>
                </div>
              </div> 

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

<script>
const projetId = '{{projet.idtoken}}';
 $(function () {
  "use strict";

  // Default
  $(".repeater-default").repeater();

  // Custom Show / Hide Configurations
  $(".contrepartie-repeater").repeater({
    show: function () {
      $(this).slideDown();
    },
    hide: function (remove) {
      $(this).slideUp(remove);
    },
  });
});
</script>

{% include '@Projet/projet/modal/import_donnees.html.twig' %}
{% include '@Projet/projet/modal/new_note.html.twig' %}
{% include '@Projet/projet/modal/new_formule.html.twig' %}
{% include 'partials/modal/delete_modal.html.twig' %}
{% include 'partials/modal/close_modal.html.twig' %}
{% include 'partials/modal/open_modal.html.twig' %}
{% include 'partials/modal/ajax_modal.html.twig' %}
{% include '@Projet/projet/modal/new_typecontrepartie.html.twig' %} 

<script src="{{ asset('assets/js/global/fonctions.js') }}"></script>
<script src="{{ asset('assets/js/projet/projet_view.js') }}"></script>
<script src="{{ asset('assets/js/projet/mecene.js') }}"></script>
<script src="{{ asset('assets/js/projet/import.js') }}"></script>

<script src="{{ asset('assets/js/data/search_mecene_ajax.js') }}"></script>
<script src="{{ asset('assets/js/data/update_datatable.js') }}"></script>

{% include 'partials/footer.html.twig' %}