Eric Fernandez / foca-crear-nota-pedido

Browse Code »

Commit bb4f94cdf54fe8139d99d35d8df4f6727ee5fc89

Authored by Eric Fernandez 2018-10-30 18:06:25 -0300

2 parents 71ac1c0cd3 236eac3d54

Exists in master

Merge branch 'master' of https://debo.suite.repo/modulos-npm/foca-crear-nota-pedido

Showing 2 changed files Show diff stats

src/js/controller.js

Diff comments View file @ bb4f94c

 angular.module('focaCrearNotaPedido') .controller('notaPedidoCtrl',
     [
         '$scope', '$uibModal', '$location', '$filter', 'crearNotaPedidoService',
         'focaModalService',
         function(
             $scope, $uibModal, $location, $filter, crearNotaPedidoService, focaModalService
         ) {
             $scope.botonera = [
                 {texto: 'Vendedor', accion: function() {$scope.seleccionarVendedor();}},
                 {texto: 'Cliente', accion: function() {$scope.seleccionarCliente();}},
                 {texto: 'Proveedor', accion: function() {$scope.seleccionarProveedor();}},
                 {texto: 'Moneda', accion: function() {$scope.abrirModalMoneda();}},
                 {
                     texto: 'Precios y condiciones',
                     accion: function() {$scope.abrirModalListaPrecio();}},
                 {texto: 'Flete', accion: function() {$scope.abrirModalFlete();}},
                 {texto: '', accion: function() {}},
                 {texto: '', accion: function() {}}
             ];
             $scope.show = false;
             $scope.cargando = true;
             $scope.dateOptions = {
                 maxDate: new Date(),
                 minDate: new Date(2010, 0, 1)
             };
             $scope.notaPedido = {
                 vendedor: {},
                 cliente: {},
                 domicilio: {dom: ''},
                 moneda: {detalle: ''}
             };
             $scope.cabecera = [];
+            $scope.showCabecera = false;
             $scope.now = new Date();
             $scope.puntoVenta = Math.round(Math.random() * 10000);
             $scope.comprobante = Math.round(Math.random() * 1000000);
             $scope.articulosTabla = [];
             var idLista;
             var notaPedidoTemp = crearNotaPedidoService.getNotaPedido();
             crearNotaPedidoService.getPrecioCondicion().then(
                 function(res) {
                     $scope.precioCondiciones = res.data;
                 }
             );
             if (notaPedidoTemp !== undefined) {
                 notaPedidoTemp.fechaCarga = new Date(notaPedidoTemp.fechaCarga);
                 $scope.notaPedido = notaPedidoTemp;
                 $scope.notaPedido.flete = ($scope.notaPedido.flete).toString();
                 $scope.notaPedido.bomba = ($scope.notaPedido.bomba).toString();
                 idLista = $scope.notaPedido.precioCondicion;
                 crearNotaPedidoService
                     .getArticulosByIdNotaPedido($scope.notaPedido.id).then(
                         function(res) {
                             $scope.articulosTabla = res.data;
                         }
                     );
                 //TODO DOMICILIOS QUE SE CARGAN AL EDITAR NOTA DE PEDIDO
                 //(NO REQUERIDO EN ESTA VERSION)
                 // crearNotaPedidoService.getDomiciliosByIdNotaPedido($scope.notaPedido.id).then(
                 //     function(res) {
                 //         $scope.notaPedido.domicilio = res.data;
                 //     }
                 // );
             } else {
                 $scope.notaPedido.fechaCarga = new Date();
                 $scope.notaPedido.bomba = '0';
                 $scope.notaPedido.flete = '0';
                 idLista = undefined;
             }
             //TO DO - FUNCIONES PARA MULTIPLES DOMICILIOS NO IMPLEMENTADAS EN ESTA DEMO
             // $scope.addNewDom = function() {
             //     $scope.notaPedido.domicilio.push({ 'id': 0 });
             // };
             // $scope.removeNewChoice = function(choice) {
             //     if ($scope.notaPedido.domicilio.length > 1) {
             //         $scope.notaPedido.domicilio.splice($scope.notaPedido.domicilio.findIndex(
             //             function(c) {
             //                 return c.$$hashKey === choice.$$hashKey;
             //             }
             //         ), 1);
             //     }
             // };
             $scope.crearNotaPedido = function() {
                 if($scope.articulosTabla.length === 0) {
                     focaModalService.alert('Debe cargar almenos un articulo');
                     return;
                 }
                 if($scope.notaPedido.domicilio.id === undefined) {
                     $scope.notaPedido.domicilio.id = 0;
                 }
                 var date = new Date();
                 var notaPedido = {
                     id: 0,
                     fechaCarga: new Date(date.getTime() - (date.getTimezoneOffset() * 60000))
                                         .toISOString().slice(0, 19).replace('T', ' '),
                     vendedor: $scope.notaPedido.vendedor.nombre,
                     idCliente: $scope.notaPedido.cliente.id,
                     domicilio: $scope.notaPedido.domicilio,
                     bomba: $scope.notaPedido.bomba,
                     flete: $scope.notaPedido.flete,
                     total: $scope.getTotal()
                 };
                 crearNotaPedidoService.crearNotaPedido(notaPedido).then(
                     function(data) {
                         focaModalService.alert('Nota pedido creada');
                         if($scope.notaPedido.flete === 1) {
                             var flete = {
                                 idNotaPedido: data.data.id,
                                 idTransportista: $scope.notaPedido.fleteId,
                                 idChofer: $scope.notaPedido.chofer.id,
                                 idVehiculo: $scope.notaPedido.vehiculo.id,
                                 kilometros: $scope.notaPedido.kilometros,
                                 costoKilometro: $scope.notaPedido.costoUnitarioKmFlete
                             };
                             crearNotaPedidoService.crearFlete(flete);
                         }
                         var articulosNotaPedido = $scope.articulosTabla;
                         for(var i = 0; i < articulosNotaPedido.length; i++) {
                             delete articulosNotaPedido[i].edit;
                             articulosNotaPedido[i].idNotaPedido = data.data.id;
                             crearNotaPedidoService
                                 .crearArticulosParaNotaPedido(articulosNotaPedido[i]);
                         }
                         $scope.limpiarPantalla();
                     }
                 );
             };
             $scope.seleccionarArticulo = function() {
                 if (idLista === undefined) {
                     focaModalService.alert(
                         'Primero seleccione una lista de precio y condicion');
                     return;
                 }
                 var modalInstance = $uibModal.open(
                     {
                         ariaLabelledBy: 'Busqueda de Productos',
                         templateUrl: 'modal-busqueda-productos.html',
                         controller: 'modalBusquedaProductosCtrl',
                         resolve: { idLista: function() { return idLista; } },
                         size: 'lg'
                     }
                 );
                 modalInstance.result.then(
                     function(producto) {
                         var newArt =
                         {
                             id: 0,
                             codigo: producto.codigo,
                             sector: producto.sector,
                             sectorCodigo: producto.sector + '-' + producto.codigo,
                             descripcion: producto.descripcion,
                             item: $scope.articulosTabla.length + 1,
                             nombre: producto.descripcion,
                             precio: producto.precio.toFixed(2),
                             costoUnitario: producto.costo,
                             edit: false
                         };
                         $scope.articuloACargar = newArt;
                         $scope.cargando = false;
                     }, function() {
                         // funcion ejecutada cuando se cancela el modal
                     }
                 );
             };
             $scope.seleccionarVendedor = function() {
                 var modalInstance = $uibModal.open(
                     {
                         ariaLabelledBy: 'Busqueda de Vendedores',
                         templateUrl: 'modal-vendedores.html',
                         controller: 'modalVendedoresCtrl',
                         size: 'lg'
                     }
                 );
                 modalInstance.result.then(
                     function(vendedor) {
                         addCabecera('Vendedor:', vendedor.NomVen);
                         $scope.notaPedido.vendedor.nombre = vendedor.NomVen;
                     }, function() {
                     }
                 );
             };
             $scope.seleccionarProveedor = function() {
                 var modalInstance = $uibModal.open(
                     {
                         ariaLabelledBy: 'Busqueda de Proveedor',
                         templateUrl: 'modal-proveedor.html',
                         controller: 'focaModalProveedorCtrl',
                         size: 'lg'
                     }
                 );
                 modalInstance.result.then(
                     function(proveedor) {
                         $scope.notaPedido.proveedor = proveedor.NOM;
                         addCabecera('Proveedor:', proveedor.NOM);
                     }, function() {
                     }
                 );
             };
             $scope.seleccionarCliente = function() {
                 var modalInstance = $uibModal.open(
                     {
                         ariaLabelledBy: 'Busqueda de Cliente',
                         templateUrl: 'foca-busqueda-cliente-modal.html',
                         controller: 'focaBusquedaClienteModalController',
                         size: 'lg'
                     }
                 );
                 modalInstance.result.then(
                     function(cliente) {
                         $scope.notaPedido.cliente.nombre = cliente.nom;
                         $scope.notaPedido.cliente.id = cliente.cod;
                         crearNotaPedidoService.getDomiciliosByIdCliente(cliente.cod).then(
                             function(data) {
                                 if(data.data.length === 0){
                                     focaModalService
                                         .alert('El cliente no tienen domicilios de entrega')
                                         .then(
                                             function() {
                                                 $scope.seleccionarCliente();
                                                 $scope.notaPedido.cliente = {nombre: ''};
                                             }
                                     );
                                     return;
                                 }
                                 var modalInstanceDomicilio = $uibModal.open(
                                     {
                                         ariaLabelledBy: 'Busqueda de Domicilios',
                                         templateUrl: 'modal-domicilio.html',
                                         controller: 'focaModalDomicilioController',
                                         resolve: { idCliente: function() { return cliente.cod; }},
                                         size: 'lg',
                                         backdrop: 'static',
                                     }
                                 );
                                 modalInstanceDomicilio.result.then(
                                     function(domicilio) {
                                        focaModalService.alert('Domicilio elegido' + domicilio.dom);
                                     }, function() {
                                         $scope.notaPedido.cliente.nombre = '';
                                         $scope.notaPedido.cliente.id = '';
                                         removeCabecera('Cliente:');
                                         $scope.seleccionarCliente();
                                         return;
                                     }
                                 );
                             }
                         );
                         addCabecera('Cliente:', cliente.nom);
                     }, function() {
                     }
                 );
             };
             $scope.mostrarFichaCliente = function() {
                 $uibModal.open(
                     {
                         ariaLabelledBy: 'Datos del Cliente',
                         templateUrl: 'foca-crear-nota-pedido-ficha-cliente.html',
                         controller: 'focaCrearNotaPedidoFichaClienteController',
                         size: 'lg'
                     }
                 );
             };
             $scope.getTotal = function() {
                 var total = 0;
                 var arrayTempArticulos = $scope.articulosTabla;
                 for (var i = 0; i < arrayTempArticulos.length; i++) {
                     total += arrayTempArticulos[i].precio * arrayTempArticulos[i].cantidad;
                 }
                 return total.toFixed(2);
             };
             $scope.getSubTotal = function() {
                 if($scope.articuloACargar) {
                     return $scope.articuloACargar.precio * $scope.articuloACargar.cantidad;
                 }
             };
             $scope.abrirModalListaPrecio = function() {
                 var modalInstance = $uibModal.open(
                     {
                         ariaLabelledBy: 'Busqueda de Precio Condición',
                         templateUrl: 'modal-precio-condicion.html',
                         controller: 'focaModalPrecioCondicionController',
                         size: 'lg'
                     }
                 );
                 modalInstance.result.then(
                     function(precioCondicion) {
                         var cabecera = '';
                         var plazosConcat = '';
                         if(!Array.isArray(precioCondicion)) {
                             $scope.plazosPagos = precioCondicion.plazoPago;
                             idLista = precioCondicion.idListaPrecio;
                             for(var i = 0; i < precioCondicion.plazoPago.length; i++) {
                                 plazosConcat += precioCondicion.plazoPago[i].dias + ' ';
                             }
                             cabecera = precioCondicion.nombre + ' ' + plazosConcat.trim();
                         } else { //Cuando se ingresan los plazos manualmente
                             idLista = -1; //-1, el modal productos busca todos los productos
                             $scope.notaPedido.plazoPago = precioCondicion;
                             for(var j = 0; j < precioCondicion.length; j++) {
                                 plazosConcat += precioCondicion[j].dias + ' ';
                             }
                             cabecera = 'Ingreso manual ' + plazosConcat.trim();
                         }
                         $scope.articulosTabla = [];
                         addCabecera('Precios y condiciones:', cabecera);
                     }, function() {
                     }
                 );
             };
             $scope.abrirModalFlete = function() {
                 var modalInstance = $uibModal.open(
                     {
                         ariaLabelledBy: 'Busqueda de Flete',
                         templateUrl: 'modal-flete.html',
                         controller: 'focaModalFleteController',
                         size: 'lg',
                         resolve: {
                             parametrosFlete:
                                 function() {
                                     return {
                                         flete: $scope.notaPedido.flete,
                                         bomba: $scope.notaPedido.bomba,
                                         kilometros: $scope.notaPedido.kilometros
                                     };
                                 }
                         }
                     }
                 );
                 modalInstance.result.then(
                     function(datos) {
                         $scope.notaPedido.flete = datos.flete;
                         $scope.notaPedido.bomba = datos.bomba;
                         $scope.notaPedido.kilometros = datos.kilometros;
                         addCabecera('Flete:', datos.flete);
                         if(datos.flete === 'si') {
                             addCabecera('Bomba:', datos.bomba);
                             addCabecera('Kilometros:', datos.kilometros);
                         } else {
                             removeCabecera('Bomba:');
                             removeCabecera('Kilometros:');
                         }
                     }, function() {
                     }
                 );
             };
             $scope.abrirModalMoneda = function() {
                 var modalInstance = $uibModal.open(
                     {
                         ariaLabelledBy: 'Busqueda de Moneda',
                         templateUrl: 'modal-moneda.html',
                         controller: 'focaModalMonedaController',
                         size: 'lg'
                     }
                 );
                 modalInstance.result.then(
                     function(moneda) {
                         $scope.notaPedido.moneda = {
                             id: moneda.ID,
                             detalle: moneda.DETALLE,
                             simbolo: moneda.SIMBOLO
                         };
                         addCabecera('Moneda:', moneda.DETALLE);
                     }, function() {
                     }
                 );
             };
             $scope.agregarATabla = function(key) {
                 if(key === 13) {
                     if($scope.articuloACargar.cantidad === undefined ||
                         $scope.articuloACargar.cantidad === 0 ||
                         $scope.articuloACargar.cantidad === null ){
                             focaModalService.alert('El valor debe ser al menos 1');
                             return;
                     }
                     delete $scope.articuloACargar.sectorCodigo;
                     $scope.articulosTabla.push($scope.articuloACargar);
                     $scope.cargando = true;
                 }
             };
             $scope.quitarArticulo = function(key) {
                 $scope.articulosTabla.splice(key, 1);
             };
             $scope.editarArticulo = function(key, articulo) {
                 if(key === 13) {
                     if(articulo.cantidad === null || articulo.cantidad === 0 ||
                         articulo.cantidad === undefined){
                         focaModalService.alert('El valor debe ser al menos 1');
                         return;
                     }
                     articulo.edit = false;
                 }
             };
             $scope.cambioEdit = function(articulo) {
                 articulo.edit = true;
             };
             $scope.limpiarFlete = function() {
                 $scope.notaPedido.fleteNombre = '';
                 $scope.notaPedido.chofer = '';
                 $scope.notaPedido.vehiculo = '';
                 $scope.notaPedido.kilometros = '';
                 $scope.notaPedido.costoUnitarioKmFlete = '';
                 $scope.choferes = '';
                 $scope.vehiculos = '';
             };
             $scope.limpiarPantalla = function() {
                 $scope.limpiarFlete();
                 $scope.notaPedido.flete = '0';
                 $scope.notaPedido.bomba = '0';
                 $scope.notaPedido.precioCondicion = '';
                 $scope.articulosTabla = [];
                 $scope.notaPedido.vendedor.nombre = '';
                 $scope.notaPedido.cliente = {nombre: ''};
                 $scope.notaPedido.domicilio = {dom: ''};
                 $scope.domiciliosCliente = [];
             };
             $scope.resetFilter = function() {
                 $scope.articuloACargar = {};
                 $scope.cargando = true;
             };
             $scope.selectFocus = function($event) {
                 $event.target.select();
             };
             $scope.salir = function() {
                 $location.path('/');
             };
             function addCabecera(label, valor) {
                 var propiedad = $filter('filter')($scope.cabecera, {label: label});
                 if(propiedad.length === 1) {
                     propiedad[0].valor = valor;
                 } else {
                     $scope.cabecera.push({label: label, valor: valor});
                 }
             }
             function removeCabecera(label) {
                 var propiedad = $filter('filter')($scope.cabecera, {label: label});
                 if(propiedad.length === 1){
                     $scope.cabecera.splice($scope.cabecera.indexOf(propiedad[0]), 1);
                 }
             }
         }
     ]
 )
 .controller('notaPedidoListaCtrl', [
     '$scope',
     'crearNotaPedidoService',
     '$location',
     function($scope, crearNotaPedidoService, $location) {
         crearNotaPedidoService.obtenerNotaPedido().then(function(datos) {
             $scope.notaPedidos = datos.data;
         });
         $scope.editar = function(notaPedido) {
             crearNotaPedidoService.setNotaPedido(notaPedido);
             $location.path('/venta-nota-pedido/abm/');
         };
         $scope.crearPedido = function() {
             crearNotaPedidoService.clearNotaPedido();
             $location.path('/venta-nota-pedido/abm/');
         };
     }
 ])
 .controller('focaCrearNotaPedidoFichaClienteController', [
     '$scope',
     'crearNotaPedidoService',
     '$location',
     function($scope, crearNotaPedidoService, $location) {
         crearNotaPedidoService.obtenerNotaPedido().then(function(datos) {
             $scope.notaPedidos = datos.data;
         });
         $scope.editar = function(notaPedido) {
             crearNotaPedidoService.setNotaPedido(notaPedido);
             $location.path('/venta-nota-pedido/abm/');
         };
         $scope.crearPedido = function() {
             crearNotaPedidoService.clearNotaPedido();
             $location.path('/venta-nota-pedido/abm/');
         };
     }
 ]);

src/views/nota-pedido.html

Diff comments View file @ bb4f94c

 <div class="crear-nota-pedido">
     <form name="formCrearNota" ng-submit="crearNotaPedido()">
         <div class="row">
             <div class="col-md-10 offset-md-1 col-lg-8 offset-lg-2">
                 <div class="row p-1 panel-informativo">
                     <div class="col-12">
                         <div class="row">
-                            <div class="col-5">
+                            <div class="col-12 col-sm-4 nota-pedido">
-                                <div class="h6">NOTA DE PEDIDO</div>
+                                <h5>NOTA DE PEDIDO</h5>
                             </div>
-                            <div class="col-3">Nº {{puntoVenta}}-{{comprobante}}</div>
+                            <div class="col-6 col-sm-4 numero-pedido">Nº {{puntoVenta}}-{{comprobante}}</div>
-                            <div class="col-4 text-right">
+                            <div class="col-6 col-sm-4 text-right">
                                 Fecha: {{ now | date:'dd/MM/yyyy HH:mm'}}
                             </div>
                         </div>
                         <div class="row">
-                            <div class="col-auto" ng-repeat="cab in cabecera">
+                            <div class="col-auto" ng-repeat="cab in cabecera" ng-show="showCabecera">
                                 <span class="label" ng-bind="cab.label"></span>
                                 <span class="valor" ng-bind="cab.valor"></span>
                             </div>
+                            <a
+                                class="btn col-12 btn-secondary d-sm-none"
+                                ng-show="cabecera.length > 0"
+                                ng-click="showCabecera = !showCabecera"
+                            >
+                                <i
+                                    class="fa fa-chevron-down"
+                                    ng-hide="showCabecera"
+                                    aria-hidden="true"
+                                >
+                                </i>
+                                <i
+                                    class="fa fa-chevron-up"
+                                    ng-show="showCabecera"
+                                    aria-hidden="true">
+                                </i>
+                            </a>
                         </div>
                     </div>
                 </div>
                 <div class="row p-1 botonera-secundaria">
                     <div class="col-12">
                         <div class="row">
-                            <div class="col-3 px-0 py-0" ng-repeat="boton in botonera">
+                            <div class="col-6 col-sm-3 px-0 py-0" ng-repeat="boton in botonera">
                                 <button
                                     type="button"
                                     class="btn btn-default btn-block btn-xs text-left py-2"
                                     ng-click="boton.accion()"
+                                    ng-class="{'d-none d-sm-block': boton.texto == ''}"
                                 >
                                     <i
                                         class="fa fa-arrow-circle-right"
                                         ng-show="boton.texto != ''"
                                     ></i>
                                     &nbsp;
                                     {{boton.texto}}
                                 </button>
                             </div>
                         </div>
                     </div>
                 </div>
             </div>
         </div>
     </form>
     <div class="row">
-        <div class="col-md-10 col-lg-8 offset-md-1 offset-lg-2">
+        <div class="col-12 col-md-10 col-lg-8 offset-md-1 offset-lg-2">
+            <!-- PC -->
             <div class="row grilla-articulo align-items-end">
-                <table class="table table-striped table-sm table-dark tabla-articulo">
+                <table class="table tabla-articulo table-striped table-sm table-dark">
                     <thead>
-                        <tr>
+                        <tr class="d-flex">
-                            <th class="tabla-articulo-numero">#</th>
+                            <th class="">#</th>
-                            <th class="tabla-articulo-codigo">Código</th>
+                            <th class="col">Código</th>
-                            <th class="tabla-articulo-descripcion">Descripción</th>
+                            <th class="col-4">Descripción</th>
-                            <th class="tabla-articulo-cantidad text-right">Cantidad</th>
+                            <th class="col text-right">Cantidad</th>
-                            <th class="tabla-articulo-precio text-right">Precio Unitario</th>
+                            <th class="col text-right">Precio Unitario</th>
-                            <th class="tabla-articulo-subtotal text-right">SubTotal</th>
+                            <th class="col text-right">SubTotal</th>
-                            <th class="tabla-articulo-boton text-right">
+                            <th class="text-right">
                                 <button
                                     class="btn btn-outline-secondary selectable"
                                     ng-click="show = !show; masMenos()"
                                 >
                                     <i
                                         class="fa fa-chevron-down"
                                         ng-show="show"
                                         aria-hidden="true"
                                     >
                                     </i>
                                     <i
                                         class="fa fa-chevron-up"
                                         ng-hide="show"
                                         aria-hidden="true">
                                     </i>
                                 </button>
                             </th>
                         </tr>
                     </thead>
                     <tbody class="tabla-articulo-body">
                         <tr
                             ng-repeat="(key, articulo) in articulosTabla"
                             ng-show="show || key == (articulosTabla.length - 1)"
+                            class="d-flex"
                         >
-                            <td class="tabla-articulo-numero" ng-bind="key + 1"></td>
+                            <td ng-bind="key + 1"></td>
                             <td
-                                class="tabla-articulo-codigo"
+                                class="col"
                                 ng-bind="articulo.sector + '-' + articulo.codigo"
                             ></td>
                             <td
-                                class="tabla-articulo-descripcion"
+                                class="col-4"
                                 ng-bind="articulo.descripcion"
                             ></td>
-                            <td class="tabla-articulo-cantidad text-right">
+                            <td class="col  text-right">
                                 <input
                                     ng-show="articulo.edit"
                                     ng-model="articulo.cantidad"
                                     class="form-control"
                                     type="number"
                                     min="1"
                                     foca-focus="articulo.edit"
                                     ng-keypress="editarArticulo($event.keyCode, articulo)"
                                     ng-focus="selectFocus($event)"
                                 >
                                 <i
                                     class="selectable"
                                     ng-click="cambioEdit(articulo)"
                                     ng-hide="articulo.edit"
                                     ng-bind="articulo.cantidad">
                                 </i>
                             </td>
                             <td
-                                class="tabla-articulo-precio text-right"
+                                class="col text-right"
                                 ng-bind="articulo.precio | currency: '$'"
                             ></td>
                             <td
-                                class="tabla-articulo-subtotal text-right"
+                                class="col text-right"
                                 ng-bind="(articulo.precio * articulo.cantidad) | currency: '$'">
                             </td>
-                            <td class="tabla-articulo-boton text-center">
+                            <td class="text-center">
                                 <button
-                                    class="btn btn-outline-secondary btn-sm"
+                                    class="btn btn-outline-secondary"
                                     ng-click="quitarArticulo(key)"
                                 >
                                     <i class="fa fa-trash"></i>
                                 </button>
                             </td>
                         </tr>
                     </tbody>
                     <tfoot>
-                        <tr ng-show="!cargando">
+                        <tr ng-show="!cargando" class="d-flex">
                             <td
-                                class="tabla-articulo-numero align-middle"
+                                class="align-middle"
                                 ng-bind="articulosTabla.length + 1"
                             ></td>
-                            <td class="tabla-articulo-codigo">
+                            <td class="col">
                                 <input
                                     class="form-control"
                                     ng-model="articuloACargar.sectorCodigo"
                                     readonly
                                 >
                             </td>
-                            <td class="tabla-articulo-descripcion">
+                            <td class="col-3 tabla-articulo-descripcion">
                                 <input
                                     class="form-control"
                                     ng-model="articuloACargar.descripcion"
                                     readonly
                                 >
                             </td>
-                            <td class="tabla-articulo-cantidad text-right">
+                            <td class="col text-right">
                                 <input
                                     class="form-control"
                                     type="number"
                                     min="1"
                                     ng-model="articuloACargar.cantidad"
                                     foca-focus="!cargando"
                                     esc-key="resetFilter()"
                                     ng-keypress="agregarATabla($event.keyCode)"
                                 >
                             </td>
-                            <td class="tabla-articulo-precio text-right">
+                            <td class="col text-right">
                                 <input
                                     class="form-control"
                                     ng-value="articuloACargar.precio | currency: '$'"
                                     readonly
                                 >
                             </td>
-                            <td class="tabla-articulo-subtotal text-right">
+                            <td class="col text-right">
                                 <input
                                     class="form-control"
                                     ng-value="getSubTotal() | currency: '$'"
                                     readonly
                                 ></td>
-                            <td class="tabla-articulo-boton text-center align-middle">
+                            <td class="text-center align-middle">
                                 <button
                                     class="btn btn-outline-secondary"
                                     ng-click="agregarATabla(13)"
                                 >
                                     <i class="fa fa-save"></i>
                                 </button>
                             </td>
                         </tr>
-                        <tr ng-show="cargando">
+                        <tr ng-show="cargando" class="d-flex">
-                            <td colspan="7">
+                            <td colspan="7" class="col-12">
                                 <input
                                     placeholder="Seleccione Articulo"
                                     class="form-control form-control-sm"
                                     readonly
                                     ng-click="seleccionarArticulo()"
                                 />
                             </td>
                         </tr>
-                        <tr class="">
+                        <tr class="d-flex">
                             <td colspan="4">
                                 <strong>Cantidad Items:</strong>
                                 <a ng-bind="articulosTabla.length"></a>
                             </td>
-                            <td class="text-right table-celda-total"><h3>Total:</h3></td>
+                            <td class="text-right ml-auto table-celda-total"><h3>Total:</h3></td>
                             <td class="table-celda-total text-right" colspan="1">
                                 <h3>{{getTotal() | currency: '$'}}</h3>
                             </td>
                             <td class="text-right">
                                 <button
                                     type="button"
                                     class="btn btn-default btn-sm"
                                 >
                                     Totales
                                 </button>
                             </td>
                         </tr>
                     </tfoot>
                 </table>
             </div>
         </div>
         <div class="col-auto my-2 col-lg-2 botonera-lateral">
             <div class="row align-items-end">
                 <div class="col-12">
                     <button
                         ng-click="crearNotaPedido()"
                         type="submit"
                         title="Crear nota pedido"
                         class="btn btn-default btn-block mb-2">
                         Guardar
                     </button>
                     <button
                         ng-click="salir()"
                         type="button"
                         title="Salir"
                         class="btn btn-default btn-block">
                         Salir
                     </button>
                 </div>
             </div>
         </div>
     </div>
 </div>