Marcelo Puebla / foca-busqueda-cliente

Download as
Browse Code »

Commit b9a56f8575781f37f2900d20db36790d24274b57

Authored by Nicolás Guarnieri
2 parents 26cb1badf1 a15f1a8d5f
Exists in master and in 1 other branch develop

Merge remote-tracking branch 'upstream/master'

Showing 8 changed files   Show diff stats
1 /node_modules 1 /node_modules
2 /dist 2 /dist
3 /tmp 3 /tmp
4 package-lock\.json 4 package-lock\.json
5 /src/etc/develop.js
5 6
1 const templateCache = require('gulp-angular-templatecache'); 1 const templateCache = require('gulp-angular-templatecache');
2 const concat = require('gulp-concat'); 2 const concat = require('gulp-concat');
3 const htmlmin = require('gulp-htmlmin'); 3 const htmlmin = require('gulp-htmlmin');
4 const rename = require('gulp-rename'); 4 const rename = require('gulp-rename');
5 const uglify = require('gulp-uglify-es').default; 5 const uglify = require('gulp-uglify-es').default;
6 const gulp = require('gulp'); 6 const gulp = require('gulp');
7 const pump = require('pump'); 7 const pump = require('pump');
8 const jshint = require('gulp-jshint'); 8 const jshint = require('gulp-jshint');
9 const replace = require('gulp-replace'); 9 const replace = require('gulp-replace');
10 const connect = require('gulp-connect'); 10 const connect = require('gulp-connect');
11 const clean = require('gulp-clean'); 11 const clean = require('gulp-clean');
12 12
13 var paths = { 13 var paths = {
14 srcJS: 'src/js/*.js', 14 srcJS: 'src/js/*.js',
15 srcViews: 'src/views/*.html', 15 srcViews: 'src/views/*.html',
16 tmp: 'tmp', 16 tmp: 'tmp',
17 dist: 'dist/' 17 dist: 'dist/'
18 }; 18 };
19 19
20 gulp.task('templates', function() { 20 gulp.task('clean', function(){
21 pump( 21 return gulp.src(['tmp', 'dist'], {read: false})
22 .pipe(clean());
23 });
24
25 gulp.task('templates', ['clean'], function() {
26 return pump(
22 [ 27 [
23 gulp.src(paths.srcViews), 28 gulp.src(paths.srcViews),
24 htmlmin(), 29 htmlmin(),
25 templateCache('views.js', { 30 templateCache('views.js', {
26 module: 'focaBusquedaCliente', 31 module: 'focaBusquedaCliente',
27 root: '' 32 root: ''
28 }), 33 }),
29 gulp.dest(paths.tmp) 34 gulp.dest(paths.tmp)
30 ] 35 ]
31 ); 36 );
32 }); 37 });
33 38
34 gulp.task('uglify', ['templates'], function() { 39 gulp.task('uglify', ['templates'], function() {
35 pump( 40 return pump(
36 [ 41 [
37 gulp.src([ 42 gulp.src([
38 paths.srcJS, 43 paths.srcJS,
39 'tmp/views.js' 44 'tmp/views.js'
40 ]), 45 ]),
41 concat('foca-busqueda-cliente.js'), 46 concat('foca-busqueda-cliente.js'),
42 replace("'ui.bootstrap'", ''), 47 replace("['ui.bootstrap', 'focaDirectivas', 'angular-ladda']", '[]'),
43 replace('src/views/', ''), 48 replace('src/views/', ''),
44 gulp.dest(paths.tmp), 49 gulp.dest(paths.tmp),
45 rename('foca-busqueda-cliente.min.js'), 50 rename('foca-busqueda-cliente.min.js'),
46 uglify(), 51 uglify(),
47 gulp.dest(paths.dist) 52 gulp.dest(paths.dist)
48 ] 53 ]
49 ); 54 );
50 }); 55 });
51 56
52 gulp.task('pre-commit', function() { 57 gulp.task('pre-commit', function() {
53 pump( 58 return pump(
54 [ 59 [
55 gulp.src(paths.srcJS), 60 gulp.src(paths.srcJS),
56 jshint('.jshintrc'), 61 jshint('.jshintrc'),
57 jshint.reporter('default'), 62 jshint.reporter('default'),
58 jshint.reporter('fail') 63 jshint.reporter('fail')
59 ] 64 ]
60 ); 65 );
61 }); 66 });
62 67
63 68
64 gulp.task('webserver', function() { 69 gulp.task('webserver', function() {
65 pump [ 70 pump [
66 connect.server({port: 3000}) 71 connect.server({port: 3000})
67 ] 72 ]
68 }); 73 });
69 74
70 gulp.task('clean-post-install', function() { 75 gulp.task('clean-post-install', function() {
71 return gulp.src(['src', 'tmp', '.jshintrc','readme.md', '.gitignore', 'gulpfile.js', 76 return gulp.src(['src', 'tmp', '.jshintrc','readme.md', '.gitignore', 'gulpfile.js',
72 'index.html'], {read: false}) 77 'index.html'], {read: false})
73 .pipe(clean()); 78 .pipe(clean());
74 }); 79 });
75 80
76 gulp.task('default', ['webserver']); 81 gulp.task('default', ['webserver']);
82
83 gulp.task('watch', function(){
84 gulp.watch([paths.srcJS, paths.srcViews], ['uglify']);
85 });
77 86
1 <html ng-app="focaBusquedaCliente"> 1 <html ng-app="focaBusquedaCliente">
2 2
3 <head> 3 <head>
4 <meta charset="UTF-8" /> 4 <meta charset="UTF-8" />
5 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
6 6
7 <!--CSS--> 7 <!--CSS-->
8 <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" /> 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" /> 9 <link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet" />
10 <link href="node_modules/ladda/dist/ladda-themeless.min.css" rel="stylesheet">
10 11
11 <!--VENDOR JS--> 12 <!--VENDOR JS-->
12 <script src="node_modules/jquery/dist/jquery.min.js"></script> 13 <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/bootstrap/dist/js/bootstrap.min.js"></script>
14 <script src="node_modules/angular/angular.min.js"></script> 15 <script src="node_modules/angular/angular.min.js"></script>
15 <script src="node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script> 16 <script src="node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script>
17 <script src="node_modules/foca-directivas/dist/foca-directivas.min.js"></script>
18 <script src="node_modules/ladda/dist/spin.min.js"></script>
19 <script src="node_modules/ladda/dist/ladda.min.js"></script>
20 <script src="node_modules/angular-ladda/dist/angular-ladda.min.js"></script>
16 21
17 <!-- BUILD --> 22 <!-- BUILD -->
18 <script src="src/js/app.js"></script> 23 <script src="src/js/app.js"></script>
19 <script src="src/js/controller.js"></script> 24 <script src="src/js/controller.js"></script>
20 <script src="src/js/service.js"></script> 25 <script src="src/js/service.js"></script>
21 26
22 <script src="src/etc/develop.js"></script> 27 <script src="src/etc/develop.js"></script>
23 <!-- /BUILD --> 28 <!-- /BUILD -->
24 29
25 <!-- CONFIG PARA DEVELOP --> 30 <!-- CONFIG PARA DEVELOP -->
26 <script type="text/javascript"> 31 <script type="text/javascript">
27 angular.module('focaBusquedaCliente') 32 angular.module('focaBusquedaCliente')
28 .controller('controller', ['$uibModal', function ($uibModal) { 33 .controller('controller', ['$uibModal', function ($uibModal) {
29 var modalInstance = $uibModal.open( 34 var modalInstance = $uibModal.open(
30 { 35 {
31 ariaLabelledBy: 'Busqueda de Cliete', 36 ariaLabelledBy: 'Busqueda de Cliete',
32 templateUrl: 'src/views/foca-busqueda-cliente-modal.html', 37 templateUrl: 'src/views/foca-busqueda-cliente-modal.html',
33 controller: 'focaBusquedaClienteModalController', 38 controller: 'focaBusquedaClienteModalController',
34 size: 'lg' 39 size: 'lg'
35 } 40 }
36 ); 41 );
37 }]); 42 }]);
38 </script> 43 </script>
39 </head> 44 </head>
40 45
41 <body ng-controller="controller"> 46 <body ng-controller="controller">
42 <style> 47 <style>
43 .p-5 { 48 .p-5 {
44 padding: 5px !important; 49 padding: 5px !important;
45 } 50 }
46 </style> 51 </style>
47 </body> 52 </body>
48 53
49 </html> 54 </html>
1 { 1 {
2 "name": "foca-busqueda-cliente", 2 "name": "foca-busqueda-cliente",
3 "version": "1.0.0", 3 "version": "1.0.0",
4 "description": "Búsqueda de clientes", 4 "description": "Búsqueda de clientes",
5 "main": "dist/foca-abm-sectores.js", 5 "main": "dist/foca-abm-sectores.js",
6 "scripts": { 6 "scripts": {
7 "test": "echo \"Error: no test specified\" && exit 1", 7 "test": "echo \"Error: no test specified\" && exit 1",
8 "compile": "gulp uglify", 8 "compile": "gulp uglify",
9 "postinstall": "npm run compile && gulp clean-post-install", 9 "postinstall": "npm run compile && gulp clean-post-install",
10 "install-dev": "npm install -D angular bootstrap angular-ui-bootstrap ui-bootstrap4 font-awesom jquery pre-commit jshint pump jasmine-core gulp gulp-connect gulp-angular-templatecache gulp-concat gulp-htmlmin gulp-jshint gulp-rename gulp-replace gulp-uglify-es gulp-clean" 10 "install-dev": "npm install -D angular bootstrap angular-ladda ladda@1.0.6 angular-ui-bootstrap ui-bootstrap4 font-awesome jquery pre-commit jshint pump jasmine-core gulp gulp-connect gulp-angular-templatecache gulp-concat gulp-htmlmin gulp-jshint gulp-rename gulp-replace gulp-uglify-es gulp-clean gulp-uglify git+https://debo.suite.repo/modulos-npm/foca-directivas.git"
11 }, 11 },
12 "repository": { 12 "repository": {
13 "type": "git", 13 "type": "git",
14 "url": "https://192.168.0.11/modulos-npm/foca-busqueda-cliente.git" 14 "url": "https://debo.suite.repo/modulos-npm/foca-busqueda-cliente.git"
15 }, 15 },
16 "author": "Foca Software", 16 "author": "Foca Software",
17 "license": "ISC", 17 "license": "ISC",
18 "peerDependencies": { 18 "peerDependencies": {
19 "angular": "^1.7.x", 19 "angular": "^1.7.x",
20 "bootstrap": "^4.1.x", 20 "bootstrap": "^4.1.x",
21 "jquery": "^3.3.x", 21 "jquery": "^3.3.x",
22 "font-awesome": "^4.7.x", 22 "font-awesome": "^4.7.x",
23 "gulp": "^3.9.x", 23 "gulp": "^3.9.x",
24 "gulp-concat": "2.6.x", 24 "gulp-concat": "2.6.x",
25 "gulp-jshint": "^2.1.x", 25 "gulp-jshint": "^2.1.x",
26 "gulp-rename": "^1.4.x", 26 "gulp-rename": "^1.4.x",
27 "gulp-replace": "^1.0.x", 27 "gulp-replace": "^1.0.x",
28 "gulp-uglify-es": "^1.0.x", 28 "gulp-uglify-es": "^1.0.x",
29 "jshint": "^2.9.x", 29 "jshint": "^2.9.x",
30 "pump": "^3.0.x" 30 "pump": "^3.0.x"
31 }, 31 },
32 "devDependencies": { 32 "devDependencies": {
33 "angular": "1.7.4", 33 "angular": "^1.7.4",
34 "angular-ui-bootstrap": "2.5.6", 34 "angular-ladda": "^0.4.3",
35 "bootstrap": "4.1.3", 35 "angular-ui-bootstrap": "^2.5.6",
36 "font-awesome": "4.7.0", 36 "bootstrap": "^4.1.3",
37 "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas.git",
38 "font-awesome": "^4.7.0",
37 "gulp": "^3.9.1", 39 "gulp": "^3.9.1",
38 "gulp-angular-templatecache": "2.2.1", 40 "gulp-angular-templatecache": "^2.2.1",
39 "gulp-clean": "^0.4.0", 41 "gulp-clean": "^0.4.0",
40 "gulp-concat": "2.6.1", 42 "gulp-concat": "^2.6.1",
41 "gulp-connect": "^5.6.1", 43 "gulp-connect": "^5.6.1",
42 "gulp-htmlmin": "5.0.1", 44 "gulp-htmlmin": "^5.0.1",
43 "gulp-jshint": "2.1.0", 45 "gulp-jshint": "^2.1.0",
44 "gulp-rename": "1.4.0", 46 "gulp-rename": "^1.4.0",
45 "gulp-replace": "1.0.0", 47 "gulp-replace": "^1.0.0",
46 "gulp-uglify-es": "1.0.4", 48 "gulp-uglify": "^3.0.1",
47 "jasmine-core": "3.2.1", 49 "gulp-uglify-es": "^1.0.4",
48 "jquery": "3.3.1", 50 "jasmine-core": "^3.2.1",
49 "jshint": "2.9.6", 51 "jquery": "^3.3.1",
52 "jshint": "^2.9.6",
53 "ladda": "1.0.6",
50 "pre-commit": "^1.2.2", 54 "pre-commit": "^1.2.2",
51 "pump": "3.0.0", 55 "pump": "^3.0.0",
52 "ui-bootstrap4": "^3.0.5" 56 "ui-bootstrap4": "^3.0.5"
53 } 57 }
54 } 58 }
55 59
src/etc/develop.js
View file @ b9a56f8
1 angular.module('focaBusquedaCliente') File was deleted
2 .constant("API_ENDPOINT", {
3 'URL': '//192.168.0.23:9900'
4 });
5 1 angular.module('focaBusquedaCliente')
1 angular.module('focaBusquedaCliente', ['ui.bootstrap']); 1 angular.module('focaBusquedaCliente', ['ui.bootstrap', 'focaDirectivas', 'angular-ladda']);
2 2
src/js/controller.js
Diff comments   View file @ b9a56f8
1 angular.module('focaBusquedaCliente') 1 angular.module('focaBusquedaCliente')
2 .controller('focaBusquedaClienteModalController', [ 2 .controller('focaBusquedaClienteModalController', [
3 '$uibModalInstance', 'focaBusquedaClienteService', '$scope', 3 '$uibModalInstance', 'focaBusquedaClienteService', '$scope', '$filter',
4 function($uibModalInstance, focaBusquedaClienteService, $scope) { 4 function($uibModalInstance, focaBusquedaClienteService, $scope, $filter) {
5 $scope.obtenerClientesPorNombreOCuit = function(textoBusqueda) { 5
6 return focaBusquedaClienteService 6 $scope.filters = '';
7 .obtenerClientesPorNombreOCuit(textoBusqueda) 7 $scope.primerBusqueda = false;
8 .then(function(datos) { 8 // pagination
9 return datos.data; 9 $scope.numPerPage = 10;
10 }); 10 $scope.currentPage = 1;
11 $scope.filteredClientes = [];
12 $scope.currentPageClientes = [];
13 $scope.selectedClientes = -1;
14
15 $scope.busquedaPress = function(key) {
16 if (key === 13) {
17 $scope.searchLoading = true;
18 focaBusquedaClienteService.obtenerClientesPorNombreOCuit($scope.filters).then(
19 function(res) {
20 $scope.primerBusqueda = true;
21 $scope.clientes = res.data;
22 $scope.search();
23 primera();
24 $scope.searchLoading = false;
25 });
26 }
11 }; 27 };
12 $scope.seleccionar = function(cliente) { 28
13 $scope.cliente = cliente; 29 $scope.search = function () {
30 if($scope.primerBusqueda) {
31 $scope.filteredClientes = $filter('filter')(
32 $scope.clientes, {$: $scope.filters}
33 );
34
35 $scope.lastPage = Math.ceil(
36 $scope.filteredClientes.length / $scope.numPerPage
37 );
38
39 $scope.resetPage();
40 }
14 }; 41 };
15 $scope.cancelar = function() { 42
16 $uibModalInstance.dismiss(); 43 $scope.resetPage = function () {
44 $scope.currentPage = 1;
45 $scope.selectPage(1);
17 }; 46 };
18 $scope.aceptar = function() { 47
19 $uibModalInstance.close($scope.cliente); 48 $scope.selectPage = function (page) {
49 var start = (page - 1) * $scope.numPerPage;
50 var end = start + $scope.numPerPage;
51 $scope.paginas = [];
52 $scope.paginas = calcularPages(page);
53 $scope.currentPageClientes = $scope.filteredClientes.slice(start, end);
54 $scope.currentPage = page;
20 }; 55 };
56
57 $scope.select = function(cliente) {
58 $uibModalInstance.close(cliente);
59 };
60
61 $scope.cancel = function() {
62 $uibModalInstance.dismiss('cancel');
63 };
64
65 $scope.busquedaDown = function(key) {
66 if (key === 40) {
67 primera(key);
68 }
69 };
70
71 $scope.itemCliente = function(key) {
72 if (key === 38) {
73 anterior(key);
74 }
75
76 if (key === 40) {
77 siguiente(key);
78 }
79
80 if (key === 37) {
81 retrocederPagina();
82 }
83
84 if (key === 39) {
85 avanzarPagina();
86 }
87 };
88
89 function calcularPages(paginaActual) {
90 var paginas = [];
91 paginas.push(paginaActual);
92
93 if (paginaActual - 1 > 1) {
94
95 paginas.unshift(paginaActual - 1);
96 if (paginaActual - 2 > 1) {
97 paginas.unshift(paginaActual - 2);
98 }
99 }
100
101 if (paginaActual + 1 < $scope.lastPage) {
102 paginas.push(paginaActual + 1);
103 if (paginaActual + 2 < $scope.lastPage) {
104 paginas.push(paginaActual + 2);
105 }
106 }
107
108 if (paginaActual !== 1) {
109 paginas.unshift(1);
110 }
111
112 if (paginaActual !== $scope.lastPage) {
113 paginas.push($scope.lastPage);
114 }
115
116 return paginas;
117 }
118
119 function primera() {
120 $scope.selectedClientes = 0;
121 }
122
123 function anterior() {
124 if ($scope.selectedClientes === 0 && $scope.currentPage > 1) {
125 retrocederPagina();
126 } else {
127 $scope.selectedClientes--;
128 }
129 }
130
131 function siguiente() {
132 if ($scope.selectedClientes < $scope.currentPageClientes.length - 1 ) {
133 $scope.selectedClientes++;
134 } else {
135 avanzarPagina();
136 }
137 }
138
139 function retrocederPagina() {
140 if ($scope.currentPage > 1) {
141 $scope.selectPage($scope.currentPage - 1);
142 $scope.selectedClientes = $scope.numPerPage - 1;
143 }
144 }
145
146 function avanzarPagina() {
147 if ($scope.currentPage < $scope.lastPage) {
148 $scope.selectPage($scope.currentPage + 1);
149 $scope.selectedClientes = 0;
150 }
151 }
21 } 152 }
22 ]); 153 ]);
23 154
src/views/foca-busqueda-cliente-modal.html
Diff comments   View file @ b9a56f8
1 <div class="modal-header"> 1 <div class="modal-header py-1">
2 <h3 class="modal-title">Búsqueda de cliente</h3> 2 <h5 class="modal-title">Búsqueda de Cliente</h5>
3 </div> 3 </div>
4 <div class="modal-body"> 4 <div class="modal-body" id="modal-body">
5 <form> 5 <div class="input-group">
6 <div class="form-group row"> 6 <input
7 <label class="col-sm-4 col-form-label">Nombre o CUIT</label> 7 ladda="searchLoading"
8 <div class="col-sm-8"> 8 type="text"
9 <input 9 class="form-control"
10 type="text" 10 placeholder="Busqueda"
11 ng-model="cliente" 11 ng-model="filters"
12 placeholder="Nombre o CUIT" 12 ng-change="search()"
13 uib-typeahead=" 13 ng-keydown="busquedaDown($event.keyCode)"
14 cliente.nom + ' (' + cliente.cuit + ')' 14 ng-keypress="busquedaPress($event.keyCode)"
15 for cliente 15 foca-focus="selectedClientes == -1"
16 in obtenerClientesPorNombreOCuit($viewValue) 16 ng-focus="selectedClientes = -1"
17 " 17 >
18 typeahead-loading="cargandoClientes" 18 <div class="input-group-append">
19 typeahead-no-results="sinResultados" 19 <button
20 typeahead-min-length="3" 20 ladda="searchLoading"
21 typeahead-on-select="seleccionar($item)" 21 class="btn btn-outline-secondary"
22 class="form-control" 22 type="button"
23 > 23 ng-click="busquedaPress(13)">
24 <i ng-show="cargandoClientes" class="fas fa-sync"></i> 24 <i class="fa fa-search" aria-hidden="true"></i>
25 <div ng-show="sinResultados"> 25 </button>
26 <i class="fa fa-minus"></i> No se encontraron resultados. 26 </div>
27 </div>
28 </div>
29 </div>
30 </form>
31 </div> 27 </div>
32 <div class="modal-footer"> 28 <table ng-show="primerBusqueda" class="table table-striped table-sm">
33 <button class="btn" ng-click="aceptar()">Aceptar</button> 29 <thead>
34 <button class="btn" ng-click="cancelar()">Cancelar</button> 30 <tr>
31 <th>Código</th>
32 <th>Nombre</th>
33 <th>CUIT</th>
34 <th></th>
35 </tr>
36 </thead>
37 <tbody>
38 <tr ng-show="currentPageClientes.length == 0 && primerBusqueda">
39 <td colspan="4">
40 No se encontraron resultados.
41 </td>
42 </tr>
43 <tr
44 class="selectable"
45 ng-repeat="(key, cliente) in currentPageClientes"
46 ng-click="select(cliente)">
47 <td ng-bind="cliente.cod"></td>
48 <td ng-bind="cliente.nom"></td>
49 <td ng-bind="cliente.cuit"></td>
50 <td>
51 <button
52 type="button"
53 class="btn btn-xs p-1 float-right"
54 ng-class="{
55 'btn-secondary': selectedClientes != key,
56 'btn-primary': selectedClientes == key
57 }"
58 ng-click="select(cliente)"
59 foca-focus="selectedClientes == {{key}}"
60 ng-keydown="itemCliente($event.keyCode)"
61 >
62 <i class="fa fa-arrow-right" aria-hidden="true"></i>
63 </button>
64 </td>
65 </tr>
66 </tbody>
67 </table>
68 <nav ng-show="currentPageClientes.length > 0 && primerBusqueda">
69 <ul class="pagination pagination-sm mb-0">
70 <li class="page-item" ng-class="{'disabled': currentPage == 1}">
71 <a class="page-link" href="#" ng-click="selectPage(currentPage - 1)">
72 <span aria-hidden="true">&laquo;</span>
73 <span class="sr-only">Anterior</span>
74 </a>
75 </li>
76 <li
77 class="page-item"
78 ng-repeat="pagina in paginas"
79 ng-class="{'active': pagina == currentPage}"
80 >
81 <a
82 class="page-link"
83 href="#"
84 ng-click="selectPage(pagina)"
85 ng-bind="pagina"
86 ></a>
87 </li>
88 <li class="page-item" ng-class="{'disabled': currentPage == lastPage}">
89 <a class="page-link" href="#" ng-click="selectPage(currentPage + 1)">
90 <span aria-hidden="true">&raquo;</span>
91 <span class="sr-only">Siguiente</span>
92 </a>
93 </li>
94 </ul>
95 </nav>
96 </div>