Commit 9ca3d14dd8defc3cc521526a760e3c8307e36e08

Authored by Pablo Marco del Pont
1 parent 96d68ac36d
Exists in master

Primera versión estable.

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'); 5 const uglify = require('gulp-uglify');
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('templates', function() {
21 return pump( 21 return pump(
22 [ 22 [
23 gulp.src(paths.srcViews), 23 gulp.src(paths.srcViews),
24 htmlmin(), 24 htmlmin(),
25 templateCache('views.js', { 25 templateCache('views.js', {
26 module: 'focaModalTransportista', 26 module: 'focaModalTransportista',
27 root: '' 27 root: ''
28 }), 28 }),
29 gulp.dest(paths.tmp) 29 gulp.dest(paths.tmp)
30 ] 30 ]
31 ); 31 );
32 }); 32 });
33 33
34 gulp.task('uglify', ['templates'], function() { 34 gulp.task('uglify', ['templates'], function() {
35 return pump( 35 return pump(
36 [ 36 [
37 gulp.src([ 37 gulp.src([
38 paths.srcJS, 38 paths.srcJS,
39 'tmp/views.js' 39 'tmp/views.js'
40 ]), 40 ]),
41 concat('foca-modal-transportista.js'), 41 concat('foca-modal-transportista.js'),
42 replace('src/views/', ''), 42 replace('src/views/', ''),
43 replace("['ui.bootstrap', 'focaDirectivas']", '[]'), 43 replace("['ui.bootstrap', 'focaDirectivas']", '[]'),
44 gulp.dest(paths.tmp), 44 gulp.dest(paths.tmp),
45 rename('foca-modal-transportista.min.js'), 45 rename('foca-modal-transportista.min.js'),
46 uglify(), 46 uglify(),
47 gulp.dest(paths.dist) 47 gulp.dest(paths.dist)
48 ] 48 ]
49 ); 49 );
50 }); 50 });
51 51
52 gulp.task('pre-commit', function() { 52 gulp.task('pre-commit', function() {
53 return pump( 53 return pump(
54 [ 54 [
55 gulp.src(paths.srcJS), 55 gulp.src(paths.srcJS),
56 jshint('.jshintrc'), 56 jshint('.jshintrc'),
57 jshint.reporter('default'), 57 jshint.reporter('default'),
58 jshint.reporter('fail') 58 jshint.reporter('fail')
59 ] 59 ]
60 ); 60 );
61 }); 61 });
62 62
63 gulp.task('webserver', function() { 63 gulp.task('webserver', function() {
64 pump [ 64 pump [
65 connect.server({port: 3000}) 65 connect.server({port: 3000})
66 ] 66 ]
67 }); 67 });
68 68
69 gulp.task('clean-post-install', function(){ 69 gulp.task('clean-post-install', function(){
70 return gulp.src(['src', 'tmp', '.jshintrc','readme.md', '.gitignore', 'gulpfile.js', 70 return gulp.src(['src', 'tmp', '.jshintrc','readme.md', '.gitignore', 'gulpfile.js',
71 'index.html'], {read: false}) 71 'index.html'], {read: false})
72 .pipe(clean()); 72 .pipe(clean());
73 }); 73 });
74 74
75 gulp.task('default', ['webserver']); 75 gulp.task('default', ['webserver']);
76
77 gulp.task('watch', function() {
78 gulp.watch([paths.srcJS, paths.srcViews], ['uglify'])
79 });
80
81 gulp.task('copy', ['uglify'], function() {
82 gulp.src('dist/*.js')
83 .pipe(gulp.dest('../../wrapper-demo/node_modules/foca-modal-transportista/dist'));
84 });
85
86 gulp.task('watchAndCopy', function() {
87 return gulp.watch([paths.srcJS, paths.srcViews], ['copy']);
88 });
76 89
1 { 1 {
2 "name": "foca-modal-transportista", 2 "name": "foca-modal-transportista",
3 "version": "0.0.1", 3 "version": "0.0.1",
4 "description": "Modal de búsqueda de transportistas", 4 "description": "Modal de búsqueda de transportistas",
5 "main": "index.js", 5 "scripts": {
6 "scripts": { 6 "test": "echo \"Error: no test specified\" && exit 1",
7 "test": "echo \"Error: no test specified\" && exit 1", 7 "gulp-pre-commit": "gulp pre-commit",
8 "gulp-pre-commit": "gulp pre-commit", 8 "compile": "gulp uglify",
9 "compile": "gulp uglify", 9 "postinstall": "npm run compile && gulp clean-post-install",
10 "postinstall": "npm run compile && gulp clean-post-install", 10 "install-dev": "npm install -D angular angular-ladda bootstrap font-awesome gulp gulp-angular-templatecache gulp-clean gulp-concat gulp-connect gulp-htmlmin gulp-jshint gulp-rename gulp-replace gulp-uglify jasmine-core jquery jshint ladda@1.0.6 pre-commit pump ui-bootstrap4 && npm i -D git+https://debo.suite.repo/modulos-npm/foca-directivas.git"
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+https://debo.suite.repo/modulos-npm/foca-directivas.git" 11 },
12 }, 12 "pre-commit": [
13 "pre-commit": [ 13 "gulp-pre-commit"
14 "gulp-pre-commit" 14 ],
15 ], 15 "repository": {
16 "repository": { 16 "type": "git",
17 "type": "git", 17 "url": "https://debo.suite.repo/modulos-npm/foca-modal-transportista.git"
18 "url": "https://debo.suite.repo/modulos-npm/foca-modal-transportista.git" 18 },
19 }, 19 "author": "Foca Software",
20 "author": "Foca Software", 20 "license": "ISC",
21 "license": "ISC", 21 "peerDependencies": {
22 "devDependencies": { 22 "angular": "^1.7.4",
23 "angular": "^1.7.5", 23 "bootstrap": "^4.1.3",
24 "bootstrap": "^4.1.3", 24 "font-awesome": "^4.7.0",
25 "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas.git", 25 "ui-bootstrap4": "^3.0.4",
26 "font-awesome": "^4.7.0", 26 "gulp": "^3.9.1",
27 "gulp": "^3.9.1", 27 "gulp-angular-templatecache": "^2.2.1",
28 "gulp-angular-templatecache": "^2.2.2", 28 "gulp-concat": "^2.6.1",
29 "gulp-clean": "^0.4.0", 29 "gulp-connect": "^5.6.1",
30 "gulp-concat": "^2.6.1", 30 "gulp-htmlmin": "^5.0.1",
31 "gulp-connect": "^5.6.1", 31 "gulp-rename": "^1.4.0",
32 "gulp-htmlmin": "^5.0.1", 32 "gulp-replace": "^1.0.0",
33 "gulp-jshint": "^2.1.0", 33 "gulp-uglify": "^3.0.1",
34 "gulp-rename": "^1.4.0", 34 "jquery": "^3.3.1",
35 "gulp-replace": "^1.0.0", 35 "pump": "^3.0.0",
36 "gulp-uglify": "^3.0.1", 36 "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas"
37 "jquery": "^3.3.1", 37 },
38 "jshint": "^2.9.6", 38 "devDependencies": {
39 "pump": "^3.0.0", 39 "angular": "^1.7.5",
40 "ui-bootstrap4": "^3.0.5" 40 "angular-ladda": "^0.4.3",
41 "bootstrap": "^4.1.3",
42 "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas.git",
43 "font-awesome": "^4.7.0",
44 "gulp": "^3.9.1",
45 "gulp-angular-templatecache": "^2.2.5",
46 "gulp-clean": "^0.4.0",
47 "gulp-concat": "^2.6.1",
48 "gulp-connect": "^5.6.1",
49 "gulp-htmlmin": "^5.0.1",
50 "gulp-jshint": "^2.1.0",
51 "gulp-rename": "^1.4.0",
52 "gulp-replace": "^1.0.0",
53 "gulp-uglify": "^3.0.1",
54 "jasmine-core": "^3.3.0",
55 "jquery": "^3.3.1",
56 "jshint": "^2.9.6",
57 "ladda": "1.0.6",
58 "pre-commit": "^1.2.2",
59 "pump": "^3.0.0",
60 "ui-bootstrap4": "^3.0.5"
41 } 61 }
42 } 62 }
43 63
src/js/controller.js
1 angular.module('focaModalTransportista') 1 angular.module('focaModalTransportista')
2 .controller('focaModalTransportistaController', 2 .controller('focaModalTransportistaController',
3 [ 3 [
4 '$filter', 4 '$filter',
5 '$scope', 5 '$scope',
6 '$uibModalInstance', 6 '$uibModalInstance',
7 'focaModalTransportistaService', 7 'focaModalTransportistaService',
8 function($filter, $scope, $uibModalInstance, focaModalTransportistaService) { 8 function($filter, $scope, $uibModalInstance,
9 focaModalTransportistaService.getTransportistas().then( 9 focaModalTransportistaService
10 function(res) { 10 ) {
11 $scope.transportista = res.data; 11
12 $scope.search(); 12 $scope.filters = '';
13 } 13 $scope.transportistas = [];
14 ); 14 $scope.primerBusqueda = false;
15 15 $scope.searchLoading = false;
16 // pagination 16 // pagination
17 $scope.numPerPage = 10; 17 $scope.numPerPage = 10;
18 $scope.currentPage = 1; 18 $scope.currentPage = 1;
19 $scope.filteredTransportista = []; 19 $scope.filteredTransportistas = [];
20 $scope.currentPageTransportista = []; 20 $scope.currentPageTransportistas = [];
21 $scope.selectedTransportista = -1; 21 $scope.selectedTransportista = -1;
22 22
23 //METODOS 23 //METODOS
24 $scope.busquedaPress = function(key) {
25 if (key === 13) {
26 $scope.searchLoading = true;
27 focaModalTransportistaService.getTransportistas().then(llenarDatos);
28 }
29 };
30 function llenarDatos(res) {
31 $scope.searchLoading = false;
32 $scope.primerBusqueda = true;
33 $scope.transportistas = res.data;
34 $scope.search();
35 primera();
36 }
24 $scope.search = function() { 37 $scope.search = function() {
25 $scope.filteredTransportista = $filter('filter')( 38 if($scope.transportistas.length > 0) {
26 $scope.transportista, 39 $scope.filteredTransportistas = $filter('filter')(
27 {$: $scope.filters} 40 $scope.transportistas,
28 ); 41 {$: $scope.filters}
42 );
29 43
30 $scope.lastPage = Math.ceil( 44 $scope.lastPage = Math.ceil(
31 $scope.filteredTransportista.length / $scope.numPerPage 45 $scope.filteredTransportistas.length / $scope.numPerPage
32 ); 46 );
33 47
34 $scope.resetPage(); 48 $scope.resetPage();
49 }
35 }; 50 };
36 51
37 $scope.resetPage = function() { 52 $scope.resetPage = function() {
38 $scope.currentPage = 1; 53 $scope.currentPage = 1;
39 $scope.selectPage(1); 54 $scope.selectPage(1);
40 }; 55 };
41 56
42 $scope.selectPage = function(page) { 57 $scope.selectPage = function(page) {
43 var start = (page - 1) * $scope.numPerPage; 58 var start = (page - 1) * $scope.numPerPage;
44 var end = start + $scope.numPerPage; 59 var end = start + $scope.numPerPage;
45 $scope.paginas = []; 60 $scope.paginas = [];
46 $scope.paginas = calcularPages(page); 61 $scope.paginas = calcularPages(page);
47 $scope.currentPageTransportista = 62 $scope.currentPageTransportistas =
48 $scope.filteredTransportista.slice(start, end); 63 $scope.filteredTransportistas.slice(start, end);
49 $scope.currentPage = page; 64 $scope.currentPage = page;
50 }; 65 };
51 66
52 $scope.select = function(transportista) { 67 $scope.select = function(transportista) {
53 $uibModalInstance.close(transportista); 68 $uibModalInstance.close(transportista);
54 }; 69 };
55 70
56 $scope.cancel = function() { 71 $scope.cancel = function() {
57 $uibModalInstance.dismiss('cancel'); 72 $uibModalInstance.dismiss('cancel');
58 }; 73 };
59 74
60 $scope.busquedaDown = function(key) { 75 $scope.busquedaDown = function(key) {
61 if (key === 40) { 76 if (key === 40) {
62 primera(key); 77 primera(key);
63 } 78 }
64 }; 79 };
65 80
66 $scope.busquedaPress = function(key) { 81 $scope.itemTransportista = function(key) {
67 if (key === 13) {
68 primera(key);
69 }
70 };
71
72 $scope.itemProducto = function(key) {
73 if (key === 38) { 82 if (key === 38) {
74 anterior(key); 83 anterior(key);
75 } 84 }
76 85
77 if (key === 40) { 86 if (key === 40) {
78 siguiente(key); 87 siguiente(key);
79 } 88 }
80 89
81 if (key === 37) { 90 if (key === 37) {
82 retrocederPagina(); 91 retrocederPagina();
83 } 92 }
84 93
85 if (key === 39) { 94 if (key === 39) {
86 avanzarPagina(); 95 avanzarPagina();
87 } 96 }
88 }; 97 };
89 98
90 function calcularPages(paginaActual) { 99 function calcularPages(paginaActual) {
91 var paginas = []; 100 var paginas = [];
92 paginas.push(paginaActual); 101 paginas.push(paginaActual);
93 102
94 if (paginaActual - 1 > 1) { 103 if (paginaActual - 1 > 1) {
95 104
96 paginas.unshift(paginaActual - 1); 105 paginas.unshift(paginaActual - 1);
97 if (paginaActual - 2 > 1) { 106 if (paginaActual - 2 > 1) {
98 paginas.unshift(paginaActual - 2); 107 paginas.unshift(paginaActual - 2);
99 } 108 }
100 } 109 }
101 110
102 if (paginaActual + 1 < $scope.lastPage) { 111 if (paginaActual + 1 < $scope.lastPage) {
103 paginas.push(paginaActual + 1); 112 paginas.push(paginaActual + 1);
104 if (paginaActual + 2 < $scope.lastPage) { 113 if (paginaActual + 2 < $scope.lastPage) {
105 paginas.push(paginaActual + 2); 114 paginas.push(paginaActual + 2);
106 } 115 }
107 } 116 }
108 117
109 if (paginaActual !== 1) { 118 if (paginaActual !== 1) {
110 paginas.unshift(1); 119 paginas.unshift(1);
111 } 120 }
112 121
113 if (paginaActual !== $scope.lastPage) { 122 if (paginaActual !== $scope.lastPage) {
114 paginas.push($scope.lastPage); 123 paginas.push($scope.lastPage);
115 } 124 }
116 125
117 return paginas; 126 return paginas;
118 } 127 }
119 128
120 function primera() { 129 function primera() {
121 $scope.selectedTransportista = 0; 130 $scope.selectedTransportista = 0;
122 } 131 }
123 132
124 function anterior() { 133 function anterior() {
125 if ($scope.selectedTransportista === 0 && $scope.currentPage > 1) { 134 if ($scope.selectedTransportista === 0 && $scope.currentPage > 1) {
126 retrocederPagina(); 135 retrocederPagina();
127 } else { 136 } else {
128 $scope.selectedTransportista--; 137 $scope.selectedTransportista--;
129 } 138 }
130 } 139 }
131 140
132 function siguiente() { 141 function siguiente() {
133 if ($scope.selectedTransportista < 142 if (
134 $scope.currentPageTransportista.length - 1 ) { 143 $scope.selectedTransportista < $scope.currentPageTransportistas.length - 1
144 ) {
135 $scope.selectedTransportista++; 145 $scope.selectedTransportista++;
136 } else { 146 } else {
137 avanzarPagina(); 147 avanzarPagina();
138 } 148 }
139 } 149 }
140 150
141 function retrocederPagina() { 151 function retrocederPagina() {
142 if ($scope.currentPage > 1) { 152 if ($scope.currentPage > 1) {
143 $scope.selectPage($scope.currentPage - 1); 153 $scope.selectPage($scope.currentPage - 1);
144 $scope.selectedTransportista = $scope.numPerPage - 1; 154 $scope.selectedTransportista = $scope.numPerPage - 1;
145 } 155 }
146 } 156 }
147 157
148 function avanzarPagina() { 158 function avanzarPagina() {
149 if ($scope.currentPage < $scope.lastPage) { 159 if ($scope.currentPage < $scope.lastPage) {
150 $scope.selectPage($scope.currentPage + 1); 160 $scope.selectPage($scope.currentPage + 1);
151 $scope.selectedTransportista = 0; 161 $scope.selectedTransportista = 0;
src/views/modal-transportista.html
1 <div class="modal-header"> 1 <div class="modal-header py-1">
2 <h3 class="modal-title">Busqueda de Transportista</h3> 2 <h5 class="modal-title">Busqueda de Transportista</h5>
3 </div> 3 </div>
4 <div class="modal-body" id="modal-body"> 4 <div class="modal-body" id="modal-body">
5 <div class="input-group mb-3"> 5 <div class="input-group">
6 <input 6 <input
7 type="text" 7 ladda="searchLoading"
8 class="form-control" 8 type="text"
9 placeholder="Busqueda" 9 class="form-control"
10 ng-model="filters" 10 placeholder="Busqueda"
11 ng-change="search()" 11 ng-model="filters"
12 ng-change="search()"
12 ng-keydown="busquedaDown($event.keyCode)" 13 ng-keydown="busquedaDown($event.keyCode)"
13 ng-keypress="busquedaPress($event.keyCode)" 14 ng-keypress="busquedaPress($event.keyCode)"
14 foca-focus="selectedTransportista == -1" 15 foca-focus="selectedTransportista == -1"
15 ng-focus="selectedTransportista = -1" 16 ng-focus="selectedTransportista = -1"
16 > 17 >
17 <table class="table table-striped table-sm"> 18 <div class="input-group-append">
18 <thead> 19 <button
19 <tr> 20 ladda="searchLoading"
20 <th>Nombre</th> 21 class="btn btn-outline-secondary"
21 <th>CUIT</th> 22 type="button"
22 <th>Costo x km</th> 23 ng-click="busquedaPress(13)"
23 <th></th> 24 >
24 </tr> 25 <i class="fa fa-search" aria-hidden="true"></i>
25 </thead> 26 </button>
26 <tbody> 27 </div>
27 <tr ng-repeat="(key,transportista) in currentPageTransportista">
28 <td ng-bind="transportista.nombre"></td>
29 <td ng-bind="transportista.CUIT"></td>
30 <td ng-bind="transportista.costoKilometro"></td>
31 <td>
32 <button
33 type="button"
34 class="btn p-2 float-right"
35 ng-class="{
36 'btn-secondary': selectedTransportista != key,
37 'btn-primary': selectedTransportista == key
38 }"
39 ng-click="select(transportista)"
40 foca-focus="selectedTransportista == {{key}}"
41 ng-keydown="itemProducto($event.keyCode)"
42 >
43 <i class="fa fa-arrow-right" aria-hidden="true"></i>
44 </button>
45 </td>
46 </tr>
47 </tbody>
48 </table>
49 <nav>
50 <ul class="pagination justify-content-end">
51 <li class="page-item" ng-class="{'disabled': currentPage == 1}">
52 <a class="page-link" href="#" ng-click="selectPage(currentPage - 1)">
53 <span aria-hidden="true">&laquo;</span>
54 <span class="sr-only">Anterior</span>
55 </a>
56 </li>
57 <li
58 class="page-item"
59 ng-repeat="pagina in paginas"
60 ng-class="{'active': pagina == currentPage}"
61 >
62 <a
63 class="page-link"
64 href="#"
65 ng-click="selectPage(pagina)"
66 ng-bind="pagina"
67 ></a>
68 </li>
69 <li class="page-item" ng-class="{'disabled': currentPage == lastPage}">
70 <a class="page-link" href="#" ng-click="selectPage(currentPage + 1)">
71 <span aria-hidden="true">&raquo;</span>
72 <span class="sr-only">Siguiente</span>
73 </a>
74 </li>
75 </ul>
76 </nav>
77 </div> 28 </div>
29 <table ng-show="primerBusqueda" class="table table-striped table-sm">
30 <thead>
31 <tr>
32 <th>Nombre</th>
33 <th>CUIT</th>
34 <th></th>
35 </tr>
36 </thead>
37 <tbody>
38 <tr ng-show="currentPageTransportistas.length == 0 && primerBusqueda">
39 <td colspan="5">
40 No se encontraron resultados.
41 </td>
42 </tr>
43 <tr class="selectable"
44 ng-repeat="(key,transportista) in currentPageTransportistas"
45 ng-click="select(transportista)">
46 <td ng-bind="transportista.nombre"></td>
47 <td ng-bind="transportista.CUIT"></td>