Eric Fernandez / foca-modal

Browse Code »

Commit 4ffd7bb17bf9a168428a85b5b09c8fe937d3b5aa

Authored by Eric Fernandez 2019-02-05 10:07:14 -0300

1 parent c5dae77bb8

Exists in master

foco apenas se abre el modal

Showing 2 changed files with 0 additions and 2 deletions Show diff stats

src/js/controllerModal.js

Diff comments View file @ 4ffd7bb

 angular.module('focaModal')
     .controller('focaModalController', [
         '$timeout',
         '$filter',
         '$scope',
         '$uibModalInstance',
         'focaModalService',
         'parametrosModal',
         function($timeout, $filter, $scope, $uibModalInstance, focaModalService, parametrosModal) {
             $scope.parametrosModal = parametrosModal;
             $scope.filters = '';
             $scope.entidades = [];
             $scope.primerBusqueda = false;
             $scope.searchLoading = false;
             // pagination
             $scope.numPerPage = 10;
             $scope.currentPage = 1;
             $scope.filteredEntidades = [];
             $scope.currentPageEntidades = [];
             $scope.selectedEntidad = -1;
             $scope.busquedaPress = function(key) {
                 if(key === 13) {
                     $scope.searchLoading = true;
                     focaModalService.getEntidad($scope.filters, parametrosModal.query).then(
                         function(res) {
                             $scope.searchLoading = false;
                             $scope.primerBusqueda = true;
                             $scope.entidades = res.data;
                             filtros($scope.entidades);
                             $scope.search(true);
-                            primera();
                         }
                     );
                 }
             };
             $scope.busquedaPress(13);
             function filtros(entidades) {
                 for (var i = 0; i < $scope.parametrosModal.columnas.length; i++) {
                     var filtro = $scope.parametrosModal.columnas[i].filtro;
                     if (filtro) {
                         for (var j = 0; j < entidades.length; j++) {
                             entidades[j][$scope.parametrosModal.columnas[i].propiedad] =
                                 $filter(filtro.nombre)(entidades[j][$scope
                                     .parametrosModal.columnas[i].propiedad], filtro.parametro);
                         }
                     }
                 }
             }
             $scope.search = function(pressed) {
                 if($scope.entidades.length > 0) {
                     $scope.filteredEntidades = $filter('filter')(
                         $scope.entidades, { $: $scope.filters }
                     );
                     $scope.lastPage = Math.ceil(
                         $scope.filteredEntidades.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.currentPageEntidades = $scope.filteredEntidades.slice(start, end);
                 $scope.currentPage = page;
             };
             $scope.select = function(vendedor) {
                 $uibModalInstance.close(vendedor);
             };
             $scope.cancel = function() {
                 $uibModalInstance.dismiss('cancel');
             };
             $scope.busquedaDown = function(key) {
                 if (key === 40) {
                     primera(key);
                 }
             };
             $scope.itemEntidad = function(key) {
                 if (key === 38) {
                     anterior(key);
                 }
                 if (key === 40) {
                     siguiente(key);
                 }
                 if (key === 37) {
                     retrocederPagina();
                 }
                 if (key === 39) {
                     avanzarPagina();
                 }
             };
             $scope.esFecha = function(fecha) {
                 if(fecha.includes('fecha')) {
                     return true;
                 }
                 return false;
             }
             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.selectedEntidad = 0;
             }
             function anterior() {
                 if($scope.selectedEntidad === 0 && $scope.currentPage > 1) {
                     retrocederPagina();
                 } else {
                     $scope.selectedEntidad--;
                 }
             }
             function siguiente() {
                 if($scope.selectedEntidad < $scope.currentPageEntidades.length - 1) {
                     $scope.selectedEntidad++;
                 } else {
                     avanzarPagina();
                 }
             }
             function retrocederPagina() {
                 if ($scope.currentPage > 1) {
                     $scope.selectPage($scope.currentPage - 1);
                     $scope.selectedEntidad = $scope.numPerPage - 1;
                 }
             }
             function avanzarPagina() {
                 if($scope.currentPage < $scope.lastPage) {
                     $scope.selectPage($scope.currentPage + 1);
                     $scope.selectedEntidad = 0;
                 }
             }
         }]
     );

src/views/foca-modal.html

Diff comments View file @ 4ffd7bb

 <div class="modal-header py-1">
     <div class="row w-100">
         <div ng-class="(parametrosModal.size == 'md') ? 'col-lg-12' : 'col-lg-6'">
             <h5 class="modal-title my-1">{{parametrosModal.titulo}}</h5>
             <small ng-if="parametrosModal.subTitulo">{{parametrosModal.subTitulo}}</small>
         </div>
         <div class="input-group pr-0 my-2" ng-class="(parametrosModal.size == 'md') ? 'col-lg-12' : 'col-lg-6'">
             <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="selectedEntidad == -1"
                 ng-focus="selectedEntidad = -1"
                 teclado-virtual
             >
             <div class="input-group-append">
                 <button
                     ladda="searchLoading"
                     data-spinner-color="#FF0000"
                     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>
     <table ng-show="primerBusqueda" class="table table-striped table-sm col-12">
         <thead>
             <tr>
                 <th ng-repeat="columna in parametrosModal.columnas" ng-bind="columna.nombre"></th>
                 <th></th>
             </tr>
         </thead>
         <tbody>
             <tr ng-show="currentPageEntidades.length == 0 && primerBusqueda">
                 <td colspan="3">
                     No se encontraron resultados.
                 </td>
             </tr>
             <tr class="selected"
                 ng-repeat="(key, entidad) in currentPageEntidades"
                 ng-click="select(entidad)"
                 >
                 <td
                     ng-repeat="columna in parametrosModal.columnas"
                     ng-bind="entidad[columna.propiedad]"></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"
                         ng-class="{
                             'btn-secondary': selectedEntidad != key,
                             'btn-primary': selectedEntidad == key
                         }"
                         foca-focus="selectedEntidad == {{key}}"
                         ng-keydown="itemEntidad($event.keyCode)">
                         <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="currentPageEntidades.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()">Cancelar</button>
 </div>