Commit 9f7ff87cb6d4125954743c1501f1039553ecf517
1 parent
e80493aa58
Exists in
master
and in
1 other branch
modal enviar mail
Showing
3 changed files
with
141 additions
and
0 deletions
Show diff stats
src/js/controller.js
| 1 | angular.module('focaModal') | 1 | angular.module('focaModal') |
| 2 | .controller('focaModalConfirmController', [ | 2 | .controller('focaModalConfirmController', [ |
| 3 | '$uibModalInstance', '$scope', 'textoModal', | 3 | '$uibModalInstance', '$scope', 'textoModal', |
| 4 | function($uibModalInstance, $scope, textoModal) { | 4 | function($uibModalInstance, $scope, textoModal) { |
| 5 | $scope.textoModal = textoModal; | 5 | $scope.textoModal = textoModal; |
| 6 | $scope.cancelar = function() { | 6 | $scope.cancelar = function() { |
| 7 | $uibModalInstance.dismiss(false); | 7 | $uibModalInstance.dismiss(false); |
| 8 | }; | 8 | }; |
| 9 | $scope.aceptar = function() { | 9 | $scope.aceptar = function() { |
| 10 | $uibModalInstance.close(true); | 10 | $uibModalInstance.close(true); |
| 11 | }; | 11 | }; |
| 12 | } | 12 | } |
| 13 | ]) | 13 | ]) |
| 14 | .controller('focaModalAlertController', [ | 14 | .controller('focaModalAlertController', [ |
| 15 | '$uibModalInstance', '$scope', 'textoModal', | 15 | '$uibModalInstance', '$scope', 'textoModal', |
| 16 | function($uibModalInstance, $scope, textoModal) { | 16 | function($uibModalInstance, $scope, textoModal) { |
| 17 | $scope.textoModal = textoModal; | 17 | $scope.textoModal = textoModal; |
| 18 | $scope.aceptar = function() { | 18 | $scope.aceptar = function() { |
| 19 | $uibModalInstance.close(true); | 19 | $uibModalInstance.close(true); |
| 20 | }; | 20 | }; |
| 21 | } | 21 | } |
| 22 | ]) | 22 | ]) |
| 23 | .controller('focaModalFechaController', [ | 23 | .controller('focaModalFechaController', [ |
| 24 | '$uibModalInstance', '$scope', 'parametros', | 24 | '$uibModalInstance', '$scope', 'parametros', |
| 25 | function($uibModalInstance, $scope, parametros) { | 25 | function($uibModalInstance, $scope, parametros) { |
| 26 | $scope.parametros = parametros; | 26 | $scope.parametros = parametros; |
| 27 | $scope.fecha = new Date(); | 27 | $scope.fecha = new Date(); |
| 28 | $scope.options = {}; | 28 | $scope.options = {}; |
| 29 | 29 | ||
| 30 | if (parametros.minDate) $scope.options.minDate = parametros.minDate; | 30 | if (parametros.minDate) $scope.options.minDate = parametros.minDate; |
| 31 | 31 | ||
| 32 | $scope.cancelar = function() { | 32 | $scope.cancelar = function() { |
| 33 | $uibModalInstance.dismiss(); | 33 | $uibModalInstance.dismiss(); |
| 34 | }; | 34 | }; |
| 35 | $scope.aceptar = function() { | 35 | $scope.aceptar = function() { |
| 36 | $uibModalInstance.close($scope.fecha); | 36 | $uibModalInstance.close($scope.fecha); |
| 37 | }; | 37 | }; |
| 38 | } | 38 | } |
| 39 | ]) | 39 | ]) |
| 40 | .controller('focaModalPromptController', [ | 40 | .controller('focaModalPromptController', [ |
| 41 | '$uibModalInstance', '$scope', 'options', 'focaModalService', | 41 | '$uibModalInstance', '$scope', 'options', 'focaModalService', |
| 42 | function($uibModalInstance, $scope, options, focaModalService) { | 42 | function($uibModalInstance, $scope, options, focaModalService) { |
| 43 | 43 | ||
| 44 | $scope.options = options; | 44 | $scope.options = options; |
| 45 | $scope.cancelar = function() { | 45 | $scope.cancelar = function() { |
| 46 | $uibModalInstance.dismiss(); | 46 | $uibModalInstance.dismiss(); |
| 47 | }; | 47 | }; |
| 48 | $scope.aceptar = function(key) { | 48 | $scope.aceptar = function(key) { |
| 49 | if (key === 13) { | 49 | if (key === 13) { |
| 50 | if (options.email && !validateEmails($scope.options.value)) { | 50 | if (options.email && !validateEmails($scope.options.value)) { |
| 51 | focaModalService.alert('Ingrese email/s válido/s'); | 51 | focaModalService.alert('Ingrese email/s válido/s'); |
| 52 | return; | 52 | return; |
| 53 | } | 53 | } |
| 54 | $uibModalInstance.close($scope.options.value); | 54 | $uibModalInstance.close($scope.options.value); |
| 55 | } | 55 | } |
| 56 | }; | 56 | }; |
| 57 | 57 | ||
| 58 | function validateEmails(emails) { | 58 | function validateEmails(emails) { |
| 59 | var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; | 59 | var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; |
| 60 | var arr = emails.split(','); | 60 | var arr = emails.split(','); |
| 61 | var result = true; | 61 | var result = true; |
| 62 | 62 | ||
| 63 | arr.forEach(function(email) { | 63 | arr.forEach(function(email) { |
| 64 | var val = String(email).trim().toLowerCase(); | 64 | var val = String(email).trim().toLowerCase(); |
| 65 | 65 | ||
| 66 | if (!re.test(val)) result = false; | 66 | if (!re.test(val)) result = false; |
| 67 | }); | 67 | }); |
| 68 | 68 | ||
| 69 | return result; | 69 | return result; |
| 70 | } | 70 | } |
| 71 | } | 71 | } |
| 72 | ]) | ||
| 73 | .controller('focaModalMailController', [ | ||
| 74 | '$scope', | ||
| 75 | '$uibModalInstance', | ||
| 76 | 'FileSaver', | ||
| 77 | 'Blob', | ||
| 78 | 'focaModalEnviarMailService', | ||
| 79 | 'focaModalService', | ||
| 80 | 'options', | ||
| 81 | function($scope, $uibModalInstance, FileSaver, Blob, | ||
| 82 | focaModalEnviarMailService, focaModalService, options) { | ||
| 83 | |||
| 84 | var regexMail = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; | ||
| 85 | $scope.descargado = false; | ||
| 86 | $scope.correoEnviado = false; | ||
| 87 | $scope.correoNoEnviado = false; | ||
| 88 | $scope.esperando = false; | ||
| 89 | $scope.titulo = options.titulo; | ||
| 90 | $scope.mailCliente = options.envio.mailCliente; | ||
| 91 | |||
| 92 | $scope.aceptar = function() { | ||
| 93 | $uibModalInstance.close(); | ||
| 94 | }; | ||
| 95 | |||
| 96 | $scope.salir = function() { | ||
| 97 | $uibModalInstance.close($scope.descargado); | ||
| 98 | }; | ||
| 99 | |||
| 100 | $scope.imprimir = function () { | ||
| 101 | $scope.descargado = true; | ||
| 102 | $scope.esperando = true; | ||
| 103 | focaModalEnviarMailService | ||
| 104 | .imprimirComprobante(options.descarga.url, options.options) | ||
| 105 | .then(function(res) { | ||
| 106 | var data = new Blob([res.data], {type: 'application/pdf'}); | ||
| 107 | |||
| 108 | FileSaver.saveAs( | ||
| 109 | data, | ||
| 110 | options.descarga.nombre | ||
| 111 | ); | ||
| 112 | $scope.esperando = false; | ||
| 113 | }); | ||
| 114 | }; | ||
| 115 | |||
| 116 | $scope.enviarCorreo = function(key) { | ||
| 117 | if (key === 13) { | ||
| 118 | if (!validarMail()) { | ||
| 119 | focaModalService.alert('Ingrese email/s válido/s'); | ||
| 120 | return; | ||
| 121 | } | ||
| 122 | $scope.descargado = true; | ||
| 123 | $scope.esperando = true; | ||
| 124 | Object.assign(options.options, {receiver: $scope.mailCliente}); | ||
| 125 | |||
| 126 | focaModalEnviarMailService | ||
| 127 | .enviarCorreo(options.envio.url, options.options) | ||
| 128 | .then(function() { | ||
| 129 | $scope.correoEnviado = true; | ||
| 130 | $scope.esperando = false; | ||
| 131 | }, function() { | ||
| 132 | $scope.esperando = false; | ||
| 133 | $scope.correoNoEnviado = true; | ||
| 134 | }); | ||
| 135 | } | ||
| 136 | }; | ||
| 137 | |||
| 138 | function validarMail() { | ||
| 139 | var emails = $scope.mailCliente.split(','); | ||
| 140 | var result = true; | ||
| 141 | emails.forEach(function(email) { | ||
| 142 | if (!regexMail.test(email.trim())) result = false; | ||
| 143 | }); | ||
| 144 | return result; | ||
| 145 | } | ||
| 146 | } | ||
| 72 | ]); | 147 | ]); |
| 73 | 148 |
src/js/service.js
| 1 | angular.module('focaModal') | 1 | angular.module('focaModal') |
| 2 | .factory('focaModalService', [ | 2 | .factory('focaModalService', [ |
| 3 | '$uibModal', 'API_ENDPOINT', '$http', | 3 | '$uibModal', 'API_ENDPOINT', '$http', |
| 4 | function($uibModal, API_ENDPOINT, $http) { | 4 | function($uibModal, API_ENDPOINT, $http) { |
| 5 | return { | 5 | return { |
| 6 | confirm: function(textoModal) { | 6 | confirm: function(textoModal) { |
| 7 | return $uibModal.open({ | 7 | return $uibModal.open({ |
| 8 | templateUrl: 'modal-confirm.html', | 8 | templateUrl: 'modal-confirm.html', |
| 9 | controller: 'focaModalConfirmController', | 9 | controller: 'focaModalConfirmController', |
| 10 | animation: false, | 10 | animation: false, |
| 11 | backdrop: false, | 11 | backdrop: false, |
| 12 | resolve: { textoModal: function() { return textoModal; } } | 12 | resolve: { textoModal: function() { return textoModal; } } |
| 13 | }) | 13 | }) |
| 14 | .result.then( | 14 | .result.then( |
| 15 | function(resultado) { | 15 | function(resultado) { |
| 16 | return resultado; | 16 | return resultado; |
| 17 | } | 17 | } |
| 18 | ); | 18 | ); |
| 19 | }, | 19 | }, |
| 20 | alert: function(textoModal) { | 20 | alert: function(textoModal) { |
| 21 | return $uibModal.open({ | 21 | return $uibModal.open({ |
| 22 | templateUrl: 'modal-alert.html', | 22 | templateUrl: 'modal-alert.html', |
| 23 | controller: 'focaModalAlertController', | 23 | controller: 'focaModalAlertController', |
| 24 | animation: false, | 24 | animation: false, |
| 25 | backdrop: false, | 25 | backdrop: false, |
| 26 | resolve: { textoModal: function() { return textoModal; } } | 26 | resolve: { textoModal: function() { return textoModal; } } |
| 27 | }) | 27 | }) |
| 28 | .result.then( | 28 | .result.then( |
| 29 | function(resultado) { | 29 | function(resultado) { |
| 30 | return resultado; | 30 | return resultado; |
| 31 | } | 31 | } |
| 32 | ); | 32 | ); |
| 33 | }, | 33 | }, |
| 34 | modal: function(parametrosModal) { | 34 | modal: function(parametrosModal) { |
| 35 | parametrosModal.size = (typeof parametrosModal.size === 'undefined') ? | 35 | parametrosModal.size = (typeof parametrosModal.size === 'undefined') ? |
| 36 | 'lg' : parametrosModal.size; | 36 | 'lg' : parametrosModal.size; |
| 37 | 37 | ||
| 38 | return $uibModal.open({ | 38 | return $uibModal.open({ |
| 39 | templateUrl: 'foca-modal.html', | 39 | templateUrl: 'foca-modal.html', |
| 40 | controller: 'focaModalController', | 40 | controller: 'focaModalController', |
| 41 | size: parametrosModal.size, | 41 | size: parametrosModal.size, |
| 42 | resolve: { | 42 | resolve: { |
| 43 | parametrosModal: function() { return parametrosModal; } | 43 | parametrosModal: function() { return parametrosModal; } |
| 44 | } | 44 | } |
| 45 | }) | 45 | }) |
| 46 | .result.then( | 46 | .result.then( |
| 47 | function(resultado) { | 47 | function(resultado) { |
| 48 | return resultado; | 48 | return resultado; |
| 49 | } | 49 | } |
| 50 | ); | 50 | ); |
| 51 | }, | 51 | }, |
| 52 | getEntidad: function(filters, query, tipo, json) { | 52 | getEntidad: function(filters, query, tipo, json) { |
| 53 | if (tipo === 'POST') { | 53 | if (tipo === 'POST') { |
| 54 | return $http.post(API_ENDPOINT.URL + query, json); | 54 | return $http.post(API_ENDPOINT.URL + query, json); |
| 55 | } else { | 55 | } else { |
| 56 | return $http.get(API_ENDPOINT.URL + query, {nombre: filters}); | 56 | return $http.get(API_ENDPOINT.URL + query, {nombre: filters}); |
| 57 | } | 57 | } |
| 58 | }, | 58 | }, |
| 59 | modalFecha: function(parametros) { | 59 | modalFecha: function(parametros) { |
| 60 | return $uibModal.open({ | 60 | return $uibModal.open({ |
| 61 | templateUrl: 'foca-fecha.html', | 61 | templateUrl: 'foca-fecha.html', |
| 62 | controller: 'focaModalFechaController', | 62 | controller: 'focaModalFechaController', |
| 63 | size: 'md', | 63 | size: 'md', |
| 64 | resolve: { | 64 | resolve: { |
| 65 | parametros: function() { return parametros; } | 65 | parametros: function() { return parametros; } |
| 66 | } | 66 | } |
| 67 | }) | 67 | }) |
| 68 | .result.then( | 68 | .result.then( |
| 69 | function(resultado) { | 69 | function(resultado) { |
| 70 | return resultado; | 70 | return resultado; |
| 71 | } | 71 | } |
| 72 | ); | 72 | ); |
| 73 | }, | 73 | }, |
| 74 | prompt: function(options) { | 74 | prompt: function(options) { |
| 75 | return $uibModal.open({ | 75 | return $uibModal.open({ |
| 76 | templateUrl: 'modal-prompt.html', | 76 | templateUrl: 'modal-prompt.html', |
| 77 | controller: 'focaModalPromptController', | 77 | controller: 'focaModalPromptController', |
| 78 | size: 'md', | 78 | size: 'md', |
| 79 | resolve: { | 79 | resolve: { |
| 80 | options: function() {return options;}, | 80 | options: function() {return options;}, |
| 81 | } | 81 | } |
| 82 | }) | 82 | }) |
| 83 | .result.then( | 83 | .result.then( |
| 84 | function(resultado) { | 84 | function(resultado) { |
| 85 | return resultado; | 85 | return resultado; |
| 86 | } | 86 | } |
| 87 | ); | 87 | ); |
| 88 | }, | ||
| 89 | mail: function(options) { | ||
| 90 | return $uibModal.open({ | ||
| 91 | templateUrl: 'modal-mail.html', | ||
| 92 | controller: 'focaModalMailController', | ||
| 93 | size: 'md', | ||
| 94 | resolve: { | ||
| 95 | options: function() {return options;}, | ||
| 96 | } | ||
| 97 | }) | ||
| 98 | .result.then( | ||
| 99 | function(resultado) { | ||
| 100 | return resultado; | ||
| 101 | } | ||
| 102 | ); | ||
| 88 | } | 103 | } |
| 89 | }; | 104 | }; |
| 90 | } | 105 | } |
| 91 | ]); | 106 | ]); |
| 92 | 107 |
src/views/modal-mail.html
| File was created | 1 | <div class="modal-header"> | |
| 2 | <h5 ng-bind="titulo"></h5> | ||
| 3 | </div> | ||
| 4 | <div class="modal-body"> | ||
| 5 | <div > | ||
| 6 | <label | ||
| 7 | class="col-12 bg-success text-white" | ||
| 8 | ng-show="correoEnviado">Correo enviado con éxito</label> | ||
| 9 | <label | ||
| 10 | class="col-12 bg-danger text-white" | ||
| 11 | ng-show="correoNoEnviado">Hubo un error al enviar el correo</label> | ||
| 12 | <label>Enviar correo a</label> | ||
| 13 | <div class="d-flex"> | ||
| 14 | <input | ||
| 15 | class="form-control col-9" | ||
| 16 | ng-model="mailCliente" | ||
| 17 | ng-keypress="enviarCorreo($event.keyCode)" | ||
| 18 | teclado-virtual/> | ||
| 19 | <button | ||
| 20 | type="button" | ||
| 21 | class="btn btn-primary ml-auto" | ||
| 22 | ng-click="enviarCorreo(13)" | ||
| 23 | ladda="esperando" | ||
| 24 | >Enviar</button> | ||
| 25 | </div> | ||
| 26 | </div> | ||
| 27 | <hr> | ||
| 28 | <div> | ||
| 29 | <label>Descargar comprobante en este dispositivo</label> | ||
| 30 | <button | ||
| 31 | class="btn btn-primary float-right" | ||
| 32 | ng-click="imprimir()" | ||
| 33 | ladda="esperando" | ||
| 34 | >Descargar</button> | ||
| 35 | </div> | ||
| 36 | </div> | ||
| 37 | <div class="modal-footer"> | ||
| 38 | <button | ||
| 39 | type="button" | ||
| 40 | class="btn btn-secondary" | ||
| 41 | ng-click="salir()" | ||
| 42 | ladda="esperando" | ||
| 43 | >Salir</button> | ||
| 44 | <button | ||
| 45 | type="button" | ||
| 46 | class="btn btn-primary" | ||
| 47 | ng-click="aceptar()" | ||
| 48 | ladda="esperando" | ||
| 49 | ng-disabled="!descargado" | ||
| 50 | >Aceptar</button> | ||
| 51 | </div> | ||
| 52 |