Commit 9bd371423a951761f51e7d5a8aab396fccef8c59
Exists in
master
Merge branch 'master' into 'master'
Implementación angular ladda See merge request modulos-npm/foca-modal-vendedores!10
Showing
6 changed files
Show diff stats
gulpfile.js
... | ... | @@ -41,7 +41,7 @@ gulp.task('uglify', ['templates'], function() { |
41 | 41 | ]), |
42 | 42 | concat('foca-modal-vendedores.js'), |
43 | 43 | replace('src/views/', ''), |
44 | - replace("['ui.bootstrap', 'focaDirectivas']", '[]'), | |
44 | + replace("['ui.bootstrap', 'focaDirectivas', 'angular-ladda']", '[]'), | |
45 | 45 | gulp.dest(paths.tmp), |
46 | 46 | rename('foca-modal-vendedores.min.js'), |
47 | 47 | uglify(), |
index.html
... | ... | @@ -7,6 +7,7 @@ |
7 | 7 | <!--CSS--> |
8 | 8 | <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" /> |
9 | 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 | 12 | <!--VENDOR JS--> |
12 | 13 | <script src="node_modules/jquery/dist/jquery.min.js"></script> |
... | ... | @@ -14,6 +15,9 @@ |
14 | 15 | <script src="node_modules/angular/angular.min.js"></script> |
15 | 16 | <script src="node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script> |
16 | 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> | |
17 | 21 | |
18 | 22 | <!-- BUILD --> |
19 | 23 | <script src="src/js/app.js"></script> |
package.json
... | ... | @@ -8,7 +8,7 @@ |
8 | 8 | "gulp-pre-commit": "gulp pre-commit", |
9 | 9 | "compile": "gulp uglify", |
10 | 10 | "postinstall": "npm run compile && gulp clean-post-install", |
11 | - "install-dev": "npm install -D angular bootstrap font-awesome gulp gulp-angular-templatecache gulp-concat gulp-connect gulp-htmlmin gulp-jshint gulp-rename gulp-clean gulp-replace gulp-uglify jasmine-core jquery jshint pre-commit pump ui-bootstrap4 && npm i -D git+https://debo.suite.repo/modulos-npm/foca-directivas" | |
11 | + "install-dev": "npm install -D angular angular-ladda ladda@1.0.6 bootstrap font-awesome gulp gulp-angular-templatecache gulp-concat gulp-connect gulp-htmlmin gulp-jshint gulp-rename gulp-clean gulp-replace gulp-uglify jasmine-core jquery jshint pre-commit pump ui-bootstrap4 && npm i -D git+https://debo.suite.repo/modulos-npm/foca-directivas" | |
12 | 12 | }, |
13 | 13 | "pre-commit": [ |
14 | 14 | "gulp-pre-commit" |
... | ... | @@ -38,6 +38,7 @@ |
38 | 38 | }, |
39 | 39 | "devDependencies": { |
40 | 40 | "angular": "^1.7.5", |
41 | + "angular-ladda": "^0.4.3", | |
41 | 42 | "bootstrap": "^4.1.3", |
42 | 43 | "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas", |
43 | 44 | "font-awesome": "^4.7.0", |
... | ... | @@ -54,6 +55,7 @@ |
54 | 55 | "jasmine-core": "^3.3.0", |
55 | 56 | "jquery": "^3.3.1", |
56 | 57 | "jshint": "^2.9.6", |
58 | + "ladda": "1.0.6", | |
57 | 59 | "pre-commit": "^1.2.2", |
58 | 60 | "pump": "^3.0.0", |
59 | 61 | "ui-bootstrap4": "^3.0.5" |
src/js/app.js
src/js/controller.js
... | ... | @@ -9,6 +9,7 @@ angular.module('focaModalVendedores') |
9 | 9 | $scope.filters = ''; |
10 | 10 | $scope.vendedores = []; |
11 | 11 | $scope.primerBusqueda = false; |
12 | + $scope.searchLoading = false; | |
12 | 13 | // pagination |
13 | 14 | $scope.numPerPage = 10; |
14 | 15 | $scope.currentPage = 1; |
... | ... | @@ -17,9 +18,11 @@ angular.module('focaModalVendedores') |
17 | 18 | $scope.selectedVendedor = -1; |
18 | 19 | |
19 | 20 | $scope.busquedaPress = function(key) { |
20 | - if (key === 13) { | |
21 | + if (key === 13) { | |
22 | + $scope.searchLoading = true; | |
21 | 23 | focaVendedoresService.getVendedores($scope.filters).then( |
22 | 24 | function(res) { |
25 | + $scope.searchLoading = false; | |
23 | 26 | $scope.primerBusqueda = true; |
24 | 27 | $scope.vendedores = res.data; |
25 | 28 | $scope.search(); |
src/views/modal-vendedores.html
... | ... | @@ -4,6 +4,7 @@ |
4 | 4 | <div class="modal-body" id="modal-body"> |
5 | 5 | <div class="input-group"> |
6 | 6 | <input |
7 | + ladda="searchLoading" | |
7 | 8 | type="text" |
8 | 9 | class="form-control form-control-sm" |
9 | 10 | placeholder="Busqueda" |
... | ... | @@ -15,7 +16,12 @@ |
15 | 16 | ng-focus="selectedVendedor = -1" |
16 | 17 | > |
17 | 18 | <div class="input-group-append"> |
18 | - <button class="btn btn-outline-secondary" type="button" ng-click="busquedaPress(13)"> | |
19 | + <button | |
20 | + ladda="searchLoading" | |
21 | + class="btn btn-outline-secondary" | |
22 | + type="button" | |
23 | + ng-click="busquedaPress(13)" | |
24 | + > | |
19 | 25 | <i class="fa fa-search" aria-hidden="true"></i> |
20 | 26 | </button> |
21 | 27 | </div> |