Eric Fernandez / foca-modal-cobranza

Download as
Browse Code »

Commit a56a016665444cdbf3a2a32c10c504ee7d837359

Authored by Nicolás Guarnieri
1 parent c20057836f
Exists in master

modal terminado

Showing 10 changed files with 648 additions and 0 deletions   Show diff stats
File was created 1
2 node_modules/
3
4 package-lock\.json
5
6 dist/
7
8 src/etc/develop\.js
9
10 tmp/
11
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": false,
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
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 const clean = require('gulp-clean');
12
13 var paths = {
14 srcJS: 'src/js/*.js',
15 srcViews: 'src/views/*.html',
16 tmp: 'tmp',
17 dist: 'dist/'
18 };
19
20 gulp.task('clean', function() {
21 return gulp.src(['tmp', 'dist'], {read: false})
22 .pipe(clean());
23 });
24
25 gulp.task('templates', ['clean'], function() {
26 return pump(
27 [
28 gulp.src(paths.srcViews),
29 htmlmin(),
30 templateCache('views.js', {
31 module: 'focaModalCobranza',
32 root: ''
33 }),
34 gulp.dest(paths.tmp)
35 ]
36 );
37 });
38
39 gulp.task('uglify', ['templates'], function() {
40 return pump(
41 [
42 gulp.src([
43 paths.srcJS,
44 'tmp/views.js'
45 ]),
46 concat('foca-modal-cobranza.js'),
47 replace('src/views/', ''),
48 replace("['ui.bootstrap', 'focaDirectivas', 'angular-ladda']", '[]'),
49 gulp.dest(paths.tmp),
50 rename('foca-modal-cobranza.min.js'),
51 uglify(),
52 gulp.dest(paths.dist)
53 ]
54 );
55 });
56
57 gulp.task('pre-commit', function() {
58 return pump(
59 [
60 gulp.src(paths.srcJS),
61 jshint('.jshintrc'),
62 jshint.reporter('default'),
63 jshint.reporter('fail')
64 ]
65 );
66
67 gulp.start('uglify');
68 });
69
70 gulp.task('webserver', function() {
71 pump [
72 connect.server({port: 3000})
73 ]
74 });
75
76 gulp.task('clean-post-install', function(){
77 return gulp.src(['src', 'tmp', '.jshintrc','readme.md', '.gitignore', 'gulpfile.js',
78 'index.html'], {read: false})
79 .pipe(clean());
80 });
81
82 gulp.task('default', ['webserver']);
83
84 gulp.task('watch', function() {
85 gulp.watch([paths.srcJS, paths.srcViews], ['uglify'])
86 });
87
88 gulp.task('copy', ['uglify'], function(){
89 gulp.src('dist/*.js')
90 .pipe(gulp.dest('../../wrapper-demo/node_modules/foca-modal-cobranza/dist'));
91 });
92
93 gulp.task('watchAndCopy', function() {
94 gulp.watch([paths.srcJS, paths.srcViews], ['copy'])
95 });
96
File was created 1 <html ng-app="focaModalCobranza">
2 <head>
3 <meta charset="UTF-8"/>
4 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
5
6 <!--CSS-->
7 <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
8 <link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>
9 <link href="node_modules/ladda/dist/ladda-themeless.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 <script src="node_modules/foca-directivas/dist/foca-directivas.min.js"></script>
17 <script src="node_modules/ladda/dist/spin.min.js"></script>
18 <script src="node_modules/ladda/dist/ladda.min.js"></script>
19 <script src="node_modules/angular-ladda/dist/angular-ladda.min.js"></script>
20 <script src="node_modules/foca-filtros/dist/foca-filtros.min.js"></script>
21
22 <!-- BUILD -->
23 <script src="src/js/app.js"></script>
24 <script src="src/js/controller.js"></script>
25 <script src="src/js/service.js"></script>
26
27 <!-- /BUILD -->
28
29 <!-- CONFIG PARA DEVELOP -->
30 <script src="src/etc/develop.js"></script>
31 <script type="text/javascript">
32 angular.module('focaModalCobranza')
33 .controller('controller', [
34 '$scope',
35 '$uibModal',
36 '$timeout',
37 function($scope, $uibModal, $timeout) {
38 openModal();
39
40 function openModal() {
41 var modalInstance = $uibModal.open(
42 {
43 ariaLabelledBy: 'Busqueda de Cobranza',
44 templateUrl: 'src/views/foca-modal-cobranza.html',
45 controller: 'focaModalCobranzaController',
46 size: 'lg',
47 resolve: {
48 parametroCobranza: {
49 idLista: -1,
50 cotizacion: 1,
51 simbolo:'$'
52 }
53 }
54 }
55 );
56
57 modalInstance.result.then(
58 function (selectedItem) {
59 console.info(selectedItem);
60 $timeout(openModal, 500);
61 }, function () {
62 console.info('modal-component dismissed at: ' + new Date());
63 $timeout(openModal, 500);
64 }
65 );
66 }
67 }
68 ]);
69 </script>
70 </head>
71 <body ng-controller="controller">
72 </body>
73 </html>
74
File was created 1 {
2 "name": "foca-modal-cobranza",
3 "version": "0.0.1",
4 "description": "foca-modal-cobranza",
5 "main": "index.js",
6 "scripts": {
7 "test": "echo \"Error: no test specified\" && exit 1"
8 },
9 "repository": {
10 "type": "git",
11 "url": "git@debonline.dyndns.org:npm/foca-modal-cobranza.git"
12 },
13 "author": "Foca Software",
14 "license": "ISC",
15 "devDependencies": {
16 "angular": "^1.7.5",
17 "angular-ladda": "^0.4.3",
18 "angular-route": "^1.7.5",
19 "bootstrap": "^4.1.3",
20 "foca-directivas": "git+ssh://git@git.focasoftware.com:npm/foca-directivas",
21 "foca-filtros": "git+ssh://git@git.focasoftware.com:npm/foca-filtros",
22 "font-awesome": "^4.7.0",
23 "gulp": "^3.9.1",
24 "gulp-angular-templatecache": "^2.2.5",
25 "gulp-clean": "^0.4.0",
26 "gulp-concat": "^2.6.1",
27 "gulp-connect": "^5.7.0",
28 "gulp-htmlmin": "^5.0.1",
29 "gulp-jshint": "^2.1.0",
30 "gulp-rename": "^1.4.0",
31 "gulp-replace": "^1.0.0",
32 "gulp-sequence": "^1.0.0",
33 "gulp-uglify": "^3.0.1",
34 "gulp-uglify-es": "^1.0.4",
35 "jquery": "^3.3.1",
36 "jshint": "^2.9.7",
37 "ladda": "^1.0.6",
38 "pre-commit": "^1.2.2",
39 "pump": "^3.0.0",
40 "ui-bootstrap4": "^3.0.5"
41 }
42 }
43
src/etc/develop.js.ejemplo
Diff comments   View file @ a56a016
File was created 1 angular.module('focaModalCobranza')
2 .constant("API_ENDPOINT", {
3 'URL': '//127.0.0.1:9000'
4 });
5
File was created 1 angular.module('focaModalCobranza', [
2 'ui.bootstrap',
3 'focaDirectivas',
4 'focaFiltros',
5 'angular-ladda'
6 ]);
7
src/js/controller.js
Diff comments   View file @ a56a016
File was created 1 angular.module('focaModalCobranza')
2 .controller('focaModalCobranzaController',
3 [
4 '$timeout',
5 '$filter',
6 '$scope',
7 '$uibModalInstance',
8 'focaModalCobranzaService',
9 function($timeout, $filter, $scope, $uibModalInstance, focaModalCobranzaService) {
10 var fecha = new Date();
11 $scope.fechaHasta = new Date();
12 $scope.fechaDesde = new Date(fecha.setMonth(fecha.getMonth() - 1));
13 $scope.filters = '';
14 $scope.cobranzas = [];
15 $scope.primerBusqueda = false;
16 $scope.searchLoading = false;
17 // pagination
18 $scope.numPerPage = 10;
19 $scope.currentPage = 1;
20 $scope.filteredCobranzas = [];
21 $scope.currentPageCobranzas = [];
22 $scope.selectedCobranza = -1;
23
24 //METODOS
25 $scope.busquedaPress = function(key) {
26 if (key === 13) {
27 //TODO Validaciones con alertas de foca
28 if(!$scope.fechaDesde) {
29 alert('INGRESE FECHA DESDE');
30 return;
31 }
32 if(!$scope.fechaHasta) {
33 alert('INGRESE FECHA HASTA');
34 return;
35 }
36 if($scope.fechaDesde > $scope.fechaHasta) {
37 alert('La fecha desde no puede ser mayor a la fecha hasta');
38 return;
39 }
40 $scope.searchLoading = true;
41 //TODO: usar filtros en vez de toISOString
42 focaModalCobranzaService
43 .getCobranzas($scope.fechaDesde.toISOString().split('.')[0],
44 $scope.fechaHasta.toISOString().split('.')[0])
45 .then(llenarDatos);
46 }
47 };
48 function llenarDatos(res) {
49 $scope.cobranzas = [];
50 $scope.filteredCobranzas = [];
51 $scope.currentPageCobranzas = [];
52 $scope.selectedCobranza = -1;
53 $scope.searchLoading = false;
54 $scope.primerBusqueda = true;
55 $scope.cobranzas = res.data;
56 $scope.search(true);
57 primera();
58 }
59 $scope.search = function(pressed) {
60 if($scope.cobranzas.length > 0) {
61 $scope.filteredCobranzas = $filter('filter')(
62 $scope.cobranzas,
63 {$: $scope.filters}
64 );
65
66 if(pressed && $scope.filteredCobranzas.length === 0){
67 $timeout(function() {
68 angular.element('#search')[0].focus();
69 $scope.filters = '';
70 });
71 }
72
73 $scope.lastPage = Math.ceil(
74 $scope.filteredCobranzas.length / $scope.numPerPage
75 );
76
77 $scope.resetPage();
78 }
79 };
80
81 $scope.resetPage = function() {
82 $scope.currentPage = 1;
83 $scope.selectPage(1);
84 };
85
86 $scope.selectPage = function(page) {
87 var start = (page - 1) * $scope.numPerPage;
88 var end = start + $scope.numPerPage;
89 $scope.paginas = [];
90 $scope.paginas = calcularPages(page);
91 $scope.currentPageCobranzas = $scope.filteredCobranzas.slice(start, end);
92 $scope.currentPage = page;
93 };
94
95 $scope.select = function(cobranza) {
96 $uibModalInstance.close(cobranza);
97 };
98
99 $scope.cancel = function() {
100 $uibModalInstance.dismiss('cancel');
101 };
102
103 $scope.busquedaDown = function(key) {
104 if (key === 40) {
105 primera(key);
106 }
107 };
108
109 $scope.itemCobranza = function(key) {
110 if (key === 38) {
111 anterior(key);
112 }
113
114 if (key === 40) {
115 siguiente(key);
116 }
117
118 if (key === 37) {
119 retrocederPagina();
120 }
121
122 if (key === 39) {
123 avanzarPagina();
124 }
125 };
126
127 function calcularPages(paginaActual) {
128 var paginas = [];
129 paginas.push(paginaActual);
130
131 if (paginaActual - 1 > 1) {
132
133 paginas.unshift(paginaActual - 1);
134 if (paginaActual - 2 > 1) {
135 paginas.unshift(paginaActual - 2);
136 }
137 }
138
139 if (paginaActual + 1 < $scope.lastPage) {
140 paginas.push(paginaActual + 1);
141 if (paginaActual + 2 < $scope.lastPage) {
142 paginas.push(paginaActual + 2);
143 }
144 }
145
146 if (paginaActual !== 1) {
147 paginas.unshift(1);
148 }
149
150 if (paginaActual !== $scope.lastPage) {
151 paginas.push($scope.lastPage);
152 }
153
154 return paginas;
155 }
156
157 function primera() {
158 $scope.selectedCobranza = 0;
159 }
160
161 function anterior() {
162 if ($scope.selectedCobranza === 0 && $scope.currentPage > 1) {
163 retrocederPagina();
164 } else {
165 $scope.selectedCobranza--;
166 }
167 }
168
169 function siguiente() {
170 if ($scope.selectedCobranza < $scope.currentPageCobranzas.length - 1 ) {
171 $scope.selectedCobranza++;
172 } else {
173 avanzarPagina();
174 }
175 }
176
177 function retrocederPagina() {
178 if ($scope.currentPage > 1) {
179 $scope.selectPage($scope.currentPage - 1);
180 $scope.selectedCobranza = $scope.numPerPage - 1;
181 }
182 }
183
184 function avanzarPagina() {
185 if ($scope.currentPage < $scope.lastPage) {
186 $scope.selectPage($scope.currentPage + 1);
187 $scope.selectedCobranza = 0;
188 }
189 }
190 }
191 ]
192 );
193
File was created 1 angular.module('focaModalCobranza')
2 .service('focaModalCobranzaService', [
3 '$http',
4 'API_ENDPOINT',
5 function($http, API_ENDPOINT) {
6 return {
7 getCobranzas: function(fechaDesde, fechaHasta) {
8 return $http.get(API_ENDPOINT.URL + '/recibo/listar/' + fechaDesde + '/' +
9 fechaHasta);
10 }
11 };
12 }
13 ]);
14
src/views/foca-modal-cobranza.html
Diff comments   View file @ a56a016
File was created 1 <div class="modal-header py-1">
2 <div class="row w-100">
3 <div class="col-lg-6">
4 <h5 class="modal-title my-1">Búsqueda de Cobranza</h5>
5 </div>
6 <div class="input-group col-lg-6 pr-0 my-2">
7 <input
8 ladda="searchLoading"
9 type="text"
10 class="form-control form-control-sm"
11 placeholder="Razón social"
12 ng-model="filters"
13 ng-change="search()"
14 ng-keydown="busquedaDown($event.keyCode)"
15 ng-keypress="busquedaPress($event.keyCode)"
16 foca-focus="selectedCobranza == -1"
17 ng-focus="selectedCobranza = -1"
18 id="search"
19 teclado-virtual
20 >
21 <div class="input-group-append">
22 <button
23 ladda="searchLoading"
24 class="btn btn-outline-secondary"
25 type="button"
26 ng-click="busquedaPress(13)"
27 >
28 <i class="fa fa-search" aria-hidden="true"></i>
29 </button>
30 </div>
31 </div>
32 </div>
33
34 </div>
35 <div class="modal-body" id="modal-body">
36 <div class="input-group row">
37 <small class="col-md-2 col-4 text-left my-1">Fecha Desde</small>
38 <div class="col-md-4 col-8 input-group mb-2">
39 <div class="input-group-prepend">
40 <div class="input-group-text form-control-sm">
41 <i class="fa fa-calendar"></i>
42 </div>
43 </div>
44 <input
45 class="form-control form-control-sm"
46 id="inlineFormInputGroup"
47 ladda="searchLoading"
48 type="date"
49 ng-model="fechaDesde"
50 hasta-hoy
51 ng-required="true"
52 />
53 </div>
54 <small class="col-md-2 col-4 text-left my-1">Fecha Hasta</small>
55 <div class="col-md-4 col-8 input-group mb-2">
56 <div class="input-group-prepend">
57 <div class="input-group-text form-control-sm">
58 <i class="fa fa-calendar"></i>
59 </div>
60 </div>
61 <input
62 class="form-control form-control-sm"
63 id="inlineFormInputGroup"
64 ladda="searchLoading"
65 type="date"
66 ng-model="fechaHasta"
67 ng-required="true"
68 hasta-hoy
69 />
70 </div>
71 </div>
72 <table ng-show="primerBusqueda" class="table table-striped table-sm">
73 <thead>
74 <tr>
75 <th>Fecha</th>
76 <th>Cliente</th>
77 <th>Comprobante</th>
78 <th></th>
79 </tr>
80 </thead>
81 <tbody>
82 <tr ng-show="currentPageCobranzas.length == 0 && primerBusqueda">
83 <td colspan="5">
84 No se encontraron resultados.
85 </td>
86 </tr>
87 <tr class="selectable"
88 ng-repeat="(key, cobranza) in currentPageCobranzas"
89 ng-click="select(cobranza)">
90 <td ng-bind="cobranza.fecha | date : 'dd/MM/yyyy'"></td>
91 <td ng-bind="cobranza.cliente.NOM"></td>
92 <td ng-bind="[cobranza.puntoVenta, cobranza.numeroRecibo] | comprobante"></td>
93 <td>
94 <button
95 type="button"
96 class="btn btn-xs p-1 float-right"
97 ng-class="{
98 'btn-secondary': selectedCobranza != key,
99 'btn-primary': selectedCobranza == key
100 }"
101 foca-focus="selectedCobranza == {{key}}"
102 ng-keydown="itemCobranza($event.keyCode)"
103 >
104 <i class="fa fa-circle-thin" aria-hidden="true"></i>
105 </button>
106 </td>
107 </tr>
108 </tbody>
109 </table>
110 </div>
111 <div class="modal-footer py-1">
112 <nav ng-show="currentPageCobranzas.length > 0 && primerBusqueda" class="mr-auto">
113 <ul class="pagination pagination-sm justify-content mb-0">
114 <li class="page-item" ng-class="{'disabled': currentPage == 1}">
115 <a
116 class="page-link"
117 href="javascript:void();"
118 ng-click="selectPage(currentPage - 1)"
119 >
120 <span aria-hidden="true">&laquo;</span>
121 <span class="sr-only">Anterior</span>
122 </a>
123 </li>
124 <li
125 class="page-item"
126 ng-repeat="pagina in paginas"
127 ng-class="{'active': pagina == currentPage}"
128 >
129 <a
130 class="page-link"
131 href="javascript:void();"
132 ng-click="selectPage(pagina)"
133 ng-bind="pagina"
134 ></a>
135 </li>
136 <li class="page-item" ng-class="{'disabled': currentPage == lastPage}">
137 <a
138 class="page-link"
139 href="javascript:void();"
140 ng-click="selectPage(currentPage + 1)"
141 >
142 <span aria-hidden="true">&raquo;</span>
143 <span class="sr-only">Siguiente</span>
144 </a>
145 </li>
146 </ul>
147 </nav>
148 <button class="btn btn-sm btn-secondary" type="button" ng-click="cancel()">Cancelar</button>
149 </div>
150