Luigi / foca-modal-remito

Download as
Browse Code »

Commit b849869dca31bf78386b1be17a2f8d04c35eadfb

Authored by Luigi
1 parent dc3c599ddd
Exists in master

Mostrar los productos al seleccionar Remito

Showing 2 changed files with 49 additions and 10 deletions   Show diff stats
src/js/controller.js
Diff comments   View file @ b849869
1 angular.module('focaModalRemito') 1 angular.module('focaModalRemito')
2 .controller('focaModalRemitoController', 2 .controller('focaModalRemitoController',
3 [ 3 [
4 '$timeout', 4 '$timeout',
5 '$filter', 5 '$filter',
6 '$scope', 6 '$scope',
7 '$uibModalInstance', 7 '$uibModalInstance',
8 'focaModalRemitoService', 8 'focaModalRemitoService',
9 'usadoPor', 9 'usadoPor',
10 'focaModalService', 10 'focaModalService',
11 function($timeout, $filter, $scope, $uibModalInstance, 11 function($timeout, $filter, $scope, $uibModalInstance,
12 focaModalRemitoService, usadoPor, focaModalService 12 focaModalRemitoService, usadoPor, focaModalService
13 ) { 13 ) {
14 var fecha = new Date(); 14 var fecha = new Date();
15 $scope.fechaHasta = new Date(); 15 $scope.fechaHasta = new Date();
16 $scope.fechaDesde = new Date(fecha.setMonth(fecha.getMonth() - 1)); 16 $scope.fechaDesde = new Date(fecha.setMonth(fecha.getMonth() - 1));
17 $scope.filters = ''; 17 $scope.filters = '';
18 $scope.remitos = []; 18 $scope.remitos = [];
19 $scope.isCollapsed = false;
20 $scope.verProductos = {};
19 $scope.primerBusqueda = false; 21 $scope.primerBusqueda = false;
20 $scope.searchLoading = false; 22 $scope.searchLoading = false;
21 // pagination 23 // pagination
22 $scope.numPerPage = 10; 24 $scope.numPerPage = 10;
23 $scope.currentPage = 1; 25 $scope.currentPage = 1;
24 $scope.filteredRemitos = []; 26 $scope.filteredRemitos = [];
25 $scope.currentPageRemitos = []; 27 $scope.currentPageRemitos = [];
26 $scope.selectedRemito = -1; 28 $scope.selectedRemito = -1;
27 29
28 //METODOS 30 //METODOS
29 $scope.busquedaPress = function(key) { 31 $scope.busquedaPress = function(key) {
30 if (key === 13) { 32 if (key === 13) {
31 if(!$scope.fechaDesde) { 33 if(!$scope.fechaDesde) {
32 focaModalService 34 focaModalService
33 .alert('INGRESE FECHA DESDE'); 35 .alert('INGRESE FECHA DESDE');
34 return; 36 return;
35 } 37 }
36 if(!$scope.fechaHasta) { 38 if(!$scope.fechaHasta) {
37 focaModalService 39 focaModalService
38 .alert('INGRESE FECHA HASTA'); 40 .alert('INGRESE FECHA HASTA');
39 return; 41 return;
40 } 42 }
41 if($scope.fechaDesde > $scope.fechaHasta) { 43 if($scope.fechaDesde > $scope.fechaHasta) {
42 focaModalService 44 focaModalService
43 .alert('La fecha desde no puede ser mayor a la fecha hasta'); 45 .alert('La fecha desde no puede ser mayor a la fecha hasta');
44 return; 46 return;
45 } 47 }
46 $scope.searchLoading = true; 48 $scope.searchLoading = true;
47 //TODO: usar filtros en vez de toISOString 49 //TODO: usar filtros en vez de toISOString
48 focaModalRemitoService 50 focaModalRemitoService
49 .getRemitos(usadoPor, $scope.fechaDesde.toISOString().split('.')[0], 51 .getRemitos(usadoPor, $scope.fechaDesde.toISOString().split('.')[0],
50 $scope.fechaHasta.toISOString().split('.')[0]) 52 $scope.fechaHasta.toISOString().split('.')[0])
51 .then(llenarDatos); 53 .then(llenarDatos);
52 } 54 }
53 }; 55 };
54 function llenarDatos(res) { 56 function llenarDatos(res) {
55 $scope.remitos = []; 57 $scope.remitos = [];
56 $scope.filteredRemitos = []; 58 $scope.filteredRemitos = [];
57 $scope.currentPageRemitos = []; 59 $scope.currentPageRemitos = [];
58 $scope.selectedRemito = -1; 60 $scope.selectedRemito = -1;
59 $scope.searchLoading = false; 61 $scope.searchLoading = false;
60 $scope.primerBusqueda = true; 62 $scope.primerBusqueda = true;
61 $scope.remitos = res.data; 63 $scope.remitos = res.data;
62 $scope.search(true); 64 $scope.search(true);
63 primera(); 65 primera();
64 } 66 }
65 $scope.search = function(pressed) { 67 $scope.search = function(pressed) {
66 if($scope.remitos.length > 0) { 68 if($scope.remitos.length > 0) {
67 $scope.filteredRemitos = $filter('filter')( 69 $scope.filteredRemitos = $filter('filter')(
68 $scope.remitos, 70 $scope.remitos,
69 {$: $scope.filters} 71 {$: $scope.filters}
70 ); 72 );
71 73
72 if(pressed && $scope.filteredRemitos.length === 0){ 74 if(pressed && $scope.filteredRemitos.length === 0){
73 $timeout(function() { 75 $timeout(function() {
74 angular.element('#search')[0].focus(); 76 angular.element('#search')[0].focus();
75 $scope.filters = ''; 77 $scope.filters = '';
76 }); 78 });
77 } 79 }
78 80
79 $scope.lastPage = Math.ceil( 81 $scope.lastPage = Math.ceil(
80 $scope.filteredRemitos.length / $scope.numPerPage 82 $scope.filteredRemitos.length / $scope.numPerPage
81 ); 83 );
82 84
83 $scope.resetPage(); 85 $scope.resetPage();
84 } 86 }
85 }; 87 };
86 88
87 $scope.resetPage = function() { 89 $scope.resetPage = function() {
88 $scope.currentPage = 1; 90 $scope.currentPage = 1;
89 $scope.selectPage(1); 91 $scope.selectPage(1);
90 }; 92 };
91 93
92 $scope.selectPage = function(page) { 94 $scope.selectPage = function(page) {
93 var start = (page - 1) * $scope.numPerPage; 95 var start = (page - 1) * $scope.numPerPage;
94 var end = start + $scope.numPerPage; 96 var end = start + $scope.numPerPage;
95 $scope.paginas = []; 97 $scope.paginas = [];
96 $scope.paginas = calcularPages(page); 98 $scope.paginas = calcularPages(page);
97 $scope.currentPageRemitos = $scope.filteredRemitos.slice(start, end); 99 $scope.currentPageRemitos = $scope.filteredRemitos.slice(start, end);
98 $scope.currentPage = page; 100 $scope.currentPage = page;
99 }; 101 };
100 102
101 $scope.select = function(remito) { 103 $scope.select = function(remito) {
102 $uibModalInstance.close(remito); 104 $uibModalInstance.close(remito);
103 }; 105 };
104 106
105 $scope.cancel = function() { 107 $scope.cancel = function() {
106 $uibModalInstance.dismiss('cancel'); 108 $uibModalInstance.dismiss('cancel');
107 }; 109 };
108 110
109 $scope.busquedaDown = function(key) { 111 $scope.busquedaDown = function(key) {
110 if (key === 40) { 112 if (key === 40) {
111 primera(key); 113 primera(key);
112 } 114 }
113 }; 115 };
114 116
115 $scope.itemRemito = function(key) { 117 $scope.itemRemito = function(key) {
116 if (key === 38) { 118 if (key === 38) {
117 anterior(key); 119 anterior(key);
118 } 120 }
119 121
120 if (key === 40) { 122 if (key === 40) {
121 siguiente(key); 123 siguiente(key);
122 } 124 }
123 125
124 if (key === 37) { 126 if (key === 37) {
125 retrocederPagina(); 127 retrocederPagina();
126 } 128 }
127 129
128 if (key === 39) { 130 if (key === 39) {
129 avanzarPagina(); 131 avanzarPagina();
130 } 132 }
131 }; 133 };
132 134
133 function calcularPages(paginaActual) { 135 function calcularPages(paginaActual) {
134 var paginas = []; 136 var paginas = [];
135 paginas.push(paginaActual); 137 paginas.push(paginaActual);
136 138
137 if (paginaActual - 1 > 1) { 139 if (paginaActual - 1 > 1) {
138 140
139 paginas.unshift(paginaActual - 1); 141 paginas.unshift(paginaActual - 1);
140 if (paginaActual - 2 > 1) { 142 if (paginaActual - 2 > 1) {
141 paginas.unshift(paginaActual - 2); 143 paginas.unshift(paginaActual - 2);
142 } 144 }
143 } 145 }
144 146
145 if (paginaActual + 1 < $scope.lastPage) { 147 if (paginaActual + 1 < $scope.lastPage) {
146 paginas.push(paginaActual + 1); 148 paginas.push(paginaActual + 1);
147 if (paginaActual + 2 < $scope.lastPage) { 149 if (paginaActual + 2 < $scope.lastPage) {
148 paginas.push(paginaActual + 2); 150 paginas.push(paginaActual + 2);
149 } 151 }
150 } 152 }
151 153
152 if (paginaActual !== 1) { 154 if (paginaActual !== 1) {
153 paginas.unshift(1); 155 paginas.unshift(1);
154 } 156 }
155 157
156 if (paginaActual !== $scope.lastPage) { 158 if (paginaActual !== $scope.lastPage) {
157 paginas.push($scope.lastPage); 159 paginas.push($scope.lastPage);
158 } 160 }
159 161
160 return paginas; 162 return paginas;
161 } 163 }
162 164
163 function primera() { 165 function primera() {
164 $scope.selectedRemito = 0; 166 $scope.selectedRemito = 0;
165 } 167 }
166 168
167 function anterior() { 169 function anterior() {
168 if ($scope.selectedRemito === 0 && $scope.currentPage > 1) { 170 if ($scope.selectedRemito === 0 && $scope.currentPage > 1) {
169 retrocederPagina(); 171 retrocederPagina();
170 } else { 172 } else {
171 $scope.selectedRemito--; 173 $scope.selectedRemito--;
172 } 174 }
173 } 175 }
174 176
175 function siguiente() { 177 function siguiente() {
176 if ($scope.selectedRemito < $scope.currentPageRemitos.length - 1 ) { 178 if ($scope.selectedRemito < $scope.currentPageRemitos.length - 1 ) {
177 $scope.selectedRemito++; 179 $scope.selectedRemito++;
178 } else { 180 } else {
179 avanzarPagina(); 181 avanzarPagina();
180 } 182 }
181 } 183 }
182 184
183 function retrocederPagina() { 185 function retrocederPagina() {
184 if ($scope.currentPage > 1) { 186 if ($scope.currentPage > 1) {
185 $scope.selectPage($scope.currentPage - 1); 187 $scope.selectPage($scope.currentPage - 1);
186 $scope.selectedRemito = $scope.numPerPage - 1; 188 $scope.selectedRemito = $scope.numPerPage - 1;
187 } 189 }
188 } 190 }
189 191
190 function avanzarPagina() { 192 function avanzarPagina() {
191 if ($scope.currentPage < $scope.lastPage) { 193 if ($scope.currentPage < $scope.lastPage) {
192 $scope.selectPage($scope.currentPage + 1); 194 $scope.selectPage($scope.currentPage + 1);
193 $scope.selectedRemito = 0; 195 $scope.selectedRemito = 0;
194 } 196 }
195 } 197 }
196 } 198 }
197 ] 199 ]
198 ); 200 );
199 201
src/views/foca-modal-remito.html
Diff comments   View file @ b849869
1 <div class="modal-header py-1"> 1 <div class="modal-header py-1">
2 <div class="row w-100"> 2 <div class="row w-100">
3 <div class="col-lg-6"> 3 <div class="col-lg-6">
4 <h5 class="modal-title my-1">Búsqueda de Remito</h5> 4 <h5 class="modal-title my-1">Búsqueda de Remito</h5>
5 </div> 5 </div>
6 <div class="input-group col-lg-6 pr-0 my-2"> 6 <div class="input-group col-lg-6 pr-0 my-2">
7 <input 7 <input
8 ladda="searchLoading" 8 ladda="searchLoading"
9 type="text" 9 type="text"
10 class="form-control form-control-sm" 10 class="form-control form-control-sm"
11 placeholder="Razón social" 11 placeholder="Razón social"
12 ng-model="filters" 12 ng-model="filters"
13 ng-change="search()" 13 ng-change="search()"
14 ng-keydown="busquedaDown($event.keyCode)" 14 ng-keydown="busquedaDown($event.keyCode)"
15 ng-keypress="busquedaPress($event.keyCode)" 15 ng-keypress="busquedaPress($event.keyCode)"
16 foca-focus="selectedRemito == -1" 16 foca-focus="selectedRemito == -1"
17 ng-focus="selectedRemito = -1" 17 ng-focus="selectedRemito = -1"
18 id="search" 18 id="search"
19 teclado-virtual 19 teclado-virtual
20 > 20 >
21 <button 21 <button
22 ng-show="filters.length >= 1" 22 ng-show="filters.length >= 1"
23 type="button" 23 type="button"
24 class="clear-input" 24 class="clear-input"
25 ng-click="filters = ''" 25 ng-click="filters = ''"
26 > 26 >
27 <i class="fa fa-times"></i> 27 <i class="fa fa-times"></i>
28 </button> 28 </button>
29 <div class="input-group-append"> 29 <div class="input-group-append">
30 <button 30 <button
31 ladda="searchLoading" 31 ladda="searchLoading"
32 data-spinner-color="#FF0000" 32 data-spinner-color="#FF0000"
33 class="btn btn-outline-secondary" 33 class="btn btn-outline-secondary"
34 type="button" 34 type="button"
35 ng-click="busquedaPress(13)" 35 ng-click="busquedaPress(13)"
36 > 36 >
37 <i class="fa fa-search" aria-hidden="true"></i> 37 <i class="fa fa-search" aria-hidden="true"></i>
38 </button> 38 </button>
39 </div> 39 </div>
40 </div> 40 </div>
41 </div> 41 </div>
42 42
43 </div> 43 </div>
44 <div class="modal-body" id="modal-body"> 44 <div class="modal-body" id="modal-body">
45 <div class="input-group row"> 45 <div class="input-group row">
46 <small class="col-md-2 col-4 text-left my-1">Fecha Desde</small> 46 <small class="col-md-2 col-4 text-left my-1">Fecha Desde</small>
47 <div class="col-md-4 col-8 input-group mb-2"> 47 <div class="col-md-4 col-8 input-group mb-3">
48 <div class="input-group-prepend"> 48 <div class="input-group-prepend">
49 <div class="input-group-text"> 49 <button
50 class="input-group-text"
51 type="button"
52 ng-click="datepickerOpen = true"
53 >
50 <i class="fa fa-calendar"></i> 54 <i class="fa fa-calendar"></i>
51 </div> 55 </button>
52 </div> 56 </div>
53 <input 57 <input
54 class="form-control form-control-sm" 58 class="form-control form-control-sm"
55 id="inlineFormInputGroup" 59 id="inlineFormInputGroup"
56 ladda="searchLoading" 60 ladda="searchLoading"
57 type="text" 61 type="text"
58 ng-model="fechaDesde" 62 ng-model="fechaDesde"
59 ng-required="true" 63 ng-required="true"
60 uib-datepicker-popup="dd/MM/yyyy" 64 uib-datepicker-popup="dd/MM/yyyy"
61 show-button-bar="false" 65 show-button-bar="false"
62 is-open="datepickerOpen" 66 is-open="datepickerOpen"
63 on-open-focus="false" 67 on-open-focus="false"
64 ng-focus="datepickerOpen = true" 68 ng-focus="datepickerOpen = true"
65 /> 69 />
66 </div> 70 </div>
67 <small class="col-md-2 col-4 text-left my-1">Fecha Hasta</small> 71 <small class="col-md-2 col-4 text-left my-1">Fecha Hasta</small>
68 <div class="col-md-4 col-8 input-group mb-2"> 72 <div class="col-md-4 col-8 input-group mb-3">
69 <div class="input-group-prepend"> 73 <div class="input-group-prepend">
70 <div class="input-group-text"> 74 <button
75 class="input-group-text"
76 type="button"
77 ng-click="datepicker2Open = true"
78 >
71 <i class="fa fa-calendar"></i> 79 <i class="fa fa-calendar"></i>
72 </div> 80 </button>
73 </div> 81 </div>
74 <input 82 <input
75 class="form-control form-control-sm" 83 class="form-control form-control-sm"
76 id="inlineFormInputGroup" 84 id="inlineFormInputGroup"
77 ladda="searchLoading" 85 ladda="searchLoading"
78 type="text" 86 type="text"
79 ng-model="fechaHasta" 87 ng-model="fechaHasta"
80 ng-required="true" 88 ng-required="true"
81 uib-datepicker-popup="dd/MM/yyyy" 89 uib-datepicker-popup="dd/MM/yyyy"
82 show-button-bar="false" 90 show-button-bar="false"
83 is-open="datepicker2Open" 91 is-open="datepicker2Open"
84 on-open-focus="false" 92 on-open-focus="false"
85 ng-focus="datepicker2Open = true" 93 ng-focus="datepicker2Open = true"
86 /> 94 />
87 </div> 95 </div>
88 </div> 96 </div>
89 <table ng-show="primerBusqueda" class="table table-striped table-sm"> 97 <table ng-show="primerBusqueda" class="table table-hover table-sm">
90 <thead> 98 <thead>
91 <tr> 99 <tr>
92 <th>Fecha</th> 100 <th>Fecha</th>
93 <th>Cliente</th> 101 <th>Cliente</th>
94 <th>Comprobante</th> 102 <th>Comprobante</th>
95 <th>Importe</th> 103 <th>Importe</th>
96 <th></th> 104 <th></th>
105 <th></th>
97 </tr> 106 </tr>
98 </thead> 107 </thead>
99 <tbody> 108 <tbody>
100 <tr ng-show="currentPageRemitos.length == 0 && primerBusqueda"> 109 <tr ng-show="currentPageRemitos.length == 0 && primerBusqueda">
101 <td colspan="5"> 110 <td colspan="5">
102 No se encontraron resultados. 111 No se encontraron resultados.
103 </td> 112 </td>
104 </tr> 113 </tr>
105 <tr class="selectable" 114 <tr class="selectable"
106 ng-repeat="(key, remito) in currentPageRemitos" 115 ng-repeat-start="(key, remito) in currentPageRemitos"
107 ng-click="select(remito)"> 116 >
108 <td ng-bind="remito.fechaRemito | date : 'dd/MM/yyyy'"></td> 117 <td ng-bind="remito.fechaRemito | date : 'dd/MM/yyyy'"></td>
109 <td ng-bind="remito.nombreCliente"></td> 118 <td ng-bind="remito.nombreCliente"></td>
110 <td ng-bind="[remito.sucursal, remito.numeroRemito] | comprobante"></td> 119 <td ng-bind="[remito.sucursal, remito.numeroRemito] | comprobante"></td>
111 <td ng-bind="remito.total | number: 2"></td> 120 <td ng-bind="remito.total | number: 2"></td>
112 <td> 121 <td>
113 <button 122 <button
114 type="button" 123 type="button"
124 class="fa fa-eye btn-secondary"
125 ng-click="isCollapsed = !isCollapsed ; verProductos = remito.articulosRemito"
126 >
127 </button>
128 </td>
129 <td>
130 <button ng-click="select(remito);"
131 type="button"
115 class="btn btn-xs p-1 float-right" 132 class="btn btn-xs p-1 float-right"
116 ng-class="{ 133 ng-class="{
117 'btn-secondary': selectedRemito != key, 134 'btn-secondary': selectedRemito != key,
118 'btn-primary': selectedRemito == key 135 'btn-primary': selectedRemito == key
119 }" 136 }"
120 foca-focus="selectedRemito == {{key}}" 137 foca-focus="selectedRemito == {{key}}"
121 ng-keydown="itemRemito($event.keyCode)" 138 ng-keydown="itemRemito($event.keyCode)"
122 > 139 >
123 <i class="fa fa-circle-thin" aria-hidden="true"></i> 140 <i class="fa fa-circle-thin" aria-hidden="true"></i>
124 </button> 141 </button>
125 </td> 142 </td>
126 </tr> 143 </tr>
144 <tr ng-repeat-end uib-collapse="!isCollapsed">
145 <td colspan="6">
146 <table class="table table-sm">
147 <thead>
148 <tr>
149 <th>Código</th>
150 <th>Descripción</th>
151 <th>Cantidad</th>
152 </tr>
153 </thead>
154 <tbody>
155 <tr ng-repeat="(key, articulo) in verProductos">
156 <td>{{articulo.codigo}}</td>
157 <td>{{articulo.descripcion}}</td>
158 <td>{{articulo.cantidad}}</td>
159 </tr>
160 </tbody>
161 </table>
162 </td>
163 </tr>
127 </tbody> 164 </tbody>
128 </table> 165 </table>
129 </div> 166 </div>
130 <div class="modal-footer py-1"> 167 <div class="modal-footer py-1">
131 <nav ng-show="currentPageRemitos.length > 0 && primerBusqueda" class="mr-auto"> 168 <nav ng-show="currentPageRemitos.length > 0 && primerBusqueda" class="mr-auto">
132 <ul class="pagination pagination-sm justify-content mb-0"> 169 <ul class="pagination pagination-sm justify-content mb-0">
133 <li class="page-item" ng-class="{'disabled': currentPage == 1}"> 170 <li class="page-item" ng-class="{'disabled': currentPage == 1}">
134 <a 171 <a
135 class="page-link" 172 class="page-link"
136 href="javascript:void();" 173 href="javascript:void();"
137 ng-click="selectPage(currentPage - 1)" 174 ng-click="selectPage(currentPage - 1)"
138 > 175 >
139 <span aria-hidden="true">&laquo;</span> 176 <span aria-hidden="true">&laquo;</span>
140 <span class="sr-only">Anterior</span> 177 <span class="sr-only">Anterior</span>
141 </a> 178 </a>
142 </li> 179 </li>
143 <li 180 <li
144 class="page-item" 181 class="page-item"
145 ng-repeat="pagina in paginas" 182 ng-repeat="pagina in paginas"
146 ng-class="{'active': pagina == currentPage}" 183 ng-class="{'active': pagina == currentPage}"
147 > 184 >
148 <a 185 <a
149 class="page-link" 186 class="page-link"
150 href="javascript:void();" 187 href="javascript:void();"
151 ng-click="selectPage(pagina)" 188 ng-click="selectPage(pagina)"
152 ng-bind="pagina" 189 ng-bind="pagina"
153 ></a> 190 ></a>
154 </li> 191 </li>
155 <li class="page-item" ng-class="{'disabled': currentPage == lastPage}"> 192 <li class="page-item" ng-class="{'disabled': currentPage == lastPage}">
156 <a 193 <a
157 class="page-link" 194 class="page-link"
158 href="javascript:void();" 195 href="javascript:void();"
159 ng-click="selectPage(currentPage + 1)" 196 ng-click="selectPage(currentPage + 1)"
160 > 197 >
161 <span aria-hidden="true">&raquo;</span> 198 <span aria-hidden="true">&raquo;</span>
162 <span class="sr-only">Siguiente</span> 199 <span class="sr-only">Siguiente</span>
163 </a> 200 </a>
164 </li> 201 </li>
165 </ul> 202 </ul>
166 </nav> 203 </nav>
167 <button class="btn btn-sm btn-secondary" type="button" ng-click="cancel()">Cancelar</button> 204 <button class="btn btn-sm btn-secondary" type="button" ng-click="cancel()">Cancelar</button>
168 </div> 205 </div>
169 206