templates/billing/index.html.twig line 1

Open in your IDE?
  1.     {% extends 'base.html.twig' %}
  2. {% block title %}Facturation{% endblock %}
  3. {% block body %}
  4.     <ol class="breadcrumb">
  5.         <li>
  6.             <i class="clip-grid-6"></i>
  7.             <a href="#">
  8.                 Factures
  9.             </a>
  10.         </li>
  11.         <li class="active">
  12.             Liste
  13.         </li>
  14.     </ol>
  15.     <div class="page-header">
  16.         <h1>Gestion des factures</h1>
  17.         <button class="btn btn-success" data-toggle="modal" data-target="#generate">Génération facture</button>
  18.         <button class="btn btn-success" data-toggle="modal" data-target="#validate">Validation facture</button>
  19.         <button class="btn btn-success" data-toggle="modal" data-target="#send">Envoi facture</button>
  20.         <button class="btn btn-success" data-toggle="modal" data-target="#encaissement">Encaisser factures</button>
  21.         <button class="btn btn-success" data-toggle="modal" data-target="#sepa">SEPA</button>
  22.         <button class="btn btn-success" data-toggle="modal" data-target="#relance">Relance factures</button>
  23.         <button class="btn btn-success" data-toggle="modal" data-target="#lot">LOT FACTURES</button>
  24.         <button class="btn btn-success" data-toggle="modal" data-target="#easycollect">ENVOI FACTURE EASYCOLLCET</button>
  25.         <button id="btn-rendre-contencieux" class="btn btn-success">Passer les factures en contentieux</button>
  26.     </div>
  27.     <div class="row">
  28.         {{ form_start(formFilter) }}
  29.         <div class="col-md-12">
  30.             <div class="col-md-2">
  31.                 {{ form_row(formFilter.company) }}
  32.             </div>
  33.             <div class="col-md-2">
  34.                 {{ form_row(formFilter.site) }}
  35.             </div>
  36.             <div class="col-md-2">
  37.                 {{ form_row(formFilter.statusSite) }}
  38.             </div>
  39.         </div>
  40.         <div class="col-md-12">
  41.             <div class="col-md-3">
  42.                 {{ form_row(formFilter.numFacture) }}
  43.             </div>
  44.             <div class="col-md-2">
  45.                 {{ form_row(formFilter.client) }}
  46.             </div>
  47.             <div class="col-md-3">
  48.                 {{ form_row(formFilter.status) }}
  49.             </div>
  50.         </div>
  51.         <div class="col-md-2">
  52.             {{ form_row(formFilter.dateDebut) }}
  53.         </div>
  54.         <div class="col-md-2">
  55.             {{ form_row(formFilter.dateFin) }}
  56.         </div>
  57.         <div class="col-md-2"  style="padding-top: 23px;">
  58.             <button type="submit" class="btn btn-success">Valider</button>
  59.         </div>
  60.         {{ form_end(formFilter) }}
  61.     </div>
  62.     <div class="row">
  63.         <div class="col-md-12">
  64.             <!-- start: BASIC TABLE PANEL -->
  65.             <div class="panel panel-default">
  66.                 <div class="panel-heading">
  67.                     Factures
  68.                     <div class="panel-tools">
  69.                     </div>
  70.                 </div>
  71.                 <div class="panel-body">
  72.                     <table class="table table-hover" id="sample-table-1">
  73.                         <thead>
  74.                         <tr>
  75.                             <th><input type="checkbox" id="select-all"></th>
  76.                             <th data-sort-default>Numéro facture</th>
  77.                             <th>Date</th>
  78.                             <th>Nom du client</th>
  79.                             <th>HT</th>
  80.                             <th>TVA</th>
  81.                             <th>Montant TTC</th>
  82.                             <th>Solde</th>
  83.                             <th>Statut facture</th>
  84.                             <th>Type facture (FDRV / FFDP)</th>
  85.                             <th>Mode de réglement</th>
  86.                             <th>Site</th>
  87.                             <th>N°</th>
  88.                             <th></th>
  89.                         </tr>
  90.                         </thead>
  91.                         <tbody>
  92.                         {% for billing in billings %}
  93.                             <tr>
  94.                                 <!-- Add Checkbox for each row -->
  95.                                 <td><input type="checkbox" class="billing-checkbox" data-id="{{ billing.id }}"></td>
  96.                                 <td>{{ billing.code }}</td>
  97.                                 <td>{{ billing.dateBilling|date('d/m/Y') }}</td>
  98.                                 <td>
  99.                                     {% if billing.client %}
  100.                                         <a href="{{ path('client_edit', {id: billing.client.id }) }}" target="_blank">
  101.                                             <b>{{ billing.client.lastname }}   {{ billing.client.firstname }}</b>
  102.                                         </a>
  103.                                     {% endif %}
  104.                                 </td>
  105.                                 <td style="text-align: right">
  106.                                     {{ billing.ht|number_format(2, '.', ',')  }}
  107.                                 </td>
  108.                                 <td style="text-align: right">
  109.                                     {{ (billing.ht * (20/100))|number_format(2, '.', ',')  }}
  110.                                 </td>
  111.                                 <td style="text-align: right">
  112.                                     <b>{{ billing.ttc }}</b>
  113.                                 </td>
  114.                                 <td style="text-align: right"> {{ billing.solde|number_format(2, '.', ',') }}</td>
  115.                                 <td>
  116.                                     {% if billing.status == 'a_regle' %}
  117.                                         A régler
  118.                                     {% else %}
  119.                                         {{ billing.status|capitalize }}
  120.                                     {% endif %}
  121.                                 </td>
  122.                                 <td>{{ billing.modeFacturation }}</td>
  123.                                 <td>{% if billing.reglement %}{{ billing.reglement.mode }}{%endif%}</td>
  124.                                 <td>  {% if billing.client %}
  125.                                         {% if billing.client.site %}
  126.                                         {% if billing.client.site.status == "closed" %}
  127.                                             <span style="color: red;">{{ billing.client.site.name }}</span>
  128.                                         {% else %}
  129.                                              {{ billing.client.site.name }}
  130.                                         {% endif %}
  131.                                     {%endif%}
  132.                                     {%endif%}</td>
  133.                                 <td>{% if billing.reglement %}
  134.                                         <a href="{{ path('reglement_edit', {'id': billing.reglement.id}) }}" {% if billing.reglement.status == 'Annulé' %} style="color:red;text-decoration:line-through;"{% endif %}>{{ billing.reglement.id }}</a>{% endif %}</td>
  135.                                 <td>
  136.                                     <a href="{{ path('billing_edit', {'id': billing.id}) }}">Edition</a>
  137.                                 </td>
  138.                             </tr>
  139.                         {% else %}
  140.                             <tr>
  141.                                 <td colspan="4">Aucun enregistrement trouvé</td>
  142.                             </tr>
  143.                         {% endfor %}
  144.                         </tbody>
  145.                     </table>
  146.                 </div>
  147.             </div>
  148.             <!-- end: BASIC TABLE PANEL -->
  149.         </div>
  150.     </div>
  151.     {% include 'billing/generate_popup.html.twig' %}
  152.     {% include 'billing/validate_popup.html.twig' %}
  153.     {% include 'billing/send_popup.html.twig' %}
  154.     {% include 'billing/encaissement.html.twig' %}
  155.     {% include 'billing/sepa.html.twig' %}
  156.     {% include 'billing/relance.html.twig' %}
  157.     {% include 'billing/lot.html.twig' %}
  158.     {% include 'billing/easycollect.html.twig' %}
  159.     <style>
  160.         .select2-container {
  161.             display: block;
  162.         }
  163.     </style>
  164. {% endblock %}
  165. {% block javascripts %}
  166.     {{ parent() }}
  167.     <script type="text/javascript">
  168.         $('#lot_site').select2( {width: '100%' });
  169.         $('#lot_client').select2( {width: '100%' });
  170.         $('#filter_status').select2( {width: '250px' });
  171.         $('#filter_site').select2({
  172.             width: '100%'
  173.         });
  174.         $('#generate_site').select2({
  175.             width: '100%'
  176.         });
  177.         $('#validate_site').select2({
  178.             width: '100%'
  179.         });
  180.         $('#send_site').select2({
  181.             width: '100%'
  182.         });
  183.         $('#relance_site').select2({
  184.             width: '100%'
  185.         });
  186.         $('#filter_dateDebut').flatpickr({
  187.             altInput: true,
  188.             'dateFormat' : 'Y-m-d',
  189.             "locale": "fr",
  190.             "altFormat": "d-m-Y",
  191.         });
  192.         $('#filter_dateFin').flatpickr({
  193.             altInput: true,
  194.             'dateFormat' : 'Y-m-d',
  195.             "locale": "fr",
  196.             "altFormat": "d-m-Y",
  197.         });
  198.         $('.flatpicker').flatpickr({
  199.             altInput: true,
  200.             'dateFormat' : 'Y-m-d',
  201.             "locale": "fr",
  202.             "altFormat": "d-m-Y",
  203.         });
  204.         $('#generate').on('shown.bs.modal', function () {
  205.             $('#generate_start').flatpickr({
  206.                 altInput: true,
  207.                 'dateFormat' : 'Y-m-d',
  208.                 "locale": "fr",
  209.                 "altFormat": "d-m-Y",
  210.             });
  211.             $('#generate_end').flatpickr({
  212.                 altInput: true,
  213.                 'dateFormat' : 'Y-m-d',
  214.                 "locale": "fr",
  215.                 "altFormat": "d-m-Y",
  216.             });
  217.         });
  218.         $('#send').on('shown.bs.modal', function () {
  219.             $('#send_start').flatpickr({
  220.                 altInput: true,
  221.                 'dateFormat' : 'Y-m-d',
  222.                 "locale": "fr",
  223.                 "altFormat": "d-m-Y",
  224.             });
  225.             $('#send_end').flatpickr({
  226.                 altInput: true,
  227.                 'dateFormat' : 'Y-m-d',
  228.                 "locale": "fr",
  229.                 "altFormat": "d-m-Y",
  230.             });
  231.         });
  232.         $('#easycollect').on('shown.bs.modal', function () {
  233.             $('#easy_collect_start').flatpickr({
  234.                 altInput: true,
  235.                 'dateFormat' : 'Y-m-d',
  236.                 "locale": "fr",
  237.                 "altFormat": "d-m-Y",
  238.             });
  239.             $('#easy_collect_end').flatpickr({
  240.                 altInput: true,
  241.                 'dateFormat' : 'Y-m-d',
  242.                 "locale": "fr",
  243.                 "altFormat": "d-m-Y",
  244.             });
  245.         });
  246.         $('#validate').on('shown.bs.modal', function () {
  247.             $('#validate_start').flatpickr({
  248.                 altInput: true,
  249.                 'dateFormat' : 'Y-m-d',
  250.                 "locale": "fr",
  251.                 "altFormat": "d-m-Y",
  252.             });
  253.             $('#validate_end').flatpickr({
  254.                 altInput: true,
  255.                 'dateFormat' : 'Y-m-d',
  256.                 "locale": "fr",
  257.                 "altFormat": "d-m-Y",
  258.             });
  259.         });
  260.           new Tablesort(document.getElementById('sample-table-1'));
  261.           $('.encaissement-checkbox').on('change', function (e) {
  262.               let total = 0;
  263.               $('.encaissement-checkbox').each(function (e) {
  264.                   if($(this).is(":checked")){
  265.                       total += parseFloat($(this).data('solde'));
  266.                   }
  267.               });
  268.               total = Math.round(total * 100) / 100;
  269.               $('.total').html(total);
  270.           });
  271.           $('.encaissement-all').on('change', function (e) {
  272.               let total = 0;
  273.               var value = $(this).is(":checked");
  274.               $('.encaissement-checkbox').each(function (e) {
  275.                     $('.encaissement-checkbox').prop('checked', value);
  276.                       if($(this).is(":checked")){
  277.                           total += parseFloat($(this).data('solde'));
  278.                      }
  279.               });
  280.                 if(value == true) {
  281.                     total = Math.round(total * 100) / 100;
  282.                     $('.total').html(total);
  283.                 }
  284.           });
  285.         $('#relance_start').flatpickr({
  286.             altInput: true,
  287.             'dateFormat' : 'Y-m-d',
  288.             "locale": "fr",
  289.             "altFormat": "d-m-Y",
  290.         });
  291.         $('#relance_end').flatpickr({
  292.             altInput: true,
  293.             'dateFormat' : 'Y-m-d',
  294.             "locale": "fr",
  295.             "altFormat": "d-m-Y",
  296.         });
  297.         $('#validate_dateBilling').flatpickr({
  298.             altInput: true,
  299.             'dateFormat' : 'Y-m-d',
  300.             "locale": "fr",
  301.             "altFormat": "d-m-Y",
  302.         });
  303.         $('#select-all').click(function () {
  304.             $('.billing-checkbox').prop('checked', this.checked);
  305.         });
  306.         $('.billing-checkbox').change(function () {
  307.             if ($('.billing-checkbox:checked').length === $('.billing-checkbox').length) {
  308.                 $('#select-all').prop('checked', true);
  309.             } else {
  310.                 $('#select-all').prop('checked', false);
  311.             }
  312.         });
  313.         $('#sepa').on('shown.bs.modal', function () {
  314.             var flatpickrInstance = flatpickr('#payment-date', {
  315.                 dateFormat: 'd-m-Y',
  316.                 locale: 'fr'
  317.             });
  318.             var today = new Date();
  319.             flatpickrInstance.setDate(today); 
  320.         });
  321.         $('#btn-rendre-contencieux').click(function () {
  322.             let selectedIds = [];
  323.             $('.billing-checkbox:checked').each(function () {
  324.                 selectedIds.push($(this).data('id'));
  325.             });
  326.             if (selectedIds.length > 0) {
  327.                 $.ajax({
  328.                     url: '{{ path('app_billing_rendrecontencieux') }}',
  329.                     method: 'POST',
  330.                     data: {ids: selectedIds},
  331.                     success: function (response) {
  332.                         alert('Factures marquées comme contentieuses avec succès.');
  333.                         location.reload();
  334.                     },
  335.                     error: function (xhr, status, error) {
  336.                         alert('Erreur lors du traitement des factures.');
  337.                     }
  338.                 });
  339.             } else {
  340.                 alert('Veuillez sélectionner au moins une facture.');
  341.             }
  342.         });
  343.     </script>
  344. {% endblock %}