{% include 'partials/header.html.twig' %}
    <script src="{{ asset('assets/libs/jquery-ui/jquery-ui.min.js') }}"></script>

    <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/jquery.repeater/jquery.repeater.min.js') }}"></script>
    <script src="{{ asset('assets/libs/select2/js/select2.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-steps/jquery.steps.min.js') }}"></script>
    <script src="{{ asset('assets/libs/jquery-validation/jquery.validate.min.js') }}"></script>

      <div class="body-wrapper">
        <div class="container-fluid">

         <div class="card card-body py-3">
            <div class="row align-items-center">
              <div class="col-12">
                <h5>Formules de partenariat</h5>
                <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> >
                  <a href="{{path('projet_view_formules', {'id': projet.idtoken})}}" class="p-2">Formules </a>
                  
                </div>
              </div>
            </div>
          </div>

          {% if has_contrepartie | length == 0 %}
            <div class="alert alert-warning text-center text-warning">
                Avant d'ajouter une formule, 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>
          {% else %}

            <div class="card">
              <div class="card-body">
              
              {% if projet.statut == 'Ouvert' %}
                <div class="text-end">
                  <button type="button" class="btn btn-light" id="btnAddFormule">
                      Ajouter une formule
                  </button>
                </div>
              {% endif %}

              <div class="row justify-content-center">
                  <div class="datatables">
                      <div class="card">
                          <div class="card-body" id="formuleContainer">
                              <div class="table-responsive mb-4 border rounded-1">
                                  <table class="table  mb-0 align-middle" id="tableFormules">
                                      <thead>
                                          <tr id="headerRow">
                                          <th></th>
                                          {% for formule in formules %}
                                              <th class="text-center fw-normal" data-formule-id="{{ formule.idtoken }}">
                                                <div class="formule-header" data-formule-id="{{ formule.idtoken }}">
                                                  <h6 class="fs-4 fw-semibold mb-0" data-field="nom">{{ formule.nom }}</h6>
                                                  <span data-field="valeur">{{ formule.valeur }}</span> €<br/>
                                                  <span class="fs-2" data-field="deductionFiscale">Déduction fiscale {{ formule.deductionFiscale }}</span> €<br/>
                                                  <span class="fs-2 mb-2 badge bg-warning" data-field="niveau">{{ formule.niveau.nom }}</span><br/>
                                                  <span class="fs-2 badge bg-{% if formule.type == 'sponsoring' %}danger{% else %}success{% endif %}" data-field="type">{{ formule.type |capitalize }}</span><br/>
                                                </div>

                                                <div class="d-flex">
                                                  <button class="btn btn-sm btn-outline-primary mt-2 btn-edit-formule" data-formule-id="{{ formule.idtoken }}">
                                                      Modifier
                                                  </button>
                                                  <button type="button" data-id="{{ formule.idtoken }}" data-type="formule" class="delete btn mt-2 ms-3 btn-outline-primary rounded round-30 btn-sm d-inline-flex align-items-center justify-content-center"><i class="fs-5 ti ti-trash"></i></button>
                                                </div>
                                              </th>
                                          {% endfor %}
                                          </tr>
                                      </thead>
                                      <tbody>
                                          {% for type in types %}
                                          <tr data-type-id="{{ type.idtoken }}">
                                              <td>{{ type.nom }}</td>
                                              {% for formule in formules %}
                                              <td class="text-center"
                                                  data-formule-id="{{ formule.idtoken }}"
                                                  data-type-id="{{ type.idtoken }}">
                                                  {{ matrix[type.nom][formule.nom] }}
                                              </td>
                                              {% endfor %}
                                          </tr>
                                          {% endfor %}
                                      </tbody>
                                  </table>

                              </div>

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

              </div>

            </div>
          {% endif %} 
      </div>
    </div>


{% include 'partials/modal/delete_modal.html.twig' %}
{% include 'partials/modal/ajax_modal.html.twig' %}
{% include '@Projet/projet/modal/new_formule.html.twig' %}
<script>
const projetId = '{{projet.idtoken}}';

const niveaux = [
  {% for niveau in niveauxMecenat %}
    { id: "{{ niveau.idtoken }}", nom: "{{ niveau.nom }}" }{{ not loop.last ? ',' : '' }}
  {% endfor %}
];

 $(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>
<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/data/search_mecene_ajax.js') }}"></script>
<script src="{{ asset('assets/js/data/update_datatable.js') }}"></script>

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