Mauricio Cattafi / foca-modal-busqueda-productos

Browse Code »

Commit d43f07ae2aa5653ebed3e456b293c21ce8cd31ce

Authored by Marcelo Puebla 2019-07-24 16:13:07 -0300

1 parent e1a9b4e09f

Exists in develop

Agregada logica para mostrar todos los productos al inicio del modal.

Showing 2 changed files with 18 additions and 1 deletions Show diff stats

src/js/controller.js

Diff comments View file @ d43f07a

 angular.module('focaBusquedaProductos')
     .controller('modalBusquedaProductosCtrl',
         [
             '$timeout',
             '$filter',
             '$scope',
             '$uibModalInstance',
             'parametroProducto',
             'focaBusquedaProductosService',
             function ($timeout, $filter, $scope, $uibModalInstance, parametroProducto,
                 focaBusquedaProductosService
             ) {
                 $scope.simbolo = parametroProducto.simbolo;
                 $scope.filters = '';
                 $scope.listaProductos = [];
                 $scope.todosProductos = [];
                 $scope.primerBusqueda = false;
                 $scope.searchLoading = false;
                 $scope.soloMostrar = parametroProducto.soloMostrar;
+                $scope.buscarTodos = parametroProducto.buscarTodos;
                 $scope.useAllProducts = false;
                 //#region pagination variables
                 $scope.numPerPage = 10;
                 $scope.currentPage = 1;
                 $scope.filteredProductos = [];
                 $scope.currentPageProductos = [];
                 $scope.selectedProducto = -1;
+                init();
+                function init() {
+                    //Verifica si el modal mostrará todos los productos al abrirse.
+                    if ($scope.buscarTodos) {
+                        $scope.useAllProducts = !$scope.useAllProducts;
+                        primera();
+                    }
+                }
                 //#endregion
                 //METODOS
                 $scope.busquedaPress = function (key) {
                     if (key === 13) {
                         $scope.searchLoading = true;
                         focaBusquedaProductosService
                             .getProductosByIdLista(parseInt(parametroProducto.idLista), $scope.filters)
                             .then(function (data) {
                                 llenarDatos(data);
                                 focaBusquedaProductosService.getProductos()
                                     .then(fillAllProductos);
                             })
                             .catch(function (e) { console.log(e) });
                     }
                 };
                 function llenarDatos(res) {
                     for (var i = 0; i < res.data.length; i++) {
                         res.data[i].precio = res.data[i].precio / parametroProducto.cotizacion;
                     }
                     $scope.searchLoading = false;
                     $scope.primerBusqueda = true;
                     $scope.listaProductos = res.data;
                     $scope.search(true);
                     primera();
                 };
                 function fillAllProductos(res) {
                     for (var i = 0; i < res.data.length; i++) {
                         var producto = $scope.listaProductos.filter(function (producto) {
                             return producto.id == res.data[i].id;
                         })[0];
                         if (producto) {
                             res.data[i].precio = producto.precio;
                         }
                     }
                     $scope.searchLoading = false;
                     $scope.primerBusqueda = true;
                     $scope.todosProductos = res.data;
                     $scope.search(true);
                     primera();
                 };
                 $scope.changeProductsData = function () {
                     $scope.useAllProducts = !$scope.useAllProducts;
                     $scope.search(false);
                     primera();
                 };
                 $scope.search = function (pressed) {
                     if ($scope.listaProductos.length > 0 || $scope.todosProductos.length > 0) {
                         $scope.filteredProductos = $filter('filter')(
                             ($scope.useAllProducts ? $scope.todosProductos : $scope.listaProductos),
                             { $: $scope.filters }
                         );
                         $scope.lastPage = Math.ceil(
                             $scope.filteredProductos.length / $scope.numPerPage
                         );
                         $scope.resetPage();
                     } else if (pressed) {
                         $timeout(function () {
                             angular.element('#search')[0].focus();
                             $scope.filters = '';
                         });
                     }
                 };
                 $scope.resetPage = function () {
                     $scope.currentPage = 1;
                     $scope.selectPage(1);
                 };
                 $scope.selectPage = function (page) {
                     var start = (page - 1) * $scope.numPerPage;
                     var end = start + $scope.numPerPage;
                     $scope.paginas = [];
                     $scope.paginas = calcularPages(page);
                     $scope.currentPageProductos = $scope.filteredProductos.slice(start, end);
                     $scope.currentPage = page;
                 };
                 $scope.select = function (producto) {
                     $uibModalInstance.close(producto);
                 };
                 $scope.cancel = function () {
                     $uibModalInstance.dismiss('cancel');
                 };
                 $scope.busquedaDown = function (key) {
                     if (key === 40) {
                         primera(key);
                     }
                 };
                 $scope.itemProducto = function (key) {
                     if (key === 38) {
                         anterior(key);
                     }
                     if (key === 40) {
                         siguiente(key);
                     }
                     if (key === 37) {
                         retrocederPagina();
                     }
                     if (key === 39) {
                         avanzarPagina();
                     }
                 };
                 //#region Paginador
                 function calcularPages(paginaActual) {
                     var paginas = [];
                     paginas.push(paginaActual);
                     if (paginaActual - 1 > 1) {
                         paginas.unshift(paginaActual - 1);
                         if (paginaActual - 2 > 1) {
                             paginas.unshift(paginaActual - 2);
                         }
                     }
                     if (paginaActual + 1 < $scope.lastPage) {
                         paginas.push(paginaActual + 1);
                         if (paginaActual + 2 < $scope.lastPage) {
                             paginas.push(paginaActual + 2);
                         }
                     }
                     if (paginaActual !== 1) {
                         paginas.unshift(1);
                     }
                     if (paginaActual !== $scope.lastPage) {
                         paginas.push($scope.lastPage);
                     }
                     return paginas;
                 };
                 function primera() {
                     $scope.selectedProducto = 0;
                 };
                 function anterior() {
                     if ($scope.selectedProducto === 0 && $scope.currentPage > 1) {
                         retrocederPagina();
                     } else {
                         $scope.selectedProducto--;
                     }
                 };
                 function siguiente() {
                     if ($scope.selectedProducto < $scope.currentPageProductos.length - 1) {
                         $scope.selectedProducto++;
                     } else {
                         avanzarPagina();
                     }
                 };
                 function retrocederPagina() {
                     if ($scope.currentPage > 1) {
                         $scope.selectPage($scope.currentPage - 1);
                         $scope.selectedProducto = $scope.numPerPage - 1;
                     }
                 };
                 function avanzarPagina() {
                     if ($scope.currentPage < $scope.lastPage) {
                         $scope.selectPage($scope.currentPage + 1);
                         $scope.selectedProducto = 0;
                     }
                 };
                 //#endregion
                 $scope.busquedaPress(13);
             }
         ]
     );

src/views/modal-busqueda-productos.html

Diff comments View file @ d43f07a

 <div class="modal-header py-1">
     <div class="row w-100">
         <div class="col-lg-6">
             <h5 class="modal-title my-1">Búsqueda de Productos</h5>
         </div>
         <div class="input-group col-lg-6 pr-0 my-2">
             <input
                 ladda="searchLoading"
                 type="text"
                 class="form-control form-control-sm"
                 id="search"
                 placeholder="Busqueda"
                 ng-model="filters"
                 ng-change="search()"
                 ng-keydown="busquedaDown($event.keyCode)"
                 ng-keypress="busquedaPress($event.keyCode)"
                 foca-focus="selectedProducto == -1"
                 ng-focus="selectedProducto = -1"
                 teclado-virtual
             >
             <div class="input-group-append">
                 <button
                     ladda="searchLoading"
                     data-spinner-color="#FF0000"
                     class="btn btn-outline-secondary"
                     type="button"
                     title="Buscar"
                     ng-click="busquedaPress(13)"
                 >
                     <i class="fa fa-search" aria-hidden="true"></i>
                 </button>
             </div>
         </div>
     </div>
     <div class="row">
         <div class="col my-1 d-flex justify-content-end">
             <div class="custom-control custom-checkbox mt-auto">
-                <input type="checkbox" class="custom-control-input" id="check" ng-click="changeProductsData()">
+                <input
+                    type="checkbox"
+                    class="custom-control-input"
+                    id="check"
+                    ng-click="changeProductsData()"
+                    ng-checked="buscarTodos">
                 <label class="custom-control-label disable-selection" for="check">
                     Buscar en todos los artículos disponibles
                 </label>
             </div>
         </div>
     </div>
 </div>
 <div class="modal-body" id="modal-body">
     <div ng-show="!primerBusqueda">
         Debe realizar una primer búsqueda.
     </div>
     <table ng-show="primerBusqueda" class="table table-striped table-sm">
         <thead>
             <tr>
                 <th ng-hide="soloMostrar">Código</th>
                 <th>Descripción</th>
                 <th class="text-right">P. Lista</th>
                 <th class="text-right" ng-show="useAllProducts">P. Base</th>
                 <th ng-hide="soloMostrar"></th>
             </tr>
         </thead>
         <tbody>
             <tr ng-show="currentPageProductos.length == 0 && primerBusqueda">
                 <td colspan="5">
                     No se encontraron resultados.
                 </td>
             </tr>
             <tr class="selectable"
                 ng-repeat="(key,producto) in currentPageProductos"
                 ng-click="select(producto)">
                 <td ng-bind="producto.sector + '-' + producto.codigo"
                     ng-hide="soloMostrar"></td>
                 <td ng-bind="producto.descripcion"></td>
                 <td class="text-right">{{producto.precioBase == producto.precio ? '' : producto.precio}}</td>
                 <td class="text-right" ng-bind="producto.precioBase | number: 2" ng-show="useAllProducts"></td>
                 <td class="d-md-none text-primary">
                     <i class="fa fa-circle-thin" aria-hidden="true"></i>
                 </td>
                 <td class="d-none d-md-table-cell">
                     <button
                         type="button"
                         class="btn btn-xs p-1 float-right"
                         title="Seleccionar"
                         ng-class="{
                             'btn-secondary': selectedProducto != key,
                             'btn-primary': selectedProducto == key
                         }"
                         foca-focus="selectedProducto == {{key}}"
                         ng-keydown="itemProducto($event.keyCode)"
                         ng-hide="soloMostrar">
                         <i class="fa fa-circle-thin" aria-hidden="true"></i>
                     </button>
                 </td>
             </tr>
         </tbody>
     </table>
 </div>
 <div class="modal-footer py-1">
     <nav ng-show="currentPageProductos.length > 0 && primerBusqueda" class="mr-auto">
         <ul class="pagination pagination-sm justify-content mb-0">
             <li class="page-item" ng-class="{'disabled': currentPage == 1}">
                 <a class="page-link" href="javascript:void();" ng-click="selectPage(currentPage - 1)">
                     <span aria-hidden="true">&laquo;</span>
                     <span class="sr-only">Anterior</span>
                 </a>
             </li>
             <li
                 class="page-item"
                 ng-repeat="pagina in paginas"
                 ng-class="{'active': pagina == currentPage}"
             >
                 <a
                     class="page-link"
                     href="javascript:void();"
                     ng-click="selectPage(pagina)"
                     ng-bind="pagina"
                 ></a>
             </li>
             <li class="page-item" ng-class="{'disabled': currentPage == lastPage}">
                 <a class="page-link" href="javascript:void();" ng-click="selectPage(currentPage + 1)">
                     <span aria-hidden="true">&raquo;</span>
                     <span class="sr-only">Siguiente</span>
                 </a>
             </li>
         </ul>
     </nav>
     <button class="btn btn-sm btn-secondary my-1" type="button" ng-click="cancel()">Volver</button>
 </div>