Jose Pinto / foca-logistica-pedido-ruta

Download as
Browse Code »

Commit 9ba5c967b754f74f3c7a82ac8428edfaa1b66c00

Authored by Eric Fernandez
1 parent 960bd05b6b
Exists in master

logistica de pedidos

Showing 7 changed files with 242 additions and 293 deletions   Show diff stats
File was created 1 function allowDrop(ev) {
2 ev.preventDefault();
3 }
4 function drag(ev, marcador) {
5 marcador = JSON.stringify(marcador);
6 ev.dataTransfer.setData('marcador', marcador);
7 var elementoDom = document.getElementById('test');
8 var scope = angular.element(elementoDom).scope();
9 scope.arrastra();
10 }
11 function drop(ev) {
12 ev.preventDefault();
13 var data = ev.dataTransfer.getData('marcador');
14 var elementoDom = document.getElementById(ev.target.id);
15 var elementoAngular = angular.element(elementoDom);
16 var elementoScope = elementoAngular.scope();
17 elementoScope.cargar(ev.target.id, data);
18 elementoScope.$digest();
19 }
20 function dropEnd() {
21 console.log('drop');
22 var elementoDom = document.getElementById('test');
23 var scope = angular.element(elementoDom).scope();
24 scope.noArrastra();
25 }
src/js/controller.js
Diff comments   View file @ 9ba5c96
1 angular.module('focaLogisticaPedidoRuta') .controller('focaLogisticaPedidoRutaController', [ 1 angular.module('focaLogisticaPedidoRuta') .controller('focaLogisticaPedidoRutaController', [
2 '$scope', 'focaLogisticaPedidoRutaService', '$location', '$uibModal', '$filter', 2 '$scope', 'focaLogisticaPedidoRutaService', '$location', '$uibModal', '$filter',
3 function($scope, focaLogisticaPedidoRutaService, $location, $uibModal, $filter) { 3 'focaModalService', 'focaBotoneraLateralService',
4 $scope.actividad = ''; 4 function($scope, focaLogisticaPedidoRutaService, $location, $uibModal, $filter,
5 5 focaModalService, focaBotoneraLateralService
6 ) {
6 $scope.now = new Date(); 7 $scope.now = new Date();
7 $scope.actividad = 'Nota de pedido'; 8 $scope.actividad = 'Logistica';
9
10 //Datos Pantalla
11 $scope.titulo = 'Logistica de Pedidos';
12 $scope.botonera = ['Vehiculo'];
13 var cabecera = '';
14
8 $scope.idUsuario = 0; 15 $scope.idUsuario = 0;
9 $scope.marcadores = []; 16 $scope.marcadores = [];
10 $scope.vehiculos = []; 17 $scope.vehiculos = [];
11 getSeguimiento(); 18 getSeguimiento();
12 $scope.arrastrando = false; 19 $scope.arrastrando = false;
13 $scope.general = function() { 20 $scope.general = function() {
14 $scope.idUsuario = 0; 21 $scope.idUsuario = 0;
15 getSeguimiento(); 22 getSeguimiento();
16 }; 23 };
17 24
25 //SETEO BOTONERA LATERAL
26 focaBotoneraLateralService.showSalir(true);
27 focaBotoneraLateralService.showPausar(false);
28 focaBotoneraLateralService.showGuardar(false);
29
30 $scope.general = function() {
31 $scope.idUsuario = 0;
32 getSeguimiento();
33 $scope.$broadcast('removeCabecera', cabecera);
34 $scope.$broadcast('addCabecera',{
35 label: 'General',
36 valor: ''
37 });
38 };
39
18 $scope.cargar = function(id, punto) { 40 $scope.cargar = function(id, punto) {
19 var marcador = JSON.parse(punto); 41 var idRemito = JSON.parse(punto).notaPedido.remito.id;
20 var vehiculo = $filter('filter')($scope.vehiculos, {id: parseInt(id)})[0];
21 var modalInstance = $uibModal.open( 42 var modalInstance = $uibModal.open(
22 { 43 {
23 ariaLabelledBy: 'Busqueda de Vehiculo', 44 ariaLabelledBy: 'Busqueda de Vehiculo',
24 templateUrl: 'foca-detalle-vehiculo.html', 45 templateUrl: 'foca-detalle-vehiculo.html',
25 controller: 'focaDetalleVehiculo', 46 controller: 'focaDetalleVehiculo',
26 size: 'lg', 47 size: 'lg',
27 resolve: { 48 resolve: {
28 vehiculo: function() {return vehiculo;}, 49 idVehiculo: function() {return id;},
29 marcador: function() {return marcador;} 50 idRemito: function() {return idRemito;}
30 } 51 }
31 } 52 }
32 ); 53 );
33 modalInstance.result.then(function() { 54 modalInstance.result.then(function() {
34 }, function() { 55 }, function() {
35 //run when cancel modal
36 }); 56 });
37 }; 57 };
38 58
39 $scope.arrastra = function() { 59 $scope.quitarVehiculo = function(vehiculo) {
60 focaModalService.confirm('Esta seguro que desea eliminar el vehículo ' +
61 vehiculo.codigo + '?').then(function() {
62 $scope.vehiculos.splice($scope.vehiculos.indexOf(vehiculo), 1);
63 });
64 };
65
66 $scope.informacionVehiculo = function(vehiculo) {
67 focaModalService.alert('EN DESARROLLO : \n información del vehículo ' +
68 JSON.stringify(vehiculo));
69 };
70
71 $scope.arrastra = function() {
40 $scope.arrastrando = true; 72 $scope.arrastrando = true;
41 $scope.$digest(); 73 $scope.$digest();
42 }; 74 };
43 75
44 $scope.noArrastra = function() { 76 $scope.noArrastra = function() {
45 $scope.arrastrando = false; 77 $scope.arrastrando = false;
46 $scope.$digest(); 78 $scope.$digest();
47 }; 79 };
48 80
49 $scope.individual = function() { 81 $scope.individual = function() {
50 $scope.idUsuario = -1; 82 $scope.idUsuario = -1;
51 }; 83 };
52 84
53 $scope.mostrarDetalle = function() { 85 $scope.mostrarDetalle = function() {
54 $scope.detalle = true; 86 $scope.detalle = true;
55 }; 87 };
56 88
57 $scope.salir = function() { 89 $scope.salir = function() {
58 $location.path('/'); 90 $location.path('/');
59 }; 91 };
60 92
61 $scope.search = function(key) { 93 $scope.search = function(key) {
62 if (key === 13) { 94 if (key === 13) {
63 $scope.idUsuario = $scope.idUsuarioInput; 95 $scope.idUsuario = $scope.idUsuarioInput;
64 getSeguimiento(); 96 getSeguimiento();
97 $scope.$broadcast('removeCabecera', 'General');
98 $scope.$broadcast('addCabecera', {
99 label: cabecera,
100 valor: $scope.idUsuarioInput
101 });
65 } 102 }
66 }; 103 };
67 104
68 $scope.fecha = function() { 105 $scope.fecha = function() {
69 getSeguimiento(); 106 getSeguimiento();
70 }; 107 };
71 108
72 $scope.seleccionarVehiculo = function() { 109 $scope.seleccionarVehiculo = function() {
73 var modalInstance = $uibModal.open( 110 var modalInstance = $uibModal.open(
74 { 111 {
75 ariaLabelledBy: 'Busqueda de Vehiculo', 112 ariaLabelledBy: 'Busqueda de Vehiculo',
76 templateUrl: 'modal-vehiculo.html', 113 templateUrl: 'modal-vehiculo.html',
77 controller: 'focaModalVehiculoController', 114 controller: 'focaModalVehiculoController',
78 size: 'lg' 115 size: 'lg'
79 } 116 }
80 ); 117 );
81 118
82 modalInstance.result.then( 119 modalInstance.result.then(
83 function(vehiculo) { 120 function(vehiculo) {
121 var existe = $filter('filter')($scope.vehiculos, {id: vehiculo.id});
122 if(existe.length > 0){
123 focaModalService.alert('El vehiculo que intenta cargar ya ha sido cargado');
124 return;
125 }
84 $scope.vehiculos.push(vehiculo); 126 $scope.vehiculos.push(vehiculo);
85 }, function() { 127 }, function() {
86 // funcion ejecutada cuando se cancela el modal 128 // funcion ejecutada cuando se cancela el modal
87 } 129 }
88 ); 130 );
89 }; 131 };
90
91
92 132
93 function getSeguimiento() { 133 function getSeguimiento() {
94 var now = $scope.now; 134 var now = $scope.now;
95 var desde = new Date(new Date(now.setHours(0)).setMinutes(0)); 135 var desde = new Date(new Date(now.setHours(0)).setMinutes(0));
96 desde = desde.setDate(desde.getDate() - 1); 136 desde = desde.setDate(desde.getDate() - 1);
97 desde = new Date(desde); 137 desde = new Date(desde);
98 var datos = { 138 var datos = {
99 actividad: $scope.actividad, 139 actividad: $scope.actividad,
100 idUsuario: $scope.idUsuario, 140 idUsuario: $scope.idUsuario,
101 fechaDesde: desde, 141 fechaDesde: desde,
102 fechaHasta: new Date(new Date(now.setHours(23)).setMinutes(59)) 142 fechaHasta: new Date(new Date(now.setHours(23)).setMinutes(59))
103 }; 143 };
104 144
105 $scope.datosBuscados = { 145 $scope.datosBuscados = {
106 actividad: $scope.actividad, 146 actividad: $scope.actividad,
107 individual: $scope.idUsuario !== 0 ? true : false 147 individual: $scope.idUsuario !== 0 ? true : false
108 }; 148 };
109 149
110 focaLogisticaPedidoRutaService.obtenerActividad(datos).then(function(datos) { 150 focaLogisticaPedidoRutaService.obtenerActividad(datos).then(function(datos) {
111
112 $scope.marcadores = datos.data; 151 $scope.marcadores = datos.data;
src/js/controllerDetalleVehiculo.js
Diff comments   View file @ 9ba5c96
1 angular.module('focaLogisticaPedidoRuta') 1 angular.module('focaLogisticaPedidoRuta')
2 .controller('focaDetalleVehiculo', 2 .controller('focaDetalleVehiculo',
3 ['$scope', 3 ['$scope',
4 '$uibModalInstance', 4 '$uibModalInstance',
5 'vehiculo', 5 'idVehiculo',
6 'marcador', 6 'idRemito',
7 function($scope, $uibModalInstance, vehiculo, marcador) { 7 'focaModalService',
8 $scope.articulos = marcador.notaPedido.articulosNotaPedido; 8 '$filter',
9 $scope.articuloSeleccionado = {}; 9 'focaLogisticaPedidoRutaService',
10 $scope.vehiculo = vehiculo; 10 function($scope, $uibModalInstance, idVehiculo, idRemito, focaModalService, $filter,
11 focaLogisticaPedidoRutaService
12 ) {
13 $scope.articulos = [];
14 $scope.vehiculo = {};
15 $scope.remito = {};
16 focaLogisticaPedidoRutaService.obtenerVehiculoById(idVehiculo).then(
17 function(res) {
18 $scope.vehiculo = res.data;
19 }
20 );
21 focaLogisticaPedidoRutaService.obtenerRemitoById(idRemito).then(
22 function(res) {
23 $scope.remito = res.data;
24 $scope.articulos = res.data.articulosRemito;
25 }
26 );
27 $scope.aCargar = [];
11 $scope.aceptar = function() { 28 $scope.aceptar = function() {
12 $uibModalInstance.close(); 29 $uibModalInstance.close();
13 }; 30 };
14 31
15 $scope.cargarACisterna = function(cisterna) { 32 $scope.cancelar = function() {
16 if(!$scope.articuloSeleccionado.id) { 33 $uibModalInstance.close();
17 //TODO: usar modal de foca 34 };
18 alert('Debe seleccionar un articulo'); 35
19 return; 36 $scope.cargarACisternas = function(vehiculo) {
20 } 37 for (var i = 0; i < vehiculo.cisternas.length; i++) {
21 if(cisterna.cisternaCarga.cantidad) { 38 var cisterna = vehiculo.cisternas[i];
22 cisterna.cisternaCarga.cantidad += parseFloat(cisterna.aCargar); 39 var aCargar = parseFloat($scope.aCargar[i]);
23 }else { 40 if(!aCargar) {
24 cisterna.cisternaCarga.cantidad = parseFloat(cisterna.aCargar); 41 continue;
25 cisterna.cisternaCarga.idProducto = $scope.articuloSeleccionado.id; 42 }
26 } 43 if(aCargar > cisterna.disponible) {
27 cisterna.disponible = cisterna.capacidad - cisterna.cisternaCarga.cantidad; 44 focaModalService.alert('La cantidad cargada supera la capacidad de la' +
28 cisterna.aCargar = ''; 45 'cisterna ' + cisterna.codigo);
46 return;
47 }
48 if(cisterna.cisternaCarga.cantidad) {
49 cisterna.cisternaCarga.cantidad += aCargar;
50 }else {
51 cisterna.cisternaCarga.cantidad = aCargar;
52 cisterna.cisternaCarga.idProducto = $scope.articuloSeleccionado.idArticulo;
53 }
54 cisterna.disponible = cisterna.capacidad - cisterna.cisternaCarga.cantidad;
55
56 cisterna.cisternaCarga.articulo = {
57 DetArt: $scope.articuloSeleccionado.descripcion
58 };
59 $filter('filter')($scope.articulos, {id: $scope.articuloSeleccionado.id})[0]
60 .cargado = true;
61
62 $scope.calcularPorcentaje(cisterna);
63 }
64 var articuloSiguiente = $scope.articulos.filter(
65 function(filter) {
66 return filter.cargado !== true;
67 }
68 );
69 if(articuloSiguiente.length > 0){
70 $scope.cambioArticulo(articuloSiguiente[0]);
71 }
72 $scope.aCargar = [];
29 }; 73 };
30 $scope.calcularPorcentaje = function(cisterna) { 74 $scope.calcularPorcentaje = function(cisterna) {
31 if(!cisterna.cisternaCarga.cantidad) { 75 if(!cisterna.cisternaCarga.cantidad) {
32 cisterna.cisternaCarga.cantidad = 0; 76 cisterna.cisternaCarga.cantidad = 0;
33 } 77 }
34 var porcentaje = (cisterna.cisternaCarga.cantidad * 100 / 78 var porcentaje = (cisterna.cisternaCarga.cantidad * 100 /
35 cisterna.capacidad) + '%'; 79 cisterna.capacidad) + '%';
36 document.getElementById(cisterna.id).style.width = porcentaje; 80 var elementHtml = document.getElementById(cisterna.id);
81 if(elementHtml) {
82 elementHtml.style.width = porcentaje;
83 }
37 }; 84 };
38 $scope.cambioArticulo = function(articulo) { 85 $scope.cambioArticulo = function(articulo) {
86 articulo.checked = true;
39 $scope.articuloSeleccionado = articulo; 87 $scope.articuloSeleccionado = articulo;
40 }; 88 };
89 $scope.actualizarArticulo = function () {
90 $scope.articuloSeleccionado.cantidadCargada = 0;
91 for (var i = 0; i < $scope.aCargar.length; i++) {
92 $scope.articuloSeleccionado.cantidadCargada +=
93 parseFloat($scope.aCargar[i]) || 0;
94 }
95 };
96 $scope.tieneArticulosPendientes = function() {
97 var articulosDescargados = $scope.articulos.filter(function(filter) {
98 return filter.cargado === true;
99 });
100 if(articulosDescargados.length === $scope.articulos.length) {
101 return false;
102 }
103 return true;
104 };
41 }]); 105 }]);
42 106
src/js/osm-directive.js
Diff comments   View file @ 9ba5c96
1 angular.module('focaLogisticaPedidoRuta').directive('foca', function() { 1 angular.module('focaLogisticaPedidoRuta').directive('foca', function() {
2 return { 2 return {
3 restrict: 'E', 3 restrict: 'E',
4 link: function(scope, el, attrs) { 4 link: function(scope, el, attrs) {
5 var contenedor = document.createElement('div'); 5 var contenedor = document.createElement('div');
6 el.append(contenedor); 6 el.append(contenedor);
7 scope.map = L.map(contenedor).setView([attrs.latitud, attrs.longitud], attrs.zoom); 7 scope.map = L.map(contenedor).setView([attrs.latitud, attrs.longitud], attrs.zoom);
8 L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(scope.map); 8 L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(scope.map);
9 }, 9 },
10 controller: ['$scope', '$filter', function($scope, $filter) { 10 controller: ['$scope', '$filter', function($scope, $filter) {
11 $scope.markers = []; 11 $scope.markers = [];
12 $scope.$watch('marcadores', function() { 12 $scope.$watch('marcadores', function() {
13 for(var i in $scope.markers) { 13 for(var i in $scope.markers) {
14 $scope.map.removeLayer($scope.markers[i]); 14 $scope.map.removeLayer($scope.markers[i]);
15 } 15 }
16 $scope.markers = []; 16 $scope.markers = [];
17 17
18 angular.forEach($scope.marcadores, function(marcador) { 18 angular.forEach($scope.marcadores, function(marcador) {
19 var observacion = 19 var observacion =
20 'Vendedor: ' + marcador.notaPedido.idVendedor + ' - ' + 20 'Vendedor: ' + marcador.notaPedido.idVendedor + ' - ' +
21 ( 21 (
22 marcador.notaPedido.vendedor ? 22 marcador.notaPedido.vendedor ?
23 marcador.notaPedido.vendedor.NomVen : 23 marcador.notaPedido.vendedor.NomVen :
24 '' 24 ''
25 ) + '<br/>'; 25 ) + '<br/>';
26 observacion += 'Fecha: ' + 26 observacion += 'Fecha: ' +
27 $filter('date')(marcador.fecha.slice(0,10), 'dd/MM/yyyy') + ' ' + 27 $filter('date')(marcador.fecha.slice(0,10), 'dd/MM/yyyy') + ' ' +
28 marcador.fecha.slice(11,19) + '<br/>'; 28 marcador.fecha.slice(11,19) + '<br/>';
29 observacion += 'Nº: ' + $filter('comprobante')([ 29 observacion += 'Nº: ' + $filter('comprobante')([
30 marcador.notaPedido.sucursal, 30 marcador.notaPedido.sucursal,
31 marcador.notaPedido.numeroNotaPedido 31 marcador.notaPedido.numeroNotaPedido
32 ]) + '<br/>'; 32 ]) + '<br/>';
33 observacion += 'Cliente: ' + 33 observacion += 'Cliente: ' +
34 marcador.notaPedido.cliente.NOM + '<br/>'; 34 marcador.notaPedido.cliente.NOM + '<br/>';
35 35
36 if($scope.parametros.individual) { 36 if($scope.parametros.individual) {
37 observacion += 37 observacion +=
38 'Total: ' + $filter('currency')(marcador.notaPedido.total, '$'); 38 'Total: ' + $filter('currency')(marcador.notaPedido.total, '$');
39 observacion = 'Orden: ' + marcador.orden + '<br/>' + observacion; 39 observacion = 'Orden: ' + marcador.orden + '<br/>' + observacion;
40 40
41 if(marcador.distancia) { 41 if(marcador.distancia) {
42 observacion += '<br/>Distancia a casa central: ' + 42 observacion += '<br/>Distancia a casa central: ' +
43 marcador.distancia + 'km'; 43 marcador.distancia + 'km';
44 } 44 }
45 }else { 45 }else {
46 observacion += 'Cantidad de nota de pedido: ' + 46 observacion += 'Cantidad de nota de pedido: ' +
47 marcador.cantidad + '<br/>'; 47 marcador.cantidad + '<br/>';
48 observacion += 'Total Vendido: ' + 48 observacion += 'Total Vendido: ' +
49 $filter('currency')(marcador.total, '$'); 49 $filter('currency')(marcador.total, '$');
50 } 50 }
51 observacion += '<br/>'; 51 observacion += '<br/>';
52 observacion += '<i class="fa fa-map-marker fa-3x" aria-hidden="true"'+ 52 observacion += '<i class="fa fa-map-marker fa-3x" aria-hidden="true"'+
53 'class="form-control" ondragend="dropEnd()" ondragstart=\'drag(event, '+ 53 'class="form-control" ondragend="dropEnd()" ondragstart=\'drag(event, '+
54 JSON.stringify(marcador)+')\' draggable="true"></i>'; 54 JSON.stringify(marcador)+')\' draggable="true"></i>(Arrastrar icono)';
55 $scope.markers.push( 55 $scope.markers.push(
56 L.marker([marcador.latitud, marcador.longitud]).addTo($scope.map) 56 L.marker([marcador.latitud, marcador.longitud]).addTo($scope.map)
57 .bindPopup(observacion) 57 .bindPopup(observacion)
58 ); 58 );
59 59
60 $scope.markers[0].openPopup(); 60 $scope.markers[0].openPopup();
61 }); 61 });
62 }); 62 });
63 }], 63 }],
64 scope: { 64 scope: {
65 latitud: '=', 65 latitud: '=',
66 longitud: '=', 66 longitud: '=',
67 zoom: '=', 67 zoom: '=',
68 marcadores: '=', 68 marcadores: '=',
69 parametros: '=' 69 parametros: '='
70 } 70 }
71 }; 71 };
72 }); 72 });
73 73
1 angular.module('focaLogisticaPedidoRuta') 1 angular.module('focaLogisticaPedidoRuta')
2 .service( 2 .service(
3 'focaLogisticaPedidoRutaService', ['$http', 'API_ENDPOINT', function($http, API_ENDPOINT 3 'focaLogisticaPedidoRutaService', ['$http', 'API_ENDPOINT', function($http, API_ENDPOINT
4 ) { 4 ) {
5 return { 5 return {
6 obtenerActividad: function(parametros) { 6 obtenerActividad: function(parametros) {
7 return $http.post(API_ENDPOINT.URL + '/seguimiento/filtros', parametros); 7 return $http.post(API_ENDPOINT.URL + '/seguimiento/filtros', parametros);
8 },
9 obtenerVehiculoById: function(idVehiculo) {
10 return $http.get(API_ENDPOINT.URL + '/vehiculo/' + idVehiculo);
11 },
12 obtenerRemitoById: function(idRemito) {
13 return $http.get(API_ENDPOINT.URL + '/remito/obtener/' + idRemito);
8 } 14 }
9 }; 15 };
10 }]); 16 }]);
11 17
src/views/foca-detalle-vehiculo.html
Diff comments   View file @ 9ba5c96
1 <div class="modal-header"> 1 <div class="modal-header">
2 <h4>Detalle de carga</h4> 2 <h4>Detalle de carga</h4>
3 <h3>-EN DESARROLLO</h3> 3 <!-- TODO: quitar llaves {{}} y usar ng-bind -->
4 <h4>-EN DESARROLLO</h4>
5 Remito Nº
6 <strong ng-bind="remito.numeroRemito"></strong>
7 , Cliente
8 <strong ng-bind="remito.nombreCliente"></strong>
9 , Domicilio
10 <strong ng-bind="remito.domicilioStamp"></strong>
4 </div> 11 </div>
5 <div class="modal-body"> 12 <div class="modal-body">
6 <div> 13 <div>
7 <div class="col-12" ng-repeat="articulo in articulos"> 14 <div class="col-12" ng-repeat="(key, articulo) in articulos">
8 <input 15 <input
9 type="radio" 16 type="radio"
10 name="articuloRadio" 17 name="articuloRadio"
11 id="{{articulo.id}}" 18 id="{{articulo.id}}"
19 ng-checked="articulo.checked"
20 ng-disabled="articulo.cargado"
12 ng-click="cambioArticulo(articulo)" 21 ng-click="cambioArticulo(articulo)"
13 > 22 >
14 <span>Articulo: {{articulo.descripcion}},</span> 23 <span>Articulo: {{articulo.descripcion}},</span>
15 <span>Cantidad Cargada: {{articulo.cantidad}}</span> 24 <span>Total: {{articulo.cantidad}},</span>
16 <span>Cantidad a Cargar: </span> 25 <span>Cantidad Cargada: {{articulo.cantidadCargada || 0}},</span>
26 <span>Pendiente: {{articulo.cantidad - articulo.cantidadCargada}} </span>
17 </div> 27 </div>
18 <strong class="col-12" ng-bind="vehiculo.tractor"></strong> 28 <strong class="col-12" ng-bind="vehiculo.tractor"></strong>
19 <strong class="col-12">Cisternas:</strong> 29 <strong class="col-12">Cisternas:</strong>
20 <div class="form-group row input-group" ng-repeat="cisterna in vehiculo.cisternas"> 30 <div class="form-group row input-group" ng-repeat="(key, cisterna) in vehiculo.cisternas">
21 <div class="col-1 mt-2"> 31 <div class="col-1 mt-2">
22 <strong>{{cisterna.codigo}}</strong> 32 <strong>{{cisterna.codigo}}</strong>
23 </div> 33 </div>
24 <input 34 <input
25 class="form-control col-2" 35 class="form-control col-2 mr-3"
26 foca-tipo-input 36 foca-tipo-input
27 foca-teclado 37 foca-teclado
28 placeholder="A cargar..." 38 placeholder="A cargar..."
29 ng-model="cisterna.aCargar" 39 ng-model="aCargar[key]"
30 ng-disabled="articuloSeleccionado.cantidad > cisterna.disponible" 40 ng-disabled="(articuloSeleccionado.idArticulo !== cisterna.cisternaCarga.idProducto &&
41 cisterna.cisternaCarga.idProducto) || !tieneArticulosPendientes()"
42 ng-change="actualizarArticulo()"
31 > 43 >
32 <div class="input-group-append"> 44 <div class="progress foca-alto-progress col-4 pl-0 pr-0 mt-1">
33 <button
34 class="form-control btn btn-outline-secondary"
35 ng-disabled="articuloSeleccionado.cantidad > cisterna.disponible">
36 <i
37 class="fa fa-save"
38 ng-click="cargarACisterna(cisterna)"
39 aria-hidden="true"></i>
40 </button>
41 </div>
42 <div class="progress foca-alto col-8 pl-0 pr-0 mt-1">
43 <strong class="col-12 mt-1 text-center position-absolute" 45 <strong class="col-12 mt-1 text-center position-absolute"
44 >{{cisterna.cisternaCarga.cantidad || 0}} / {{cisterna.capacidad}}</strong> 46 >{{cisterna.cisternaCarga.cantidad || 0}} / {{cisterna.capacidad}}</strong>
45 <div 47 <div
46 id="{{cisterna.id}}" 48 id="{{cisterna.id}}"
47 class="progress-bar" 49 class="progress-bar"
48 role="progressbar" 50 role="progressbar"
49 aria-valuemin="0" 51 aria-valuemin="0"
50 aria-valuemax="{{cisterna.capacidad}}" 52 aria-valuemax="{{cisterna.capacidad}}"
51 ng-style="{'width':'{{calcularPorcentaje(cisterna)}}'}"> 53 ng-style="{'width':'{{calcularPorcentaje(cisterna)}}'}">
52 </div> 54 </div>
53 </div> 55 </div>
54 <div class="col-1 mt-1"> 56 <div class="col-4 mt-2">
55 <i class="fa fa-info" data-toggle="tooltip" title="asd"></i> 57 <strong>{{cisterna.cisternaCarga.articulo.DetArt || 'Sin articulo'}}</strong>
56 </div> 58 </div>
59 <!--TODO: descomentar cuando se use-->
60 <!-- <div class="col-1 mt-1">
61 <i class="fa fa-info" uib-tooltip="Información cisterna"></i>
62 </div> -->
63 </div>
64 <div class="col-12 aling-end">
65 <button
66 class="form-control"
67 type="button"
68 ng-disabled="!articuloSeleccionado || articuloSeleccionado.cantidad -
69 articuloSeleccionado.cantidadCargada !== 0 || !tieneArticulosPendientes()"
70 ng-click="cargarACisternas(vehiculo)">
71 Cargar cisternas
72 </button>
57 </div> 73 </div>
58 </div> 74 </div>
59 </div> 75 </div>
60 <div class="modal-footer py-1"> 76 <div class="modal-footer py-1">
61 <button class="btn btn-sm btn-secondary" type="button" ng-click="aceptar()">Aceptar</button> 77 <button
src/views/foca-logistica-pedido-ruta.html
Diff comments   View file @ 9ba5c96
1 <script>
2 function allowDrop(ev) {
3 ev.preventDefault();
4 }
5 function drag(ev, marcador) {
6 marcador = JSON.stringify(marcador);
7 ev.dataTransfer.setData("marcador", marcador);
8 var dom_el = document.getElementById('test');
9 var scope = angular.element(dom_el).scope();
10 scope.arrastra();
11 }
12 function drop(ev) {
13 ev.preventDefault();
14 var data = ev.dataTransfer.getData("marcador");
15 var dom_el = document.getElementById(ev.target.id);
16 var ng_el = angular.element(dom_el);
17 var ng_el_scope = ng_el.scope();
18 ng_el_scope.cargar(ev.target.id, data);
19 ng_el_scope.$digest();
20 }
21 function dropEnd() {
22 console.log('drop');
23 var dom_el = document.getElementById('test');
24 var scope = angular.element(dom_el).scope();
25 scope.noArrastra();
26 }
27 </script>
28 <div class="foca-logistica-pedido-ruta" id="test"> 1 <div class="foca-logistica-pedido-ruta" id="test">
29 <h3>-EN DESARROLLO</h3> 2 <div class="row">
3 <foca-cabecera-facturador
4 titulo="titulo"
5 fecha="now"
6 class="mb-0 col-lg-12"
7 ></foca-cabecera-facturador>
8 </div>
9 <div class="row px-5 py-2 botonera-secundaria">
10 <div class="col-12">
11 <foca-botonera-facturador botones="botonera" extra="5" class="row"></foca-botonera-facturador>
12 </div>
13 </div>
30 <div class="row"> 14 <div class="row">
31 <div class="offset-1 col-9"> 15 <div class="offset-1 col-9">
32 <foca 16 <foca
33 latitud="-32.89214159952345" 17 latitud="-32.89214159952345"
34 longitud="-68.84572999101856" 18 longitud="-68.84572999101856"
35 zoom="14" 19 zoom="14"
36 marcadores="marcadores" 20 marcadores="marcadores"
37 parametros= "datosBuscados" 21 parametros= "datosBuscados"
38 /> 22 />
39 </div> 23 </div>
40 <div class="col-2 pl-0"> 24 <div class="col-2 pl-0">
41 <input 25 <input
42 type="date" 26 type="date"
43 ng-model="now" 27 ng-model="now"
44 class="btn col-12 my-1" 28 class="btn col-12 my-1"
45 foca-focus="true" 29 foca-focus="true"
46 ng-blur="fecha()" 30 ng-blur="fecha()"
47 hasta-hoy 31 hasta-hoy
48 /> 32 />
49 <button 33 <button
50 type="button" 34 type="button"
51 ng-class="{'active': idUsuario == 0}" 35 ng-class="{'active': idUsuario == 0}"
52 class="btn col-12 my-1" 36 class="btn col-12 my-1"
53 ng-click="general()" 37 ng-click="general()"
54 >General</button> 38 >General</button>
55 <button 39 <button
56 type="button" 40 type="button"
57 ng-class="{'active': idUsuario != 0}" 41 ng-class="{'active': idUsuario != 0}"
58 class="btn col-12 my-1" 42 class="btn col-12 my-1"
59 ng-click="individual()" 43 ng-click="individual()"
60 ng-show="actividad != 'Cobranza'"
61 >Individual</button> 44 >Individual</button>
62 <div class="form-group" ng-show="idUsuario == -1"> 45 <div class="form-group" ng-show="idUsuario == -1">
63 <input 46 <input
64 type="text" 47 type="text"
65 placeholder="Vendedor" 48 placeholder="Vendedor"
66 class="form-control" 49 class="form-control"
67 ng-model="idUsuarioInput" 50 ng-model="idUsuarioInput"
68 ng-keypress="search($event.keyCode)" 51 ng-keypress="search($event.keyCode)"
69 foca-focus="idUsuario == -1" 52 foca-focus="idUsuario == -1"
70 ng-show="actividad == 'Nota de pedido'"
71 >
72 <input
73 type="text"
74 placeholder="Vehiculo"
75 class="form-control"
76 ng-model="idUsuarioInput"
77 ng-keypress="search($event.keyCode)"
78 foca-focus="idUsuario == -1"
79 ng-show="actividad == 'Entrega de producto'"
80 > 53 >
81 </div> 54 </div>
82 <button
83 type="button"
84 class="btn col-12 my-1 boton-salir"
85 ng-click="salir()"
86 >
87 Salir
88 </button>
89 </div> 55 </div>
90 <input
91 class="col-auto form-control"
92 ng-click="seleccionarVehiculo()"
93 placeholder="Seleccionar vehiculo"
94 readonly
95 />
96 <div class="row"> 56 <div class="row">
97 <div 57 <div
98 class="container col-auto" 58 class="container col-auto"
99 ng-repeat="vehiculo in vehiculos" 59 ng-repeat="vehiculo in vehiculos"
100 ng-click="mostrarDetalleVehiculo(vehiculo)" 60 ng-click="mostrarDetalleVehiculo(vehiculo)"
101 > 61 >
102 <div> 62 <div>
103 <div class="col-md-3 col-sm-6"> 63 <div class="col-md-3 col-sm-6">
104 <div class="progress-circle blue" ng-class="{'arrastrando': arrastrando}"> 64 <div class="progress-circle blue" ng-class="{'arrastrando': arrastrando}">
105 <span class="progress-left"> 65 <span class="progress-left">
106 <span class="progress-bar"></span> 66 <span class="progress-bar"></span>
107 </span> 67 </span>
108 <span class="progress-right"> 68 <span class="progress-right">
109 <span class="progress-bar"></span> 69 <span class="progress-bar"></span>
110 </span> 70 </span>
111 <div class="progress-value">{{vehiculo.codigo}}</div> 71 <div class="progress-value">{{vehiculo.codigo}}</div>
112 </div> 72 </div>
113 </div> 73 </div>
74 <div class="row">
75 <div class="text-left col-6">
76 <i
77 class="fa fa-info fa-2x"
78 uib-tooltip="Ver información del vehículo"
79 ng-click="informacionVehiculo(vehiculo)"></i>
80 </div>
81 <div class="text-right col-6">
82 <i
83 class="fa fa-trash fa-2x"
84 uib-tooltip="Eliminar vehiculo"
85 ng-click="quitarVehiculo(vehiculo)"></i>
86 </div>
87 </div>
114 <div 88 <div
115 class="col-12 border border-dark text-center" 89 class="col-12 border border-dark text-center"
116 ng-show="arrastrando" 90 ng-show="arrastrando"
117 id="{{vehiculo.id}}" 91 id="{{vehiculo.id}}"
118 ondrop="drop(event)" 92 ondrop="drop(event)"
119 ondragover="allowDrop(event)" 93 ondragover="allowDrop(event)"
120 >Soltar acá</div> 94 >Soltar acá</div>
121 </div> 95 </div>
122 </div> 96 </div>
123 </div> 97 </div>
124 </div> 98 </div>
125 </div> 99 </div>
126 <style>
127 .arrastrando {
128 opacity: 0.5;
129 }
130 .vertical {
131 display: inline-block;
132 width: 20%;
133 height: 40px;
134 -webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
135 transform: rotate(-90deg);
136 }
137 .progress-circle{
138 width: 150px;
139 height: 150px;
140 line-height: 150px;
141 background: none;
142 margin: 0 auto;
143 box-shadow: none;
144 position: relative;
145 }
146 .progress-circle:after{
147 content: "";
148 width: 100%;
149 height: 100%;
150 border-radius: 50%;
151 border: 12px solid #fff;
152 position: absolute;
153 top: 0;
154 left: 0;
155 }
156 .progress-circle > span{
157 width: 50%;
158 height: 100%;
159 overflow: hidden;
160 position: absolute;
161 top: 0;
162 z-index: 1;
163 }
164 .progress-circle .progress-left{
165 left: 0;
166 }
167 .progress-circle .progress-bar{
168 width: 100%;
169 height: 100%;
170 background: none;
171 border-width: 12px;
172 border-style: solid;
173 position: absolute;
174 top: 0;
175 }
176 .progress-circle .progress-left .progress-bar{
177 left: 100%;
178 border-top-right-radius: 80px;
179 border-bottom-right-radius: 80px;
180 border-left: 0;
181 -webkit-transform-origin: center left;
182 transform-origin: center left;
183 }
184 .progress-circle .progress-right{
185 right: 0;
186 }
187 .progress-circle .progress-right .progress-bar{
188 left: -100%;
189 border-top-left-radius: 80px;
190 border-bottom-left-radius: 80px;
191 border-right: 0;
192 -webkit-transform-origin: center right;
193 transform-origin: center right;
194 animation: loading-1 1.8s linear forwards;
195 }
196 .progress-circle .progress-value{
197 width: 90%;
198 height: 90%;
199 border-radius: 50%;
200 background: #44484b;
201 font-size: 24px;
202 color: #fff;
203 line-height: 135px;
204 text-align: center;
205 position: absolute;
206 top: 5%;
207 left: 5%;
208 }
209 .progress-circle.blue .progress-bar{
210 border-color: #049dff;
211 }
212 .progress-circle.blue .progress-left .progress-bar{
213 animation: loading-2 1.5s linear forwards 1.8s;
214 }
215 .progress-circle.yellow .progress-bar{
216 border-color: #fdba04;
217 }
218 .progress-circle.yellow .progress-left .progress-bar{
219 animation: loading-3 1s linear forwards 1.8s;
220 }
221 .progress-circle.pink .progress-bar{
222 border-color: #ed687c;
223 }
224 .progress-circle.pink .progress-left .progress-bar{
225 animation: loading-4 0.4s linear forwards 1.8s;
226 }
227 .progress-circle.green .progress-bar{
228 border-color: #1abc9c;
229 }
230 .progress-circle.green .progress-left .progress-bar{
231 animation: loading-5 1.2s linear forwards 1.8s;
232 }
233 @keyframes loading-1{
234 0%{
235 -webkit-transform: rotate(0deg);
236 transform: rotate(0deg);
237 }
238 100%{
239 -webkit-transform: rotate(180deg);
240 transform: rotate(180deg);
241 }
242 }
243 @keyframes loading-2{
244 0%{
245 -webkit-transform: rotate(0deg);
246 transform: rotate(0deg);
247 }
248 100%{
249 -webkit-transform: rotate(180deg);
250 transform: rotate(180deg);
251 }
252 }
253 @keyframes loading-3{
254 0%{
255 -webkit-transform: rotate(0deg);
256 transform: rotate(0deg);
257 }
258 100%{
259 -webkit-transform: rotate(90deg);
260 transform: rotate(90deg);
261 }
262 }
263 @keyframes loading-4{