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

{% block body %}
<div class="page-bar">
  <ul class="page-breadcrumb">
    <li><a href="{{ path('homepage') }}">Accueil</a><i class="fa fa-circle"></i></li>
    <li><span>Stock par fournisseur</span></li>
  </ul>
</div>

<div class="portlet light bordered">
  <div class="portlet-title">
    <div class="caption">
      <i class="fa fa-truck fa-lg font-green"></i>
      <span class="caption-subject bold uppercase">Stock par fournisseur</span>
      <span class="caption-helper hidden-print">Sélectionner la période et le fournisseur</span>
    </div>
  </div>

  <form method="post" class="form-horizontal" id="rapport-fournisseur-form">
    <div class="portlet-body form">
      <div class="form-body">
        <div class="ka-toolbar hidden-print">
          <div class="toolbar-left" style="flex:1 1 420px; min-width:320px;">
            <div class="input-icon input-group" style="width:100%;">
              <i class="fa fa-calendar font-red"></i>
              <input type="text" name="rapport-daterange" class="form-control" placeholder="Sélectionner la période" value="{{ selected_daterange is defined ? selected_daterange : '' }}" />
            </div>
          </div>
          <div class="toolbar-right" style="flex:1 1 320px; min-width:280px;">
            <select name="rapport-fournisseur" class="form-control" required>
              <option value="">-- Fournisseur --</option>
              {% for f in fournisseurs %}
                <option value="{{ f.id }}" {% if selected_fournisseur is defined and selected_fournisseur == f.id %}selected{% endif %}>{{ f.getRaisonSociale() }}</option>
              {% endfor %}
            </select>
          </div>
        </div>
        <div class="ka-filter-quick hidden-print" style="margin-top:10px;">
          <button type="submit" class="btn green btn-block">
            <i class="fa fa-gears"></i> Générer l'état
          </button>
        </div>
      </div>
    </div>
  </form>

  <div id="rapport-loading" class="text-center" style="display:none; padding:20px;">
    <i class="fa fa-spinner fa-spin fa-2x"></i>
    <div class="ka-muted" style="margin-top:8px;">Génération en cours…</div>
  </div>

  {% if results is defined and results|length > 0 %}
    <hr class="ka-section-sep" />
    <div class="hidden-print text-right" style="margin-bottom:10px;">
      <div class="btn-group">
        <button class="btn btn-default btn-sm" id="btn-export"><i class="fa fa-download"></i> Exporter</button>
        <button class="btn btn-default btn-sm" id="btn-print"><i class="fa fa-print"></i> Imprimer</button>
      </div>
    </div>

    <div class="table-responsive" id="rapport-result">
      <table class="table table-striped table-hover ka-table-tight">
        <thead>
          <tr>
            <th>EMPLACEMENT</th>
            <th>RÉFÉRENCE</th>
            <th>DÉSIGNATION</th>
            <th class="text-right"><a href="javascript:void;" class="tooltips" data-original-title="Quantité jusqu'au {{ dateStart }}">QTT INITIALE</a></th>
            <th class="text-right"><a href="javascript:void;" class="tooltips" data-original-title="Entrées (achats) entre {{ selected_daterange }}">QTT ENTREE</a></th>
            <th class="text-right"><a href="javascript:void;" class="tooltips" data-original-title="Sorties (livraisons clients - retours) entre {{ selected_daterange }}">QTT SORTIE</a></th>
            <th class="text-right">QTT FINALE</th>
            <th class="text-right">PRIX</th>
            <th class="text-right">TOTAL</th>
            <th class="text-right">ACTIONS</th>
          </tr>
        </thead>
        <tbody>
          {% for r in results %}
            <tr>
              <td>{{ r.emplacement }}</td>
              <td>{{ r.reference }}</td>
              <td>{{ r.titre }}</td>
                <td class="text-right no-wrap">{{ r.quantite_avant|number_format(2, ',', ' ') }}</td>
                <td class="text-right no-wrap">{{ r.quantite_entree|number_format(2, ',', ' ') }}</td>
                <td class="text-right no-wrap">{{ r.quantite_sortie|number_format(2, ',', ' ') }}</td>
                <td class="text-right no-wrap">{{ r.quantite_finale|number_format(2, ',', ' ') }}</td>
                <td class="text-right no-wrap">{{ r.prix_achat|number_format(2, ',', ' ') }}</td>
                <td class="text-right no-wrap">{{ r.total_valeur|number_format(2, ',', ' ') }}</td>
                <td class="text-right"><a href="{{ path('produit_show', { 'id': r.produit_id }) }}" class="btn btn-xs green" title="Détails" target="_blank"><i class="fa fa-mail-forward"></i></a></td>
            </tr>
          {% endfor %}
        </tbody>
        <tfoot>
          <tr>
            <th colspan="3" class="text-right">Totaux</th>
            <th class="text-right no-wrap">{{ summary.total_avant|number_format(2, ',', ' ') }}</th>
            <th class="text-right no-wrap">{{ summary.total_apres|number_format(2, ',', ' ') }}</th>
            <th class="text-right no-wrap">{{ summary.total_sortie|number_format(2, ',', ' ') }}</th>
            <th class="text-right no-wrap">{{ summary.total_finale|number_format(2, ',', ' ') }}</th>
            <th></th>
            <th class="text-right no-wrap">{{ summary.total_valeur|number_format(2, ',', ' ') }}</th>
          </tr>
        </tfoot>
      </table>
    </div>
  {% else %}
    <div class="ka-empty-state" style="margin-top:10px;">
      <div style="font-size:36px;color:#9aa0a6;line-height:1;margin-bottom:6px;"><i class="fa fa-file-o"></i></div>
      <h4 style="margin-top:0;">Aucun résultat</h4>
      <p class="ka-muted">Sélectionnez une période et un fournisseur puis générez le rapport.</p>
    </div>
  {% endif %}
</div>
{% endblock %}

{% block javascripts %}
  {{ parent() }}
  <script>
    $(function(){
      $('input[name="rapport-daterange"]').daterangepicker({
        opens: 'left',
        ranges: {
          "Aujourd'hui": [moment(), moment()],
          "7 Jours": [moment().subtract(6,'days'), moment()],
          "Ce mois": [moment().startOf('month'), moment().endOf('month')],
          "Mois dernier": [moment().subtract(1,'month').startOf('month'), moment().subtract(1,'month').endOf('month')],
          "Cette année": [moment().startOf('year'), moment().endOf('year')],
          "Année dernière": [moment().subtract(1,'year').startOf('year'), moment().subtract(1,'year').endOf('year')]
        },
        locale: {
          format: 'DD/MM/YYYY',
          separator: ' au ',
          applyLabel: 'Appliquer',
          cancelLabel: 'Annuler',
          fromLabel: 'De',
          toLabel: 'À',
          customRangeLabel: 'Personnalisé',
          daysOfWeek: ["Di","Lu","Ma","Me","Je","Ve","Sa"],
          monthNames: ["Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre"],
          firstDay: 1
        }
      });

      $('#rapport-fournisseur-form').on('submit', function(){
        $('#rapport-loading').show();
      });

      // Export & Print hooks – reuse existing behavior via simple triggers
      $('#btn-print').on('click', function(e){
        e.preventDefault();
        window.print();
      });
      $('#btn-export').on('click', function(e){
        e.preventDefault();
        // Simple CSV export of current table
        var csv = [];
        $('#rapport-result table tr').each(function(){
          var row = [];
          $(this).find('th,td').each(function(){
            var text = $(this).text().trim().replace(/\s+/g,' ');
            text = '"' + text.replace('"','\"') + '"';
            row.push(text);
          });
          csv.push(row.join(','));
        });
        var blob = new Blob([csv.join('\n')], { type: 'text/csv;charset=utf-8;' });
        var url = URL.createObjectURL(blob);
        var a = document.createElement('a');
        a.href = url;
        a.download = 'rapport_fournisseur.csv';
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
        URL.revokeObjectURL(url);
      });
    });
  </script>
{% endblock %}