Commit 0db0096410dd74f45bed472c48243b0bf3d6882d
Exists in
master
Merge branch 'master' into 'master'
Primera versión estable See merge request modulos-npm/foca-modal-petroleras!1
Showing
10 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 |
.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": true, | ||
| 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 | |||
| 12 | var paths = { | ||
| 13 | srcJS: 'src/js/*.js', | ||
| 14 | srcViews: 'src/views/*.html', | ||
| 15 | tmp: 'tmp', | ||
| 16 | dist: 'dist/' | ||
| 17 | }; | ||
| 18 | |||
| 19 | gulp.task('templates', function() { | ||
| 20 | pump( | ||
| 21 | [ | ||
| 22 | gulp.src(paths.srcViews), | ||
| 23 | replace('views/', ''), | ||
| 24 | htmlmin(), | ||
| 25 | templateCache('views.js', { | ||
| 26 | module: 'focaBusquedaProductos', | ||
| 27 | root: '' | ||
| 28 | }), | ||
| 29 | gulp.dest(paths.tmp) | ||
| 30 | ] | ||
| 31 | ); | ||
| 32 | }); | ||
| 33 | |||
| 34 | gulp.task('uglify', function() { | ||
| 35 | pump( | ||
| 36 | [ | ||
| 37 | gulp.src([ | ||
| 38 | paths.srcJS, | ||
| 39 | 'tmp/views.js' | ||
| 40 | ]), | ||
| 41 | concat('foca-busqueda-productos.js'), | ||
| 42 | gulp.dest(paths.tmp), | ||
| 43 | rename('foca-busqueda-productos.min.js'), | ||
| 44 | uglify(), | ||
| 45 | gulp.dest(paths.dist) | ||
| 46 | ] | ||
| 47 | ); | ||
| 48 | }); | ||
| 49 | |||
| 50 | gulp.task('pre-commit', function() { | ||
| 51 | pump( | ||
| 52 | [ | ||
| 53 | gulp.src(paths.srcJS), | ||
| 54 | jshint('.jshintrc'), | ||
| 55 | jshint.reporter('default'), | ||
| 56 | jshint.reporter('fail') | ||
| 57 | ] | ||
| 58 | ); | ||
| 59 | |||
| 60 | gulp.start('uglify'); | ||
| 61 | gulp.start('templates'); | ||
| 62 | }); | ||
| 63 | |||
| 64 | gulp.task('webserver', function() { | ||
| 65 | pump [ | ||
| 66 | connect.server({port: 3000}) | ||
| 67 | ] | ||
| 68 | }); | ||
| 69 | |||
| 70 | gulp.task('default', ['webserver']); |
index.html
| File was created | 1 | <html ng-app="focaModalPetroleras"> | |
| 2 | |||
| 3 | <head> | ||
| 4 | <meta charset="UTF-8" /> | ||
| 5 | <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | ||
| 6 | |||
| 7 | <!--CSS--> | ||
| 8 | <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" /> | ||
| 9 | <link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet" /> | ||
| 10 | |||
| 11 | <!--VENDOR JS--> | ||
| 12 | <script src="node_modules/jquery/dist/jquery.min.js"></script> | ||
| 13 | <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script> | ||
| 14 | <script src="node_modules/angular/angular.min.js"></script> | ||
| 15 | <script src="node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script> | ||
| 16 | |||
| 17 | <!-- BUILD --> | ||
| 18 | <script src="src/js/app.js"></script> | ||
| 19 | <script src="src/js/controller.js"></script> | ||
| 20 | <script src="src/js/service.js"></script> | ||
| 21 | |||
| 22 | <!-- /BUILD --> | ||
| 23 | |||
| 24 | <!-- CONFIG PARA DEVELOP --> | ||
| 25 | <script type="text/javascript"> | ||
| 26 | angular.module('focaModalPetroleras') | ||
| 27 | .controller('controller', ['$uibModal', function ($uibModal) { | ||
| 28 | var modalInstance = $uibModal.open( | ||
| 29 | { | ||
| 30 | ariaLabelledBy: 'Busqueda de Petroleras', | ||
| 31 | templateUrl: 'src/views/modal-petroleras.html', | ||
| 32 | controller: 'modalPetrolerasCtrl', | ||
| 33 | size: 'lg' | ||
| 34 | } | ||
| 35 | ); | ||
| 36 | }]); | ||
| 37 | </script> | ||
| 38 | </head> | ||
| 39 | |||
| 40 | <body ng-controller="controller"> | ||
| 41 | <style> | ||
| 42 | .p-5 { | ||
| 43 | padding: 5px !important; | ||
| 44 | } | ||
| 45 | </style> | ||
| 46 | </body> | ||
| 47 | |||
| 48 | </html> |
package.json
| File was created | 1 | { | |
| 2 | "name": "foca-navegacion-doble", | ||
| 3 | "version": "0.0.1", | ||
| 4 | "description": "Menu de navegacion de doble entrada", | ||
| 5 | "main": "index.js", | ||
| 6 | "scripts": { | ||
| 7 | "test": "echo \"Error: no test specified\" && exit 1", | ||
| 8 | "compile": "gulp templates && gulp uglify", | ||
| 9 | "pre-commit": [ | ||
| 10 | "gulp-pre-commit" | ||
| 11 | ], | ||
| 12 | "postinstall": "npm run compile && rm -R src && rm index.html && rm .jshintrc && rm gulpfile.js", | ||
| 13 | "install-dev": "npm install angular bootstrap jquery font-awesome gulp gulp-concat gulp-jshint gulp-rename gulp-replace gulp-uglify-es jshint pump gulp-connect jasmine-core pre-commit" | ||
| 14 | }, | ||
| 15 | "repository": { | ||
| 16 | "type": "git", | ||
| 17 | "url": "https://192.168.0.11/modulos-npm/foca-navegacion-doble" | ||
| 18 | }, | ||
| 19 | "author": "Nicolás Guarnieri", | ||
| 20 | "license": "ISC", | ||
| 21 | "peerDependencies": { | ||
| 22 | "angular": "^1.7.4", | ||
| 23 | "bootstrap": "^4.1.3", | ||
| 24 | "font-awesome": "^4.7.0", | ||
| 25 | "ui-bootstrap4": "^3.0.4", | ||
| 26 | "gulp": "^3.9.1", | ||
| 27 | "gulp-angular-templatecache": "^2.2.1", | ||
| 28 | "gulp-concat": "^2.6.1", | ||
| 29 | "gulp-connect": "^5.6.1", | ||
| 30 | "gulp-htmlmin": "^5.0.1", | ||
| 31 | "gulp-rename": "^1.4.0", | ||
| 32 | "gulp-replace": "^1.0.0", | ||
| 33 | "gulp-uglify": "^3.0.1", | ||
| 34 | "jquery": "^3.3.1", | ||
| 35 | "pump": "^3.0.0" | ||
| 36 | }, | ||
| 37 | "devDependencies": { | ||
| 38 | "angular": "^1.7.4", | ||
| 39 | "bootstrap": "^4.1.3", | ||
| 40 | "font-awesome": "^4.7.0", | ||
| 41 | "gulp": "^3.9.1", | ||
| 42 | "gulp-angular-templatecache": "^2.2.1", | ||
| 43 | "gulp-concat": "^2.6.1", | ||
| 44 | "gulp-connect": "^5.6.1", | ||
| 45 | "gulp-htmlmin": "^5.0.1", | ||
| 46 | "gulp-jshint": "^2.1.0", | ||
| 47 | "gulp-rename": "^1.4.0", | ||
| 48 | "gulp-replace": "^1.0.0", | ||
| 49 | "gulp-uglify": "^3.0.1", | ||
| 50 | "jasmine-core": "^3.2.1", | ||
| 51 | "jquery": "^3.3.1", | ||
| 52 | "jshint": "^2.9.6", | ||
| 53 | "pre-commit": "^1.2.2", | ||
| 54 | "pump": "^3.0.0", | ||
| 55 | "ui-bootstrap4": "^3.0.4" | ||
| 56 | } | ||
| 57 | } | ||
| 58 |
src/etc/develop.js.ejemplo
| File was created | 1 | angular.module('focaBusquedaProductos') | |
| 2 | .constant("API_ENDPOINT", { | ||
| 3 | 'URL': '//127.0.0.1:9000' | ||
| 4 | }); | ||
| 5 |
src/js/app.js
| File was created | 1 | angular.module('focaModalPetroleras', ['ui.bootstrap']); | |
| 2 |
src/js/controller.js
| File was created | 1 | angular.module('focaModalPetroleras') | |
| 2 | .controller('modalPetrolerasCtrl', [ | ||
| 3 | '$filter', | ||
| 4 | '$scope', | ||
| 5 | '$uibModalInstance', | ||
| 6 | 'focaPetrolerasService', | ||
| 7 | function ($filter, $scope, $uibModalInstance, focaPetrolerasService) { | ||
| 8 | var json = { | ||
| 9 | razonCuitCod: '' | ||
| 10 | } | ||
| 11 | focaPetrolerasService.getPetroleras(json).then( | ||
| 12 | function (res) { | ||
| 13 | $scope.vendedores = res.data; | ||
| 14 | $scope.search(); | ||
| 15 | }); | ||
| 16 | |||
| 17 | // pagination | ||
| 18 | $scope.numPerPage = 10; | ||
| 19 | $scope.currentPage = 1; | ||
| 20 | $scope.filteredPetroleras = []; | ||
| 21 | $scope.currentPagePetroleras = []; | ||
| 22 | $scope.selectPetroleras = 0; | ||
| 23 | |||
| 24 | $scope.search = function () { | ||
| 25 | $scope.filteredPetroleras = $filter('filter')($scope.vendedores, { $: $scope.filters }); | ||
| 26 | $scope.resetPage(); | ||
| 27 | } | ||
| 28 | |||
| 29 | $scope.resetPage = function () { | ||
| 30 | $scope.currentPage = 1; | ||
| 31 | $scope.selectPage(1); | ||
| 32 | } | ||
| 33 | |||
| 34 | $scope.selectPage = function (page) { | ||
| 35 | var start = (page - 1) * $scope.numPerPage; | ||
| 36 | var end = start + $scope.numPerPage; | ||
| 37 | $scope.currentPagePetroleras = $scope.filteredPetroleras.slice(start, end); | ||
| 38 | } | ||
| 39 | |||
| 40 | $scope.select = function(vendedor) { | ||
| 41 | $uibModalInstance.close(vendedor); | ||
| 42 | } | ||
| 43 | |||
| 44 | $scope.cancel = function() { | ||
| 45 | $uibModalInstance.dismiss('cancel'); | ||
| 46 | } | ||
| 47 | |||
| 48 | $scope.enter = function(key) { | ||
| 49 | if (key === 13) { | ||
| 50 | console.table($scope.currentPagePetroleras); | ||
| 51 | } | ||
| 52 | } | ||
| 53 | }] | ||
| 54 | ) | ||
| 55 |
src/js/service.js
| File was created | 1 | angular.module('focaModalPetroleras') | |
| 2 | .service('focaPetrolerasService', ['$http', function($http) { | ||
| 3 | var configRoute ='http://localhost:9900'; | ||
| 4 | return { | ||
| 5 | getPetroleras: function(json) { | ||
| 6 | return $http.post(configRoute + '/petroleras', json); | ||
| 7 | } | ||
| 8 | } | ||
| 9 | }]) | ||
| 10 |
src/views/modal-petroleras.html
| File was created | 1 | <div class="modal-header"> | |
| 2 | <h3 class="modal-title">Búsqueda de Petrolera</h3> | ||
| 3 | </div> | ||
| 4 | <div class="modal-body" id="modal-body"> | ||
| 5 | <div class="input-group mb-3"> | ||
| 6 | <input | ||
| 7 | type="text" | ||
| 8 | class="form-control" | ||
| 9 | placeholder="Busqueda" | ||
| 10 | ng-model="filters" | ||
| 11 | ng-change="search()" | ||
| 12 | ng-keypress="enter($event.keyCode)" | ||
| 13 | > | ||
| 14 | <table class="table table-striped table-sm"> | ||
| 15 | <thead> | ||
| 16 | <tr> | ||
| 17 | <th>Código</th> | ||
| 18 | <th>Nombre</th> | ||
| 19 | <th>CUIT</th> | ||
| 20 | <th></th> | ||
| 21 | </tr> | ||
| 22 | </thead> | ||
| 23 | <tbody> | ||
| 24 | <tr ng-repeat="petrolera in filteredPetroleras"> | ||
| 25 | <td ng-bind="petrolera.COD"></td> | ||
| 26 | <td ng-bind="petrolera.NOM"></td> | ||
| 27 | <td ng-bind="petrolera.CUIT"></td> | ||
| 28 | <td> | ||
| 29 | <button type="button" class="btn btn-secondary p-5 float-right mr-1" ng-click="select(producto)"> | ||
| 30 | <i class="fa fa-check" aria-hidden="true"></i> | ||
| 31 | </button> | ||
| 32 | </td> | ||
| 33 | </tr> | ||
| 34 | </tbody> | ||
| 35 | </table> | ||
| 36 | </div> | ||
| 37 | </div> | ||
| 38 | <div class="modal-footer"> | ||
| 39 | <button class="btn btn-secondary" type="button" ng-click="cancel()">Cancelar</button> | ||
| 40 | </div> | ||
| 41 |