templates/app/expense/index.html.twig line 1

  1. {% extends 'app/index.html.twig' %} {% block title %} {% trans %}Historique des
  2. Dépenses {% endtrans %} {% endblock %} {% block content %} {% include
  3. "app/_partials/breadcrumb.html.twig" with { 'title': 'Dépenses'|trans, 'parent':
  4. 'Comptabilité'|trans } %}
  5. <div class="row">
  6.   <div class="col-12">
  7.     <div class="card">
  8.       <div class="card-header">
  9.         <div class="row align-items-center">
  10.           <div class="col-md-6">
  11.             <div class="mb-3">
  12.               <h5 class="card-title">
  13.                 {% trans %} Toutes dépenses {% endtrans %}
  14.                 <span class="text-muted fw-normal ms-2"
  15.                   >({{ expenses | length }})</span
  16.                 >
  17.               </h5>
  18.             </div>
  19.           </div>
  20.           <div class="col-md-6">
  21.             <div
  22.               class="d-flex flex-wrap align-items-center justify-content-end gap-2 mb-3"
  23.             >
  24.               <div>
  25.                 <ul class="nav nav-pills"></ul>
  26.               </div>
  27.               <div>
  28.                 <a
  29.                   href="{{ path('app_expense_new') }}"
  30.                   class="btn btn-primary"
  31.                   data-bs-toggle="modal"
  32.                   data-bs-target="#add-modal"
  33.                 >
  34.                   <i class="bx bx-plus me-1"></i>
  35.                   {% trans %} Ajouter un nouveau {% endtrans %}
  36.                 </a>
  37.               </div>
  38.               {% include "app/expense/add-modal.html.twig" %}
  39.             </div>
  40.           </div>
  41.         </div>
  42.       </div>
  43.       <div class="card-body">
  44.         <div class="table">
  45.           <table
  46.             id="datatable"
  47.             class="table table-bordered dt-responsive nowrap w-100"
  48.           >
  49.             <thead>
  50.               <tr>
  51.                 <th>#</th>
  52.                 <th>{% trans %} Nom de Dépense{% endtrans %}</th>
  53.                 <th>{% trans %} Référence {% endtrans %}</th>
  54.                 <th>{% trans %} Type {% endtrans %}</th>
  55.                 <th>{% trans %} Date {% endtrans %}</th>
  56.                 <th>{% trans %} Montant {% endtrans %}</th>
  57.                 <th width="220px">{% trans %} Actions {% endtrans %}</th>
  58.               </tr>
  59.             </thead>
  60.             <tbody data-controller="expense">
  61.               {% for expense in expenses %}
  62.               <tr>
  63.                 <th scope="row">
  64.                   {{ loop.index }}
  65.                 </th>
  66.                 <td>
  67.                   <div class="d-flex align-items-center">
  68.                     <div class="flex-shrink-0 me-3">
  69.                       <img
  70.                         class="avatar-md"
  71.                         src="/front/images/expense.png"
  72.                         alt="Chyna Gorczany"
  73.                       />
  74.                     </div>
  75.                     <div class="flex-grow-1">
  76.                       <a href="#">
  77.                         <h5 class="font-size-14 mb-2">
  78.                           {{ expense.name }}
  79.                         </h5>
  80.                       </a>
  81.                     </div>
  82.                   </div>
  83.                 </td>
  84.                 <td>#{{ expense.reference }}</td>
  85.                 <td>
  86.                   {{ expense.type.name }}
  87.                 </td>
  88.                 <td>
  89.                   {{ expense.date ? expense.date|date('d-m-Y') : '' }}
  90.                 </td>
  91.                 <td>
  92.                   <b> {% trans %} Total {% endtrans %} : </b>
  93.                   <span class="text-info"
  94.                     >{{ expense.amount }}
  95.                     {{ company.currencie }}
  96.                   </span>
  97.                   <br />
  98.                 </td>
  99.                 <td>
  100.                   <a
  101.                     href="{{ path('app_expense_edit', { id: expense.id }) }}"
  102.                     class="btn btn-info waves-effect waves-light me-2"
  103.                     data-toggle="tooltip"
  104.                     data-placement="top"
  105.                     title="{{ 'Modifier' | trans }}"
  106.                   >
  107.                     <i class="bx bx-edit font-size-16 align-middle"></i>
  108.                   </a>
  109.                   <form
  110.                     style="display: contents"
  111.                     id="delete-form-{{ expense.id }}"
  112.                     method="post"
  113.                     action="{{
  114.                       path('app_expense_delete', { id: expense.id })
  115.                     }}"
  116.                     onclick="
  117.                   alertify.set('notifier','position', 'top-right'); alertify.confirm('Supprimer', 'Voulez-vous vraiment supprimer cet objet?', function(e){ document.getElementById('delete-form-{{
  118.                       expense.id
  119.                     }}').submit(); }, function(){ alertify.error('Annuler')});"
  120.                   >
  121.                     <input
  122.                       type="hidden"
  123.                       name="_token"
  124.                       value="{{ csrf_token('delete' ~ expense.id) }}"
  125.                     />
  126.                     <a
  127.                       href="javascript:void(0);"
  128.                       type="button"
  129.                       class="btn btn-danger waves-effect waves-light me-2"
  130.                       data-toggle="tooltip"
  131.                       data-placement="top"
  132.                       title="{{ 'Supprimer' | trans }}"
  133.                     >
  134.                       <i class="bx bx-trash font-size-16 align-middle"></i>
  135.                     </a>
  136.                   </form>
  137.                 </td>
  138.               </tr>
  139.               {% endfor %}
  140.             </tbody>
  141.           </table>
  142.         </div>
  143.       </div>
  144.     </div>
  145.   </div>
  146. </div>
  147. {% endblock %}