Eric Fernandez / foca-modal-busqueda-productos

Download as
Browse Code »

Commit 1bf2409e3a752ba66dd26b68ec57a2305344b945

Authored by Eric Fernandez
1 parent 09f1f19617
Exists in master

buscador en header, paginacion en footer, cambio icons, focus input cuando no hay resultados

Showing 3 changed files with 56 additions and 39 deletions   Show diff stats
... ... @@ -7,14 +7,14 @@
7 7 "gulp-pre-commit": "gulp pre-commit",
8 8 "compile": "gulp uglify",
9 9 "postinstall": "npm run compile && gulp clean-post-install",
10   - "install-dev": "npm install -D angular angular-ladda ladda@1.0.6 bootstrap font-awesome gulp gulp-angular-templatecache gulp-concat gulp-connect gulp-htmlmin gulp-jshint gulp-rename gulp-replace gulp-uglify gulp-clean jasmine-core jquery jshint pre-commit pump ui-bootstrap4 && npm i -D git+https://debo.suite.repo/modulos-npm/foca-directivas"
  10 + "install-dev": "npm install -D angular angular-ladda ladda@1.0.6 bootstrap font-awesome gulp gulp-angular-templatecache gulp-concat gulp-connect gulp-htmlmin gulp-jshint gulp-rename gulp-replace gulp-uglify gulp-clean jasmine-core jquery jshint pre-commit pump ui-bootstrap4 && npm i -D git+http://git.focasoftware.com/npm/foca-directivas"
11 11 },
12 12 "pre-commit": [
13 13 "gulp-pre-commit"
14 14 ],
15 15 "repository": {
16 16 "type": "git",
17   - "url": "https://debo.suite.repo/modulos-npm/foca-modal-busqueda-productos"
  17 + "url": "http://git.focasoftware.com/npm/foca-modal-busqueda-productos"
18 18 },
19 19 "author": "Nicolás Guarnieri",
20 20 "license": "ISC",
... ... @@ -33,13 +33,13 @@
33 33 "gulp-uglify": "^3.0.1",
34 34 "jquery": "^3.3.1",
35 35 "pump": "^3.0.0",
36   - "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas"
  36 + "foca-directivas": "git+http://git.focasoftware.com/npm/foca-directivas"
37 37 },
38 38 "devDependencies": {
39 39 "angular": "^1.7.5",
40 40 "angular-ladda": "^0.4.3",
41 41 "bootstrap": "^4.1.3",
42   - "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas",
  42 + "foca-directivas": "git+http://git.focasoftware.com/npm/foca-directivas",
43 43 "font-awesome": "^4.7.0",
44 44 "gulp": "^3.9.1",
45 45 "gulp-angular-templatecache": "^2.2.3",
src/js/controller.js
Diff comments   View file @ 1bf2409
1 1 angular.module('focaBusquedaProductos')
2 2 .controller('modalBusquedaProductosCtrl',
3 3 [
  4 + '$timeout',
4 5 '$filter',
5 6 '$scope',
6 7 '$uibModalInstance',
7 8 'parametroProducto',
8 9 'focaBusquedaProductosService',
9   - function($filter, $scope, $uibModalInstance, parametroProducto,
  10 + function($timeout, $filter, $scope, $uibModalInstance, parametroProducto,
10 11 focaBusquedaProductosService
11 12 ) {
12 13  
... ... @@ -43,10 +44,10 @@ angular.module('focaBusquedaProductos')
43 44 $scope.searchLoading = false;
44 45 $scope.primerBusqueda = true;
45 46 $scope.productos = res.data;
46   - $scope.search();
  47 + $scope.search(true);
47 48 primera();
48 49 }
49   - $scope.search = function() {
  50 + $scope.search = function(pressed) {
50 51 if($scope.productos.length > 0) {
51 52 $scope.filteredProductos = $filter('filter')(
52 53 $scope.productos,
... ... @@ -58,6 +59,11 @@ angular.module('focaBusquedaProductos')
58 59 );
59 60  
60 61 $scope.resetPage();
  62 + }else if(pressed){
  63 + $timeout(function() {
  64 + angular.element('#search')[0].focus();
  65 + $scope.filters = '';
  66 + });
61 67 }
62 68 };
63 69  
src/views/modal-busqueda-productos.html
Diff comments   View file @ 1bf2409
1   -<div class="modal-header">
2   - <h5 class="modal-title my-1">Busqueda de Productos</h5>
  1 +<div class="modal-header py-1">
  2 + <div class="row w-100">
  3 + <div class="col-lg-6">
  4 + <h5 class="modal-title my-1">Busqueda de Productos</h5>
  5 + </div>
  6 + <div class="input-group col-lg-6 pr-0 my-2">
  7 + <input
  8 + ladda="searchLoading"
  9 + type="text"
  10 + class="form-control"
  11 + id="search"
  12 + placeholder="Busqueda"
  13 + ng-model="filters"
  14 + ng-change="search()"
  15 + ng-keydown="busquedaDown($event.keyCode)"
  16 + ng-keypress="busquedaPress($event.keyCode)"
  17 + foca-focus="selectedProducto == -1"
  18 + ng-focus="selectedProducto = -1"
  19 + teclado-virtual
  20 + >
  21 + <div class="input-group-append">
  22 + <button
  23 + ladda="searchLoading"
  24 + class="btn btn-outline-secondary"
  25 + type="button"
  26 + ng-click="busquedaPress(13)"
  27 + >
  28 + <i class="fa fa-search" aria-hidden="true"></i>
  29 + </button>
  30 + </div>
  31 + </div>
  32 + </div>
3 33 </div>
4 34 <div class="modal-body" id="modal-body">
5   - <div class="input-group">
6   - <input
7   - ladda="searchLoading"
8   - type="text"
9   - class="form-control"
10   - placeholder="Busqueda"
11   - ng-model="filters"
12   - ng-change="search()"
13   - ng-keydown="busquedaDown($event.keyCode)"
14   - ng-keypress="busquedaPress($event.keyCode)"
15   - foca-focus="selectedProducto == -1"
16   - ng-focus="selectedProducto = -1"
17   - teclado-virtual
18   - >
19   - <div class="input-group-append">
20   - <button
21   - ladda="searchLoading"
22   - class="btn btn-outline-secondary"
23   - type="button"
24   - ng-click="busquedaPress(13)"
25   - >
26   - <i class="fa fa-search" aria-hidden="true"></i>
27   - </button>
28   - </div>
  35 +
  36 + <div ng-show="!primerBusqueda">
  37 + Debe realizar una primer búsqueda.
29 38 </div>
  39 +
30 40 <table ng-show="primerBusqueda" class="table table-striped table-sm">
31 41 <thead>
32 42 <tr>
... ... @@ -47,9 +57,9 @@
47 57 ng-click="select(producto)">
48 58 <td ng-bind="producto.sector + '-' + producto.codigo"></td>
49 59 <td ng-bind="producto.descripcion"></td>
50   - <td class="text-right" ng-bind="producto.precio | currency: simbolo : 4"></td>
  60 + <td class="text-right" ng-bind="producto.precio | currency: simbolo : 2"></td>
51 61 <td class="d-md-none text-primary">
52   - <i class="fa fa-arrow-right" aria-hidden="true"></i>
  62 + <i class="fa fa-circle-thin" aria-hidden="true"></i>
53 63 </td>
54 64 <td class="d-none d-md-table-cell">
55 65 <button
... ... @@ -61,13 +71,16 @@
61 71 }"
62 72 foca-focus="selectedProducto == {{key}}"
63 73 ng-keydown="itemProducto($event.keyCode)">
64   - <i class="fa fa-arrow-right" aria-hidden="true"></i>
  74 + <i class="fa fa-circle-thin" aria-hidden="true"></i>
65 75 </button>
66 76 </td>
67 77 </tr>
68 78 </tbody>
69 79 </table>
70   - <nav ng-show="currentPageProductos.length > 0 && primerBusqueda">
  80 +
  81 +</div>
  82 +<div class="modal-footer py-1">
  83 + <nav ng-show="currentPageProductos.length > 0 && primerBusqueda" class="mr-auto">
71 84 <ul class="pagination pagination-sm justify-content mb-0">
72 85 <li class="page-item" ng-class="{'disabled': currentPage == 1}">
73 86 <a class="page-link" href="javascript:void();" ng-click="selectPage(currentPage - 1)">
... ... @@ -95,7 +108,5 @@
95 108 </li>
96 109 </ul>
97 110 </nav>
98   -</div>
99   -<div class="modal-footer">
100 111 <button class="btn btn-sm btn-secondary my-1" type="button" ng-click="cancel()">Cancelar</button>
101 112 </div>