Commit 761e2779b55f174af3e665876d7635533763b07b

Authored by Benjamin Rodriguez
1 parent 85e02bd58e
Exists in master

hojaruta

src/js/controller.js
1 angular.module('focaOrdenCarga') 1 angular.module('focaOrdenCarga')
2 .controller('focaOrdenCargaController', [ 2 .controller('focaOrdenCargaController', [
3 '$scope', 3 '$scope',
4 '$location', 4 '$location',
5 '$filter', 5 '$filter',
6 '$timeout', 6 '$timeout',
7 'focaOrdenCargaService', 7 'focaOrdenCargaService',
8 'focaBotoneraLateralService', 8 'focaBotoneraLateralService',
9 'focaModalService', 9 'focaModalService',
10 '$uibModal', 10 '$uibModal',
11 function ( 11 function (
12 $scope, $location, $filter, $timeout, focaOrdenCargaService, 12 $scope, $location, $filter, $timeout, focaOrdenCargaService,
13 focaBotoneraLateralService, focaModalService, $uibModal) { 13 focaBotoneraLateralService, focaModalService, $uibModal) {
14 14
15 init(); 15 init();
16 16
17 function init() { 17 function init() {
18 // PARAMETROS INICIALES PARA FUNCIONAMIENTO DEL PROGRAMA 18 // PARAMETROS INICIALES PARA FUNCIONAMIENTO DEL PROGRAMA
19 $scope.fecha = new Date(); 19 $scope.fecha = new Date();
20 $scope.isNumber = angular.isNumber; 20 $scope.isNumber = angular.isNumber;
21 $scope.show = false; 21 $scope.show = false;
22 $scope.cargando = true; 22 $scope.cargando = true;
23 $scope.cabeceras = []; 23 $scope.cabeceras = [];
24 $scope.botonera = focaOrdenCargaService.getBotonera(); 24 $scope.botonera = focaOrdenCargaService.getBotonera();
25 $scope.dateOptions = { 25 $scope.dateOptions = {
26 maxDate: new Date(), 26 maxDate: new Date(),
27 minDate: new Date(2010, 0, 1) 27 minDate: new Date(2010, 0, 1)
28 }; 28 };
29
30 $scope.ordenCarga = { 29 $scope.ordenCarga = {
31 id: 0, 30 id: 0,
32 cliente: {}, 31 cliente: {},
33 proveedor: {}, 32 proveedor: {},
34 domicilio: { dom: '' }, 33 domicilio: { dom: '' },
35 vendedor: {}, 34 vendedor: {},
36 fechaCarga: new Date(), 35 fechaCarga: new Date(),
37 cotizacion: {}, 36 cotizacion: {},
38 articulosNotaPedido: [], 37 articulosNotaPedido: [],
39 notaPedidoPlazo: [], 38 notaPedidoPlazo: [],
40 notaPedidoPuntoDescarga: [] 39 notaPedidoPuntoDescarga: []
41 }; 40 };
42 $scope.hojaRuta = { 41 $scope.hojaRuta = {
43 fecha: new Date(), 42 fecha: new Date(),
44 litros: 0, 43 litros: 0,
45 chofer: {}, 44 chofer: {},
46 vehiculo: { 45 vehiculo: {
47 capacidad: 0, 46 capacidad: 0,
48 cisternas: [] 47 cisternas: []
49 }, 48 },
50 transportista: {}, 49 transportista: {},
51 remitosTabla: [] 50 remitosTabla: []
52 }; 51 };
53 } 52 }
54 53
55 //SETEO BOTONERA LATERAL 54 //SETEO BOTONERA LATERAL
56 $timeout(function () { 55 $timeout(function () {
57 focaBotoneraLateralService.showSalir(false); 56 focaBotoneraLateralService.showSalir(false);
58 focaBotoneraLateralService.showPausar(true); 57 focaBotoneraLateralService.showPausar(true);
59 focaBotoneraLateralService.showGuardar(true, $scope.crearNotaPedido); 58 focaBotoneraLateralService.showGuardar(true, $scope.crearNotaPedido);
60 focaBotoneraLateralService.addCustomButton('Salir', salir); 59 focaBotoneraLateralService.addCustomButton('Salir', salir);
61 }); 60 });
62 61
63 function seleccionarTransportista() {
64 var parametrosModal = {
65 titulo: 'Búsqueda de Transportista',
66 query: '/transportista',
67 columnas: [
68 {
69 nombre: 'Código',
70 propiedad: 'COD'
71 },
72 {
73 nombre: 'Nombre',
74 propiedad: 'NOM'
75 },
76 {
77 nombre: 'CUIT',
78 propiedad: 'CUIT'
79 }
80 ]
81 };
82 return focaModalService.modal(parametrosModal);
83 };
84
85 $scope.seleccionarVehiculo = function () { 62 $scope.seleccionarVehiculo = function () {
86 63
87 seleccionarTransportista().then( 64 seleccionarTransportista().then(
88 65
89 function (transportista) { 66 function (transportista) {
90 elegirTransportista(transportista); 67 elegirTransportista(transportista);
91 68
92 var parametrosModal = { 69 var parametrosModal = {
93 columnas: [ 70 columnas: [
94 { 71 {
95 propiedad: 'codigo', 72 propiedad: 'codigo',
96 nombre: 'Código' 73 nombre: 'Código'
97 }, 74 },
98 { 75 {
99 propiedad: 'tractor', 76 propiedad: 'tractor',
100 nombre: 'tractor' 77 nombre: 'tractor'
101 }, 78 },
102 { 79 {
103 propiedad: 'semi', 80 propiedad: 'semi',
104 nombre: 'Semi' 81 nombre: 'Semi'
105 }, 82 },
106 { 83 {
107 propiedad: 'capacidadTotalCisternas', 84 propiedad: 'capacidadTotalCisternas',
108 nombre: 'Capacidad' 85 nombre: 'Capacidad'
109 } 86 }
110 ], 87 ],
111 query: '/vehiculo/transportista/' + transportista.COD, 88 query: '/vehiculo/transportista/' + transportista.COD,
112 titulo: 'Búsqueda de vehiculos', 89 titulo: 'Búsqueda de vehiculos',
113 subTitulo: transportista.COD + '-' + transportista.NOM 90 subTitulo: transportista.COD + '-' + transportista.NOM
114 }; 91 };
115 92
116 focaModalService.modal(parametrosModal).then( 93 focaModalService.modal(parametrosModal).then(
117 function (vehiculo) { 94 function (vehiculo) {
118 $scope.$broadcast('addCabecera', { 95 $scope.$broadcast('addCabecera', {
119 label: 'Vehículo:', 96 label: 'Vehículo:',
120 valor: vehiculo.codigo 97 valor: vehiculo.codigo
121 }); 98 });
122 $scope.hojaRuta.vehiculo = vehiculo; 99 $scope.hojaRuta.vehiculo = vehiculo;
123 $scope.hojaRuta.transportista = transportista; 100 $scope.hojaRuta.transportista = transportista;
124 $scope.hojaRuta.vehiculo.cisternas = vehiculo.cisternas; 101 $scope.hojaRuta.vehiculo.cisternas = vehiculo.cisternas;
125 getEstadosCisternas($scope.hojaRuta.vehiculo.cisternas); 102 getEstadosCisternas($scope.hojaRuta.vehiculo.cisternas);
126 }, function () { 103 }, function () {
127 seleccionarTransportista(); 104 seleccionarTransportista();
128 }); 105 });
129 }); 106 });
130 }; 107 };
131 108
132 $scope.seleccionarVerCisternas = function () { 109 function seleccionarTransportista() {
133 if (!$scope.hojaRuta.vehiculo.cisternas.length) { 110 var parametrosModal = {
134 focaModalService.alert('Primero seleccione un vehículo con cisternas'); 111 titulo: 'Búsqueda de Transportista',
135 return; 112 query: '/transportista',
136 } 113 columnas: [
137 console.log($scope.hojaRuta.vehiculo); 114 {
138 $uibModal.open( 115 nombre: 'Código',
139 { 116 propiedad: 'COD'
140 ariaLabelledBy: 'Grafico de cisternas', 117 },
141 templateUrl: 'modal-grafico-cisternas.html', 118 {
142 controller: 'focaModalGraficoCisternasController', 119 nombre: 'Nombre',
143 size: 'md', 120 propiedad: 'NOM'
144 resolve: { 121 },
145 filters: { 122 {
146 cisternas: $scope.hojaRuta.vehiculo.cisternas 123 nombre: 'CUIT',
147 } 124 propiedad: 'CUIT'
148 } 125 }
149 } 126 ]
150 ); 127 };
128 return focaModalService.modal(parametrosModal);
151 }; 129 };
152 130
153 $scope.seleccionarFechaDeReparto = function () { 131 $scope.seleccionarFechaDeReparto = function () {
154 focaModalService.modalFecha('Fecha').then(function (fecha) { 132 focaModalService.modalFecha('Fecha').then(function (fecha) {
155 $scope.$broadcast('addCabecera', { 133 $scope.$broadcast('addCabecera', {
156 label: 'Fecha:', 134 label: 'Fecha:',
157 valor: fecha.toLocaleDateString() 135 valor: fecha.toLocaleDateString()
158 }); 136 });
159 137
160 $scope.fecha = fecha; 138 $scope.fecha = fecha;
161 if ($scope.hojaRuta.vehiculo.cisternas) 139 if ($scope.hojaRuta.vehiculo.cisternas)
162 getEstadosCisternas($scope.hojaRuta.vehiculo.cisternas); 140 getEstadosCisternas($scope.hojaRuta.vehiculo.cisternas);
163 }); 141 });
164 }; 142 };
165 143
144 $scope.seleccionarHojasDeRuta = function () {
145 if (!$scope.hojaRuta.vehiculo.cisternas.length) {
146 focaModalService.alert('Primero seleccione un vehículo con cisternas');
147 return;
148 }
149 $uibModal.open(
150 {
151 ariaLabelledBy: 'Hojas de Ruta',
152 templateUrl: 'modal-hojas-ruta.html',
153 controller: 'focaOrdenCargaController',
154 size: 'md',
155 resolve: {
156 filters: {
157 cisternas: $scope.hojaRuta.vehiculo.id
158 }
159 }
160 }
161 );
162 var idVehiculo = $scope.hojaRuta.vehiculo.id
163 focaOrdenCargaService.getHojasRuta(idVehiculo)
164 .then(function (res) {
165 console.log(res);
166 })
167 .catch(function (err) {
168 console.error(err)
169 })
170 }
171
166 $scope.seleccionarRemitoAbierto = function () { 172 $scope.seleccionarRemitoAbierto = function () {
167 if ($scope.hojaRuta.vehiculo.capacidad === 0) { 173 if ($scope.hojaRuta.vehiculo.capacidad === 0) {
168 focaModalService.alert('Debe ingresar vehiculo'); 174 focaModalService.alert('Debe ingresar vehiculo');
169 return; 175 return;
170 } else { 176 } else {
171 mostrarDetalle($scope.hojaRuta); 177 mostrarDetalle($scope.hojaRuta);
172 } 178 }
173 }; 179 };
174 180
175 $scope.seleccionarChofer = function () { 181 $scope.seleccionarChofer = function () {
176 var parametrosModal = { 182 var parametrosModal = {
177 titulo: 'Búsqueda de Chofer', 183 titulo: 'Búsqueda de Chofer',
178 query: '/chofer', 184 query: '/chofer',
179 columnas: [ 185 columnas: [
180 { 186 {
181 propiedad: 'id', 187 propiedad: 'id',
182 nombre: 'Código', 188 nombre: 'Código',
183 filtro: { 189 filtro: {
184 nombre: 'rellenarDigitos', 190 nombre: 'rellenarDigitos',
185 parametro: 3 191 parametro: 3
186 } 192 }
187 }, 193 },
188 { 194 {
189 propiedad: 'nombre', 195 propiedad: 'nombre',
190 nombre: 'Nombre' 196 nombre: 'Nombre'
191 }, 197 },
192 { 198 {
193 propiedad: 'dni', 199 propiedad: 'dni',
194 nombre: 'DNI' 200 nombre: 'DNI'
195 }, 201 },
196 { 202 {
197 propiedad: 'telefono', 203 propiedad: 'telefono',
198 nombre: 'Teléfono' 204 nombre: 'Teléfono'
199 } 205 }
200 ] 206 ]
201 }; 207 };
202 focaModalService.modal(parametrosModal).then( 208 focaModalService.modal(parametrosModal).then(
203 function (chofer) { 209 function (chofer) {
204 $scope.ordenCarga.chofer = chofer; 210 $scope.ordenCarga.chofer = chofer;
205 $scope.$broadcast('addCabecera', { 211 $scope.$broadcast('addCabecera', {
206 label: 'Chofer:', 212 label: 'Chofer:',
207 valor: $filter('rellenarDigitos')(chofer.id, 3) + ' - ' + chofer.nombre 213 valor: $filter('rellenarDigitos')(chofer.id, 3) + ' - ' + chofer.nombre
208 }); 214 });
209 215
210 $filter('filter')($scope.botonera, { 216 $filter('filter')($scope.botonera, {
211 label: 'Chofer', 217 label: 'Chofer',
212 })[0].checked = true; 218 })[0].checked = true;
213 }, function () { 219 }, function () {
214 // funcion ejecutada cuando se cancela el modal 220 // funcion ejecutada cuando se cancela el modal
215 } 221 }
216 ); 222 );
217 }; 223 };
218 224
219 function getEstadosCisternas(cisternas) { 225 $scope.seleccionarGraficar = function () {
220 cisternas.forEach(function (cisterna) { 226 if (!$scope.hojaRuta.vehiculo.cisternas.length) {
221 focaOrdenCargaService 227 focaModalService.alert('Primero seleccione un vehículo con cisternas');
222 .getEstadoCisterna(cisterna.id, $scope.fecha) 228 return;
223 .then(function (res) { 229 }
224 cisterna.estado = res.data; 230 $uibModal.open(
225 }) 231 {
226 .catch(function (err) { console.error(err) }); 232 ariaLabelledBy: 'Grafico de cisternas',
227 }); 233 templateUrl: 'modal-grafico-cisternas.html',
228 } 234 controller: 'focaModalGraficoCisternasController',
235 size: 'md',
236 resolve: {
237 filters: {
238 cisternas: $scope.hojaRuta.vehiculo.cisternas
239 }
240 }
241 }
242 );
243 };
229 244
230 function elegirTransportista(transportista) { 245 function elegirTransportista(transportista) {
231 var codigo = ('00000' + transportista.COD).slice(-5); 246 var codigo = ('00000' + transportista.COD).slice(-5);
232 $scope.idTransportista = transportista.COD; 247 $scope.idTransportista = transportista.COD;
233 $scope.filtros = transportista.NOM.trim(); 248 $scope.filtros = transportista.NOM.trim();
234 $scope.$broadcast('addCabecera', { 249 $scope.$broadcast('addCabecera', {
235 label: 'Transportista:', 250 label: 'Transportista:',
236 valor: codigo + ' - ' + transportista.NOM 251 valor: codigo + ' - ' + transportista.NOM
237 }); 252 });
238 } 253 }
239 254
255 function getEstadosCisternas(cisternas) {
256 cisternas.forEach(function (cisterna) {
257 focaOrdenCargaService
258 .getEstadoCisterna(cisterna.id, $scope.fecha)
259 .then(function (res) {
260 cisterna.estado = res.data;
261 })
262 .catch(function (err) { console.error(err) });
263 });
264 }
265
240 function mostrarDetalle(hojasRutas) { 266 function mostrarDetalle(hojasRutas) {
241 var modalInstance = $uibModal.open( 267 var modalInstance = $uibModal.open(
242 { 268 {
243 ariaLabelledBy: '', 269 ariaLabelledBy: '',
244 templateUrl: 'modal-detalle-carga.html', 270 templateUrl: 'modal-detalle-carga.html',
245 controller: 'focaModalDetalleController', 271 controller: 'focaModalDetalleController',
246 resolve: { 272 resolve: {
247 parametrosModal: function () { 273 parametrosModal: function () {
248 return { 274 return {
249 hojasRutas: hojasRutas, 275 hojasRutas: hojasRutas,
250 orden: $scope.hojaRuta.orden 276 orden: $scope.hojaRuta.orden
251 }; 277 };
252 } 278 }
253 }, 279 },
254 size: 'lg', 280 size: 'lg',
255 backdrop: false 281 backdrop: false
256 } 282 }
257 ); 283 );
258 return modalInstance.result 284 return modalInstance.result
259 .then(function (res) { 285 .then(function (res) {
260 res.cisternas.forEach(function (cisterna) { 286 res.cisternas.forEach(function (cisterna) {
261 $scope.cisternaCargas.push(cisterna.cisternaCarga); 287 $scope.cisternaCargas.push(cisterna.cisternaCarga);
262 }); 288 });
263 $scope.cisternaMovimientos = res.movimientos; 289 $scope.cisternaMovimientos = res.movimientos;
264 $scope.articulosRecibidos = res.articulos; 290 $scope.articulosRecibidos = res.articulos;
265 $scope.articulos = res.articulos; 291 $scope.articulos = res.articulos;
266 $filter('filter')($scope.botonera, { 292 $filter('filter')($scope.botonera, {
267 label: 'Detalle de Carga', 293 label: 'Detalle de Carga',
268 })[0].checked = true; 294 })[0].checked = true;
269 }) 295 })
270 .catch(function (e) { console.error(e); }); 296 .catch(function (e) { console.error(e); });
271 }; 297 };
272 298
273 function crearOrdenCarga() { 299 function crearOrdenCarga() {
300 if (!$scope.hojaRuta.vehiculo) {
301 focaModalService.alert('Ingrese Vehículo');
302 return;
303 } else if (!$scope.hojaRuta.chofer) {
304 focaBotoneraLateralService.alert('Ingrese Chofer');
305 return;
306 }
274 307
275 focaBotoneraLateralService.startGuardar(); 308 focaBotoneraLateralService.startGuardar();
276 $scope.saveLoading = true; 309 $scope.saveLoading = true;
310
277 } 311 }
278 312
279 $scope.$watch('ordenCarga', function (newValue) { 313 $scope.$watch('ordenCarga', function (newValue) {
280 focaBotoneraLateralService.setPausarData({ 314 focaBotoneraLateralService.setPausarData({
281 label: 'ordenCarga', 315 label: 'ordenCarga',
282 val: newValue 316 val: newValue
283 }); 317 });
284 }, true); 318 }, true);
285 319
286 $scope.$watch('ordenCarga', function (newValue) { 320 $scope.$watch('ordenCarga', function (newValue) {
287 focaBotoneraLateralService.setPausarData({ 321 focaBotoneraLateralService.setPausarData({
288 label: 'ordenCarga', 322 label: 'ordenCarga',
289 val: newValue 323 val: newValue
290 }); 324 });
291 focaBotoneraLateralService.setRutasPausadas({ 325 focaBotoneraLateralService.setRutasPausadas({
292 label: 'rutas', 326 label: 'rutas',
293 val: 'orden-carga' 327 val: 'orden-carga'
294 }); 328 });
295 }, true); 329 }, true);
296 330
297 $scope.salir = function () { 331 $scope.salir = function () {
298 $location.path('/'); 332 $location.path('/');
1 angular.module('focaOrdenCarga') 1 angular.module('focaOrdenCarga')
2 .factory('focaOrdenCargaService', ['$http', 'API_ENDPOINT', function ($http, API_ENDPOINT) { 2 .factory('focaOrdenCargaService', ['$http', 'API_ENDPOINT', function ($http, API_ENDPOINT) {
3 return { 3 return {
4 getVehiculos: function () { 4 getVehiculos: function () {
5 return $http.get(API_ENDPOINT.URL + '/vehiculo'); 5 return $http.get(API_ENDPOINT.URL + '/vehiculo');
6 }, 6 },
7 getTransportistas: function () { 7 getTransportistas: function () {
8 return $http.get(API_ENDPOINT.URL + '/transportista'); 8 return $http.get(API_ENDPOINT.URL + '/transportista');
9 }, 9 },
10 getCisternadoPorVehiculo: function (idVehiculo) { 10 getCisternadoPorVehiculo: function (idVehiculo) {
11 return $http.get(API_ENDPOINT.URL + '/cisterna/listar/' + idVehiculo); 11 return $http.get(API_ENDPOINT.URL + '/cisterna/listar/' + idVehiculo);
12 }, 12 },
13 getCisterna: function (id) { 13 getCisterna: function (id) {
14 return $http.get(API_ENDPOINT.URL + '/cisterna/obtener/' + id); 14 return $http.get(API_ENDPOINT.URL + '/cisterna/obtener/' + id);
15 }, 15 },
16 guardarCisterna: function (cisterna) { 16 guardarCisterna: function (cisterna) {
17 return $http.post(API_ENDPOINT.URL + '/cisterna/guardar', { cisterna: cisterna }); 17 return $http.post(API_ENDPOINT.URL + '/cisterna/guardar', { cisterna: cisterna });
18 }, 18 },
19 deleteCisterna: function (id) { 19 deleteCisterna: function (id) {
20 return $http.delete(API_ENDPOINT.URL + '/cisterna/borrar/' + id); 20 return $http.delete(API_ENDPOINT.URL + '/cisterna/borrar/' + id);
21 }, 21 },
22 getVehiculosPorTransportista: function (id) { 22 getVehiculosPorTransportista: function (id) {
23 return $http.get(API_ENDPOINT.URL + '/vehiculo/transportista/' + id); 23 return $http.get(API_ENDPOINT.URL + '/vehiculo/transportista/' + id);
24 }, 24 },
25 getEstadoCisterna: function (id, fecha) { 25 getEstadoCisterna: function (id, fecha) {
26 console.log(id, " ", fecha); 26 console.log(id, " ", fecha);
27 return $http.post(API_ENDPOINT.URL + '/cisterna/stock', 27 return $http.post(API_ENDPOINT.URL + '/cisterna/stock',
28 { idCisterna: id, fecha: fecha }); 28 { idCisterna: id, fecha: fecha });
29 }, 29 },
30 getHojasRuta: function (idVehiculo) {
31 return $http.get(API_ENDPOINT.URL + '/orden-carga/hoja-ruta/' + idVehiculo);
32 },
30 getBotonera: function () { 33 getBotonera: function () {
31 var result = [ 34 var result = [
32 { 35 {
33 label: 'Vehiculo', 36 label: 'Vehiculo',
34 image: 'vehiculo_secundario.png' 37 image: 'vehiculo_secundario.png'
35 }, 38 },
36 { 39 {
37 label: 'Fecha de Reparto', 40 label: 'Fecha de Reparto',
38 image: 'fechaDeEntrega.png' 41 image: 'fechaDeEntrega.png'
39 }, 42 },
40 { 43 {
41 label: 'Hojas de Ruta', 44 label: 'Hojas de Ruta',
42 image: 'hojaDeRuta.png' 45 image: 'hojaDeRuta.png'
43 }, 46 },
44 { 47 {
45 label: 'Remito Abierto', 48 label: 'Remito Abierto',
46 image: 'remito_abierto.png' 49 image: 'remito_abierto.png'
47 }, 50 },
48 { 51 {
49 label: 'Chofer', 52 label: 'Chofer',
50 image: 'chofer_secundario.png' 53 image: 'chofer_secundario.png'
51 }, 54 },
52 { 55 {
53 label: 'Ver Cisternas', 56 label: 'Graficar',
54 image: 'verCisterna.png' 57 image: 'graficar.png'
55 } 58 }
56 ]; 59 ];
57 return result; 60 return result;
58 }, 61 },
62
59 }; 63 };
60 }]); 64 }]);
61 65
src/views/orden-carga.html
1 <div class="row"> 1 <div class="row">
2 <foca-cabecera-facturador titulo="'Orden de Carga'" numero="puntoVenta + '-' + comprobante" 2 <foca-cabecera-facturador titulo="'Orden de Carga'" numero="puntoVenta + '-' + comprobante"
3 fecha="ordenCarga.fechaCarga" class="mb-0 col-lg-12"></foca-cabecera-facturador> 3 fecha="ordenCarga.fechaCarga" class="mb-0 col-lg-12"></foca-cabecera-facturador>
4 </div> 4 </div>
5 <div class="row"> 5 <div class="row">
6 <div class="col-12 col-md-10 p-0 mt-4 border border-white rounded"> 6 <div class="col-12 col-md-10 p-0 mt-4 border border-white rounded">
7 <div class="row px-5 py-2 botonera-secundaria"> 7 <div class="row px-5 py-2 botonera-secundaria">
8 <div class="col-12"> 8 <div class="col-12">
9 <foca-botonera-facturador botones="botonera" max="6" class="row"></foca-botonera-facturador> 9 <foca-botonera-facturador botones="botonera" max="6" class="row"></foca-botonera-facturador>
10 </div> 10 </div>
11 </div> 11 </div>
12 12
13 <table class="table table-default table-hover table-sm table-abm table-striped mb-0"> 13 <table class="table table-default table-hover table-sm table-abm table-striped mb-0">
14 <thead> 14 <thead>
15 <tr> 15 <tr>
16 <th>Cisterna</th> 16 <th>Cisterna</th>
17 <th>Producto</th> 17 <th>Producto</th>
18 <th>Capacidad Total</th> 18 <th>Capacidad Total</th>
19 <th>Carga</th> 19 <th>Carga</th>
20 <th>Disponible</th> 20 <th>Disponible</th>
21 <th class="text-center"> 21 <th class="text-center">
22 </th> 22 </th>
23 </tr> 23 </tr>
24 </thead> 24 </thead>
25 <tbody> 25 <tbody>
26 <tr> 26 <tr ng-repeat="cisterna in hojaRuta.vehiculo.cisternas">
27 <th scope="row">-</th> 27 <td ng-bind="cisterna.codigo"></td>
28 <td>-</td> 28 <td>producto</td>
29 <td>-</td> 29 <td ng-bind="cisterna.capacidad"></td>
30 <td>-</td> 30 <td ng-bind="cisterna.cantidadDescargada"></td>
31 <td>-</td> 31 <td>{{cisterna.capacidad - cisterna.cantidadDescargada}}</td>
32 </tr>
33 </tr>
34 <tr>
35 <th scope="row">-</th>
36 <td>-</td>
37 <td>-</td>
38 <td>-</td>
39 <td>-</td>
40 </tr>
41 <tr>
42 <th scope="row">-</th>
43 <td>-</td>
44 <td>-</td>
45 <td>-</td>
46 <td>-</td>
47 </tr> 32 </tr>
48 </tbody> 33 </tbody>
49
50 </table> 34 </table>
51 </div> 35 </div>
52 </div> 36 </div>