Nicolás Guarnieri / foca-modal-detalle-hoja-ruta

Download as
Browse Code »

Commit f2267791faaae7adf67236f321023d04b6ddfe0e

Authored by Pablo Marco del Pont
1 parent bd9c953097
Exists in master

- Agregué propiedades contacto y telefonoContacto. 

- Agregué directivas foca-tipo-input y teclado-virtual.
Showing 2 changed files with 26 additions and 0 deletions   Show diff stats
1 <html ng-app="focaModalDetalleHojaRuta"> 1 <html ng-app="focaModalDetalleHojaRuta">
2 <head> 2 <head>
3 <meta charset="UTF-8"/> 3 <meta charset="UTF-8"/>
4 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 4 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
5 5
6 <!--CSS--> 6 <!--CSS-->
7 <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/> 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"/> 8 <link href="node_modules/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>
9 9
10 <!--VENDOR JS--> 10 <!--VENDOR JS-->
11 <script src="node_modules/jquery/dist/jquery.min.js"></script> 11 <script src="node_modules/jquery/dist/jquery.min.js"></script>
12 <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script> 12 <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
13 <script src="node_modules/angular/angular.min.js"></script> 13 <script src="node_modules/angular/angular.min.js"></script>
14 <script src="node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script> 14 <script src="node_modules/ui-bootstrap4/dist/ui-bootstrap-tpls.js"></script>
15 <script src="node_modules/foca-directivas/dist/foca-directivas.min.js"></script> 15 <script src="node_modules/foca-directivas/dist/foca-directivas.min.js"></script>
16 16
17 <!-- BUILD --> 17 <!-- BUILD -->
18 <script src="src/js/app.js"></script> 18 <script src="src/js/app.js"></script>
19 <script src="src/js/controller.js"></script> 19 <script src="src/js/controller.js"></script>
20 <script src="src/js/service.js"></script> 20 <script src="src/js/service.js"></script>
21 21
22 <!-- /BUILD --> 22 <!-- /BUILD -->
23 23
24 <!-- CONFIG PARA DEVELOP --> 24 <!-- CONFIG PARA DEVELOP -->
25 <script src="src/etc/develop.js"></script> 25 <script src="src/etc/develop.js"></script>
26 <script type="text/javascript"> 26 <script type="text/javascript">
27 angular.module('focaModalDetalleHojaRuta') 27 angular.module('focaModalDetalleHojaRuta')
28 .controller('controller', [ 28 .controller('controller', [
29 '$scope', 29 '$scope',
30 '$uibModal', 30 '$uibModal',
31 '$timeout', 31 '$timeout',
32 function($scope, $uibModal, $timeout) { 32 function($scope, $uibModal, $timeout) {
33 openModal(); 33 openModal();
34 34
35 function openModal() { 35 function openModal() {
36 var modalInstance = $uibModal.open( 36 var modalInstance = $uibModal.open(
37 { 37 {
38 ariaLabelledBy: 'Detalle de hoja de ruta', 38 ariaLabelledBy: 'Detalle de hoja de ruta',
39 templateUrl: 'src/views/modal-detalle-hoja-ruta.html', 39 templateUrl: 'src/views/modal-detalle-hoja-ruta.html',
40 controller: 'focaModalDetalleHojaRutaController', 40 controller: 'focaModalDetalleHojaRutaController',
41 size: 'lg', 41 size: 'lg',
42 resolve: { 42 resolve: {
43 parametrosDetalleHojaRuta: function(){ 43 parametrosDetalleHojaRuta: function(){
44 return { 44 return {
45 remito: '00001-00000001', 45 remito: '00001-00000001',
46 cliente: 'Rubén Gomez', 46 cliente: 'Rubén Gomez',
47 domicilio: 'Patricias Mendocinas 5050', 47 domicilio: 'Patricias Mendocinas 5050',
48 producto: 'Super', 48 producto: 'Super',
49 contacto: 'Ramiro Gutierrez',
50 telefonoContacto: '2614292827',
49 litros: 20 51 litros: 20
50 }; 52 };
51 } 53 }
52 } 54 }
53 } 55 }
54 ); 56 );
55 57
56 modalInstance.result.then( 58 modalInstance.result.then(
57 function (selectedItem) { 59 function (selectedItem) {
58 console.info(selectedItem); 60 console.info(selectedItem);
59 $timeout(openModal, 500); 61 $timeout(openModal, 500);
60 }, function () { 62 }, function () {
61 console.info('modal-component dismissed at: ' + new Date()); 63 console.info('modal-component dismissed at: ' + new Date());
62 $timeout(openModal, 500); 64 $timeout(openModal, 500);
63 } 65 }
64 ); 66 );
65 } 67 }
66 } 68 }
67 ]); 69 ]);
68 </script> 70 </script>
69 </head> 71 </head>
70 <body ng-controller="controller"> 72 <body ng-controller="controller">
71 </body> 73 </body>
72 </html> 74 </html>
73 75
src/views/modal-detalle-hoja-ruta.html
Diff comments   View file @ f226779
1 <div class="modal-header py-1"> 1 <div class="modal-header py-1">
2 <h5 class="modal-title">Detalle de hoja de ruta</h5> 2 <h5 class="modal-title">Detalle de hoja de ruta</h5>
3 </div> 3 </div>
4 <div class="modal-body" id="modal-body"> 4 <div class="modal-body" id="modal-body">
5 <form name="formDetalleHojaRuta"> 5 <form name="formDetalleHojaRuta">
6 <div class="form-group row"> 6 <div class="form-group row">
7 <div class="col-12"> 7 <div class="col-12">
8 <div class="form-group row"> 8 <div class="form-group row">
9 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Remito</label> 9 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Remito</label>
10 <div class="col-sm-3"> 10 <div class="col-sm-3">
11 <input 11 <input
12 type="text" 12 type="text"
13 class="form-control form-control-sm" 13 class="form-control form-control-sm"
14 ng-model="parametrosDetalleHojaRuta.remito" 14 ng-model="parametrosDetalleHojaRuta.remito"
15 readonly disabled 15 readonly disabled
16 /> 16 />
17 </div> 17 </div>
18 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Cliente</label> 18 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Cliente</label>
19 <div class="col-sm-3"> 19 <div class="col-sm-3">
20 <input 20 <input
21 type="text" 21 type="text"
22 class="form-control form-control-sm" 22 class="form-control form-control-sm"
23 ng-model="parametrosDetalleHojaRuta.cliente" 23 ng-model="parametrosDetalleHojaRuta.cliente"
24 readonly disabled 24 readonly disabled
25 /> 25 />
26 </div> 26 </div>
27 </div> 27 </div>
28 <div class="form-group row"> 28 <div class="form-group row">
29 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Domicilio</label> 29 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Domicilio</label>
30 <div class="col-sm-3"> 30 <div class="col-sm-3">
31 <input 31 <input
32 type="text" 32 type="text"
33 class="form-control form-control-sm" 33 class="form-control form-control-sm"
34 ng-model="parametrosDetalleHojaRuta.domicilio" 34 ng-model="parametrosDetalleHojaRuta.domicilio"
35 readonly disabled 35 readonly disabled
36 /> 36 />
37 </div> 37 </div>
38 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Contacto</label>
39 <div class="col-sm-3">
40 <input
41 type="text"
42 class="form-control form-control-sm"
43 ng-model="parametrosDetalleHojaRuta.contacto"
44 readonly disabled
45 />
46 </div>
47 </div>
48 <div class="form-group row">
49 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Teléfono</label>
50 <div class="col-sm-3">
51 <input
52 type="text"
53 class="form-control form-control-sm"
54 ng-model="parametrosDetalleHojaRuta.telefonoContacto"
55 readonly disabled
56 />
57 </div>
38 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Producto</label> 58 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Producto</label>
39 <div class="col-sm-3"> 59 <div class="col-sm-3">
40 <input 60 <input
41 type="text" 61 type="text"
42 class="form-control form-control-sm" 62 class="form-control form-control-sm"
43 ng-model="parametrosDetalleHojaRuta.producto" 63 ng-model="parametrosDetalleHojaRuta.producto"
44 readonly disabled 64 readonly disabled
45 /> 65 />
46 </div> 66 </div>
47 </div> 67 </div>
48 <div class="form-group row"> 68 <div class="form-group row">
49 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Litros</label> 69 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Litros</label>
50 <div class="col-sm-3"> 70 <div class="col-sm-3">
51 <input 71 <input
52 type="text" 72 type="text"
53 class="form-control form-control-sm" 73 class="form-control form-control-sm"
54 ng-model="parametrosDetalleHojaRuta.litros" 74 ng-model="parametrosDetalleHojaRuta.litros"
55 readonly disabled 75 readonly disabled
56 /> 76 />
57 </div> 77 </div>
58 </div> 78 </div>
59 <div class="form-group row"> 79 <div class="form-group row">
60 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Litros descargados</label> 80 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Litros descargados</label>
61 <div class="col-sm-3"> 81 <div class="col-sm-3">
62 <input 82 <input
63 type="number" 83 type="number"
64 min="0" 84 min="0"
65 step="0.01" 85 step="0.01"
66 class="form-control form-control-sm" 86 class="form-control form-control-sm"
67 id="litrosDescargados" 87 id="litrosDescargados"
68 name="litrosDescargados" 88 name="litrosDescargados"
69 placeholder="Litros descargados" 89 placeholder="Litros descargados"
70 ng-model="parametrosDetalleHojaRuta.litrosDescargados" 90 ng-model="parametrosDetalleHojaRuta.litrosDescargados"
71 foca-focus="paso === 0" 91 foca-focus="paso === 0"
72 ng-keypress="$event.keyCode === 13 && irPaso(1)" 92 ng-keypress="$event.keyCode === 13 && irPaso(1)"
93 foca-tipo-input
94 teclado-virtual
73 /> 95 />
74 </div> 96 </div>
75 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Nº recibo</label> 97 <label for="costo" class="col-sm-3 col-form-label col-form-label-sm">Nº recibo</label>
76 <div class="col-sm-3"> 98 <div class="col-sm-3">
77 <input 99 <input
78 type="number" 100 type="number"
79 min="0" 101 min="0"
80 step="0.01" 102 step="0.01"
81 class="form-control form-control-sm" 103 class="form-control form-control-sm"
82 id="numeroRecibo" 104 id="numeroRecibo"
83 name="numeroRecibo" 105 name="numeroRecibo"
84 placeholder="Nº Recibo" 106 placeholder="Nº Recibo"
85 ng-model="parametrosDetalleHojaRuta.numeroRecibo" 107 ng-model="parametrosDetalleHojaRuta.numeroRecibo"
86 foca-focus="paso === 1" 108 foca-focus="paso === 1"
87 ng-keypress="$event.keyCode == 13 && validar() && aceptar()" 109 ng-keypress="$event.keyCode == 13 && validar() && aceptar()"
110 foca-tipo-input
111 teclado-virtual
88 /> 112 />
89 </div> 113 </div>
90 </div> 114 </div>
91 </div> 115 </div>
92 </div> 116 </div>
93 </form> 117 </form>
94 </div> 118 </div>
95 <div class="modal-footer py-2"> 119 <div class="modal-footer py-2">
96 <button 120 <button
97 class="btn btn-secondary btn-sm" 121 class="btn btn-secondary btn-sm"
98 type="button" 122 type="button"
99 ng-click="aceptar()" 123 ng-click="aceptar()"
100 ng-disabled="validar()" 124 ng-disabled="validar()"
101 >Aceptar</button> 125 >Aceptar</button>
102 <button class="btn btn-secondary btn-sm" type="button" ng-click="cancel()">Cancelar</button> 126 <button class="btn btn-secondary btn-sm" type="button" ng-click="cancel()">Cancelar</button>
103 </div> 127 </div>
104 128