Jose Pinto / foca-modal-transportista

Download as
Browse Code »

Commit 9ca3d14dd8defc3cc521526a760e3c8307e36e08

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

Primera versión estable.

Showing 4 changed files with 198 additions and 140 deletions   Show diff stats
... ... @@ -73,3 +73,16 @@ gulp.task('clean-post-install', function(){
73 73 });
74 74  
75 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 +});
1 1 {
2   - "name": "foca-modal-transportista",
3   - "version": "0.0.1",
4   - "description": "Modal de búsqueda de transportistas",
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+https://debo.suite.repo/modulos-npm/foca-directivas.git"
12   - },
13   - "pre-commit": [
14   - "gulp-pre-commit"
15   - ],
16   - "repository": {
17   - "type": "git",
18   - "url": "https://debo.suite.repo/modulos-npm/foca-modal-transportista.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+https://debo.suite.repo/modulos-npm/foca-directivas.git",
26   - "font-awesome": "^4.7.0",
27   - "gulp": "^3.9.1",
28   - "gulp-angular-templatecache": "^2.2.2",
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"
  2 + "name": "foca-modal-transportista",
  3 + "version": "0.0.1",
  4 + "description": "Modal de búsqueda de transportistas",
  5 + "scripts": {
  6 + "test": "echo \"Error: no test specified\" && exit 1",
  7 + "gulp-pre-commit": "gulp pre-commit",
  8 + "compile": "gulp uglify",
  9 + "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 + },
  12 + "pre-commit": [
  13 + "gulp-pre-commit"
  14 + ],
  15 + "repository": {
  16 + "type": "git",
  17 + "url": "https://debo.suite.repo/modulos-npm/foca-modal-transportista.git"
  18 + },
  19 + "author": "Foca Software",
  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 + "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas"
  37 + },
  38 + "devDependencies": {
  39 + "angular": "^1.7.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 }
src/js/controller.js
Diff comments   View file @ 9ca3d14
... ... @@ -5,33 +5,48 @@ angular.module('focaModalTransportista')
5 5 '$scope',
6 6 '$uibModalInstance',
7 7 'focaModalTransportistaService',
8   - function($filter, $scope, $uibModalInstance, focaModalTransportistaService) {
9   - focaModalTransportistaService.getTransportistas().then(
10   - function(res) {
11   - $scope.transportista = res.data;
12   - $scope.search();
13   - }
14   - );
15   -
  8 + function($filter, $scope, $uibModalInstance,
  9 + focaModalTransportistaService
  10 + ) {
  11 +
  12 + $scope.filters = '';
  13 + $scope.transportistas = [];
  14 + $scope.primerBusqueda = false;
  15 + $scope.searchLoading = false;
16 16 // pagination
17 17 $scope.numPerPage = 10;
18 18 $scope.currentPage = 1;
19   - $scope.filteredTransportista = [];
20   - $scope.currentPageTransportista = [];
  19 + $scope.filteredTransportistas = [];
  20 + $scope.currentPageTransportistas = [];
21 21 $scope.selectedTransportista = -1;
22   -
  22 +
23 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 37 $scope.search = function() {
25   - $scope.filteredTransportista = $filter('filter')(
26   - $scope.transportista,
27   - {$: $scope.filters}
28   - );
  38 + if($scope.transportistas.length > 0) {
  39 + $scope.filteredTransportistas = $filter('filter')(
  40 + $scope.transportistas,
  41 + {$: $scope.filters}
  42 + );
29 43  
30   - $scope.lastPage = Math.ceil(
31   - $scope.filteredTransportista.length / $scope.numPerPage
32   - );
  44 + $scope.lastPage = Math.ceil(
  45 + $scope.filteredTransportistas.length / $scope.numPerPage
  46 + );
33 47  
34   - $scope.resetPage();
  48 + $scope.resetPage();
  49 + }
35 50 };
36 51  
37 52 $scope.resetPage = function() {
... ... @@ -44,8 +59,8 @@ angular.module('focaModalTransportista')
44 59 var end = start + $scope.numPerPage;
45 60 $scope.paginas = [];
46 61 $scope.paginas = calcularPages(page);
47   - $scope.currentPageTransportista =
48   - $scope.filteredTransportista.slice(start, end);
  62 + $scope.currentPageTransportistas =
  63 + $scope.filteredTransportistas.slice(start, end);
49 64 $scope.currentPage = page;
50 65 };
51 66  
... ... @@ -63,13 +78,7 @@ angular.module('focaModalTransportista')
63 78 }
64 79 };
65 80  
66   - $scope.busquedaPress = function(key) {
67   - if (key === 13) {
68   - primera(key);
69   - }
70   - };
71   -
72   - $scope.itemProducto = function(key) {
  81 + $scope.itemTransportista = function(key) {
73 82 if (key === 38) {
74 83 anterior(key);
75 84 }
... ... @@ -130,8 +139,9 @@ angular.module('focaModalTransportista')
130 139 }
131 140  
132 141 function siguiente() {
133   - if ($scope.selectedTransportista <
134   - $scope.currentPageTransportista.length - 1 ) {
  142 + if (
  143 + $scope.selectedTransportista < $scope.currentPageTransportistas.length - 1
  144 + ) {
135 145 $scope.selectedTransportista++;
136 146 } else {
137 147 avanzarPagina();
src/views/modal-transportista.html
Diff comments   View file @ 9ca3d14
1   -<div class="modal-header">
2   - <h3 class="modal-title">Busqueda de Transportista</h3>
  1 +<div class="modal-header py-1">
  2 + <h5 class="modal-title">Busqueda de Transportista</h5>
3 3 </div>
4 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()"
  5 + <div class="input-group">
  6 + <input
  7 + ladda="searchLoading"
  8 + type="text"
  9 + class="form-control"
  10 + placeholder="Busqueda"
  11 + ng-model="filters"
  12 + ng-change="search()"
12 13 ng-keydown="busquedaDown($event.keyCode)"
13 14 ng-keypress="busquedaPress($event.keyCode)"
14 15 foca-focus="selectedTransportista == -1"
15 16 ng-focus="selectedTransportista = -1"
16 17 >
17   - <table class="table table-striped table-sm">
18   - <thead>
19   - <tr>
20   - <th>Nombre</th>
21   - <th>CUIT</th>
22   - <th>Costo x km</th>
23   - <th></th>
24   - </tr>
25   - </thead>
26   - <tbody>
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>
  18 + <div class="input-group-append">
  19 + <button
  20 + ladda="searchLoading"
  21 + class="btn btn-outline-secondary"
  22 + type="button"
  23 + ng-click="busquedaPress(13)"
  24 + >
  25 + <i class="fa fa-search" aria-hidden="true"></i>
  26 + </button>
  27 + </div>
77 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>
  48 + <td>
  49 + <button
  50 + type="button"
  51 + class="btn btn-xs p-1 float-right"
  52 + ng-class="{
  53 + 'btn-secondary': selectedTransportista != key,
  54 + 'btn-primary': selectedTransportista == key
  55 + }"
  56 + foca-focus="selectedTransportista == {{key}}"
  57 + ng-keydown="itemTransportista($event.keyCode)"
  58 + >
  59 + <i class="fa fa-arrow-right" aria-hidden="true"></i>
  60 + </button>
  61 + </td>
  62 + </tr>
  63 + </tbody>
  64 + </table>
  65 + <nav ng-show="currentPageTransportistas.length > 0 && primerBusqueda">
  66 + <ul class="pagination pagination-sm justify-content mb-0">
  67 + <li class="page-item" ng-class="{'disabled': currentPage == 1}">
  68 + <a class="page-link" href="#" ng-click="selectPage(currentPage - 1)">
  69 + <span aria-hidden="true">&laquo;</span>
  70 + <span class="sr-only">Anterior</span>
  71 + </a>
  72 + </li>
  73 + <li
  74 + class="page-item"
  75 + ng-repeat="pagina in paginas"
  76 + ng-class="{'active': pagina == currentPage}"
  77 + >
  78 + <a
  79 + class="page-link"
  80 + href="#"
  81 + ng-click="selectPage(pagina)"
  82 + ng-bind="pagina"
  83 + ></a>
  84 + </li>
  85 + <li class="page-item" ng-class="{'disabled': currentPage == lastPage}">
  86 + <a class="page-link" href="#" ng-click="selectPage(currentPage + 1)">
  87 + <span aria-hidden="true">&raquo;</span>
  88 + <span class="sr-only">Siguiente</span>
  89 + </a>
  90 + </li>
  91 + </ul>
  92 + </nav>
78 93 </div>
79   -<div class="modal-footer">
80   - <button class="btn btn-secondary" type="button" ng-click="cancel()">Cancelar</button>
  94 +<div class="modal-footer py-1">
  95 + <button class="btn btn-sm btn-secondary" type="button" ng-click="cancel()">Cancelar</button>
81 96 </div>