Marcelo Puebla / foca-modal-domicilio

Commit 3d8cb710bf08ecdb81922f186d8761111d3cae0f

Authored by Eric Fernandez 2018-12-12 17:06:19 -0300

Merge branch 'master' into 'master'

focus input cuando no hay resultados

See merge request !2

Showing 2 changed files Show diff stats

src/js/controller.js

Diff comments View file @ 3d8cb71

 angular.module('focaModalDomicilio')
     .controller('focaModalDomicilioController',
         [
+            '$timeout',
             '$filter',
             '$scope',
             '$uibModalInstance',
             'idCliente',
             'focaModalDomicilioService',
-            function($filter, $scope, $uibModalInstance, idCliente, focaModalDomicilioService) {
+            function($timeout, $filter, $scope, $uibModalInstance, idCliente,
+                focaModalDomicilioService) {
                 $scope.buscar = function() {
                     focaModalDomicilioService
                         .getDomiciliosEntregaByIdCliente($scope.idCliente)
                         .then(function(res) {
                             $scope.domicilios = res.data;
                             $scope.search();
                             $scope.primerBusqueda = true;
                         }
                     );
                 };
+                $scope.filters = '';
                 $scope.idCliente = idCliente;
                 $scope.buscar();
                 $scope.ingreso = false;
                 $scope.primerBusqueda = false;
                 $scope.contactos = [{}];
                 // pagination
                 $scope.numPerPage = 5;
                 $scope.currentPage = 1;
                 $scope.filteredDomicilios = [];
                 $scope.currentPageDomicilios = [];
                 $scope.selectedDomicilio = -1;
                 //METODOS
-                $scope.search = function() {
+                $scope.search = function(pressed) {
                     $scope.filteredDomicilios = $filter('filter')(
                         $scope.domicilios,
                         {$: $scope.filters}
                     );
+                    if(pressed) {
+                        if($scope.filteredDomicilios.length === 0) {
+                            $timeout(function() {
+                                angular.element('#search')[0].focus();
+                                $scope.filters = '';
+                            });
+                        }else {
+                            primera();
+                        }
+                    }
                     $scope.lastPage = Math.ceil(
                         $scope.filteredDomicilios.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.currentPageDomicilios = $scope.filteredDomicilios.slice(start, end);
                     $scope.currentPage = page;
                 };
                 $scope.select = function(domicilio) {
                     $uibModalInstance.close(domicilio);
                 };
                 $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.itemDomicilio = function(key) {
                     if (key === 38) {
                         anterior(key);
                     }
                     if (key === 40) {
                         siguiente(key);
                     }
                     if (key === 37) {
                         retrocederPagina();
                     }
                     if (key === 39) {
                         avanzarPagina();
                     }
                 };
                 $scope.agregarDomicilio = function() {
                     $scope.domicilio.valores = [];
                     $scope.domicilio.idCliente = $scope.idCliente;
                     if($scope.domicilio.calle) {
                         $scope.domicilio.valores.push({
                             ID_ADAC_1: 1,
                             dato: $scope.domicilio.calle
                         });
                     }
                     if($scope.domicilio.numeroCalle) {
                         $scope.domicilio.valores.push({
                             ID_ADAC_1: 2,
                             dato: $scope.domicilio.numeroCalle
                         });
                     }
                     if($scope.domicilio.localidad) {
                         $scope.domicilio.valores.push({
                             ID_ADAC_1: 3,
                             dato: $scope.domicilio.localidad
                         });
                     }
                     if($scope.domicilio.provincia) {
                         $scope.domicilio.valores.push({
                             ID_ADAC_1: 4,
                             dato: $scope.domicilio.provincia
                         });
                     }
                     //domicilios de entrega corresponden al 1
                     focaModalDomicilioService
                         .obtenerUltimoPorNivelPadre(1)
                         .then(function(res) {
                             $scope.domicilio.nivel1 = 1;//domicilio de entrega corresponde 1
                             $scope.domicilio.nivel2 = res.data[0].ultimo + 1;
                             focaModalDomicilioService
                                 .guardarDomicilio($scope.domicilio)
                                 .then(function() {
                                     $scope.buscar();
                                     $scope.ingreso = false;
                                     $scope.domicilio = {};
                                 });
                     });
                 };
                 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.selectedDomicilio = 0;
                 }
                 function anterior() {
                     if ($scope.selectedDomicilio === 0 && $scope.currentPage > 1) {
                         retrocederPagina();
                     } else {
                         $scope.selectedDomicilio--;
                     }
                 }
                 function siguiente() {
                     if ($scope.selectedDomicilio < $scope.currentPageDomicilios.length ) {
                         $scope.selectedDomicilio++;
                     } else {
                             avanzarPagina();
                     }
                 }
                 function retrocederPagina() {
                     if ($scope.currentPage > 1) {
                         $scope.selectPage($scope.currentPage - 1);
                         $scope.selectedDomicilio = $scope.numPerPage - 1;
                     }
                 }
                 function avanzarPagina() {
                     if ($scope.currentPage < $scope.lastPage) {
                         $scope.selectPage($scope.currentPage + 1);
                         $scope.selectedDomicilio = 0;
                     }
                 }
             }
         ]
     );

src/views/modal-domicilio.html

Diff comments View file @ 3d8cb71

 <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 Domicilios</h5>
         </div>
         <div class="input-group col-lg-6 pr-0 my-2">
             <input
                 type="text"
                 class="form-control form-control-sm"
+                id="search"
                 placeholder="Búsqueda"
                 ng-model="filters"
                 ng-change="search()"
                 ng-keydown="busquedaDown($event.keyCode)"
                 ng-keypress="busquedaPress($event.keyCode)"
                 foca-focus="selectedDomicilio == -1"
                 ng-focus="selectedDomicilio = -1"
                 teclado-virtual
             >
             <div class="input-group-append">
                 <button
                     ladda="searchLoading"
                     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">
     <div ng-show="!primerBusqueda">
         Debe realizar una primer búsqueda.
     </div>
     <div ng-show="!ingreso">
         <table ng-show="!ingreso" class="table table-striped table-sm">
             <thead>
                 <tr>
                     <th>Titulo</th>
                     <th>Calle</th>
                     <th>Localidad</th>
                     <th>Provincia</th>
                     <th></th>
                 </tr>
             </thead>
             <tbody>
                 <tr ng-show="currentPageDomicilios.length == 0 && primerBusqueda">
                     <td colspan="5">
                         No se encontraron resultados.
                     </td>
                 </tr>
                 <tr>
                     <td colspan="4" ng-show="!ingreso">
                         <input
                             class="form-control form-control-sm"
                             type="text"
                             placeholder="Nuevo domicilio"
                             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': selectedDomicilio != 0,
                                 'btn-primary': selectedDomicilio == 0
                             }"
                             foca-focus="selectedDomicilio == 0"
                             ng-keydown="itemDomicilio($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,domicilio) in currentPageDomicilios"
                     ng-click="select(domicilio)">
                     <td ng-bind="domicilio.titulo"></td>
                     <td ng-bind="domicilio.Calle + ' ' + domicilio.Numero"></td>
                     <td ng-bind="domicilio.Localidad"></td>
                     <td ng-bind="domicilio.Provincia"></td>
                     <td>
                         <button
                             type="button"
                             class="btn btn-sm p-1 float-right"
                             ng-class="{
                                 'btn-secondary': selectedDomicilio != key + 1,
                                 'btn-primary': selectedDomicilio == key + 1
                             }"
                             foca-focus="selectedDomicilio == {{key + 1}}"
                             ng-keydown="itemDomicilio($event.keyCode)"
                         >
                             <i class="fa fa-circle-thin" aria-hidden="true"></i>
                         </button>
                     </td>
                 </tr>
             </tbody>
         </table>
     </div>
     <form name="formDomicilio" ng-show="ingreso">
         <div class="row">
             <div class="col-4">
                 <label>Tipo</label>
                 <select
                     class="form-control"
                     ng-disabled="true"
                     >
                     <option ng-value="2">Entrega</option>
                 </select>
             </div>
             <div class="col-8">
                 <label>Titulo</label>
                 <input
                     type="text"
                     foca-focus="ingreso"
                     class="form-control"
                     ng-model="domicilio.titulo"
                     placeholder="Ingrese título"
                     ng-required="true"
                     teclado-virtual
                 />
             </div>
             <div class="col-9">
                 <label>Calle</label>
                 <input
                     type="text"
                     class="form-control"
                     ng-model="domicilio.calle"
                     placeholder="Ingrese calle"
                     ng-required="true"
                 />
             </div>
             <div class="col-3">
                 <label>Nº</label>
                 <input
                     type="text"
                     class="form-control"
                     ng-model="domicilio.numeroCalle"
                     placeholder="Ingrese Numero"
                     ng-required="true"
                     teclado-virtual
                 />
             </div>
             <div class="col-6">
                 <label>Localidad</label>
                 <input
                     type="text"
                     class="form-control"
                     ng-model="domicilio.localidad"
                     placeholder="Ingrese localidad"
                     ng-required="true"
                     teclado-virtual
                 />
             </div>
             <div class="col-6">
                 <label>Provincia</label>
                 <input
                     type="text"
                     class="form-control"
                     ng-model="domicilio.provincia"
                     placeholder="Ingrese provincia"
                     ng-required="true"
                 />
             </div>
         </div>
     </form>
 </div>
 <div class="modal-footer">
     <nav ng-show="currentPageDomicilios.length > 0 && !ingreso" class="mr-auto">
         <ul class="pagination pagination-sm mb-0 justify-content-end">
             <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()"
     >Volver
     </button>
     <button
         ng-show="ingreso"
         class="btn btn-secondary btn-sm"
         type="button"
         ng-click="ingreso = !ingreso; domicilio = {}; contactos = [{}]"
     >Cancelar
     </button>
     <button
         ng-show="ingreso"
         class="btn btn-sm btn-primary"
         type="button"
         ng-click="agregarDomicilio()"
         ng-disabled="!formDomicilio.$valid"
     >Agregar domicilio
     </button>
 </div>