Commit a7d374b5e8450913c0764cb4efd00e6f1c83d4d2

Authored by Jose Pinto
1 parent 28fbfe450c
Exists in master

buscador en header, paginado en footer, cambio icons

Showing 2 changed files with 40 additions and 30 deletions   Show diff stats
1 { 1 {
2 "name": "foca-modal-vehiculo", 2 "name": "foca-modal-vehiculo",
3 "version": "0.0.1", 3 "version": "0.0.1",
4 "description": "Modal de búsqueda de vehiculos", 4 "description": "Modal de búsqueda de vehiculos",
5 "scripts": { 5 "scripts": {
6 "test": "echo \"Error: no test specified\" && exit 1", 6 "test": "echo \"Error: no test specified\" && exit 1",
7 "gulp-pre-commit": "gulp pre-commit", 7 "gulp-pre-commit": "gulp pre-commit",
8 "compile": "gulp uglify", 8 "compile": "gulp uglify",
9 "postinstall": "npm run compile && gulp clean-post-install", 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" 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+ssh://git@git.focasoftware.com:npm/foca-directivas.git"
11 }, 11 },
12 "pre-commit": [ 12 "pre-commit": [
13 "gulp-pre-commit" 13 "gulp-pre-commit"
14 ], 14 ],
15 "repository": { 15 "repository": {
16 "type": "git", 16 "type": "git",
17 "url": "https://debo.suite.repo/modulos-npm/foca-modal-vehiculo.git" 17 "url": "https://debo.suite.repo/modulos-npm/foca-modal-vehiculo.git"
18 }, 18 },
19 "author": "Foca Software", 19 "author": "Foca Software",
20 "license": "ISC", 20 "license": "ISC",
21 "peerDependencies": { 21 "peerDependencies": {
22 "angular": "^1.7.4", 22 "angular": "^1.7.4",
23 "bootstrap": "^4.1.3", 23 "bootstrap": "^4.1.3",
24 "font-awesome": "^4.7.0", 24 "font-awesome": "^4.7.0",
25 "ui-bootstrap4": "^3.0.4", 25 "ui-bootstrap4": "^3.0.4",
26 "gulp": "^3.9.1", 26 "gulp": "^3.9.1",
27 "gulp-angular-templatecache": "^2.2.1", 27 "gulp-angular-templatecache": "^2.2.1",
28 "gulp-concat": "^2.6.1", 28 "gulp-concat": "^2.6.1",
29 "gulp-connect": "^5.6.1", 29 "gulp-connect": "^5.6.1",
30 "gulp-htmlmin": "^5.0.1", 30 "gulp-htmlmin": "^5.0.1",
31 "gulp-rename": "^1.4.0", 31 "gulp-rename": "^1.4.0",
32 "gulp-replace": "^1.0.0", 32 "gulp-replace": "^1.0.0",
33 "gulp-uglify": "^3.0.1", 33 "gulp-uglify": "^3.0.1",
34 "jquery": "^3.3.1", 34 "jquery": "^3.3.1",
35 "pump": "^3.0.0", 35 "pump": "^3.0.0",
36 "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas" 36 "foca-directivas": "git+ssh://git@git.focasoftware.com:npm/foca-directivas"
37 }, 37 },
38 "devDependencies": { 38 "devDependencies": {
39 "angular": "^1.7.5", 39 "angular": "^1.7.5",
40 "angular-ladda": "^0.4.3", 40 "angular-ladda": "^0.4.3",
41 "bootstrap": "^4.1.3", 41 "bootstrap": "^4.1.3",
42 "foca-directivas": "git+https://debo.suite.repo/modulos-npm/foca-directivas.git", 42 "foca-directivas": "git+ssh://git@git.focasoftware.com:npm/foca-directivas.git",
43 "font-awesome": "^4.7.0", 43 "font-awesome": "^4.7.0",
44 "gulp": "^3.9.1", 44 "gulp": "^3.9.1",
45 "gulp-angular-templatecache": "^2.2.5", 45 "gulp-angular-templatecache": "^2.2.5",
46 "gulp-clean": "^0.4.0", 46 "gulp-clean": "^0.4.0",
47 "gulp-concat": "^2.6.1", 47 "gulp-concat": "^2.6.1",
48 "gulp-connect": "^5.6.1", 48 "gulp-connect": "^5.6.1",
49 "gulp-htmlmin": "^5.0.1", 49 "gulp-htmlmin": "^5.0.1",
50 "gulp-jshint": "^2.1.0", 50 "gulp-jshint": "^2.1.0",
51 "gulp-rename": "^1.4.0", 51 "gulp-rename": "^1.4.0",
52 "gulp-replace": "^1.0.0", 52 "gulp-replace": "^1.0.0",
53 "gulp-uglify": "^3.0.1", 53 "gulp-uglify": "^3.0.1",
54 "jasmine-core": "^3.3.0", 54 "jasmine-core": "^3.3.0",
55 "jquery": "^3.3.1", 55 "jquery": "^3.3.1",
56 "jshint": "^2.9.6", 56 "jshint": "^2.9.6",
57 "ladda": "1.0.6", 57 "ladda": "1.0.6",
58 "pre-commit": "^1.2.2", 58 "pre-commit": "^1.2.2",
59 "pump": "^3.0.0", 59 "pump": "^3.0.0",
60 "ui-bootstrap4": "^3.0.5" 60 "ui-bootstrap4": "^3.0.5"
61 } 61 }
62 } 62 }
63 63
src/views/modal-vehiculo.html
1 <div class="modal-header py-1"> 1 <div class="modal-header py-1">
2 <h5 class="modal-title">Busqueda de Vehiculo</h5> 2 <div class="row w-100">
3 </div> 3 <div class="col-lg-6">
4 <div class="modal-body" id="modal-body"> 4 <h5 class="modal-title my-1">Busqueda de Vehiculo</h5>
5 <div class="input-group"> 5 </div>
6 <input 6 <div class="input-group col-lg-6 pr-0 my-2">
7 ladda="searchLoading" 7 <input
8 type="text"
9 class="form-control"
10 placeholder="Busqueda"
11 ng-model="filters"
12 ng-change="search()"
13 ng-keydown="busquedaDown($event.keyCode)"
14 ng-keypress="busquedaPress($event.keyCode)"
15 foca-focus="selectedVehiculo == -1"
16 ng-focus="selectedVehiculo = -1"
17 >
18 <div class="input-group-append">
19 <button
20 ladda="searchLoading" 8 ladda="searchLoading"
21 class="btn btn-outline-secondary" 9 type="text"
22 type="button" 10 class="form-control"
23 ng-click="busquedaPress(13)" 11 placeholder="Busqueda"
12 ng-model="filters"
13 ng-change="search()"
14 ng-keydown="busquedaDown($event.keyCode)"
15 ng-keypress="busquedaPress($event.keyCode)"
16 foca-focus="selectedVehiculo == -1"
17 ng-focus="selectedVehiculo = -1"
24 > 18 >
25 <i class="fa fa-search" aria-hidden="true"></i> 19 <div class="input-group-append">
26 </button> 20 <button
21 ladda="searchLoading"
22 class="btn btn-outline-secondary"
23 type="button"
24 ng-click="busquedaPress(13)"
25 >
26 <i class="fa fa-search" aria-hidden="true"></i>
27 </button>
28 </div>
27 </div> 29 </div>
28 </div> 30 </div>
31 </div>
32 <div class="modal-body" id="modal-body">
33
34 <div ng-show="!primerBusqueda">
35 Debe realizar una primer búsqueda.
36 </div>
37
29 <table ng-show="primerBusqueda" class="table table-striped table-sm"> 38 <table ng-show="primerBusqueda" class="table table-striped table-sm">
30 <thead> 39 <thead>
31 <tr> 40 <tr>
32 <th>Código</th> 41 <th>Código</th>
33 <th>Tractor</th> 42 <th>Tractor</th>
34 <th>Semi</th> 43 <th>Semi</th>
35 <th>Capacidad</th> 44 <th>Capacidad</th>
36 <th>Cisternado</th> 45 <th>Cisternado</th>
37 </tr> 46 </tr>
38 </thead> 47 </thead>
39 <tbody> 48 <tbody>
40 <tr ng-show="currentPageVehiculos.length == 0 && primerBusqueda"> 49 <tr ng-show="currentPageVehiculos.length == 0 && primerBusqueda">
41 <td colspan="5"> 50 <td colspan="5">
42 No se encontraron resultados. 51 No se encontraron resultados.
43 </td> 52 </td>
44 </tr> 53 </tr>
45 <tr class="selectable" 54 <tr class="selectable"
46 ng-repeat="(key,vehiculo) in currentPageVehiculos" 55 ng-repeat="(key,vehiculo) in currentPageVehiculos"
47 ng-click="select(vehiculo)"> 56 ng-click="select(vehiculo)">
48 <td ng-bind="vehiculo.id"></td> 57 <td ng-bind="vehiculo.id"></td>
49 <td ng-bind="vehiculo.tractor"></td> 58 <td ng-bind="vehiculo.tractor"></td>
50 <td ng-bind="vehiculo.semi"></td> 59 <td ng-bind="vehiculo.semi"></td>
51 <td ng-bind="vehiculo.capacidad"></td> 60 <td ng-bind="vehiculo.capacidad"></td>
52 <td ng-bind="vehiculo.cisternado"></td> 61 <td ng-bind="vehiculo.cisternado"></td>
53 <td> 62 <td>
54 <button 63 <button
55 type="button" 64 type="button"
56 class="btn btn-xs p-1 float-right" 65 class="btn btn-xs p-1 float-right"
57 ng-class="{ 66 ng-class="{
58 'btn-secondary': selectedVehiculo != key, 67 'btn-secondary': selectedVehiculo != key,
59 'btn-primary': selectedVehiculo == key 68 'btn-primary': selectedVehiculo == key
60 }" 69 }"
61 foca-focus="selectedVehiculo == {{key}}" 70 foca-focus="selectedVehiculo == {{key}}"
62 ng-keydown="itemVehiculo($event.keyCode)" 71 ng-keydown="itemVehiculo($event.keyCode)"
63 > 72 >
64 <i class="fa fa-arrow-right" aria-hidden="true"></i> 73 <i class="fa fa-circle-thin" aria-hidden="true"></i>
65 </button> 74 </button>
66 </td> 75 </td>
67 </tr> 76 </tr>
68 </tbody> 77 </tbody>
69 </table> 78 </table>
70 <nav ng-show="currentPageVehiculos.length > 0 && primerBusqueda"> 79
80 </div>
81 <div class="modal-footer py-1">
82 <nav ng-show="currentPageVehiculos.length > 0 && primerBusqueda" class="mr-auto">
71 <ul class="pagination pagination-sm justify-content mb-0"> 83 <ul class="pagination pagination-sm justify-content mb-0">
72 <li class="page-item" ng-class="{'disabled': currentPage == 1}"> 84 <li class="page-item" ng-class="{'disabled': currentPage == 1}">
73 <a class="page-link" href="javascript:void();" ng-click="selectPage(currentPage - 1)"> 85 <a class="page-link" href="javascript:void();" ng-click="selectPage(currentPage - 1)">
74 <span aria-hidden="true">&laquo;</span> 86 <span aria-hidden="true">&laquo;</span>
75 <span class="sr-only">Anterior</span> 87 <span class="sr-only">Anterior</span>
76 </a> 88 </a>
77 </li> 89 </li>
78 <li 90 <li
79 class="page-item" 91 class="page-item"
80 ng-repeat="pagina in paginas" 92 ng-repeat="pagina in paginas"
81 ng-class="{'active': pagina == currentPage}" 93 ng-class="{'active': pagina == currentPage}"
82 > 94 >
83 <a 95 <a
84 class="page-link" 96 class="page-link"
85 href="javascript:void();" 97 href="javascript:void();"
86 ng-click="selectPage(pagina)" 98 ng-click="selectPage(pagina)"
87 ng-bind="pagina" 99 ng-bind="pagina"
88 ></a> 100 ></a>