Nicolás Guarnieri / foca-modal-busqueda-productos

Download as
Browse Code »

Commit 00fbea86ea5ae847609b0c1b3b1b13fded5433a8

Authored by Eric Fernandez
1 parent d0c69fa0c8
Exists in master

code review

Showing 2 changed files with 17 additions and 26 deletions   Show diff stats
1 <html ng-app="focaBusquedaProductos"> 1 <html ng-app="focaBusquedaProductos">
2 <head> 2 <head>
3 <meta charset="UTF-8"/> 3 <meta charset="UTF-8"/>
4 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 4 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
5 5
6 <!--CSS--> 6 <!--CSS-->
7 <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/> 7 <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
8 <link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"/> 8 <link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>
9 <link href="node_modules/ladda/dist/ladda-themeless.min.css" rel="stylesheet"> 9 <link href="node_modules/ladda/dist/ladda-themeless.min.css" rel="stylesheet">
10 10
11 <!--VENDOR JS--> 11 <!--VENDOR JS-->
12 <script src="node_modules/jquery/dist/jquery.min.js"></script> 12 <script src="node_modules/jquery/dist/jquery.min.js"></script>
13 <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script> 13 <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
14 <script src="node_modules/angular/angular.min.js"></script> 14 <script src="node_modules/angular/angular.min.js"></script>
15 <script src="node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script> 15 <script src="node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script>
16 <script src="node_modules/foca-directivas/dist/foca-directivas.min.js"></script> 16 <script src="node_modules/foca-directivas/dist/foca-directivas.min.js"></script>
17 <script src="node_modules/ladda/dist/spin.min.js"></script> 17 <script src="node_modules/ladda/dist/spin.min.js"></script>
18 <script src="node_modules/ladda/dist/ladda.min.js"></script> 18 <script src="node_modules/ladda/dist/ladda.min.js"></script>
19 <script src="node_modules/angular-ladda/dist/angular-ladda.min.js"></script> 19 <script src="node_modules/angular-ladda/dist/angular-ladda.min.js"></script>
20 20
21 <!-- BUILD --> 21 <!-- BUILD -->
22 <script src="src/js/app.js"></script> 22 <script src="src/js/app.js"></script>
23 <script src="src/js/controller.js"></script> 23 <script src="src/js/controller.js"></script>
24 <script src="src/js/service.js"></script> 24 <script src="src/js/service.js"></script>
25 25
26 <!-- /BUILD --> 26 <!-- /BUILD -->
27 27
28 <!-- CONFIG PARA DEVELOP --> 28 <!-- CONFIG PARA DEVELOP -->
29 <script src="src/etc/develop.js"></script> 29 <script src="src/etc/develop.js"></script>
30 <script type="text/javascript"> 30 <script type="text/javascript">
31 angular.module('focaBusquedaProductos') 31 angular.module('focaBusquedaProductos')
32 .controller('controller', [ 32 .controller('controller', [
33 '$scope', 33 '$scope',
34 '$uibModal', 34 '$uibModal',
35 '$timeout', 35 '$timeout',
36 function($scope, $uibModal, $timeout) { 36 function($scope, $uibModal, $timeout) {
37 openModal(); 37 openModal();
38 38
39 function openModal() { 39 function openModal() {
40 var modalInstance = $uibModal.open( 40 var modalInstance = $uibModal.open(
41 { 41 {
42 ariaLabelledBy: 'Busqueda de Productos', 42 ariaLabelledBy: 'Busqueda de Productos',
43 templateUrl: 'src/views/modal-busqueda-productos.html', 43 templateUrl: 'src/views/modal-busqueda-productos.html',
44 controller: 'modalBusquedaProductosCtrl', 44 controller: 'modalBusquedaProductosCtrl',
45 size: 'lg', 45 size: 'lg',
46 resolve: {idLista : function() { return -1; }, cotizacion: 1} 46 resolve: {
47 idLista : function() { return -1; },
48 cotizacion: function() { return 1;}
49 }
47 } 50 }
48 ); 51 );
49 52
50 modalInstance.result.then( 53 modalInstance.result.then(
51 function (selectedItem) { 54 function (selectedItem) {
52 console.info(selectedItem); 55 console.info(selectedItem);
53 $timeout(openModal, 500); 56 $timeout(openModal, 500);
54 }, function () { 57 }, function () {
55 console.info('modal-component dismissed at: ' + new Date()); 58 console.info('modal-component dismissed at: ' + new Date());
56 $timeout(openModal, 500); 59 $timeout(openModal, 500);
57 } 60 }
58 ); 61 );
59 } 62 }
60 } 63 }
61 ]); 64 ]);
62 </script> 65 </script>
63 </head> 66 </head>
64 <body ng-controller="controller"> 67 <body ng-controller="controller">
65 </body> 68 </body>
66 </html> 69 </html>
67 70
src/js/controller.js
Diff comments   View file @ 00fbea8
1 angular.module('focaBusquedaProductos') 1 angular.module('focaBusquedaProductos')
2 .controller('modalBusquedaProductosCtrl', 2 .controller('modalBusquedaProductosCtrl',
3 [ 3 [
4 '$filter', 4 '$filter',
5 '$scope', 5 '$scope',
6 '$uibModalInstance', 6 '$uibModalInstance',
7 'idLista', 7 'idLista',
8 'cotizacion', 8 'cotizacion',
9 'focaBusquedaProductosService', 9 'focaBusquedaProductosService',
10 function($filter, $scope, $uibModalInstance, idLista, 10 function($filter, $scope, $uibModalInstance, idLista,
11 cotizacion, focaBusquedaProductosService 11 cotizacion, focaBusquedaProductosService
12 ) { 12 ) {
13 13
14 $scope.filters = ''; 14 $scope.filters = '';
15 $scope.productos = []; 15 $scope.productos = [];
16 $scope.primerBusqueda = false; 16 $scope.primerBusqueda = false;
17 $scope.searchLoading = false; 17 $scope.searchLoading = false;
18 // pagination 18 // pagination
19 $scope.numPerPage = 10; 19 $scope.numPerPage = 10;
20 $scope.currentPage = 1; 20 $scope.currentPage = 1;
21 $scope.filteredProductos = []; 21 $scope.filteredProductos = [];
22 $scope.currentPageProductos = []; 22 $scope.currentPageProductos = [];
23 $scope.selectedProducto = -1; 23 $scope.selectedProducto = -1;
24 24
25 //METODOS 25 //METODOS
26 $scope.busquedaPress = function(key) { 26 $scope.busquedaPress = function(key) {
27 if (key === 13) { 27 if (key === 13) {
28 $scope.searchLoading = true; 28 $scope.searchLoading = true;
29 if(idLista > 0) { 29 if(idLista > 0) {
30 focaBusquedaProductosService 30 focaBusquedaProductosService
31 .getProductosByIdLista(idLista, $scope.filters) 31 .getProductosByIdLista(idLista, $scope.filters)
32 .then( 32 .then(llenarDatos);
33 function(res) {
34 for(var i = 0; i < res.data.length; i++) {
35 res.data[i].precio = res.data[i].precio / cotizacion;
36 }
37 $scope.searchLoading = false;
38 $scope.primerBusqueda = true;
39 $scope.productos = res.data;
40 $scope.search();
41 primera();
42 }
43 );
44 } else if(idLista === -1) { 33 } else if(idLista === -1) {
45 focaBusquedaProductosService.getProductos().then( 34 focaBusquedaProductosService.getProductos()
46 function(res) { 35 .then(llenarDatos);
47 for(var i = 0; i < res.data.length; i++) {
48 res.data[i].precio = res.data[i].precio / cotizacion;
49 }
50 $scope.searchLoading = false;
51 $scope.primerBusqueda = true;
52 $scope.productos = res.data;
53 $scope.search();
54 primera();
55 }
56 );
57 } 36 }
58 } 37 }
59 }; 38 };
60 39 function llenarDatos(res) {
40 for(var i = 0; i < res.data.length; i++) {
41 res.data[i].precio = res.data[i].precio / cotizacion;
42 }
43 $scope.searchLoading = false;
44 $scope.primerBusqueda = true;
45 $scope.productos = res.data;
46 $scope.search();
47 primera();
48 }
61 $scope.search = function() { 49 $scope.search = function() {
62 if($scope.productos.length > 0) { 50 if($scope.productos.length > 0) {
63 $scope.filteredProductos = $filter('filter')( 51 $scope.filteredProductos = $filter('filter')(
64 $scope.productos, 52 $scope.productos,
65 {$: $scope.filters} 53 {$: $scope.filters}
66 ); 54 );
67 55
68 $scope.lastPage = Math.ceil( 56 $scope.lastPage = Math.ceil(
69 $scope.filteredProductos.length / $scope.numPerPage 57 $scope.filteredProductos.length / $scope.numPerPage
70 ); 58 );
71 59
72 $scope.resetPage(); 60 $scope.resetPage();
73 } 61 }
74 }; 62 };
75 63
76 $scope.resetPage = function() { 64 $scope.resetPage = function() {
77 $scope.currentPage = 1; 65 $scope.currentPage = 1;
78 $scope.selectPage(1); 66 $scope.selectPage(1);
79 }; 67 };
80 68
81 $scope.selectPage = function(page) { 69 $scope.selectPage = function(page) {
82 var start = (page - 1) * $scope.numPerPage; 70 var start = (page - 1) * $scope.numPerPage;
83 var end = start + $scope.numPerPage; 71 var end = start + $scope.numPerPage;
84 $scope.paginas = []; 72 $scope.paginas = [];
85 $scope.paginas = calcularPages(page); 73 $scope.paginas = calcularPages(page);
86 $scope.currentPageProductos = $scope.filteredProductos.slice(start, end); 74 $scope.currentPageProductos = $scope.filteredProductos.slice(start, end);
87 $scope.currentPage = page; 75 $scope.currentPage = page;
88 }; 76 };
89 77
90 $scope.select = function(producto) { 78 $scope.select = function(producto) {
91 $uibModalInstance.close(producto); 79 $uibModalInstance.close(producto);
92 }; 80 };
93 81
94 $scope.cancel = function() { 82 $scope.cancel = function() {
95 $uibModalInstance.dismiss('cancel'); 83 $uibModalInstance.dismiss('cancel');
96 }; 84 };
97 85
98 $scope.busquedaDown = function(key) { 86 $scope.busquedaDown = function(key) {
99 if (key === 40) { 87 if (key === 40) {
100 primera(key); 88 primera(key);
101 } 89 }
102 }; 90 };
103 91
104 $scope.itemProducto = function(key) { 92 $scope.itemProducto = function(key) {
105 if (key === 38) { 93 if (key === 38) {
106 anterior(key); 94 anterior(key);
107 } 95 }
108 96
109 if (key === 40) { 97 if (key === 40) {
110 siguiente(key); 98 siguiente(key);
111 } 99 }
112 100
113 if (key === 37) { 101 if (key === 37) {
114 retrocederPagina(); 102 retrocederPagina();
115 } 103 }
116 104
117 if (key === 39) { 105 if (key === 39) {
118 avanzarPagina(); 106 avanzarPagina();
119 } 107 }
120 }; 108 };
121 109
122 function calcularPages(paginaActual) { 110 function calcularPages(paginaActual) {
123 var paginas = []; 111 var paginas = [];
124 paginas.push(paginaActual); 112 paginas.push(paginaActual);
125 113
126 if (paginaActual - 1 > 1) { 114 if (paginaActual - 1 > 1) {
127 115
128 paginas.unshift(paginaActual - 1); 116 paginas.unshift(paginaActual - 1);
129 if (paginaActual - 2 > 1) { 117 if (paginaActual - 2 > 1) {
130 paginas.unshift(paginaActual - 2); 118 paginas.unshift(paginaActual - 2);
131 } 119 }
132 } 120 }
133 121
134 if (paginaActual + 1 < $scope.lastPage) { 122 if (paginaActual + 1 < $scope.lastPage) {
135 paginas.push(paginaActual + 1); 123 paginas.push(paginaActual + 1);
136 if (paginaActual + 2 < $scope.lastPage) { 124 if (paginaActual + 2 < $scope.lastPage) {
137 paginas.push(paginaActual + 2); 125 paginas.push(paginaActual + 2);
138 } 126 }
139 } 127 }
140 128
141 if (paginaActual !== 1) { 129 if (paginaActual !== 1) {
142 paginas.unshift(1); 130 paginas.unshift(1);
143 } 131 }
144 132
145 if (paginaActual !== $scope.lastPage) { 133 if (paginaActual !== $scope.lastPage) {
146 paginas.push($scope.lastPage); 134 paginas.push($scope.lastPage);
147 } 135 }
148 136
149 return paginas; 137 return paginas;
150 } 138 }
151 139
152 function primera() { 140 function primera() {
153 $scope.selectedProducto = 0; 141 $scope.selectedProducto = 0;
154 } 142 }
155 143
156 function anterior() { 144 function anterior() {
157 if ($scope.selectedProducto === 0 && $scope.currentPage > 1) { 145 if ($scope.selectedProducto === 0 && $scope.currentPage > 1) {
158 retrocederPagina(); 146 retrocederPagina();
159 } else { 147 } else {
160 $scope.selectedProducto--; 148 $scope.selectedProducto--;
161 } 149 }
162 } 150 }
163 151
164 function siguiente() { 152 function siguiente() {
165 if ($scope.selectedProducto < $scope.currentPageProductos.length - 1 ) { 153 if ($scope.selectedProducto < $scope.currentPageProductos.length - 1 ) {
166 $scope.selectedProducto++; 154 $scope.selectedProducto++;
167 } else { 155 } else {
168 avanzarPagina(); 156 avanzarPagina();
169 } 157 }
170 } 158 }
171 159
172 function retrocederPagina() { 160 function retrocederPagina() {
173 if ($scope.currentPage > 1) { 161 if ($scope.currentPage > 1) {
174 $scope.selectPage($scope.currentPage - 1); 162 $scope.selectPage($scope.currentPage - 1);
175 $scope.selectedProducto = $scope.numPerPage - 1; 163 $scope.selectedProducto = $scope.numPerPage - 1;
176 } 164 }
177 } 165 }
178 166
179 function avanzarPagina() { 167 function avanzarPagina() {