templates/almacen/articulo/index.html.twig line 1

Open in your IDE?
  1. {% extends 'navbar.html.twig' %}
  3. {% block title %}Articulos{% endblock %}
  5. {% block content_user %}
  6.     <h5>Articulos</h5>
  9.     <style>
  10.         select.form-select {
  11.            
  12.         }
  13.     </style>
  14.     {% set selectAplicaciones %}
  15.         <select class="form-control form-control-sm form-select change-aplication">
  16.             <option value=""></option>
  17.             {% for aplicacion in aplicaciones %}
  18.                 <option value="{{ aplicacion.id }}">{{ aplicacion.nombre }}</option>
  19.             {% endfor %}
  20.         </select>
  21.     {% endset %}
  23.     <table id="example" class="table table-striped table-bordered table-hover">
  24.         <thead>
  25.             <tr>
  26.                 <th>Activo</th>
  27.                 <th>Codigo</th>
  28.                 <th>Descripcion</th>
  29.                 <th>Categoria</th>
  30.                 <th>Unidad Medida</th>
  31.                 <th>Aplicacion</th>
  32.                 <th></th>
  33.                 <th></th>
  34.             </tr>
  35.         </thead>
  36.         <tbody>
  37.         {% for articulo in articulos %}
  38.             <tr>
  39.                 <td>
  40.                     <div class="custom-control custom-switch">
  41.                         <input data-id="{{ articulo.id }}" {{ articulo.activo ? "checked" : "" }} type="checkbox" class="status custom-control-input" id="chk{{ articulo.id }}"/>
  42.                       <label class="custom-control-label pt-1" for="chk{{ articulo.id }}"></label>
  43.                   </div>
  44.                      
  45.                 </td>
  46.                 <td>{{ articulo.codigo }}</td>
  47.                 <td>{{ articulo.descripcion }}</td>
  48.                 <td>{{ articulo.categoria }}</td>
  49.                 <td>{{ articulo.unidaMedida }}</td>
  50.                 <td id="art{{articulo.id}}" data-art="{{ articulo.id }}">{{ articulo.listaAplicaciones }}</td>
  51.                 <td>{{ selectAplicaciones }}</td>
  52.                 <td>
  54.                     <a href="{{ path('app_almacen_articulo_edit', {'id': articulo.id}) }}" class="btn btn-success btn-sm">Modificar</a>
  56.                 </td>
  57.             </tr>
  58.         {% else %}
  59.             <tr>
  60.                 <td colspan="5">no records found</td>
  61.             </tr>
  62.         {% endfor %}
  63.         </tbody>
  64.     </table>
  66.     <a href="{{ path('app_almacen_articulo_new') }}" class="btn btn-default">Nuevo Articulo</a>
  68. {% endblock %}
  69. {% block javascripts_footer %}
  70.     
  71.     {{ parent() }}
  73.     <script type="text/javascript">
  75.         const path = "{{ path('app_almacen_articulo_change_status', { id : '__ID__' }) }}";
  77.         $('.change-aplication').change(function(){
  78.                                         let select = $(this);
  79.                                         let idArticulo = select.closest('tr').find('td[data-art]').data('art');
  80.                                         let idAplicacion = select.val();
  82.                                         $.post("{{ path('app_almacen_articulo_add_aplicacion', { id : '__ID__' }) }}".replace('__ID__', idArticulo),
  83.                                                { aplicacion: idAplicacion },
  84.                                                function(data){
  85.                                                                 if (data.ok) {
  86.                                                                     select.css('border-color', 'green');
  87.                                                                     $('#art' + idArticulo).html(data.aplicacion);
  88.                                                                 } else {
  89.                                                                     select.css('border-color', 'red');
  90.                                                                 }
  92.                                                });
  93.                               
  94.         });
  96.         $('.status').change(function(){
  97.                                         let btn = $(this);
  98.                                         let id = btn.data('id');
  100.                                         $.post(path.replace('__ID__', id),
  101.                                                function(data){
  102.                                                                 console.log(data);
  103.                                                });
  104.                               
  105.         });
  107.         $('#example').DataTable({
  108.                                     fixedHeader: true,
  109.                                     paging: true,
  110.                                     responsive: true,
  111.                                     language: {
  112.                                         url: '{{ asset('i18n/spanish.json') }}'
  113.                                     }
  115.                                 });
  117.     </script>
  119. {% endblock %}