Marcelo Puebla / foca-modal-busqueda-productos

Commit e430dcddd3105c954ef4631fd81ed334c8897cad

Authored by Eric Fernandez 2019-06-05 16:35:59 -0300

Exists in master

Merge branch 'master' into 'develop'

Master(mpuebla)

See merge request !6

Showing 4 changed files Show diff stats

package.json

Diff comments View file @ e430dcd

 {
   "name": "foca-modal-busqueda-productos",
   "version": "0.0.1",
   "description": "Modal para seleccion de productos",
   "scripts": {
+    "refresh": "gulp uglify && cp tmp/foca-busqueda-productos.js ../wrapper-demo/node_modules/foca-modal-busqueda-productos/dist/foca-busqueda-productos.min.js",
     "test": "echo \"Error: no test specified\" && exit 1",
     "gulp-pre-commit": "gulp pre-commit",
     "compile": "gulp uglify",
     "postinstall": "npm run compile && gulp clean-post-install",
     "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.git"
   },
   "pre-commit": [
     "gulp-pre-commit"
   ],
   "repository": {
     "type": "git",
     "url": "http://git.focasoftware.com/npm/foca-modal-busqueda-productos"
   },
   "author": "Nicolás Guarnieri",
   "license": "ISC",
   "peerDependencies": {
     "angular": "^1.7.4",
     "bootstrap": "^4.1.3",
     "font-awesome": "^4.7.0",
     "ui-bootstrap4": "^3.0.4",
     "gulp": "^3.9.1",
     "gulp-angular-templatecache": "^2.2.1",
     "gulp-concat": "^2.6.1",
     "gulp-connect": "^5.6.1",
     "gulp-htmlmin": "^5.0.1",
     "gulp-rename": "^1.4.0",
     "gulp-replace": "^1.0.0",
     "gulp-uglify": "^3.0.1",
     "jquery": "^3.3.1",
     "pump": "^3.0.0",
     "foca-directivas": "git+http://git.focasoftware.com/npm/foca-directivas.git"
   },
   "devDependencies": {
     "angular": "^1.7.5",
     "angular-ladda": "^0.4.3",
     "bootstrap": "^4.1.3",
     "foca-directivas": "git+http://git.focasoftware.com/npm/foca-directivas.git",
     "font-awesome": "^4.7.0",
     "gulp": "^3.9.1",
     "gulp-angular-templatecache": "^2.2.3",
     "gulp-clean": "^0.4.0",
     "gulp-concat": "^2.6.1",
     "gulp-connect": "^5.6.1",
     "gulp-htmlmin": "^5.0.1",
     "gulp-jshint": "^2.1.0",
     "gulp-rename": "^1.4.0",
     "gulp-replace": "^1.0.0",
     "gulp-uglify": "^3.0.1",
     "jasmine-core": "^3.3.0",
     "jquery": "^3.3.1",
     "jshint": "^2.9.6",
     "ladda": "1.0.6",
     "pre-commit": "^1.2.2",
     "pump": "^3.0.0",
     "ui-bootstrap4": "^3.0.5"
   }
 }

src/js/controller.js

Diff comments View file @ e430dcd

1	angular.module('focaBusquedaProductos')	1	angular.module('focaBusquedaProductos')
2	.controller('modalBusquedaProductosCtrl',	2	.controller('modalBusquedaProductosCtrl',
3	[	3	[
4	'$timeout',	4	'$timeout',
5	'$filter',	5	'$filter',
6	'$scope',	6	'$scope',
7	'$uibModalInstance',	7	'$uibModalInstance',
8	'parametroProducto',	8	'parametroProducto',
9	'focaBusquedaProductosService',	9	'focaBusquedaProductosService',
10	function($timeout, $filter, $scope, $uibModalInstance, parametroProducto,	10	function ($timeout, $filter, $scope, $uibModalInstance, parametroProducto,
11	focaBusquedaProductosService	11	focaBusquedaProductosService
12	) {	12	) {
13		13
14	$scope.simbolo = parametroProducto.simbolo;	14	$scope.simbolo = parametroProducto.simbolo;
15	$scope.filters = '';	15	$scope.filters = '';
16	$scope.productos = [];	16	$scope.listaProductos = [];
		17	$scope.todosProductos = [];
17	$scope.primerBusqueda = false;	18	$scope.primerBusqueda = false;
18	$scope.searchLoading = false;	19	$scope.searchLoading = false;
19	// pagination	20	$scope.soloMostrar = parametroProducto.soloMostrar;
		21	$scope.useAllProducts = false;
		22	//#region pagination variables
20	$scope.numPerPage = 10;	23	$scope.numPerPage = 10;
21	$scope.currentPage = 1;	24	$scope.currentPage = 1;
22	$scope.filteredProductos = [];	25	$scope.filteredProductos = [];
23	$scope.currentPageProductos = [];	26	$scope.currentPageProductos = [];
24	$scope.selectedProducto = -1;	27	$scope.selectedProducto = -1;
		28	//#endregion
25		29
26	$scope.soloMostrar = parametroProducto.soloMostrar;
27
28	//METODOS	30	//METODOS
29	$scope.busquedaPress = function(key) {	31	$scope.busquedaPress = function (key) {
30	if (key === 13) {	32	if (key === 13) {
31	$scope.searchLoading = true;	33	$scope.searchLoading = true;
32	if(parametroProducto.idLista > 0) {	34	if (parametroProducto.idLista > 0) {
33	focaBusquedaProductosService	35	focaBusquedaProductosService
34	.getProductosByIdLista(parametroProducto.idLista, $scope.filters)	36	.getProductosByIdLista(parametroProducto.idLista, $scope.filters)
35	.then(llenarDatos);	37	.then(llenarDatos);
36	} else if(parametroProducto.idLista === -1) {
37	focaBusquedaProductosService.getProductos()	38	focaBusquedaProductosService.getProductos()
38	.then(llenarDatos);	39	.then(fillAllProductos);
39	}	40	}
40	}	41	}
41	};	42	};
42	function llenarDatos(res) {	43	function llenarDatos(res) {
43	for(var i = 0; i < res.data.length; i++) {	44	for (var i = 0; i < res.data.length; i++) {
44	res.data[i].precio = res.data[i].precio / parametroProducto.cotizacion;	45	res.data[i].precio = res.data[i].precio / parametroProducto.cotizacion;
		46	}
		47	$scope.searchLoading = false;
		48	$scope.primerBusqueda = true;
		49	$scope.listaProductos = res.data;
		50	$scope.search(true);
		51	primera();
		52	};
		53	function fillAllProductos(res) {
		54	for (var i = 0; i < res.data.length; i++) {
		55	res.data[i].precio = res.data[i].precio / parametroProducto.cotizacion;
45	}	56	}
46	$scope.searchLoading = false;	57	$scope.searchLoading = false;
47	$scope.primerBusqueda = true;	58	$scope.primerBusqueda = true;
48	$scope.productos = res.data;	59	$scope.todosProductos = res.data;
49	$scope.search(true);	60	$scope.search(true);
50	primera();	61	primera();
51	}	62	};
52	$scope.search = function(pressed) {	63	$scope.changeProductsData = function () {
53	if($scope.productos.length > 0) {	64	$scope.useAllProducts = !$scope.useAllProducts;
		65	$scope.search(false);
		66	primera();
		67	};
		68	$scope.search = function (pressed) {
		69	if ($scope.listaProductos.length > 0) {
54	$scope.filteredProductos = $filter('filter')(	70	$scope.filteredProductos = $filter('filter')(
55	$scope.productos,	71	($scope.useAllProducts ? $scope.todosProductos : $scope.listaProductos),
56	{$: $scope.filters}	72	{ $: $scope.filters }
57	);	73	);
58		74
59	$scope.lastPage = Math.ceil(	75	$scope.lastPage = Math.ceil(
60	$scope.filteredProductos.length / $scope.numPerPage	76	$scope.filteredProductos.length / $scope.numPerPage
61	);	77	);
62		78
63	$scope.resetPage();	79	$scope.resetPage();
64	}else if(pressed) {	80	} else if (pressed) {
65	$timeout(function() {	81	$timeout(function () {
66	angular.element('#search')[0].focus();	82	angular.element('#search')[0].focus();
67	$scope.filters = '';	83	$scope.filters = '';
68	});	84	});
69	}	85	}
70	};	86	};
71		87	$scope.resetPage = function () {
72	$scope.resetPage = function() {
73	$scope.currentPage = 1;	88	$scope.currentPage = 1;
74	$scope.selectPage(1);	89	$scope.selectPage(1);
75	};	90	};
76		91	$scope.selectPage = function (page) {
77	$scope.selectPage = function(page) {
78	var start = (page - 1) * $scope.numPerPage;	92	var start = (page - 1) * $scope.numPerPage;
79	var end = start + $scope.numPerPage;	93	var end = start + $scope.numPerPage;
80	$scope.paginas = [];	94	$scope.paginas = [];
81	$scope.paginas = calcularPages(page);	95	$scope.paginas = calcularPages(page);
82	$scope.currentPageProductos = $scope.filteredProductos.slice(start, end);	96	$scope.currentPageProductos = $scope.filteredProductos.slice(start, end);
83	$scope.currentPage = page;	97	$scope.currentPage = page;
84	};	98	};
85		99	$scope.select = function (producto) {
86	$scope.select = function(producto) {	100	// if ($scope.useAllProducts)
		101	// producto.precio = producto.precioBase;
87	$uibModalInstance.close(producto);	102	$uibModalInstance.close(producto);
88	};	103	};
89		104	$scope.cancel = function () {
90	$scope.cancel = function() {
91	$uibModalInstance.dismiss('cancel');	105	$uibModalInstance.dismiss('cancel');
92	};	106	};
93		107	$scope.busquedaDown = function (key) {
94	$scope.busquedaDown = function(key) {
95	if (key === 40) {	108	if (key === 40) {
96	primera(key);	109	primera(key);
97	}	110	}
98	};	111	};
99		112	$scope.itemProducto = function (key) {
100	$scope.itemProducto = function(key) {
101	if (key === 38) {	113	if (key === 38) {
102	anterior(key);	114	anterior(key);
103	}	115	}
104		116
105	if (key === 40) {	117	if (key === 40) {
106	siguiente(key);	118	siguiente(key);
107	}	119	}
108		120
109	if (key === 37) {	121	if (key === 37) {
110	retrocederPagina();	122	retrocederPagina();
111	}	123	}
112		124
113	if (key === 39) {	125	if (key === 39) {
114	avanzarPagina();	126	avanzarPagina();
115	}	127	}
116	};	128	};
117		129
		130	//#region Paginador
118	function calcularPages(paginaActual) {	131	function calcularPages(paginaActual) {
119	var paginas = [];	132	var paginas = [];
120	paginas.push(paginaActual);	133	paginas.push(paginaActual);
121		134
122	if (paginaActual - 1 > 1) {	135	if (paginaActual - 1 > 1) {
123		136
124	paginas.unshift(paginaActual - 1);	137	paginas.unshift(paginaActual - 1);
125	if (paginaActual - 2 > 1) {	138	if (paginaActual - 2 > 1) {
126	paginas.unshift(paginaActual - 2);	139	paginas.unshift(paginaActual - 2);
127	}	140	}
128	}	141	}
129		142
130	if (paginaActual + 1 < $scope.lastPage) {	143	if (paginaActual + 1 < $scope.lastPage) {
131	paginas.push(paginaActual + 1);	144	paginas.push(paginaActual + 1);
132	if (paginaActual + 2 < $scope.lastPage) {	145	if (paginaActual + 2 < $scope.lastPage) {
133	paginas.push(paginaActual + 2);	146	paginas.push(paginaActual + 2);
134	}	147	}
135	}	148	}
136		149
137	if (paginaActual !== 1) {	150	if (paginaActual !== 1) {
138	paginas.unshift(1);	151	paginas.unshift(1);
139	}	152	}
140		153
141	if (paginaActual !== $scope.lastPage) {	154	if (paginaActual !== $scope.lastPage) {
142	paginas.push($scope.lastPage);	155	paginas.push($scope.lastPage);
143	}	156	}
144		157
145	return paginas;	158	return paginas;
146	}	159	};
147
148	function primera() {	160	function primera() {
149	$scope.selectedProducto = 0;	161	$scope.selectedProducto = 0;
150	}	162	};
151
152	function anterior() {	163	function anterior() {
153	if ($scope.selectedProducto === 0 && $scope.currentPage > 1) {	164	if ($scope.selectedProducto === 0 && $scope.currentPage > 1) {
154	retrocederPagina();	165	retrocederPagina();
155	} else {	166	} else {
156	$scope.selectedProducto--;	167	$scope.selectedProducto--;
157	}	168	}
158	}	169	};
159
160	function siguiente() {	170	function siguiente() {
161	if ($scope.selectedProducto < $scope.currentPageProductos.length - 1 ) {	171	if ($scope.selectedProducto < $scope.currentPageProductos.length - 1) {
162	$scope.selectedProducto++;	172	$scope.selectedProducto++;
163	} else {	173	} else {
164	avanzarPagina();	174	avanzarPagina();
165	}	175	}
166	}	176	};
167
168	function retrocederPagina() {	177	function retrocederPagina() {
169	if ($scope.currentPage > 1) {	178	if ($scope.currentPage > 1) {
170	$scope.selectPage($scope.currentPage - 1);	179	$scope.selectPage($scope.currentPage - 1);
171	$scope.selectedProducto = $scope.numPerPage - 1;	180	$scope.selectedProducto = $scope.numPerPage - 1;
172	}	181	}
173	}	182	};
174

src/js/service.js

Diff comments View file @ e430dcd

1	angular.module('focaBusquedaProductos')	1	angular.module('focaBusquedaProductos')
2	.service('focaBusquedaProductosService', [	2	.service('focaBusquedaProductosService', [
3	'$http',	3	'$http',
4	'API_ENDPOINT',	4	'API_ENDPOINT',
5	function($http, API_ENDPOINT) {	5	function ($http, API_ENDPOINT) {
6	return {	6	return {
7	getProductos: function() {	7	getProductos: function () {
8	return $http.get(API_ENDPOINT.URL + '/articulos');	8	return $http.get(API_ENDPOINT.URL + '/articulos');
9	},	9	},
10	getProductosByIdLista: function(id, filters) {	10	getProductosByIdLista: function (id, filters) {
11	return $http.post(API_ENDPOINT.URL + '/articulos/lista',	11	return $http.post(API_ENDPOINT.URL + '/articulos/lista',
12	{filters: filters, id: id});	12	{ filters: filters, id: id });
13	}	13	}
14	};	14	};
15	}	15	}
16	]);	16	]);
17		17

src/views/modal-busqueda-productos.html

Diff comments View file @ e430dcd

 <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 Productos</h5>
         </div>
         <div class="input-group col-lg-6 pr-0 my-2">
             <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="selectedProducto == -1"
                 ng-focus="selectedProducto = -1"
                 teclado-virtual
             >
             <div class="input-group-append">
                 <button
                     ladda="searchLoading"
                     data-spinner-color="#FF0000"
                     class="btn btn-outline-secondary"
                     type="button"
                     title="Buscar"
                     ng-click="busquedaPress(13)"
                 >
                     <i class="fa fa-search" aria-hidden="true"></i>
                 </button>
             </div>
         </div>
     </div>
+    <div class="row">
+        <div class="col my-1 d-flex justify-content-end">
+            <div class="custom-control custom-checkbox mt-auto">
+                <input type="checkbox" class="custom-control-input" id="check" ng-click="changeProductsData()">
+                <label class="custom-control-label" for="check">Buscar en todos los artículos disponibles</label>
+            </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">
         <thead>
             <tr>
                 <th ng-hide="soloMostrar">Código</th>
                 <th>Descripción</th>
-                <th class="text-right">P. Base</th>
+                <th class="text-right">P. Lista</th>
+                <th class="text-right" ng-show="useAllProducts">P. Base</th>
                 <th ng-hide="soloMostrar"></th>
             </tr>
         </thead>
         <tbody>
             <tr ng-show="currentPageProductos.length == 0 && primerBusqueda">
                 <td colspan="5">
                     No se encontraron resultados.
                 </td>
             </tr>
             <tr class="selectable"
                 ng-repeat="(key,producto) in currentPageProductos"
                 ng-click="select(producto)">
                 <td ng-bind="producto.sector + '-' + producto.codigo"
                     ng-hide="soloMostrar"></td>
                 <td ng-bind="producto.descripcion"></td>
                 <td class="text-right" ng-bind="producto.precio | number: 2"></td>
+                <td class="text-right" ng-bind="producto.precioBase | number: 2" ng-show="useAllProducts"></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"
                         title="Seleccionar"
                         ng-class="{
                             'btn-secondary': selectedProducto != key,
                             'btn-primary': selectedProducto == key
                         }"
                         foca-focus="selectedProducto == {{key}}"
                         ng-keydown="itemProducto($event.keyCode)"
                         ng-hide="soloMostrar">
                         <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="currentPageProductos.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()">Volver</button>
 </div>