Jose Pinto / foca-modal-punto-descarga

Commit 19c4c92be4f88834703b83901c1981f38d73234a

Authored by Eric Fernandez 2019-01-21 16:51:30 -0300

Exists in master

Merge branch 'master' into 'master'

Master

See merge request !9

Showing 3 changed files Show diff stats

src/js/controller.js

Diff comments View file @ 19c4c92

 angular.module('focaModalPuntoDescarga')
     .controller('focaModalPuntoDescargaController', [
         '$timeout',
         '$filter',
         '$scope',
         '$uibModalInstance',
         'focaModalPuntoDescargaService',
         'filters',
         'focaModalService',
         function($timeout, $filter, $scope, $uibModalInstance,
             focaModalPuntoDescargaService, filters, focaModalService) {
             $scope.cantidadArticulo = 0;
             $scope.articuloSeleccionado = 0;
             $scope.ivas = [];
             $scope.puntosSeleccionados = [];
+            $scope.editando = false;
             $scope.puntoDescarga = {
                 id: 0,
                 id_cliente: filters.idCliente,
                 id_da_config_0: filters.idDomicilio,
                 latitud: -32.89214159952345,
                 longitud: -68.84572999101856
             };
             $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) {
                     $scope.ingreso = false;
+                    $scope.puntoDescarga = {
+                        id: 0,
+                        id_cliente: filters.idCliente,
+                        id_da_config_0: filters.idDomicilio,
+                        latitud: -32.89214159952345,
+                        longitud: -68.84572999101856
+                    };
+                    $scope.editando = false;
                 }else {
                     $uibModalInstance.dismiss('cancel');
                 }
             };
             $scope.aceptar = function() {
                 if($scope.cargaArticulos) {
                     cargarArticulos();
                 }else {
                     verCargaArticulos();
                 }
             };
             $scope.guardar = function() {
                 focaModalPuntoDescargaService
                     .guardarPuntoDescarga($scope.puntoDescarga)
                     .then(function() {
                         actualizarTabla();
                         $scope.ingreso = false;
                         $scope.puntoDescarga = {
                             id: 0,
                             id_cliente: filters.idCliente,
                             id_da_config_0: filters.idDomicilio,
                             latitud: -32.89214159952345,
                             longitud: -68.84572999101856
                         };
+                        $scope.editando = false;
                     });
             };
             $scope.editar = function(id) {
                 focaModalPuntoDescargaService.getPuntoDescargaById(id).then(function(res) {
                     $scope.puntoDescarga = res.data;
                     $scope.ingreso = true;
+                    $scope.editando = true;
                 });
             };
             $scope.eliminar = function(idx, puntoDescarga) {
                 focaModalService.confirm('¿Está seguro que desea borrar el punto de descarga '+
                     puntoDescarga.descripcion + '?').then(function(data) {
                         if(data) {
                             focaModalPuntoDescargaService
                                 .eliminarPuntoDescarga(puntoDescarga.id)
                                 .then(function() {
                                     $scope.puntosDescarga.splice(idx, 1);
                                 });
                         }
                     });
             };
             $scope.seleccionarPunto = function(idx, esCheckbox) {
                 var indexPunto = $scope.puntosSeleccionados.indexOf(idx);
                 if(indexPunto !== -1) {
                     if(!esCheckbox){
                         $scope.puntosDescarga[idx].seleccionado = false;
                     }
                     $scope.puntosSeleccionados.splice(indexPunto, 1);
                 }else {
                     if(!esCheckbox){
                         $scope.puntosDescarga[idx].seleccionado = true;
                     }
                     $scope.puntosSeleccionados.push(idx);
                 }
             };
             $scope.agregarArticulo = function(punto, key) {
                 key = (typeof key  === 'undefined') ? 13 : key;
                 if(key === 13){
                     var articulo = $scope.articulos[$scope.articuloSeleccionado],
                     cantidadRestante = articulo.restante - punto.cantidadACargar;
                     if(cantidadRestante < 0) {
                         focaModalService
                             .alert('La cantidad a cargar debe ser menor o igual al restante');
                     }else if(punto.cantidadACargar <= 0) {
                         focaModalService
                             .alert('La cantidad a cargar debe ser mayor que cero');
                     }else {
                         punto.cargado += parseInt(punto.cantidadACargar);
                         articulo.restante = cantidadRestante;
                         var existeArticulo = punto.articulosAgregados.filter(
                             function (articuloAAgregar) {
                                 return articuloAAgregar.id === articulo.idArticulo;
                             });
                         //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.idArticulo,
                                 descripcion: articulo.descripcion,
                                 cantidad: punto.cantidadACargar,
                                 index: $scope.articuloSeleccionado
                             });
                         }
                         punto.cantidadACargar = 0;
                     }
                 }
             };
             $scope.quitarArticulo = function(articulo, idx, punto) {
                 var articuloAEliminar = $scope.articulos.filter(function(art) {
                     return art.id === articulo.id;
                 });
                 var restante = parseInt(articuloAEliminar[0].restante);
                 restante += parseInt(articulo.cantidad);
                 articuloAEliminar[0].restante = restante;
                 punto.cargado -= parseInt(punto.articulosAgregados[idx].cantidad);
                 punto.articulosAgregados.splice(idx, 1);
             };
             function actualizarTabla() {
                 focaModalPuntoDescargaService
                     .getPuntosDescargaByClienDom(filters.idDomicilio, filters.idCliente)
                     .then(function(res) {
                         $scope.puntosDescarga = res.data;
                     });
             }
             function verCargaArticulos() {
                 $scope.puntosACargar = [];
                 $scope.cargaArticulos = true;
                 $scope.puntosSeleccionados.forEach(function(idx) {
                     $scope.puntosACargar.push($scope.puntosDescarga[idx]);
                 });
                 $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.idArticulo === 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;
                     });
                 });
             }
         }]
     );

src/js/osm-directive.js

Diff comments View file @ 19c4c92

 angular.module('focaModalPuntoDescarga').directive('osmPuntoDescarga', function() {
     return {
         restrict: 'E',
         link: function(scope, el, attrs) {
             var contenedor = document.createElement('div');
             contenedor.className = 'w-100 h-50 mt-3';
             el.append(contenedor);
             scope.map = L.map(contenedor).setView([-32.89214159952345, -68.84572999101856], attrs.zoom);
             L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(scope.map);
         },
         controller: ['$scope', '$timeout', function($scope, $timeout) {
             //resuelve bug mapa gris en modales
             $timeout(function() {
                 $scope.map.invalidateSize();
             }, 100);
             $scope.markers = [];
             $scope.$watchGroup(['latitud', 'longitud'], function() {
                 for(var i in $scope.markers) {
                     $scope.map.removeLayer($scope.markers[i]);
                 }
                 $scope.markers.push(
-                    L.marker([$scope.latitud, $scope.longitud], {draggable:'true'})
+                    L.marker([$scope.latitud, $scope.longitud], {draggable: $scope.draggable})
                     .addTo($scope.map)
                     .on('dragend', function() {
                         $scope.latitud = this.getLatLng().lat;
                         $scope.longitud = this.getLatLng().lng;
                         $scope.$apply();
                     })
                 );
             });
         }],
         scope: {
             latitud: '=',
             longitud: '=',
-            zoom: '='
+            zoom: '=',
+            draggable: '<'
         }
     };
 });

src/views/modal-punto-descarga.html

Diff comments View file @ 19c4c92

 <div class="modal-header d-flex">
     <h5 class="modal-title my-1" ng-hide="ingreso || cargaArticulos">Búsqueda de puntos de descarga</h5>
     <h5 class="modal-title my-1" ng-show="ingreso">Crear punto de descarga</h5>
     <h5 class="modal-title my-1" ng-show="cargaArticulos">Cargar artículos en puntos de descarga</h5>
     <button
         class="btn btn-primary"
         title="Nuevo"
         ng-click="ingreso = true"
         ng-hide="ingreso || cargaArticulos">
         <i class="fa fa-plus" aria-hidden="true"></i>
     </button>
 </div>
 <div class="modal-body" id="modal-body">
     <table
         class="table table-striped table-sm col-12"
         ng-hide="ingreso || cargaArticulos">
         <thead>
             <tr>
                 <th>Código</th>
                 <th>Descripción</th>
                 <th>Latitud</th>
                 <th>Longitud</th>
                 <th></th>
             </tr>
         </thead>
         <tbody>
             <tr ng-show="!puntosDescarga.length">
-                <td colspan="3">
+                <td colspan="5">
                     No se encontraron resultados.
                 </td>
             </tr>
             <tr class="selected"
                 ng-repeat="(key, puntoDescarga) in puntosDescarga | filter: filters"
                 >
                 <td
                     ng-bind="puntoDescarga.id | rellenarDigitos: 3: 0"
                     ng-click="seleccionarPunto(key)"></td>
                 <td
                     ng-bind="puntoDescarga.descripcion"
                     ng-click="seleccionarPunto(key)"></td>
                 <td
                     ng-bind="puntoDescarga.latitud"
                     ng-click="seleccionarPunto(key)"></td>
                 <td
                     ng-bind="puntoDescarga.longitud"
                     ng-click="seleccionarPunto(key)"></td>
                 <td>
                     <input
                         type="checkbox"
                         class="custom-control-input float-right"
                         id="checkSelect{{key}}"
                         ng-model="puntoDescarga.seleccionado"
                         ng-change="seleccionarPunto(key, true)"
                         >
                     <label
                         class="custom-control-label float-right"
                         for="checkSelect{{key}}"></label>
                     <button
                         type="button"
                         class="btn btn-xs p-1 float-right mr-5"
                         ng-click="eliminar(key, puntoDescarga)"
                         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)"
                         title="Editar">
                         <i class="fa fa-pencil" aria-hidden="true"></i>
                     </button>
                 </td>
             </tr>
         </tbody>
     </table>
     <div ng-show="cargaArticulos">
         <div ng-show="!articulos.length">
             <h6>No existen articulos para agregar</h6>
         </div>
         <div ng-show="articulos.length">
             <div class="row">
                 <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-12">
                     <h5 class="col-12 my-3">Puntos de descarga</h5>
                     <table class="table table-sm">
                         <thead>
                             <tr>
                                 <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"
                                         ng-keypress="agregarArticulo(punto, $event.keyCode)"
                                     >
                                 </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)"
                                         title="Eliminar">
                                         <i class="fa fa-trash" aria-hidden="true"></i>
                                     </button>
                                 </td>
                             </tr>
                         </tbody>
                     </table>
                 </div>
             </div>
         </div>
     </div>
     <form ng-show="ingreso">
         <div class="row">
             <div class="col-12">
                 <label>Descripción</label>
                 <input
                     type="text"
                     class="form-control form-control-sm"
                     ng-model="puntoDescarga.descripcion"
                     uppercase-only>
             </div>
         </div>
         <div class="row">
             <div class="col-6">
                 <label>Latitud</label>
                 <input
                     type="text"
                     class="form-control form-control-sm"
                     ng-model="puntoDescarga.latitud"
                     ng-required="true"
+                    ng-readonly="editando"
                 />
             </div>
             <div class="col-6">
                 <label>Longitud</label>
                 <input
                     type="text"
                     class="form-control form-control-sm"
                     ng-model="puntoDescarga.longitud"
                     ng-required="true"
+                    ng-readonly="editando"
                 />
             </div>
         </div>
         <osm-punto-descarga
             latitud="puntoDescarga.latitud"
             longitud="puntoDescarga.longitud"
             zoom="14"
-            ng-if="ingreso"
+            ng-if="ingreso",
+            draggable="!editando"
         />
     </form>
 </div>
 <div class="modal-footer">
     <button
         class="btn btn-sm btn-secondary my-1"
         type="button"
         ng-click="cancel()">Cancelar</button>
     <button
         class="btn btn-sm btn-primary my-1"
         type="button"
         ng-click="aceptar()"
         ng-hide="ingreso">Aceptar</button>
     <button
         class="btn btn-sm btn-primary my-1"
         type="button"
         ng-click="guardar()"
         ng-show="ingreso">Guardar</button>
 </div>