-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
307 lines (276 loc) · 18.6 KB
/
index.html
File metadata and controls
307 lines (276 loc) · 18.6 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
<!DOCTYPE html>
<html lang="es-AR">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/png" href="./assets/logo.png">
<title>PayRoller</title>
<!-- Tailwind CSS -->
<script src="https://cdn.tailwindcss.com"></script>
<!-- Flowbite -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.3/flowbite.min.css" rel="stylesheet" />
<!-- Darkmode localStorage -->
<script src="./js/darkmode/localStorage.js"></script>
</head>
<body class="bg-white dark:bg-gray-800">
<!-- BARRA SUPERIOR -->
<nav
class="fixed top-0 z-50 w-full bg-opacity-80 dark:bg-opacity-80 dark:bg-gray-900 bg-gray-100 hover:bg-opacity-100 border-b border-gray-200 dark:border-gray-700">
<div class="px-3 py-3 lg:px-5 lg:pl-3">
<div class="flex items-center justify-between">
<div class="flex items-center justify-start">
<button id="show-menu" class="hidden" data-drawer-target="logo-sidebar"
data-drawer-show="logo-sidebar">Show</button>
<button id="hide-menu" class="hidden" data-drawer-target="logo-sidebar"
data-drawer-hide="logo-sidebar">Hide</button>
<button id="btn-hamburguer" data-drawer-target="logo-sidebar" data-drawer-toggle="logo-sidebar"
data-drawer-backdrop="false" aria-controls="logo-sidebar" type="button"
class="inline-flex items-center p-2 text-sm text-gray-500 rounded-lg md:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600">
<span class="sr-only">Open sidebar</span>
<svg class="w-6 h-6" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path clip-rule="evenodd" fill-rule="evenodd"
d="M2 4.75A.75.75 0 012.75 4h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 4.75zm0 10.5a.75.75 0 01.75-.75h7.5a.75.75 0 010 1.5h-7.5a.75.75 0 01-.75-.75zM2 10a.75.75 0 01.75-.75h14.5a.75.75 0 010 1.5H2.75A.75.75 0 012 10z">
</path>
</svg>
</button>
<a href="#" onclick="refreshPage()" class="flex ml-2 md:mr-24">
<img src="./assets/logo.png" class="h-8 mr-3" />
<span
class="self-center text-xl font-semibold sm:text-2xl whitespace-nowrap dark:text-white dark:hover:text-green-300 hover:text-green-800">PayRoller</span>
</a>
</div>
<div class="flex items-center">
<div class="flex items-center ml-3">
<button id="theme-toggle" type="button"
class="text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-700 focus:outline-none rounded-lg text-sm p-2.5 mr-2">
<svg id="theme-toggle-dark-icon" class="hidden w-5 h-5" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path d="M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z"></path>
</svg>
<svg id="theme-toggle-light-icon" class="hidden w-5 h-5" fill="currentColor"
viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
<path
d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z"
fill-rule="evenodd" clip-rule="evenodd"></path>
</svg>
</button>
<div>
<button type="button"
class="flex text-sm bg-gray-800 rounded-full focus:ring-4 focus:ring-gray-300 dark:focus:ring-gray-600"
aria-expanded="false" data-dropdown-toggle="dropdown-user">
<span class="sr-only">Open user menu</span>
<img class="w-8 h-8 rounded-full" src="./assets/user.png" alt="user photo">
</button>
</div>
<div class="z-50 hidden my-4 text-base list-none bg-white divide-y divide-gray-100 rounded shadow dark:bg-gray-700 dark:divide-gray-600"
id="dropdown-user">
<div class="px-4 py-3" role="none">
<p class="text-sm font-medium text-gray-900 dark:text-white" role="none">
Rodri Casas
</p>
<p class="text-sm text-gray-900 truncate dark:text-gray-300" role="none">
cr.rodrigocasas@gmail.com
</p>
</div>
<ul class="py-2" role="none">
<li>
<a href="https://github.com/casasrodri"
class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white"
role="menuitem">Perfil</a>
</li>
<li>
<a href="#"
class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white"
role="menuitem" onclick="modalNotImplemented()">Soporte</a>
</li>
<li title="Reinicia el localStorage para eliminar cambios temporales.">
<a href="#"
class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-gray-600 dark:hover:text-white"
role="menuitem" onclick="clearLocalStorage()">
<span style="color: rgb(214, 70, 70);">Reiniciar sesión</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</nav>
<!-- BARRA LATERAL -->
<aside id="logo-sidebar"
class="fixed top-0 left-0 z-40 w-64 h-screen pt-20 transition-transform -translate-x-full bg-white border-r border-gray-200 sm:translate-x-0 dark:bg-gray-800 dark:border-gray-700"
aria-label="Sidebar">
<div class="h-full px-3 pb-4 overflow-y-auto bg-white dark:bg-gray-800">
<ul class="space-y-1" id="menu-lateral">
<li>
<button type="button"
class="flex items-center w-full p-2 text-base font-normal text-gray-900 transition duration-75 rounded-lg group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700"
aria-controls="dropdown-empleados" data-collapse-toggle="dropdown-empleados">
<span data-feather="users"
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"></span>
<span class="flex-1 ml-3 text-left whitespace-nowrap" sidebar-toggle-item>Empleados</span>
<svg sidebar-toggle-item class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd"></path>
</svg>
</button>
<ul id="dropdown-empleados" class="hidden py-2 space-y-1">
<li>
<a href="#"
class="flex items-center w-full p-1 text-base font-normal text-gray-900 transition duration-75 rounded-lg pl-11 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700"
id="menu-empleados-consulta" onclick="seleccionMenu('menu-empleados-consulta')">
<span data-feather="list"
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"></span>
<span class="ml-3">Consulta</span>
</a>
</li>
<li>
<a href="#"
class="flex items-center w-full p-1 text-base font-normal text-gray-900 transition duration-75 rounded-lg pl-11 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700"
id="menu-empleados-admin" onclick="seleccionMenu('menu-empleados-admin')">
<span data-feather="database"
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"></span>
<span class="ml-3">Administración</span>
</a>
</li>
</ul>
</li>
<li>
<button type="button"
class="flex items-center w-full p-2 text-base font-normal text-gray-900 transition duration-75 rounded-lg group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700"
aria-controls="dropdown-novedades" data-collapse-toggle="dropdown-novedades">
<span data-feather="bell"
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"></span>
<span class="flex-1 ml-3 text-left whitespace-nowrap" sidebar-toggle-item>Novedades</span>
<svg sidebar-toggle-item class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd"></path>
</svg>
</button>
<ul id="dropdown-novedades" class="hidden py-2 space-y-1">
<li>
<a href="#"
class="flex items-center w-full p-1 text-base font-normal text-gray-900 transition duration-75 rounded-lg pl-11 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700"
id="menu-novedades-alta" onclick="seleccionMenu('menu-novedades-alta')">
<span data-feather="plus-square"
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"></span>
<span class="ml-3">Alta</span>
</a>
</li>
<li>
<a href="#"
class="flex items-center w-full p-1 text-base font-normal text-gray-900 transition duration-75 rounded-lg pl-11 group hover:bg-gray-100 dark:text-white dark:hover:bg-gray-700"
id="menu-novedades-admin" onclick="seleccionMenu('menu-novedades-admin')">
<span data-feather="layers"
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"></span>
<span class="ml-3">Administración</span>
</a>
</li>
</ul>
</li>
<li>
<a href="#"
class="flex items-center p-2 text-base font-normal text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700"
id="menu-liquidacion" onclick="seleccionMenu('menu-liquidacion')">
<span data-feather="dollar-sign"
class="w-5 h-5 text-gray-500 transition duration-75 dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white"></span>
<span class="ml-3">Liquidación</span>
</a>
</li>
</ul>
</div>
</aside>
<!-- CONTENIDO DINÁMICO -->
<div id="contenido-dinamico" class="p-4 sm:ml-64">
<div class="p-1 mt-12">
<div class="h-full h-full" id="canvas-contenido">
<!---------------------------------->
<!-- ACÁ VA EL CONTENIDO DINÁMICO -->
<!---------------------------------->
</div>
</div>
</div>
<!-- Drawer Vista Empleado (oculto por defecto) -->
<div id="drawer-lateral-vista-empleado">
<button id="MostrarDrawer" data-drawer-target="drawer-vista-empleado" data-drawer-show="drawer-vista-empleado"
data-drawer-placement="right" aria-controls="drawer-vista-empleado" class="hidden">Abrir Drawer</button>
<div id="drawer-vista-empleado"
class="fixed top-0 right-0 z-40 h-screen p-4 overflow-y-auto transition-transform translate-x-full bg-white w-120 dark:bg-gray-800 mt-16"
tabindex="-1" aria-labelledby="drawer-vista-empleado">
<img id="drawer-empleado-img" class="rounded-lg object-cover h-48 w-96 mb-3 mx-3"
src="./assets/profile/0.jpg" />
<h6 id="drawer-empleado-nombre"
class="ml-2 inline-flex items-center mb-2 text-base font-semibold dark:text-white text-xl">
NombreEmpleado
</h6>
<input type="hidden" name="legajo-drawer" id="legajo-drawer">
<button type="button" data-drawer-hide="drawer-vista-empleado" aria-controls="drawer-vista-empleado"
class="bg-gray-200/50 dark:bg-gray-500/50 text-gray-400 hover:bg-gray-200 hover:text-gray-900 rounded-lg text-sm p-1.5 absolute top-2.5 right-2.5 inline-flex items-center dark:hover:bg-gray-600 dark:hover:text-white">
<svg aria-hidden="true" class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
clip-rule="evenodd"></path>
</svg>
</button>
<div
class="text-sm font-medium text-center text-gray-500 border-b border-gray-200 dark:text-gray-400 dark:border-gray-700">
<ul class="flex flex-wrap -mb-px">
<li class="mr-1">
<a id="tab-datos-personales" href="#"
class="inline-block p-2 border-b-2 border-transparent rounded-t-lg hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300"
onclick="tablaDatosPersonales()">Datos personales</a>
</li>
<li class="mr-1">
<a href="#" id="tab-datos-laborales"
class="inline-block p-2 border-b-2 border-transparent rounded-t-lg hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300"
onclick="tablaDatosLaborales()">Datos
laborales</a>
</li>
</ul>
</div>
<div class="relative overflow-x-auto shadow-md sm:rounded-lg">
<table class="w-full text-sm text-left text-gray-500 dark:text-gray-400">
<tbody id="tabla-visualizacion-datos">
<!-- ACÁ VAN LOS REGISTROS SEGUN TAB -->
</tbody>
</table>
</div>
</div>
</div>
<!-- JS SCRIPTS -->
<!-- Flowbite -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/1.6.3/flowbite.min.js"></script>
<!-- Darkmode toggle -->
<script src="./js/darkmode/toggle.js"></script>
<!-- Feather icons -->
<script src="https://cdn.jsdelivr.net/npm/feather-icons@4.28.0/dist/feather.min.js"
integrity="sha384-uO3SXW5IuS1ZpFPKugNNWqTZRRglnUJK6UAZ/gxOX80nxEkN9NcGZTftn6RzhGWE"
crossorigin="anonymous"></script>
<script src="./js/icons/feather-icons.js"></script>
<!-- SweetAlert -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<!-- Funcionalidades -->
<script src="./js/classes/empleados.js"></script>
<script src="./js/classes/novedades.js"></script>
<script src="./js/classes/liquidador.js"></script>
<script src="./js/data/data.js"></script>
<!-- GUI -->
<script src="./js/gui/empleados-view.js"></script>
<script src="./js/gui/empleados-admin.js"></script>
<script src="./js/gui/empleados-nuevo.js"></script>
<script src="./js/gui/empleados-edit.js"></script>
<script src="./js/gui/novedades-alta.js"></script>
<script src="./js/gui/novedades-admin.js"></script>
<script src="./js/gui/liquidacion.js"></script>
<script src="./js/gui/menu-lateral.js"></script>
<script src="./js/main.js"></script>
</body>
</html>