Eric Fernandez / foca-modal-precio-condiciones

Commit 2311b084275e41ab236aaadf5b3cab2ebd45e0e9

Authored by Eric Fernandez 2018-12-12 17:12:56 -0300

Exists in master

Merge branch 'master' into 'master'

focus input si no hay resultados

See merge request !2

Showing 2 changed files Show diff stats

src/js/controller.js

Diff comments View file @ 2311b08

 angular.module('focaModalPrecioCondicion')
     .controller('focaModalPrecioCondicionController',
         [
+            '$timeout',
             '$filter',
             '$scope',
             '$uibModalInstance',
             'focaModalService',
             'focaModalPrecioCondicionService',
             function(
-                $filter, $scope, $uibModalInstance,
+                $timeout, $filter, $scope, $uibModalInstance,
                 focaModalService, focaModalPrecioCondicionService
             ) {
                 focaModalPrecioCondicionService.getPreciosCondicionesPlazosPagos().then(
                     function(res) {
                         for(var i = 0; i < res.data.length; i++) {
                             var plazosTemp = '';
                             for(var j = 0; j < res.data[i].plazoPago.length; j++) {
                                 plazosTemp += res.data[i].plazoPago[j].dias + ' ';
                             }
                             res.data[i].plazos = plazosTemp.trim();
                         }
                         $scope.precioCondicion = res.data;
                         $scope.search();
                     }
                 );
+                $scope.filters = '';
                 $scope.ingreso = false;
                 $scope.plazosNuevos = [];
                 $scope.plazoACargar =
                 {
                     item: 1
                 };
                 // pagination
                 $scope.numPerPage = 10;
                 $scope.currentPage = 1;
                 $scope.filteredPrecioCondicion = [];
                 $scope.currentPagePrecioCondicion = [];
                 $scope.selectedPrecioCondicion = -1;
                 //METODOS
                 $scope.agregarPlazo = function(key) {
                     if(key === 13) {
                         if(!$scope.plazoACargar.dias) {
                             focaModalService.alert('Ingrese cantidad de días');
                             return;
                         }
                         var tieneEseDia = $scope.plazosNuevos.filter(function(a) {
                             return a.dias === $scope.plazoACargar.dias;
                         });
                         if(tieneEseDia.length > 0) {
                             focaModalService.alert('Ya ha ingresado un plazo con esos días');
                             return;
                         }
                         $scope.plazosNuevos.push($scope.plazoACargar);
                         $scope.plazoACargar =
                         {
                             item: $scope.plazosNuevos.length + 1
                         };
                     }
                 };
                 $scope.volver = function() {
                     $scope.ingreso = false;
                     $scope.plazosNuevos = [];
                     $scope.plazoACargar =
                     {
                         item: $scope.plazosNuevos.length + 1
                     };
                 };
                 $scope.quitarPlazo = function(key) {
                     $scope.plazosNuevos.splice(key, 1);
                     $scope.plazoACargar =
                     {
                         item: $scope.plazosNuevos.length + 1
                     };
                 };
-                $scope.search = function() {
+                $scope.search = function(pressed) {
                     $scope.filteredPrecioCondicion = $filter('filter')(
                         $scope.precioCondicion,
                         {$: $scope.filters}
                     );
+                    if(pressed) {
+                        if($scope.filteredPrecioCondicion.length === 0) {
+                            $timeout(function() {
+                                angular.element('#search')[0].focus();
+                                $scope.filters = '';
+                            });
+                        }else {
+                            primera();
+                        }
+                    }
                     $scope.lastPage = Math.ceil(
                         $scope.filteredPrecioCondicion.length / $scope.numPerPage
                     );
                     $scope.resetPage();
                 };
                 $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.currentPagePrecioCondicion =
                         $scope.filteredPrecioCondicion.slice(start, end);
                     $scope.currentPage = page;
                 };
                 $scope.select = function(precioCondicion) {
                     $uibModalInstance.close(precioCondicion);
                 };
                 $scope.cancel = function() {
                     $uibModalInstance.dismiss('cancel');
                 };
                 $scope.busquedaDown = function(key) {
                     if (key === 40) {
                         primera(key);
                     }
                 };
                 $scope.busquedaPress = function(key) {
                     if (key === 13) {
-                        primera(key);
+                        $scope.search(true);
                     }
                 };
                 $scope.itemProducto = function(key) {
                     if (key === 38) {
                         anterior(key);
                     }
                     if (key === 40) {
                         siguiente(key);
                     }
                     if (key === 37) {
                         retrocederPagina();
                     }
                     if (key === 39) {
                         avanzarPagina();
                     }
                 };
                 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.selectedPrecioCondicion = 0;
                 }
                 function anterior() {
                     if ($scope.selectedPrecioCondicion === 0 && $scope.currentPage > 1) {
                         retrocederPagina();
                     } else {
                         $scope.selectedPrecioCondicion--;
                     }
                 }
                 function siguiente() {
                     if ($scope.selectedPrecioCondicion <
                             $scope.currentPagePrecioCondicion.length ) {
                         $scope.selectedPrecioCondicion++;
                     } else {
                             avanzarPagina();
                     }
                 }
                 function retrocederPagina() {
                     if ($scope.currentPage > 1) {
                         $scope.selectPage($scope.currentPage - 1);
                         $scope.selectedPrecioCondicion = $scope.numPerPage - 1;
                     }
                 }
                 function avanzarPagina() {
                     if ($scope.currentPage < $scope.lastPage) {
                         $scope.selectPage($scope.currentPage + 1);
                         $scope.selectedPrecioCondicion = 0;
                     }
                 }
             }
         ]
     );

src/views/modal-precio-condicion.html

Diff comments View file @ 2311b08

 <div class="modal-header py-1">
     <div class="row w-100">
         <div class="col-lg-6">
             <h5 ng-show="!ingreso" class="modal-title my-1">Busqueda de Precio-Condición</h5>
             <h5 ng-show="ingreso" class="modal-title my-1">Nuevos Plazos</h5>
         </div>
         <div class="input-group col-lg-6 pr-0 my-2" ng-show="!ingreso">
             <input
                 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="selectedPrecioCondicion == -1"
                 ng-focus="selectedPrecioCondicion = -1"
                 teclado-virtual
             >
             <div class="input-group-append">
                 <button class="btn btn-outline-secondary" type="button" ng-click="busquedaPress(13)">
                     <i class="fa fa-search" aria-hidden="true"></i>
                 </button>
             </div>
         </div>
     </div>
 </div>
 <div class="modal-body" id="modal-body">
     <table ng-show="!ingreso" class="table table-striped table-sm">
         <thead>
             <tr>
                 <th>Código</th>
                 <th>Nombre</th>
                 <th>Lista Precio</th>
                 <th>Plazos</th>
                 <th></th>
             </tr>
         </thead>
         <tbody>
             <tr ng-show="currentPagePrecioCondicion.length == 0">
                 <td colspan="6">
                     No se encontraron resultados.
                 </td>
             </tr>
             <tr>
                 <td colspan="4" ng-show="!ingreso">
                     <input
                         class="form-control form-control-sm"
                         type="text"
                         placeholder="Selección manual"
                         readonly
                         ng-click="ingreso = !ingreso"
                         />
                 </td>
                 <td colspan="1" ng-show="!ingreso">
                     <button
                         type="button"
                         class="btn btn-sm p-1 float-right"
                         ng-class="{
                             'btn-secondary': selectedPrecioCondicion != 0,
                             'btn-primary': selectedPrecioCondicion == 0
                         }"
                         foca-focus="selectedPrecioCondicion == 0"
                         ng-keydown="itemProducto($event.keyCode)"
                         ng-click="ingreso = !ingreso"
                     >
                         <i class="fa fa-circle-thin" aria-hidden="true"></i>
                     </button>
                 </td>
             </tr>
             <tr class="selectable"
                 ng-repeat="(key, precioCondicion) in currentPagePrecioCondicion"
                 ng-click="select(precioCondicion)">
                 <td ng-bind="precioCondicion.codigo"></td>
                 <td ng-bind="precioCondicion.nombre"></td>
                 <td ng-bind="precioCondicion.idListaPrecio"></td>
                 <td ng-bind="precioCondicion.plazos"></td>
                 <td>
                     <button
                         type="button"
                         class="btn btn-sm p-1 float-right"
                         ng-class="{
                             'btn-secondary': selectedPrecioCondicion != key + 1,
                             'btn-primary': selectedPrecioCondicion == key + 1
                         }"
                         foca-focus="selectedPrecioCondicion == {{key + 1}}"
                         ng-keydown="itemProducto($event.keyCode)"
                     >
                         <i class="fa fa-circle-thin" aria-hidden="true"></i>
                     </button>
                 </td>
             </tr>
         </tbody>
     </table>
     <table class="table table-striped table-sm" ng-show="ingreso">
         <thead>
             <tr>
                 <th>Item</th>
                 <th>Días</th>
                 <th></th>
             </tr>
         </thead>
         <tbody>
             <tr>
                 <td>
                     <input
                         type="number"
                         class="form-control text-right"
                         ng-model="plazoACargar.item"
                         readonly
                     />
                 </td>
                 <td>
                     <input
                         type="number"
                         class="form-control text-right"
                         min="0"
                         ng-model="plazoACargar.dias"
                         ng-keypress="agregarPlazo($event.keyCode)"
                         foca-focus="ingreso"
                     />
                 </td>
                 <td class="text-center">
                     <button
                         class="btn btn-outline-secondary"
                         ng-click="agregarPlazo(13)"
                     >
                         <i class="fa fa-save"></i>
                     </button>
                 </td>
             </tr>
             <tr ng-repeat="(key, plazo) in plazosNuevos">
                 <td class="text-right" ng-bind="key + 1"></td>
                 <td class="text-right" ng-bind="plazo.dias"></td>
                 <td class="text-center">
                     <button
                         class="btn btn-outline-secondary"
                         ng-click="quitarPlazo(key)"
                     >
                         <i class="fa fa-trash"></i>
                     </button>
                 </td>
             </tr>
         </tbody>
     </table>
 </div>
 <div class="modal-footer py-1">
     <nav ng-show="currentPagePrecioCondicion.length > 0 && !ingreso" class="mr-auto">
         <ul class="pagination pagination-sm 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
         ng-show="!ingreso"
         class="btn btn-sm btn-secondary"
         type="button"
         ng-click="cancel()"
     >Cancelar
     </button>
     <button
         ng-show="ingreso"
         ng-disabled="plazosNuevos.length === 0"
         class="btn btn-sm btn-primary"
         type="button"
         ng-click="select(plazosNuevos)"
     >Aceptar
     </button>
     <button
         ng-show="ingreso"
         class="btn btn-sm btn-secondary"
         type="button"
         ng-click="volver()"
     >Volver
     </button>
 </div>