Commit a3596c2f6c55935495cff76004320243a1b8b504
1 parent
69b95b1dcf
Exists in
master
agrega y guarda puntos de descarga
Showing
3 changed files
with
190 additions
and
22 deletions
Show diff stats
src/js/controller.js
1 | angular.module('focaModalPuntoDescarga') | 1 | angular.module('focaModalPuntoDescarga') |
2 | .controller('focaModalPuntoDescargaController', [ | 2 | .controller('focaModalPuntoDescargaController', [ |
3 | '$timeout', | 3 | '$timeout', |
4 | '$filter', | 4 | '$filter', |
5 | '$scope', | 5 | '$scope', |
6 | '$uibModalInstance', | 6 | '$uibModalInstance', |
7 | 'focaModalPuntoDescargaService', | 7 | 'focaModalPuntoDescargaService', |
8 | 'filters', | 8 | 'filters', |
9 | function($timeout, $filter, $scope, $uibModalInstance, | 9 | function($timeout, $filter, $scope, $uibModalInstance, |
10 | focaModalPuntoDescargaService, filters) { | 10 | focaModalPuntoDescargaService, filters) { |
11 | 11 | ||
12 | $scope.cantidadArticulo = 0; | ||
13 | $scope.articuloSeleccionado = 0; | ||
12 | $scope.ivas = []; | 14 | $scope.ivas = []; |
15 | $scope.puntosSeleccionados = []; | ||
13 | $scope.puntoDescarga = { | 16 | $scope.puntoDescarga = { |
14 | id: 0, | 17 | id: 0, |
15 | id_cliente: filters.idCliente, | 18 | id_cliente: filters.idCliente, |
16 | id_da_config_0: filters.idDomicilio | 19 | id_da_config_0: filters.idDomicilio |
17 | }; | 20 | }; |
18 | 21 | $scope.articulos = angular.copy(filters.articulos); | |
19 | focaModalPuntoDescargaService | 22 | actualizarTabla(); |
20 | .getPuntosDescargaByClienDom(filters.idDomicilio, filters.idCliente) | ||
21 | .then(function(res) { | ||
22 | $scope.puntosDescarga = res.data; | ||
23 | }); | ||
24 | 23 | ||
25 | $scope.cancel = function() { | 24 | $scope.cancel = function() { |
26 | if($scope.ingreso){ | 25 | if($scope.ingreso){ |
27 | $scope.ingreso = false; | 26 | $scope.ingreso = false; |
28 | }else { | 27 | }else { |
29 | $uibModalInstance.dismiss('cancel'); | 28 | $uibModalInstance.dismiss('cancel'); |
30 | } | 29 | } |
31 | }; | 30 | }; |
32 | 31 | ||
33 | $scope.select = function(iva) { | 32 | $scope.aceptar = function() { |
34 | $uibModalInstance.close(iva); | 33 | if($scope.cargaArticulos) { |
34 | cargarArticulos(); | ||
35 | }else { | ||
36 | verCargaArticulos(); | ||
37 | } | ||
35 | }; | 38 | }; |
36 | 39 | ||
37 | $scope.guardar = function() { | 40 | $scope.guardar = function() { |
38 | focaModalPuntoDescargaService | 41 | focaModalPuntoDescargaService |
39 | .guardarPuntoDescarga($scope.puntoDescarga) | 42 | .guardarPuntoDescarga($scope.puntoDescarga) |
40 | .then(function(res) {}); | 43 | .then(function() { |
44 | actualizarTabla(); | ||
45 | $scope.ingreso = false; | ||
46 | }); | ||
47 | }; | ||
48 | |||
49 | $scope.editar = function(id) { | ||
50 | focaModalPuntoDescargaService.getPuntoDescargaById(id).then(function(res) { | ||
51 | $scope.puntoDescarga = res.data; | ||
52 | $scope.ingreso = true; | ||
53 | }); | ||
54 | }; | ||
55 | |||
56 | $scope.eliminar = function(idx, id) { | ||
57 | focaModalPuntoDescargaService.eliminarPuntoDescarga(id).then(function() { | ||
58 | $scope.puntosDescarga.splice(idx, 1); | ||
59 | }); | ||
60 | }; | ||
61 | |||
62 | $scope.seleccionarPunto = function(idx) { | ||
63 | $scope.puntosSeleccionados.push(idx); | ||
41 | }; | 64 | }; |
65 | |||
66 | $scope.agregarArticulo = function(punto) { | ||
67 | var articulo = $scope.articulos[$scope.articuloSeleccionado], | ||
68 | cantidadRestante = articulo.cantidad - $scope.cantidadArticulo; | ||
69 | |||
70 | if(cantidadRestante < 0) { | ||
71 | alert('La cantidad a cargar debe ser menor o igual al restante'); | ||
72 | }else if($scope.cantidadArticulo <= 0) { | ||
73 | alert('La cantidad a cargar debe ser mayor que cero'); | ||
74 | }else { | ||
75 | articulo.cantidad = cantidadRestante; | ||
76 | punto.articulosAgregados.push({ | ||
77 | id: articulo.id, | ||
78 | descripcion: articulo.descripcion, | ||
79 | cantidad: $scope.cantidadArticulo, | ||
80 | index: $scope.articuloSeleccionado | ||
81 | }); | ||
82 | $scope.cantidadArticulo = 0; | ||
83 | } | ||
84 | }; | ||
85 | |||
86 | $scope.quitarArticulo = function(articulo, idx, punto) { | ||
87 | var restante = parseInt($scope.articulos[articulo.index].cantidad); | ||
88 | restante += parseInt(articulo.cantidad); | ||
89 | $scope.articulos[articulo.index].cantidad = restante; | ||
90 | punto.articulosAgregados.splice(idx, 1); | ||
91 | }; | ||
92 | |||
93 | function actualizarTabla() { | ||
94 | focaModalPuntoDescargaService | ||
95 | .getPuntosDescargaByClienDom(filters.idDomicilio, filters.idCliente) | ||
96 | .then(function(res) { | ||
97 | $scope.puntosDescarga = res.data; | ||
98 | }); | ||
99 | } | ||
100 | function verCargaArticulos() { | ||
101 | $scope.puntosACargar = []; | ||
102 | $scope.cargaArticulos = true; | ||
103 | $scope.puntosSeleccionados.forEach(function(idx) { | ||
104 | $scope.puntosACargar.push($scope.puntosDescarga[idx]); | ||
105 | }); | ||
106 | |||
107 | $scope.puntosACargar.map(function(punto) { | ||
108 | punto.articulosAgregados = []; | ||
109 | }); | ||
110 | } | ||
111 | function cargarArticulos() { | ||
112 | $uibModalInstance.close($scope.puntosACargar); |
src/js/service.js
1 | angular.module('focaModalPuntoDescarga') | 1 | angular.module('focaModalPuntoDescarga') |
2 | .factory('focaModalPuntoDescargaService', | 2 | .factory('focaModalPuntoDescargaService', |
3 | ['$http', 'API_ENDPOINT', function($http, API_ENDPOINT) { | 3 | ['$http', 'API_ENDPOINT', function($http, API_ENDPOINT) { |
4 | return { | 4 | return { |
5 | getPuntosDescarga: function() { | 5 | getPuntosDescarga: function() { |
6 | return $http.get(API_ENDPOINT.URL + '/punto-descarga'); | 6 | return $http.get(API_ENDPOINT.URL + '/punto-descarga'); |
7 | }, | 7 | }, |
8 | getPuntoDescargaById: function(id) { | ||
9 | return $http.get(API_ENDPOINT.URL + '/punto-descarga/' + id); | ||
10 | }, | ||
8 | getPuntosDescargaByClienDom: function(idDomicilio, idCliente) { | 11 | getPuntosDescargaByClienDom: function(idDomicilio, idCliente) { |
9 | return $http.get(API_ENDPOINT.URL + '/punto-descarga/' + | 12 | return $http.get(API_ENDPOINT.URL + '/punto-descarga/' + |
10 | idDomicilio + '/' + idCliente); | 13 | idDomicilio + '/' + idCliente); |
11 | }, | 14 | }, |
12 | guardarPuntoDescarga: function(puntoDescarga) { | 15 | guardarPuntoDescarga: function(puntoDescarga) { |
13 | return $http.post(API_ENDPOINT.URL + '/punto-descarga', | 16 | return $http.post(API_ENDPOINT.URL + '/punto-descarga', |
14 | {puntoDescarga: puntoDescarga}); | 17 | {puntoDescarga: puntoDescarga}); |
18 | }, | ||
19 | eliminarPuntoDescarga: function(id) { | ||
20 | return $http.delete(API_ENDPOINT.URL + '/punto-descarga/' + id); | ||
15 | } | 21 | } |
16 | }; | 22 | }; |
17 | }]); | 23 | }]); |
18 | 24 |
src/views/modal-punto-descarga.html
1 | <div class="modal-header d-flex"> | 1 | <div class="modal-header d-flex"> |
2 | <h5 class="modal-title my-1" ng-hide="ingreso">Búsqueda de puntos de descarga</h5> | 2 | <h5 class="modal-title my-1" ng-hide="ingreso || cargaArticulos">Búsqueda de puntos de descarga</h5> |
3 | <h5 class="modal-title my-1" ng-show="ingreso">Crear punto de descarga</h5> | 3 | <h5 class="modal-title my-1" ng-show="ingreso">Crear punto de descarga</h5> |
4 | <h5 class="modal-title my-1" ng-show="cargaArticulos">Cargar articulos en puntos de descarga</h5> | ||
4 | <button | 5 | <button |
5 | class="btn btn-primary" | 6 | class="btn btn-primary" |
6 | ng-click="ingreso = true" | 7 | ng-click="ingreso = true" |
7 | ng-hide="ingreso"> | 8 | ng-hide="ingreso || cargaArticulos"> |
8 | <i class="fa fa-plus" aria-hidden="true"></i> | 9 | <i class="fa fa-plus" aria-hidden="true"></i> |
9 | </button> | 10 | </button> |
10 | </div> | 11 | </div> |
11 | <div class="modal-body" id="modal-body"> | 12 | <div class="modal-body" id="modal-body"> |
12 | <table | 13 | <table |
13 | class="table table-striped table-sm col-12" | 14 | class="table table-striped table-sm col-12" |
14 | ng-hide="ingreso"> | 15 | ng-hide="ingreso || cargaArticulos"> |
15 | <thead> | 16 | <thead> |
16 | <tr> | 17 | <tr> |
17 | <th>Código</th> | 18 | <th>Código</th> |
19 | <th>Descripción</th> | ||
18 | <th>Latitud</th> | 20 | <th>Latitud</th> |
19 | <th>Longitud</th> | 21 | <th>Longitud</th> |
20 | <th></th> | 22 | <th></th> |
21 | </tr> | 23 | </tr> |
22 | </thead> | 24 | </thead> |
23 | <tbody> | 25 | <tbody> |
24 | <tr ng-show="puntosDescarga.length == 0"> | 26 | <tr ng-show="puntosDescarga.length == 0"> |
25 | <td colspan="3"> | 27 | <td colspan="3"> |
26 | No se encontraron resultados. | 28 | No se encontraron resultados. |
27 | </td> | 29 | </td> |
28 | </tr> | 30 | </tr> |
29 | <tr class="selected" | 31 | <tr class="selected" |
30 | ng-repeat="(key, puntoDescarga) in puntosDescarga | filter: filters" | 32 | ng-repeat="(key, puntoDescarga) in puntosDescarga | filter: filters" |
31 | ng-click="select(puntoDescarga)" | ||
32 | > | 33 | > |
33 | <td ng-bind="puntoDescarga.id | rellenarDigitos: 3: 0"></td> | 34 | <td ng-bind="puntoDescarga.id | rellenarDigitos: 3: 0"></td> |
35 | <td ng-bind="puntoDescarga.descripcion"></td> | ||
34 | <td ng-bind="puntoDescarga.latitud"></td> | 36 | <td ng-bind="puntoDescarga.latitud"></td> |
35 | <td ng-bind="puntoDescarga.longitud"></td> | 37 | <td ng-bind="puntoDescarga.longitud"></td> |
36 | <td class="d-md-none text-primary"> | 38 | <td class="d-md-none text-primary"> |
37 | <i class="fa fa-circle-thin" aria-hidden="true"></i> | 39 | <i class="fa fa-circle-thin" aria-hidden="true"></i> |
38 | </td> | 40 | </td> |
39 | <td class="d-none d-md-table-cell"> | 41 | <td class="d-none d-md-table-cell"> |
42 | <input | ||
43 | type="checkbox" | ||
44 | class="custom-control-input float-right" | ||
45 | id="checkSelect{{key}}"> | ||
46 | <label | ||
47 | class="custom-control-label float-right" | ||
48 | for="checkSelect{{key}}" | ||
49 | ng-click="seleccionarPunto(key)"></label> | ||
40 | <button | 50 | <button |
41 | type="button" | 51 | type="button" |
42 | class="btn btn-xs p-1 float-right" | 52 | class="btn btn-xs p-1 float-right mr-5" |
43 | ng-class="{ | 53 | ng-click="eliminar(key, puntoDescarga.id)"> |
44 | 'btn-secondary': selectedProvincia != key, | 54 | <i class="fa fa-trash" aria-hidden="true"></i> |
45 | 'btn-primary': selectedProvincia == key | 55 | </button> |
46 | }" | 56 | <button |
47 | foca-focus="selectedProvincia == {{key}}" | 57 | type="button" |
48 | ng-keydown="itemProvincia($event.keyCode)"> | 58 | class="btn btn-xs p-1 float-right mr-1" |
49 | <i class="fa fa-circle-thin" aria-hidden="true"></i> | 59 | ng-click="editar(puntoDescarga.id)"> |
60 | <i class="fa fa-pencil" aria-hidden="true"></i> | ||
50 | </button> | 61 | </button> |
51 | </td> | 62 | </td> |
52 | </tr> | 63 | </tr> |
53 | </tbody> | 64 | </tbody> |
54 | </table> | 65 | </table> |
55 | <form ng-show="ingreso"> | 66 | <form ng-show="ingreso"> |
56 | <div class="row"> | 67 | <div class="row"> |
57 | <div class="col-6"> | 68 | <div class="col-6"> |
58 | <label>Latitud</label> | 69 | <label>Latitud</label> |
59 | <input | 70 | <input |
60 | type="text" | 71 | type="text" |
61 | class="form-control form-control-sm" | 72 | class="form-control form-control-sm" |
62 | ng-model="puntoDescarga.latitud" | 73 | ng-model="puntoDescarga.latitud" |
63 | ng-required="true" | 74 | ng-required="true" |
64 | /> | 75 | /> |
65 | </div> | 76 | </div> |
66 | <div class="col-6"> | 77 | <div class="col-6"> |
67 | <label>Longitud</label> | 78 | <label>Longitud</label> |
68 | <input | 79 | <input |
69 | type="text" | 80 | type="text" |
70 | class="form-control form-control-sm" | 81 | class="form-control form-control-sm" |
71 | ng-model="puntoDescarga.longitud" | 82 | ng-model="puntoDescarga.longitud" |
72 | ng-required="true" | 83 | ng-required="true" |
73 | /> | 84 | /> |
74 | </div> | 85 | </div> |
75 | </div> | 86 | </div> |
76 | <div class="row"> | 87 | <div class="row"> |
77 | <div class="col-12"> | 88 | <div class="col-12"> |
78 | <label>Descripción</label> | 89 | <label>Descripción</label> |
79 | <textarea | 90 | <textarea |
80 | class="form-control form-control-sm" | 91 | class="form-control form-control-sm" |
81 | cols="30" | 92 | cols="30" |
82 | rows="5" | 93 | rows="5" |
83 | ng-model="puntoDescarga.descripcion"></textarea> | 94 | ng-model="puntoDescarga.descripcion"></textarea> |
84 | </div> | 95 | </div> |
85 | </div> | 96 | </div> |
86 | </form> | 97 | </form> |
98 | <div ng-show="cargaArticulos"> | ||
99 | <div ng-show="articulos.length === 0"> | ||
100 | <h6>No existen articulos para agregar</h6> | ||
101 | </div> | ||
102 | <div ng-show="articulos.length > 0"> | ||
103 | <div class="row"> | ||
104 | <div class="form-check ml-4" ng-repeat="(key, articulo) in articulos"> | ||
105 | <input | ||
106 | class="form-check-input" | ||
107 | type="radio" | ||
108 | name="exampleRadios" | ||
109 | id="inputRadio{{key}}" | ||
110 | ng-value="key" | ||
111 | ng-model="$parent.articuloSeleccionado" | ||
112 | > | ||
113 | <label class="form-check-label" for="inputRadio{{key}}"> | ||
114 | {{articulo.descripcion}} <strong>Cantidad:</strong> {{articulo.cantidad}} | ||
115 | </label> | ||
116 | </div> | ||
117 | </div> | ||
118 | <div class="row"> | ||
119 | <div class="form-group col-3 mt-3"> | ||
120 | <label for="inputCantidad">Cantidad</label> | ||
121 | <input | ||
122 | type="text" | ||
123 | class="form-control" | ||
124 | id="inputCantidad" | ||
125 | placeholder="Cantidad" | ||
126 | ng-model="cantidadArticulo" | ||
127 | > | ||
128 | </div> | ||
129 | </div> | ||
130 | <div class="row"> | ||
131 | <div class="col-6" ng-repeat="punto in puntosACargar"> | ||
132 | <div class="d-flex"> | ||
133 | <h6>{{punto.descripcion}}</h6> | ||
134 | <button | ||
135 | class="btn btn-sm btn-outline-primary ml-auto" | ||
136 | type="button" | ||
137 | ng-click="agregarArticulo(punto)" | ||
138 | > | ||
139 | Agregar | ||
140 | </button> | ||
141 | </div> | ||
142 | <table class="table table-sm"> | ||
143 | <thead> | ||
144 | <tr> | ||
145 | <th>Articulo</th> | ||
146 | <th class="text-right">Cantidad</th> | ||
147 | <th></th> | ||
148 | </tr> | ||
149 | </thead> | ||
150 | <tbody> | ||
151 | <tr ng-repeat="(key, articulo) in punto.articulosAgregados"> | ||
152 | <td ng-bind="articulo.descripcion" class="p-2"></td> | ||
153 | <td ng-bind="articulo.cantidad" class="text-right p-2"></td> | ||
154 | <td class="p-2"> | ||
155 | <button | ||
156 | type="button" | ||
157 | class="btn btn-xs p-1 float-right mr-5" | ||
158 | ng-click="quitarArticulo(articulo, key, punto)"> | ||
159 | <i class="fa fa-trash" aria-hidden="true"></i> | ||
160 | </button> | ||
161 | </td> | ||
162 | </tr> | ||
163 | </tbody> | ||
164 | </table> | ||
165 | </div> | ||
166 | </div> | ||
167 | </div> | ||
168 | </div> | ||
87 | </div> | 169 | </div> |
88 | <div class="modal-footer"> | 170 | <div class="modal-footer"> |
89 | <button class="btn btn-sm btn-secondary my-1" type="button" ng-click="cancel()">Cancelar</button> | 171 | <button |
172 | class="btn btn-sm btn-secondary my-1" | ||
173 | type="button" | ||
174 | ng-click="cancel()">Cancelar</button> | ||
175 | <button | ||
176 | class="btn btn-sm btn-primary my-1" | ||
177 | type="button" | ||
178 | ng-click="aceptar()" | ||
179 | ng-hide="ingreso">Aceptar</button> | ||
90 | <button | 180 | <button |
91 | class="btn btn-sm btn-primary my-1" | 181 | class="btn btn-sm btn-primary my-1" |
92 | type="button" | 182 | type="button" |
93 | ng-click="guardar()" | 183 | ng-click="guardar()" |
94 | ng-show="ingreso">Guardar</button> | 184 | ng-show="ingreso">Guardar</button> |
95 | </div> | 185 | </div> |