Commit 6824e5640d773d85599dc5cb0d112cbc75952789

Authored by Jose Pinto
1 parent a3e5f2152b
Exists in master

ok nombre directiva

src/js/osm-directive.js
1 angular.module('focaLogisticaPedidoRuta').directive('osma', function() { 1 angular.module('focaLogisticaPedidoRuta').directive('osmPuntoDescarga', 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 contenedor.className = 'w-100 h-50 mt-3'; 6 contenedor.className = 'w-100 h-50 mt-3';
7 el.append(contenedor); 7 el.append(contenedor);
8 scope.map = L.map(contenedor).setView([-32.89214159952345, -68.84572999101856], attrs.zoom); 8 scope.map = L.map(contenedor).setView([-32.89214159952345, -68.84572999101856], attrs.zoom);
9 L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(scope.map); 9 L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(scope.map);
10 }, 10 },
11 controller: ['$scope', '$timeout', function($scope, $timeout) { 11 controller: ['$scope', '$timeout', function($scope, $timeout) {
12 //resuelve bug mapa gris 12 //resuelve bug mapa gris en modales
13 $timeout(function() { 13 $timeout(function() {
14 $scope.map.invalidateSize(); 14 $scope.map.invalidateSize();
15 }, 1000); 15 }, 1000);
16 16
17 $scope.markers = []; 17 $scope.markers = [];
18 $scope.$watchGroup(['latitud', 'longitud'], function() { 18 $scope.$watchGroup(['latitud', 'longitud'], function() {
19 for(var i in $scope.markers) { 19 for(var i in $scope.markers) {
20 $scope.map.removeLayer($scope.markers[i]); 20 $scope.map.removeLayer($scope.markers[i]);
21 } 21 }
22 $scope.markers.push( 22 $scope.markers.push(
23 L.marker([$scope.latitud, $scope.longitud], {draggable:'true'}) 23 L.marker([$scope.latitud, $scope.longitud], {draggable:'true'})
24 .addTo($scope.map) 24 .addTo($scope.map)
25 .on('dragend', function() { 25 .on('dragend', function() {
26 $scope.latitud = this.getLatLng().lat; 26 $scope.latitud = this.getLatLng().lat;
27 $scope.longitud = this.getLatLng().lng; 27 $scope.longitud = this.getLatLng().lng;
28 $scope.$apply(); 28 $scope.$apply();
29 }) 29 })
30 ); 30 );
31 }); 31 });
32 }], 32 }],
33 scope: { 33 scope: {
34 latitud: '=', 34 latitud: '=',
35 longitud: '=', 35 longitud: '=',
36 zoom: '=' 36 zoom: '='
37 } 37 }
38 }; 38 };
39 }); 39 });
40 40
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 || cargaArticulos">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 <h5 class="modal-title my-1" ng-show="cargaArticulos">Cargar articulos en puntos de descarga</h5>
5 <button 5 <button
6 class="btn btn-primary" 6 class="btn btn-primary"
7 ng-click="ingreso = true" 7 ng-click="ingreso = true"
8 ng-hide="ingreso || cargaArticulos"> 8 ng-hide="ingreso || cargaArticulos">
9 <i class="fa fa-plus" aria-hidden="true"></i> 9 <i class="fa fa-plus" aria-hidden="true"></i>
10 </button> 10 </button>
11 </div> 11 </div>
12 <div class="modal-body" id="modal-body"> 12 <div class="modal-body" id="modal-body">
13 <table 13 <table
14 class="table table-striped table-sm col-12" 14 class="table table-striped table-sm col-12"
15 ng-hide="ingreso || cargaArticulos"> 15 ng-hide="ingreso || cargaArticulos">
16 <thead> 16 <thead>
17 <tr> 17 <tr>
18 <th>Código</th> 18 <th>Código</th>
19 <th>Descripción</th> 19 <th>Descripción</th>
20 <th>Latitud</th> 20 <th>Latitud</th>
21 <th>Longitud</th> 21 <th>Longitud</th>
22 <th></th> 22 <th></th>
23 </tr> 23 </tr>
24 </thead> 24 </thead>
25 <tbody> 25 <tbody>
26 <tr ng-show="puntosDescarga.length == 0"> 26 <tr ng-show="puntosDescarga.length == 0">
27 <td colspan="3"> 27 <td colspan="3">
28 No se encontraron resultados. 28 No se encontraron resultados.
29 </td> 29 </td>
30 </tr> 30 </tr>
31 <tr class="selected" 31 <tr class="selected"
32 ng-repeat="(key, puntoDescarga) in puntosDescarga | filter: filters" 32 ng-repeat="(key, puntoDescarga) in puntosDescarga | filter: filters"
33 > 33 >
34 <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> 35 <td ng-bind="puntoDescarga.descripcion"></td>
36 <td ng-bind="puntoDescarga.latitud"></td> 36 <td ng-bind="puntoDescarga.latitud"></td>
37 <td ng-bind="puntoDescarga.longitud"></td> 37 <td ng-bind="puntoDescarga.longitud"></td>
38 <td class="d-md-none text-primary"> 38 <td class="d-md-none text-primary">
39 <i class="fa fa-circle-thin" aria-hidden="true"></i> 39 <i class="fa fa-circle-thin" aria-hidden="true"></i>
40 </td> 40 </td>
41 <td class="d-none d-md-table-cell"> 41 <td class="d-none d-md-table-cell">
42 <input 42 <input
43 type="checkbox" 43 type="checkbox"
44 class="custom-control-input float-right" 44 class="custom-control-input float-right"
45 id="checkSelect{{key}}"> 45 id="checkSelect{{key}}">
46 <label 46 <label
47 class="custom-control-label float-right" 47 class="custom-control-label float-right"
48 for="checkSelect{{key}}" 48 for="checkSelect{{key}}"
49 ng-click="seleccionarPunto(key)"></label> 49 ng-click="seleccionarPunto(key)"></label>
50 <button 50 <button
51 type="button" 51 type="button"
52 class="btn btn-xs p-1 float-right mr-5" 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 title="Eliminar">
55 <i class="fa fa-trash" aria-hidden="true"></i> 55 <i class="fa fa-trash" aria-hidden="true"></i>
56 </button> 56 </button>
57 <button 57 <button
58 type="button" 58 type="button"
59 class="btn btn-xs p-1 float-right mr-1" 59 class="btn btn-xs p-1 float-right mr-1"
60 ng-click="editar(puntoDescarga.id)" 60 ng-click="editar(puntoDescarga.id)"
61 title="Editar"> 61 title="Editar">
62 <i class="fa fa-pencil" aria-hidden="true"></i> 62 <i class="fa fa-pencil" aria-hidden="true"></i>
63 </button> 63 </button>
64 </td> 64 </td>
65 </tr> 65 </tr>
66 </tbody> 66 </tbody>
67 </table> 67 </table>
68 <form ng-show="ingreso"> 68 <form ng-show="ingreso">
69 <div class="row"> 69 <div class="row">
70 <div class="col-12"> 70 <div class="col-12">
71 <label>Descripción</label> 71 <label>Descripción</label>
72 <input 72 <input
73 type="text" 73 type="text"
74 class="form-control form-control-sm" 74 class="form-control form-control-sm"
75 ng-model="puntoDescarga.descripcion" 75 ng-model="puntoDescarga.descripcion"
76 uppercase-only> 76 uppercase-only>
77 </div> 77 </div>
78 </div> 78 </div>
79 <div class="row"> 79 <div class="row">
80 <div class="col-6"> 80 <div class="col-6">
81 <label>Latitud</label> 81 <label>Latitud</label>
82 <input 82 <input
83 type="text" 83 type="text"
84 class="form-control form-control-sm" 84 class="form-control form-control-sm"
85 ng-model="puntoDescarga.latitud" 85 ng-model="puntoDescarga.latitud"
86 ng-required="true" 86 ng-required="true"
87 /> 87 />
88 </div> 88 </div>
89 <div class="col-6"> 89 <div class="col-6">
90 <label>Longitud</label> 90 <label>Longitud</label>
91 <input 91 <input
92 type="text" 92 type="text"
93 class="form-control form-control-sm" 93 class="form-control form-control-sm"
94 ng-model="puntoDescarga.longitud" 94 ng-model="puntoDescarga.longitud"
95 ng-required="true" 95 ng-required="true"
96 /> 96 />
97 </div> 97 </div>
98 </div> 98 </div>
99 <osma 99 <osm-punto-descarga
100 latitud="puntoDescarga.latitud" 100 latitud="puntoDescarga.latitud"
101 longitud="puntoDescarga.longitud" 101 longitud="puntoDescarga.longitud"
102 zoom="14" 102 zoom="14"
103 /> 103 />
104 </form> 104 </form>
105 <div ng-show="cargaArticulos"> 105 <div ng-show="cargaArticulos">
106 <div ng-show="articulos.length === 0"> 106 <div ng-show="articulos.length === 0">
107 <h6>No existen articulos para agregar</h6> 107 <h6>No existen articulos para agregar</h6>
108 </div> 108 </div>
109 <div ng-show="articulos.length > 0"> 109 <div ng-show="articulos.length > 0">
110 <div class="row"> 110 <div class="row">
111 <div class="col-12"> 111 <div class="col-12">
112 <table class="table table-sm"> 112 <table class="table table-sm">
113 <thead> 113 <thead>
114 <tr> 114 <tr>
115 <th></th> 115 <th></th>
116 <th>Articulo</th> 116 <th>Articulo</th>
117 <th>Total</th> 117 <th>Total</th>
118 <th>Restante</th> 118 <th>Restante</th>
119 </tr> 119 </tr>
120 </thead> 120 </thead>
121 <tbody> 121 <tbody>
122 <tr ng-repeat="(key, articulo) in articulos"> 122 <tr ng-repeat="(key, articulo) in articulos">
123 <td> 123 <td>
124 <input 124 <input
125 type="radio" 125 type="radio"
126 ng-value="key" 126 ng-value="key"
127 ng-model="$parent.articuloSeleccionado" 127 ng-model="$parent.articuloSeleccionado"
128 > 128 >
129 </td> 129 </td>
130 <td ng-bind="articulo.descripcion"></td> 130 <td ng-bind="articulo.descripcion"></td>
131 <td ng-bind="articulo.cantidad"></td> 131 <td ng-bind="articulo.cantidad"></td>
132 <td ng-bind="articulo.restante"></td> 132 <td ng-bind="articulo.restante"></td>
133 </tr> 133 </tr>
134 </tbody> 134 </tbody>
135 </table> 135 </table>
136 </div> 136 </div>
137 </div> 137 </div>
138 <div class="row"> 138 <div class="row">
139 <div class="col-12"> 139 <div class="col-12">
140 <h5 class="col-12 my-3">Puntos de descarga</h5> 140 <h5 class="col-12 my-3">Puntos de descarga</h5>
141 <table class="table table-sm"> 141 <table class="table table-sm">
142 <thead> 142 <thead>
143 <tr> 143 <tr>
144 <th>Lugar</th> 144 <th>Lugar</th>
145 <th class="text-right">Total cargado</th> 145 <th class="text-right">Total cargado</th>
146 <th class="text-right">Cantidad</th> 146 <th class="text-right">Cantidad</th>
147 <th></th> 147 <th></th>
148 </tr> 148 </tr>
149 </thead> 149 </thead>
150 <tbody> 150 <tbody>
151 <tr ng-repeat="punto in puntosACargar"> 151 <tr ng-repeat="punto in puntosACargar">
152 <td ng-bind="punto.descripcion"></td> 152 <td ng-bind="punto.descripcion"></td>
153 <td ng-bind="punto.cargado" class="text-right"></td> 153 <td ng-bind="punto.cargado" class="text-right"></td>
154 <td> 154 <td>
155 <input 155 <input
156 type="text" 156 type="text"
157 class="form-control col-4 float-right" 157 class="form-control col-4 float-right"
158 id="inputCantidad" 158 id="inputCantidad"
159 placeholder="A cargar" 159 placeholder="A cargar"
160 ng-model="punto.cantidadACargar" 160 ng-model="punto.cantidadACargar"
161 > 161 >
162 </td> 162 </td>
163 <td> 163 <td>
164 <button 164 <button
165 class="btn btn-sm btn-outline-primary ml-auto" 165 class="btn btn-sm btn-outline-primary ml-auto"
166 type="button" 166 type="button"
167 ng-click="agregarArticulo(punto)" 167 ng-click="agregarArticulo(punto)"
168 > 168 >
169 Agregar 169 Agregar
170 </button> 170 </button>
171 </td> 171 </td>
172 </tr> 172 </tr>
173 </tbody> 173 </tbody>
174 </table> 174 </table>
175 <table class="table table-sm"> 175 <table class="table table-sm">
176 <thead> 176 <thead>
177 <tr> 177 <tr>
178 <th>Lugar</th> 178 <th>Lugar</th>
179 <th>Articulo</th> 179 <th>Articulo</th>
180 <th class="text-right">Cantidad</th> 180 <th class="text-right">Cantidad</th>
181 <th></th> 181 <th></th>
182 </tr> 182 </tr>
183 </thead> 183 </thead>
184 <tbody ng-repeat="punto in puntosACargar"> 184 <tbody ng-repeat="punto in puntosACargar">
185 <tr ng-repeat="(key, articulo) in punto.articulosAgregados"> 185 <tr ng-repeat="(key, articulo) in punto.articulosAgregados">
186 <td ng-bind="punto.descripcion"></td> 186 <td ng-bind="punto.descripcion"></td>
187 <td ng-bind="articulo.descripcion" class="p-2"></td> 187 <td ng-bind="articulo.descripcion" class="p-2"></td>
188 <td ng-bind="articulo.cantidad" class="text-right p-2"></td> 188 <td ng-bind="articulo.cantidad" class="text-right p-2"></td>
189 <td class="p-2"> 189 <td class="p-2">
190 <button 190 <button
191 type="button" 191 type="button"
192 class="btn btn-xs p-1 float-right mr-5" 192 class="btn btn-xs p-1 float-right mr-5"
193 ng-click="quitarArticulo(articulo, key, punto)" 193 ng-click="quitarArticulo(articulo, key, punto)"
194 title="Eliminar"> 194 title="Eliminar">
195 <i class="fa fa-trash" aria-hidden="true"></i> 195 <i class="fa fa-trash" aria-hidden="true"></i>
196 </button> 196 </button>
197 </td> 197 </td>
198 </tr> 198 </tr>
199 </tbody> 199 </tbody>
200 </table> 200 </table>
201 </div> 201 </div>
202 </div> 202 </div>
203 </div> 203 </div>
204 </div> 204 </div>
205 </div> 205 </div>
206 <div class="modal-footer"> 206 <div class="modal-footer">
207 <button 207 <button
208 class="btn btn-sm btn-secondary my-1" 208 class="btn btn-sm btn-secondary my-1"
209 type="button" 209 type="button"
210 ng-click="cancel()">Cancelar</button> 210 ng-click="cancel()">Cancelar</button>
211 <button 211 <button
212 class="btn btn-sm btn-primary my-1" 212 class="btn btn-sm btn-primary my-1"
213 type="button" 213 type="button"
214 ng-click="aceptar()" 214 ng-click="aceptar()"
215 ng-hide="ingreso">Aceptar</button> 215 ng-hide="ingreso">Aceptar</button>
216 <button 216 <button
217 class="btn btn-sm btn-primary my-1" 217 class="btn btn-sm btn-primary my-1"
218 type="button" 218 type="button"
219 ng-click="guardar()" 219 ng-click="guardar()"
220 ng-show="ingreso">Guardar</button> 220 ng-show="ingreso">Guardar</button>
221 </div> 221 </div>
222 222