Nuevo diseño, muestra puntos cargados anteriormente

Jose Pinto
1 parent a3596c2f6c
Showing 2 changed files with 148 additions and 55 deletions Show diff stats
src/js/controller.js
src/views/modal-punto-descarga.html
@@ -19,10 +19,14 @@ angular.module(&#39;focaModalPuntoDescarga&#39;)
                 id_da_config_0: filters.idDomicilio
             };
             $scope.articulos = angular.copy(filters.articulos);
+            $scope.articulos.map(function(articulo) {
+                articulo.restante = articulo.cantidad;
+            });
             actualizarTabla();
+            cargarPuntos(filters.puntosDescarga);
  
             $scope.cancel = function() {
-                if($scope.ingreso){
+                if($scope.ingreso) {
                     $scope.ingreso = false;
                 }else {
                     $uibModalInstance.dismiss('cancel');
@@ -60,33 +64,56 @@ angular.module(&#39;focaModalPuntoDescarga&#39;)
             };
  
             $scope.seleccionarPunto = function(idx) {
-                $scope.puntosSeleccionados.push(idx);
+                var indexPunto = $scope.puntosSeleccionados.indexOf(idx);
+                if(indexPunto !== -1) {
+                    $scope.puntosSeleccionados.splice(indexPunto, 1);
+                }else {
+                    $scope.puntosSeleccionados.push(idx);
+                }
             };
  
             $scope.agregarArticulo = function(punto) {
                 var articulo = $scope.articulos[$scope.articuloSeleccionado],
-                    cantidadRestante = articulo.cantidad - $scope.cantidadArticulo;
+                    cantidadRestante = articulo.restante - punto.cantidadACargar;
  
                 if(cantidadRestante < 0) {
                     alert('La cantidad a cargar debe ser menor o igual al restante');
-                }else if($scope.cantidadArticulo <= 0) {
+                }else if(punto.cantidadACargar <= 0) {
                     alert('La cantidad a cargar debe ser mayor que cero');
                 }else {
-                    articulo.cantidad = cantidadRestante;
-                    punto.articulosAgregados.push({
-                        id: articulo.id,
-                        descripcion: articulo.descripcion,
-                        cantidad: $scope.cantidadArticulo,
-                        index: $scope.articuloSeleccionado
-                    });
-                    $scope.cantidadArticulo = 0;
+                    punto.cargado += parseInt(punto.cantidadACargar);
+                    articulo.restante = cantidadRestante;
+                    var existeArticulo = punto.articulosAgregados.filter(
+                        function (articuloAAgregar) {
+                            return articuloAAgregar.id === articulo.id;
+                        });
+                    //Si el articulo ya fue agregado
+                    if(existeArticulo.length) {
+                        //Solo sumo cantidad
+                        var total = parseInt(existeArticulo[0].cantidad) + parseInt(punto.cantidadACargar);
+                        existeArticulo[0].cantidad = total;
+                    }else {
+                        //Agrego el articulo con la cantidad
+                        punto.articulosAgregados.push({
+                            id: articulo.id,
+                            descripcion: articulo.descripcion,
+                            cantidad: punto.cantidadACargar,
+                            index: $scope.articuloSeleccionado
+                        });
+                    }
+                    punto.cantidadACargar = 0;
                 }
             };
  
             $scope.quitarArticulo = function(articulo, idx, punto) {
-                var restante = parseInt($scope.articulos[articulo.index].cantidad);
+                var articuloAEliminar = $scope.articulos.filter(function(art) {
+                    return art.id == articulo.id;
+                });
+                var restante = parseInt(articuloAEliminar[0].restante);
                 restante += parseInt(articulo.cantidad);
-                $scope.articulos[articulo.index].cantidad = restante;
+                articuloAEliminar[0].restante = restante;
+
+                punto.cargado -= parseInt(punto.articulosAgregados[idx].cantidad);
                 punto.articulosAgregados.splice(idx, 1);
             };
  
@@ -106,10 +133,44 @@ angular.module(&#39;focaModalPuntoDescarga&#39;)
  
                 $scope.puntosACargar.map(function(punto) {
                     punto.articulosAgregados = [];
+                    punto.cantidadACargar = 0;
+                    punto.cargado = 0;
                 });
             }
             function cargarArticulos() {
                 $uibModalInstance.close($scope.puntosACargar);
             }
+            function cargarPuntos(puntosDescarga) {
+                //Si existen puntos ya cargados
+                if(puntosDescarga) {
+                    if(!puntosDescarga[0].cargado) {
+                        agregarTotalCargado(puntosDescarga);
+                    }
+                    $scope.puntosACargar = puntosDescarga;
+                    $scope.cargaArticulos = true;
+                    //Recorro los puntos
+                    puntosDescarga.forEach(function(punto) {
+                        //Recorro los articulos cargados en cada punto
+                        punto.articulosAgregados.forEach(function(articulo) {
+                            var articuloARestar = $scope.articulos.filter(function(art) {
+                                return art.id == articulo.id;
+                            });
+                            articuloARestar[0].restante -= articulo.cantidad;
+                        });
+                    });
+                }
+            }
+            function agregarTotalCargado(puntosDescarga){
+                puntosDescarga.map(function(punto) {
+                    punto.cantidadACargar = 0;
+                    punto.cargado = 0;
+                });
+                //Agrego cantidad de combustible cargada en los puntos de descarga
+                puntosDescarga.forEach(function(punto) {
+                    punto.articulosAgregados.forEach(function(articulo) {
+                        punto.cargado += articulo.cantidad;
+                    });
+                });
+            }
         }]
     );
@@ -50,13 +50,15 @@
                     <button
                         type="button"
                         class="btn btn-xs p-1 float-right mr-5"
-                        ng-click="eliminar(key, puntoDescarga.id)">
+                        ng-click="eliminar(key, puntoDescarga.id)"
+                        title="Eliminar">
                         <i class="fa fa-trash" aria-hidden="true"></i>
                     </button>
                     <button
                         type="button"
                         class="btn btn-xs p-1 float-right mr-1"
-                        ng-click="editar(puntoDescarga.id)">
+                        ng-click="editar(puntoDescarga.id)"
+                        title="Editar">
                         <i class="fa fa-pencil" aria-hidden="true"></i>
                     </button>
                 </td>
@@ -88,10 +90,11 @@
             <div class="col-12">
                 <label>Descripción</label>
                 <textarea 
-                    class="form-control form-control-sm"
+                    class="form-control form-control-sm text-uppercase"
                     cols="30"
                     rows="5"
-                    ng-model="puntoDescarga.descripcion"></textarea>
+                    ng-model="puntoDescarga.descripcion">
+                </textarea>
             </div>
         </div>
     </form>
@@ -101,61 +104,90 @@
         </div>
         <div ng-show="articulos.length > 0">
             <div class="row">
-                <div class="form-check ml-4" ng-repeat="(key, articulo) in articulos">
-                    <input 
-                        class="form-check-input"
-                        type="radio"
-                        name="exampleRadios"
-                        id="inputRadio{{key}}"
-                        ng-value="key"
-                        ng-model="$parent.articuloSeleccionado"
-                        >
-                    <label class="form-check-label" for="inputRadio{{key}}">
-                        {{articulo.descripcion}} <strong>Cantidad:</strong> {{articulo.cantidad}}
-                    </label>
-                </div>
-            </div>
-            <div class="row">
-                <div class="form-group col-3 mt-3">
-                    <label for="inputCantidad">Cantidad</label>
-                    <input
-                        type="text" 
-                        class="form-control" 
-                        id="inputCantidad" 
-                        placeholder="Cantidad"
-                        ng-model="cantidadArticulo"
-                        >
+                <div class="col-12">
+                    <table class="table table-sm">
+                        <thead>
+                            <tr>
+                                <th></th>
+                                <th>Articulo</th>
+                                <th>Total</th>
+                                <th>Restante</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr ng-repeat="(key, articulo) in articulos">
+                                <td>
+                                    <input 
+                                        type="radio"
+                                        ng-value="key"
+                                        ng-model="$parent.articuloSeleccionado"
+                                    >
+                                </td>
+                                <td ng-bind="articulo.descripcion"></td>
+                                <td ng-bind="articulo.cantidad"></td>
+                                <td ng-bind="articulo.restante"></td>
+                            </tr>
+                        </tbody>
+                    </table>
                 </div>
             </div>
             <div class="row">
-                <div class="col-6" ng-repeat="punto in puntosACargar">
-                    <div class="d-flex">
-                        <h6>{{punto.descripcion}}</h6>
-                        <button
-                            class="btn btn-sm btn-outline-primary ml-auto"
-                            type="button"
-                            ng-click="agregarArticulo(punto)"
-                        >
-                            Agregar
-                        </button>
-                    </div>
+                <div class="col-12">
+                    <h5 class="col-12 my-3">Puntos de descarga</h5>
                     <table class="table table-sm">
                         <thead>
                             <tr>
-                                <th>Articulo</th>
+                                <th>Lugar</th>
+                                <th class="text-right">Total cargado</th>
                                 <th class="text-right">Cantidad</th>
                                 <th></th>
                             </tr>
                         </thead>
                         <tbody>
+                            <tr ng-repeat="punto in puntosACargar">
+                                <td ng-bind="punto.descripcion"></td>
+                                <td ng-bind="punto.cargado" class="text-right"></td>
+                                <td>
+                                    <input
+                                        type="text" 
+                                        class="form-control col-4 float-right" 
+                                        id="inputCantidad" 
+                                        placeholder="A cargar"
+                                        ng-model="punto.cantidadACargar"
+                                    >
+                                </td>
+                                <td>
+                                    <button
+                                        class="btn btn-sm btn-outline-primary ml-auto"
+                                        type="button"
+                                        ng-click="agregarArticulo(punto)"
+                                    >
+                                        Agregar
+                                    </button>
+                                </td>
+                            </tr>
+                        </tbody>
+                    </table>
+                    <table class="table table-sm">
+                        <thead>
+                            <tr>
+                                <th>Lugar</th>
+                                <th>Articulo</th>
+                                <th class="text-right">Cantidad</th>
+                                <th></th>
+                            </tr>
+                        </thead>
+                        <tbody ng-repeat="punto in puntosACargar">
                             <tr ng-repeat="(key, articulo) in punto.articulosAgregados">
+                                <td ng-bind="punto.descripcion"></td>
                                 <td ng-bind="articulo.descripcion" class="p-2"></td>
                                 <td ng-bind="articulo.cantidad" class="text-right p-2"></td>
                                 <td class="p-2">
                                     <button
                                         type="button"
                                         class="btn btn-xs p-1 float-right mr-5"
-                                        ng-click="quitarArticulo(articulo, key, punto)">
+                                        ng-click="quitarArticulo(articulo, key, punto)"
+                                        title="Eliminar">
                                         <i class="fa fa-trash" aria-hidden="true"></i>
                                     </button>
                                 </td>
...	...	@@ -19,10 +19,14 @@ angular.module('focaModalPuntoDescarga')
19	19	id_da_config_0: filters.idDomicilio
20	20	};
21	21	$scope.articulos = angular.copy(filters.articulos);
	22	+ $scope.articulos.map(function(articulo) {
	23	+ articulo.restante = articulo.cantidad;
	24	+ });
22	25	actualizarTabla();
	26	+ cargarPuntos(filters.puntosDescarga);
23	27
24	28	$scope.cancel = function() {
25		- if($scope.ingreso){
	29	+ if($scope.ingreso) {
26	30	$scope.ingreso = false;
27	31	}else {
28	32	$uibModalInstance.dismiss('cancel');
...	...	@@ -60,33 +64,56 @@ angular.module('focaModalPuntoDescarga')
60	64	};
61	65
62	66	$scope.seleccionarPunto = function(idx) {
63		- $scope.puntosSeleccionados.push(idx);
	67	+ var indexPunto = $scope.puntosSeleccionados.indexOf(idx);
	68	+ if(indexPunto !== -1) {
	69	+ $scope.puntosSeleccionados.splice(indexPunto, 1);
	70	+ }else {
	71	+ $scope.puntosSeleccionados.push(idx);
	72	+ }
64	73	};
65	74
66	75	$scope.agregarArticulo = function(punto) {
67	76	var articulo = $scope.articulos[$scope.articuloSeleccionado],
68		- cantidadRestante = articulo.cantidad - $scope.cantidadArticulo;
	77	+ cantidadRestante = articulo.restante - punto.cantidadACargar;
69	78
70	79	if(cantidadRestante < 0) {
71	80	alert('La cantidad a cargar debe ser menor o igual al restante');
72		- }else if($scope.cantidadArticulo <= 0) {
	81	+ }else if(punto.cantidadACargar <= 0) {
73	82	alert('La cantidad a cargar debe ser mayor que cero');
74	83	}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;
	84	+ punto.cargado += parseInt(punto.cantidadACargar);
	85	+ articulo.restante = cantidadRestante;
	86	+ var existeArticulo = punto.articulosAgregados.filter(
	87	+ function (articuloAAgregar) {
	88	+ return articuloAAgregar.id === articulo.id;
	89	+ });
	90	+ //Si el articulo ya fue agregado
	91	+ if(existeArticulo.length) {
	92	+ //Solo sumo cantidad
	93	+ var total = parseInt(existeArticulo[0].cantidad) + parseInt(punto.cantidadACargar);
	94	+ existeArticulo[0].cantidad = total;
	95	+ }else {
	96	+ //Agrego el articulo con la cantidad
	97	+ punto.articulosAgregados.push({
	98	+ id: articulo.id,
	99	+ descripcion: articulo.descripcion,
	100	+ cantidad: punto.cantidadACargar,
	101	+ index: $scope.articuloSeleccionado
	102	+ });
	103	+ }
	104	+ punto.cantidadACargar = 0;
83	105	}
84	106	};
85	107
86	108	$scope.quitarArticulo = function(articulo, idx, punto) {
87		- var restante = parseInt($scope.articulos[articulo.index].cantidad);
	109	+ var articuloAEliminar = $scope.articulos.filter(function(art) {
	110	+ return art.id == articulo.id;
	111	+ });
	112	+ var restante = parseInt(articuloAEliminar[0].restante);
88	113	restante += parseInt(articulo.cantidad);
89		- $scope.articulos[articulo.index].cantidad = restante;
	114	+ articuloAEliminar[0].restante = restante;
	115	+
	116	+ punto.cargado -= parseInt(punto.articulosAgregados[idx].cantidad);
90	117	punto.articulosAgregados.splice(idx, 1);
91	118	};
92	119
...	...	@@ -106,10 +133,44 @@ angular.module('focaModalPuntoDescarga')
106	133
107	134	$scope.puntosACargar.map(function(punto) {
108	135	punto.articulosAgregados = [];
	136	+ punto.cantidadACargar = 0;
	137	+ punto.cargado = 0;
109	138	});
110	139	}
111	140	function cargarArticulos() {
112	141	$uibModalInstance.close($scope.puntosACargar);
113	142	}
	143	+ function cargarPuntos(puntosDescarga) {
	144	+ //Si existen puntos ya cargados
	145	+ if(puntosDescarga) {
	146	+ if(!puntosDescarga[0].cargado) {
	147	+ agregarTotalCargado(puntosDescarga);
	148	+ }
	149	+ $scope.puntosACargar = puntosDescarga;
	150	+ $scope.cargaArticulos = true;
	151	+ //Recorro los puntos
	152	+ puntosDescarga.forEach(function(punto) {
	153	+ //Recorro los articulos cargados en cada punto
	154	+ punto.articulosAgregados.forEach(function(articulo) {
	155	+ var articuloARestar = $scope.articulos.filter(function(art) {
	156	+ return art.id == articulo.id;
	157	+ });
	158	+ articuloARestar[0].restante -= articulo.cantidad;
	159	+ });
	160	+ });
	161	+ }
	162	+ }
	163	+ function agregarTotalCargado(puntosDescarga){
	164	+ puntosDescarga.map(function(punto) {
	165	+ punto.cantidadACargar = 0;
	166	+ punto.cargado = 0;
	167	+ });
	168	+ //Agrego cantidad de combustible cargada en los puntos de descarga
	169	+ puntosDescarga.forEach(function(punto) {
	170	+ punto.articulosAgregados.forEach(function(articulo) {
	171	+ punto.cargado += articulo.cantidad;
	172	+ });
	173	+ });
	174	+ }
114	175	}]
115	176	);
...	...	@@ -50,13 +50,15 @@
50	50	<button
51	51	type="button"
52	52	class="btn btn-xs p-1 float-right mr-5"
53		- ng-click="eliminar(key, puntoDescarga.id)">
	53	+ ng-click="eliminar(key, puntoDescarga.id)"
	54	+ title="Eliminar">
54	55	<i class="fa fa-trash" aria-hidden="true"></i>
55	56	</button>
56	57	<button
57	58	type="button"
58	59	class="btn btn-xs p-1 float-right mr-1"
59		- ng-click="editar(puntoDescarga.id)">
	60	+ ng-click="editar(puntoDescarga.id)"
	61	+ title="Editar">
60	62	<i class="fa fa-pencil" aria-hidden="true"></i>
61	63	</button>
62	64	</td>
...	...	@@ -88,10 +90,11 @@
88	90	<div class="col-12">
89	91	<label>Descripción</label>
90	92	<textarea
91		- class="form-control form-control-sm"
	93	+ class="form-control form-control-sm text-uppercase"
92	94	cols="30"
93	95	rows="5"
94		- ng-model="puntoDescarga.descripcion"></textarea>
	96	+ ng-model="puntoDescarga.descripcion">
	97	+ </textarea>
95	98	</div>
96	99	</div>
97	100	</form>
...	...	@@ -101,61 +104,90 @@
101	104	</div>
102	105	<div ng-show="articulos.length > 0">
103	106	<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		- >
	107	+ <div class="col-12">
	108	+ <table class="table table-sm">
	109	+ <thead>
	110	+ <tr>
	111	+ <th></th>
	112	+ <th>Articulo</th>
	113	+ <th>Total</th>
	114	+ <th>Restante</th>
	115	+ </tr>
	116	+ </thead>
	117	+ <tbody>
	118	+ <tr ng-repeat="(key, articulo) in articulos">
	119	+ <td>
	120	+ <input
	121	+ type="radio"
	122	+ ng-value="key"
	123	+ ng-model="$parent.articuloSeleccionado"
	124	+ >
	125	+ </td>
	126	+ <td ng-bind="articulo.descripcion"></td>
	127	+ <td ng-bind="articulo.cantidad"></td>
	128	+ <td ng-bind="articulo.restante"></td>
	129	+ </tr>
	130	+ </tbody>
	131	+ </table>
128	132	</div>
129	133	</div>
130	134	<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>
	135	+ <div class="col-12">
	136	+ <h5 class="col-12 my-3">Puntos de descarga</h5>
142	137	<table class="table table-sm">
143	138	<thead>
144	139	<tr>
145		- <th>Articulo</th>
	140	+ <th>Lugar</th>
	141	+ <th class="text-right">Total cargado</th>
146	142	<th class="text-right">Cantidad</th>
147	143	<th></th>
148	144	</tr>
149	145	</thead>
150	146	<tbody>
	147	+ <tr ng-repeat="punto in puntosACargar">
	148	+ <td ng-bind="punto.descripcion"></td>
	149	+ <td ng-bind="punto.cargado" class="text-right"></td>
	150	+ <td>
	151	+ <input
	152	+ type="text"
	153	+ class="form-control col-4 float-right"
	154	+ id="inputCantidad"
	155	+ placeholder="A cargar"
	156	+ ng-model="punto.cantidadACargar"
	157	+ >
	158	+ </td>
	159	+ <td>
	160	+ <button
	161	+ class="btn btn-sm btn-outline-primary ml-auto"
	162	+ type="button"
	163	+ ng-click="agregarArticulo(punto)"
	164	+ >
	165	+ Agregar
	166	+ </button>
	167	+ </td>
	168	+ </tr>
	169	+ </tbody>
	170	+ </table>
	171	+ <table class="table table-sm">
	172	+ <thead>
	173	+ <tr>
	174	+ <th>Lugar</th>
	175	+ <th>Articulo</th>
	176	+ <th class="text-right">Cantidad</th>
	177	+ <th></th>
	178	+ </tr>
	179	+ </thead>
	180	+ <tbody ng-repeat="punto in puntosACargar">
151	181	<tr ng-repeat="(key, articulo) in punto.articulosAgregados">
	182	+ <td ng-bind="punto.descripcion"></td>
152	183	<td ng-bind="articulo.descripcion" class="p-2"></td>
153	184	<td ng-bind="articulo.cantidad" class="text-right p-2"></td>
154	185	<td class="p-2">
155	186	<button
156	187	type="button"
157	188	class="btn btn-xs p-1 float-right mr-5"
158		- ng-click="quitarArticulo(articulo, key, punto)">
	189	+ ng-click="quitarArticulo(articulo, key, punto)"
	190	+ title="Eliminar">
159	191	<i class="fa fa-trash" aria-hidden="true"></i>
160	192	</button>
161	193	</td>