Commit bad1ea0f4aa3fd83bf20402a25db310b2277de0b
Exists in
master
Merge branch 'master' into 'master'
Master See merge request !1
Showing
8 changed files
Show diff stats
.gitignore
| File was created | 1 | /node_modules | |
| 2 | /dist | ||
| 3 | /tmp | ||
| 4 | package-lock\.json | ||
| 5 | src/etc/develop\.js | ||
| 6 | /yarn.lock | ||
| 7 |
.jshintrc
| File was created | 1 | { | |
| 2 | /* | ||
| 3 | * ENVIRONMENTS | ||
| 4 | * ================= | ||
| 5 | */ | ||
| 6 | |||
| 7 | // Define globals exposed by modern browsers. | ||
| 8 | "browser": true, | ||
| 9 | |||
| 10 | // Define globals exposed by jQuery. | ||
| 11 | "jquery": true, | ||
| 12 | |||
| 13 | // Define globals exposed by Node.js. | ||
| 14 | "node": true, | ||
| 15 | |||
| 16 | // Allow ES6. | ||
| 17 | "esversion": 6, | ||
| 18 | |||
| 19 | /* | ||
| 20 | * ENFORCING OPTIONS | ||
| 21 | * ================= | ||
| 22 | */ | ||
| 23 | |||
| 24 | // Force all variable names to use either camelCase style or UPPER_CASE | ||
| 25 | // with underscores. | ||
| 26 | "camelcase": true, | ||
| 27 | |||
| 28 | // Prohibit use of == and != in favor of === and !==. | ||
| 29 | "eqeqeq": true, | ||
| 30 | |||
| 31 | // Enforce tab width of 2 spaces. | ||
| 32 | "indent": 4, | ||
| 33 | |||
| 34 | // Prohibit use of a variable before it is defined. | ||
| 35 | "latedef": false, | ||
| 36 | |||
| 37 | // Enforce line length to 100 characters | ||
| 38 | "maxlen": 100, | ||
| 39 | |||
| 40 | // Require capitalized names for constructor functions. | ||
| 41 | "newcap": true, | ||
| 42 | |||
| 43 | // Enforce use of single quotation marks for strings. | ||
| 44 | "quotmark": "single", | ||
| 45 | |||
| 46 | // Enforce placing 'use strict' at the top function scope | ||
| 47 | "strict": false, | ||
| 48 | |||
| 49 | // Prohibit use of explicitly undeclared variables. | ||
| 50 | "undef": true, | ||
| 51 | |||
| 52 | // Warn when variables are defined but never used. | ||
| 53 | "unused": true, | ||
| 54 | |||
| 55 | // Para que funcione en angular | ||
| 56 | "predef": ["angular", "alert", "spyOn", "expect", "it", "inject", "beforeEach", "describe"], | ||
| 57 | /* | ||
| 58 | * RELAXING OPTIONS | ||
| 59 | * ================= | ||
| 60 | */ | ||
| 61 | |||
| 62 | // Suppress warnings about == null comparisons. | ||
| 63 | "eqnull": true | ||
| 64 | } | ||
| 65 |
gulpfile.js
| File was created | 1 | const templateCache = require('gulp-angular-templatecache'); | |
| 2 | const concat = require('gulp-concat'); | ||
| 3 | const htmlmin = require('gulp-htmlmin'); | ||
| 4 | const rename = require('gulp-rename'); | ||
| 5 | const uglify = require('gulp-uglify'); | ||
| 6 | const gulp = require('gulp'); | ||
| 7 | const pump = require('pump'); | ||
| 8 | const jshint = require('gulp-jshint'); | ||
| 9 | const replace = require('gulp-replace'); | ||
| 10 | const connect = require('gulp-connect'); | ||
| 11 | const clean = require('gulp-clean'); | ||
| 12 | |||
| 13 | var paths = { | ||
| 14 | srcJS: 'src/js/*.js', | ||
| 15 | srcViews: 'src/views/*.html', | ||
| 16 | tmp: 'tmp', | ||
| 17 | dist: 'dist/' | ||
| 18 | }; | ||
| 19 | |||
| 20 | gulp.task('templates', function() { | ||
| 21 | return pump( | ||
| 22 | [ | ||
| 23 | gulp.src(paths.srcViews), | ||
| 24 | htmlmin(), | ||
| 25 | templateCache('views.js', { | ||
| 26 | module: 'focaModalDetalles', | ||
| 27 | root: '' | ||
| 28 | }), | ||
| 29 | gulp.dest(paths.tmp) | ||
| 30 | ] | ||
| 31 | ); | ||
| 32 | }); | ||
| 33 | |||
| 34 | gulp.task('uglify', ['templates'], function() { | ||
| 35 | return pump( | ||
| 36 | [ | ||
| 37 | gulp.src([ | ||
| 38 | paths.srcJS, | ||
| 39 | 'tmp/views.js' | ||
| 40 | ]), | ||
| 41 | concat('foca-modal-detalles.js'), | ||
| 42 | replace('src/views/', ''), | ||
| 43 | gulp.dest(paths.tmp), | ||
| 44 | rename('foca-modal-detalles.min.js'), | ||
| 45 | uglify(), | ||
| 46 | gulp.dest(paths.dist) | ||
| 47 | ] | ||
| 48 | ); | ||
| 49 | }); | ||
| 50 | |||
| 51 | gulp.task('pre-commit', function() { | ||
| 52 | return pump( | ||
| 53 | [ | ||
| 54 | gulp.src(paths.srcJS), | ||
| 55 | jshint('.jshintrc'), | ||
| 56 | jshint.reporter('default'), | ||
| 57 | jshint.reporter('fail') | ||
| 58 | ] | ||
| 59 | ); | ||
| 60 | }); | ||
| 61 | |||
| 62 | gulp.task('webserver', function() { | ||
| 63 | pump [ | ||
| 64 | connect.server({port: 3000}) | ||
| 65 | ] | ||
| 66 | }); | ||
| 67 | |||
| 68 | gulp.task('clean-post-install', function(){ | ||
| 69 | return gulp.src(['src', 'tmp', '.jshintrc','readme.md', '.gitignore', 'gulpfile.js', | ||
| 70 | 'index.html'], {read: false}) | ||
| 71 | .pipe(clean()); | ||
| 72 | }); | ||
| 73 | |||
| 74 | gulp.task('default', ['webserver']); | ||
| 75 | |||
| 76 | gulp.task('watch', function() { | ||
| 77 | gulp.watch([paths.srcJS, paths.srcViews], ['uglify']); | ||
| 78 | }); | ||
| 79 |
package.json
| File was created | 1 | { | |
| 2 | "name": "foca-modal-detalles", | ||
| 3 | "version": "0.0.1", | ||
| 4 | "description": "Modal de carga de detalles", | ||
| 5 | "main": "index.js", | ||
| 6 | "scripts": { | ||
| 7 | "test": "echo \"Error: no test specified\" && exit 1", | ||
| 8 | "gulp-pre-commit": "gulp pre-commit", | ||
| 9 | "compile": "gulp uglify", | ||
| 10 | "postinstall": "npm run compile && gulp clean-post-install", | ||
| 11 | "install-dev": "npm install -D angular font-awesome pump jquery bootstrap ui-bootstrap4 jshint gulp gulp-uglify gulp-concat gulp-htmlmin gulp-rename gulp-uglify gulp-jshint gulp-replace gulp-connect gulp-clean gulp-angular-templatecache git+http://git.focasoftware.com/npm/foca-directivas.git" | ||
| 12 | }, | ||
| 13 | "pre-commit": [ | ||
| 14 | "gulp-pre-commit" | ||
| 15 | ], | ||
| 16 | "repository": { | ||
| 17 | "type": "git", | ||
| 18 | "url": "http://git.focasoftware.com/npm/foca-modal-detalles.git" | ||
| 19 | }, | ||
| 20 | "author": "Foca Software", | ||
| 21 | "license": "ISC", | ||
| 22 | "devDependencies": { | ||
| 23 | "angular": "^1.7.5", | ||
| 24 | "bootstrap": "^4.1.3", | ||
| 25 | "foca-directivas": "git+http://git.focasoftware.com/npm/foca-directivas.git", | ||
| 26 | "font-awesome": "^4.7.0", | ||
| 27 | "gulp": "^3.9.1", | ||
| 28 | "gulp-angular-templatecache": "^2.2.5", | ||
| 29 | "gulp-clean": "^0.4.0", | ||
| 30 | "gulp-concat": "^2.6.1", | ||
| 31 | "gulp-connect": "^5.6.1", | ||
| 32 | "gulp-htmlmin": "^5.0.1", | ||
| 33 | "gulp-jshint": "^2.1.0", | ||
| 34 | "gulp-rename": "^1.4.0", | ||
| 35 | "gulp-replace": "^1.0.0", | ||
| 36 | "gulp-uglify": "^3.0.1", | ||
| 37 | "jquery": "^3.3.1", | ||
| 38 | "jshint": "^2.9.6", | ||
| 39 | "pump": "^3.0.0", | ||
| 40 | "ui-bootstrap4": "^3.0.5" | ||
| 41 | } | ||
| 42 | } | ||
| 43 |
src/etc/develop.js.ejemplo
| File was created | 1 | angular.module('focaModalDetalles') | |
| 2 | .constant("API_ENDPOINT", { | ||
| 3 | 'URL': '//127.0.0.1:9000' | ||
| 4 | }); | ||
| 5 |
src/js/app.js
| File was created | 1 | angular.module('focaModalDetalles', []); | |
| 2 |
src/js/controller.js
| File was created | 1 | angular.module('focaModalDetalles') | |
| 2 | .controller('focaModalDetallesController', | ||
| 3 | [ | ||
| 4 | '$scope', | ||
| 5 | '$uibModalInstance', | ||
| 6 | 'focaModalService', | ||
| 7 | 'sugerido', | ||
| 8 | function($scope, $uibModalInstance, focaModalService, sugerido) { | ||
| 9 | $scope.files = []; | ||
| 10 | $scope.importe = Math.abs(sugerido); | ||
| 11 | |||
| 12 | $scope.$watch('files', function() { | ||
| 13 | validarExtSize(); | ||
| 14 | }); | ||
| 15 | |||
| 16 | $scope.eliminarImg = function(key) { | ||
| 17 | $scope.files.splice(key, 1); | ||
| 18 | }; | ||
| 19 | |||
| 20 | $scope.cancel = function() { | ||
| 21 | $uibModalInstance.dismiss('cancel'); | ||
| 22 | }; | ||
| 23 | $scope.aceptar = function() { | ||
| 24 | $uibModalInstance.close({ | ||
| 25 | observacion: $scope.observaciones, | ||
| 26 | monto: $scope.importe, | ||
| 27 | imgs: $scope.files | ||
| 28 | }); | ||
| 29 | }; | ||
| 30 | |||
| 31 | function validarExtSize() { | ||
| 32 | var totalSize = 0; | ||
| 33 | var invalidExt = false; | ||
| 34 | $scope.files.forEach(function(file) { | ||
| 35 | //CONVIERTO BYTES A MB | ||
| 36 | totalSize += file.size / 1000000; | ||
| 37 | var fileExt = file.name.split('.').pop(); | ||
| 38 | |||
| 39 | if(fileExt != 'jpg' && fileExt != 'png') { | ||
| 40 | invalidExt = true; | ||
| 41 | } | ||
| 42 | }); | ||
| 43 | |||
| 44 | if (totalSize > 150) { | ||
| 45 | focaModalService.alert('El/los archivo/s exceden la capacidad máxima'); | ||
| 46 | $scope.files = []; | ||
| 47 | } else if (invalidExt) { | ||
| 48 | focaModalService.alert('Ha ingresado un archivo con extensión inválida'); | ||
| 49 | $scope.files = []; | ||
| 50 | } | ||
| 51 | } | ||
| 52 | } | ||
| 53 | ] | ||
| 54 | ); | ||
| 55 |
src/views/modal-detalles.html
| File was created | 1 | <div class="modal-header"> | |
| 2 | <h3 class="modal-title">Ingrese detalles</h3> | ||
| 3 | </div> | ||
| 4 | <div class="modal-body" id="modal-body"> | ||
| 5 | <form name="formObservaciones"> | ||
| 6 | <div class="row"> | ||
| 7 | <div class="col-12 col-md-2 mb-3"> | ||
| 8 | <label class="form-control-sm p-0">Observaciones:</label> | ||
| 9 | </div> | ||
| 10 | <div class="col-12 col-md-10 mb-3"> | ||
| 11 | <textarea | ||
| 12 | teclado-virtual | ||
| 13 | rows="5" | ||
| 14 | ng-model="observaciones" | ||
| 15 | class="form-control form-control-sm" | ||
| 16 | foca-focus="focused == 9" | ||
| 17 | ng-focus="focused = 9" | ||
| 18 | ng-required="true"></textarea> | ||
| 19 | </div> | ||
| 20 | <div class="col-12 col-md-2"> | ||
| 21 | <label class="form-control-sm p-0">Monto cubierto:</label> | ||
| 22 | </div> | ||
| 23 | <div class="col-6 col-md-5 input-group mb-2"> | ||
| 24 | <div class="input-group-prepend"> | ||
| 25 | <div class="input-group-text form-control form-control-sm">$</div> | ||
| 26 | </div> | ||
| 27 | <input | ||
| 28 | foca-tipo-input | ||
| 29 | teclado-virtual | ||
| 30 | class="form-control form-control-sm" | ||
| 31 | placeholder="Importe" | ||
| 32 | ng-model="importe" | ||
| 33 | ng-keypress="next($event.keyCode)" | ||
| 34 | ng-required="true" | ||
| 35 | foca-focus="focused == 6" | ||
| 36 | ng-focus="focused = 6"/> | ||
| 37 | </div> | ||
| 38 | <div class="col-md-5"> | ||
| 39 | <input | ||
| 40 | type="file" | ||
| 41 | class="form-control-file" | ||
| 42 | ng-file-model="files" | ||
| 43 | multiple | ||
| 44 | accept=".jpg,.png"> | ||
| 45 | <small>Solo .jpg y .png - Tamaño máximo 150mb</small> | ||
| 46 | </div> | ||
| 47 | </div> | ||
| 48 | </form> | ||
| 49 | <div class="row"> | ||
| 50 | <div class="col-md-3" ng-repeat="(key, file) in files"> | ||
| 51 | <img ng-src="{{file.url}}" alt="" class="col-md-12 p-0"> | ||
| 52 | <button | ||
| 53 | type="button" | ||
| 54 | class="btn btn-delete-image btn-danger rounded-circle position-absolute p-0" | ||
| 55 | title="Eliminar" | ||
| 56 | ng-click="eliminarImg(key)"> | ||
| 57 | <i class="fa fa-times" aria-hidden="true"></i> | ||
| 58 | </button> | ||
| 59 | </div> | ||
| 60 | </div> | ||
| 61 | </div> | ||
| 62 | <div class="modal-footer"> | ||
| 63 | <button | ||
| 64 | class="btn btn-primary" | ||
| 65 | type="button" | ||
| 66 | ng-click="aceptar()" | ||
| 67 | ng-disabled="!formObservaciones.$valid" | ||
| 68 | >Aceptar</button> | ||
| 69 | <button | ||
| 70 | class="btn btn-secondary" | ||
| 71 | type="button" | ||
| 72 | ng-click="cancel()" | ||
| 73 | >Cancelar</button> | ||
| 74 | </div> | ||
| 75 |