{% load combo %}

{% if json.data %}

  {% if id %} {# une seule facture #}

    {% for facture in json.data %}{% if facture.num == id %} {# pour trouver facture avec l’id #}
    <div class="invoice">

    <p></p>

    <h3>Détail d’une facture</h3>

    <div class="grid-1-3"><p>Numéro de facture</p></div>
    <div class="grid-2-3"><p>{{ facture.num }}</p></div>
    <div class="grid-1-3"><p>Débiteur</p></div>
    <div class="grid-2-3"><p>{{ facture.extra.redevable }}</p></div>
    <div class="grid-1-3"><p>Date d’émission</p></div>
    <div class="grid-2-3"><p>{{ facture.date_facture|strptime:"%Y-%m-%d"|date:"d F Y" }}</p></div>
    <div class="grid-1-3"><p>Date limite de paiement</p></div>
    <div class="grid-2-3"><p>{{ facture.date_limite_recouvrement|strptime:"%Y-%m-%d"|date:"d F Y"}}</p></div>
    <div class="grid-1-3"><p>Montant facturé</p></div>
    <div class="grid-2-3"><p>{{ facture.montant_initial }} €</p></div>
    <div class="grid-1-3"><p>Montant restant à payer</p></div>
    <div class="grid-2-3"><p>{{ facture.reste_a_payer }} €</p></div>
    <div class="grid-1-3"><p>État</p></div>
    <div class="grid-2-3"><p>{{ facture.etat|upper }}</p></div>
    <table class="invoices"><tbody>
      <tr><th>Libellé</th><th>Montant</th></tr>
      {% for creance in facture.creances %}
        <tr><td>{{ creance.libelle }}</td><td>{{ creance.montant }} €</td></tr>
      {% endfor %}
    </tbody></table>
    <div class="newline"></div>
    <div class="links-list">
    <ul><li><a href="./">Retour à la liste</a></li></ul>
    </div>

    </div>

    {% endif %}{% endfor %} {# pour trouver facture avec l’id #}

  {% else %} {# liste des factures #}

    <div class="invoices">

    {% with factures=json.data|dictsort:"date_limite_recouvrement" %}

      {% if factures %}

        {% if parameters.paiement_actif %}
        <form method="POST" action="/_plugin/nanterre/saga-transaction/">
        <input type="hidden" name="error_url" value="{{ cell.page.get_online_url }}">
        {% endif %}

        <table class="invoices"><tbody>
          <tr>
            {% if parameters.paiement_actif %}<th></th>{% endif %}
            <th>N° de facture</th>
            <th>Libellé</th>
            <th>Débiteur</th>
            {% if etat == 'en cours' %}<th>Date limite de paiement</th>{% endif %}
            <th>Montant</th>
            <th>Détail</th>
          </tr>

        {% for facture in factures %}
          <tr>
            {% if parameters.paiement_actif %}
            <td><input type="checkbox" name="num_factures" value="{{ facture.num }}"
                       data-value="{{ facture.reste_a_payer|stringformat:"s" }}"/></td>
            {% endif %}
            <td>{{ facture.num }}</td>
            <td>{% with creance=facture.creances|first %}{{ creance.libelle }}{% endwith %}</td>
            <td>{{ facture.extra.redevable }}</td>
            {% if etat == 'en cours' %}
            <td>{{ facture.date_limite_recouvrement|strptime:"%Y-%m-%d"|date:"d F Y" }}</td>
            <td>{{ facture.reste_a_payer|floatformat:2 }} €</td>
            {% else %}
            <td>{{ facture.montant_initial|floatformat:2 }} €</td>
            {% endif %}
            <td><a class="icon-view" href="./?id={{ facture.num }}">détails</a></td>
          </tr>
        {% endfor %}

        {% if parameters.paiement_actif %}
          <tr>
            <td><input type="checkbox" id="checkall"></td>
            <td colspan="4" align="right">Montant total des factures sélectionnées</td>
            <td><strong><span id="totalamount">0,00</span> €</strong></td>
            <td></td>
          </tr>
        {% endif %}
        </tbody></table>

        {% if parameters.paiement_actif %}
        {# Adresse pour paiement : <input type="email" name="email" value="{{ request.user.email }}"/> #}
        <div class="buttons">
          <button name="submit" value="Payer les factures sélectionnées" disabled="disabled">Payer les factures sélectionnées</button>
        </div>
        </form>

        <script>
        $(document).ready(function(){
          // somme des factures checkées
          $("input[name='num_factures']").on('click', function () {
            var sum = 0;
            $("input:checked[name='num_factures']").each(function(index, elem){
              sum += parseFloat(elem.getAttribute("data-value"));
            });
            $("span#totalamount").text(sum.toFixed(2).replace('.', ','));
            if (sum > 0.0) {
              $("button[name=submit]").attr("disabled", null);
            } else {
              $("button[name=submit]").attr("disabled", "disabled");
            }
          });
          $("input#checkall").on('click', function (event) {
            event.preventDefault();
            $("input[name='num_factures']").click();
          });
          // on évite les double-clic en désactivant le bouton au premier clic
          $('form').on('submit', function(event) {
            var $form = $(this);
            $form.addClass('disabled-during-submit');
          });
        });
        </script>
        {% endif %}

      {% else %}

        {% if etat == 'en cours' %}
          <p><em>Aucune facture n’est à payer.</em></p>
        {% else %}
          <p><em>Aucune facture disponible.</em></p>
        {% endif %}

      {% endif %}

    {% endwith %}

    </div>

  {% endif %} {# une seule ou plusieurs factures #}

{% else %} {# json.data vide, quelle est l'erreur ? #}

  {% if rsu_status == 500 %}

    <div>
      <p>Un problème s’est produit lors de l’appel au service de facturation.</p>
      <p>Veuillez réessayer dans quelques minutes et, si le problème persiste appeler le 3992.</p>
      <p style="display: none">L’erreur est la suivante : ERREUR 500 (crash Zoo)</p>
    </div>

  {% elif rsu_status == 404 %}

    <div>
      <p>
         Pour consulter et régler vos factures en ligne, vous devez d’abord
         <a href="/tableau-de-bord/profil/">demander l’accès à votre dossier administratif</a>.
      </p>
    </div>

  {% elif json.err %}

    <div>
    {% if "l'individu n'a pas de code tiers SAGA" in json.errors %}
      <p><em>Votre dossier administratif ne présente pas de lien avec des factures.</em></p>
    {% elif "référencé dans la régie" in json.errors.0 %} {# fédération inconnue car pas encore de facture #}
      <p><em>Aucune facture n’est à payer.</em></p>
    {% else %}
      <p>Un problème s’est produit lors de l’appel au service de facturation.</p>
      <p>Veuillez réessayer dans quelques minutes et, si le problème persiste appeler le 3992.</p>
      <p style="display: none">L’erreur est la suivante :</p>
      <ul style="display: none">
        {% for error in json.errors %}
        <li>{{ error }}</li>
        {% endfor %}
      </ul>
    {% endif %}
    </div>

  {% else %}

    <div>
    {% if json %}
      {% if etat == 'en cours' %}
        <p><em>Aucune facture n’est à payer.</em></p>
      {% else %}
        <p><em>Aucune facture disponible.</em></p>
      {% endif %}
    {% else %} {# en fait c'est une 404 et le json est complétement vide #}
      <p><strong>Vous devez d’abord disposer d’un
         <a href="/tableau-de-bord/profil/">dossier administratif.</strong></em></p>
    {% endif %}
    </div>

  {% endif %}

{% endif %}
