Fernando Vasquez 6 gadi atpakaļ
vecāks
revīzija
61be1a4a57
5 mainītis faili ar 434 papildinājumiem un 78 dzēšanām
  1. 370 0
      asignar.php
  2. 58 4
      css/all.css
  3. 0 69
      header.php
  4. 1 0
      pruebas.php
  5. 5 5
      sidebar.php

+ 370 - 0
asignar.php

@@ -0,0 +1,370 @@
1
+<head>
2
+    <meta charset="utf-8">
3
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
4
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
5
+    <title>PruebasPsico - Asignación de prueba</title>
6
+    <link rel="stylesheet" href="css/all.css">
7
+    <script src="js/jquery.min.js"></script>
8
+    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.css"/>
9
+    <script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.18/datatables.min.js"></script>
10
+
11
+</head>
12
+<script type="text/javascript">
13
+    $(document).ready(function () {
14
+        $(".list-unstyled").find('li').removeClass("active");
15
+        $("#pruebas").addClass("active");
16
+        $("#aplicar").addClass("active");
17
+    });
18
+</script>
19
+<?php include('sidebar.php') ?>       
20
+<section id="content">
21
+    <?php include('header.php') ?>       
22
+    <div class="content-section">
23
+        <div class="main">
24
+            <h1>Asignación de pruebas</h1>
25
+            <p>Selecciona el código del candidato y posteriormente las pruebas que deberá ejecutar.</p>
26
+            <div class="asignar_usuario">
27
+                <div class="row">
28
+                    <div class="col-md-3">
29
+                        <div class="datos_candidato">
30
+                            <label>Seleccionar código</label>
31
+                            <select>
32
+                                <option>001</option>
33
+                                <option>002</option>
34
+                                <option>003</option>
35
+                                <option>004</option>
36
+                                <option>005</option>
37
+                                <option>006</option>
38
+                                <option>007</option>
39
+                                <option>008</option>
40
+                            </select>
41
+                        </div>
42
+                    </div>
43
+                    <div class="col-md-3">
44
+                        <div class="datos_candidato">
45
+                            <label>Nombre</label>
46
+                            <input type="text" name="nombre" placeholder="Nombre candidato" readonly>
47
+                        </div>
48
+                    </div>
49
+                    <div class="col-md-3">
50
+                        <div class="datos_candidato">
51
+                            <label>Edad</label>
52
+                            <input type="number" name="text" placeholder="28" readonly>
53
+                        </div>
54
+                    </div>
55
+                    <div class="col-md-3">
56
+                        <div class="datos_candidato">
57
+                            <label>Género</label>
58
+                            <input type="text" name="genero" placeholder="Hombre" readonly>
59
+                        </div>
60
+                    </div>
61
+                </div>
62
+            </div>
63
+            <div class="tabs_pruebas">
64
+                <div class="row">
65
+                    <div class="col-md-4">
66
+                        <div class="test_tab active" id="comportamiento" onclick="comportamiento()">
67
+                            <p>COMPORTAMIENTO</p>
68
+                        </div>
69
+                    </div>
70
+                    <div class="col-md-4">
71
+                        <div class="test_tab" id="personalidad" onclick="personalidad()">
72
+                            <p>PERSONALIDAD</p>
73
+                        </div>
74
+                    </div>
75
+                    <div class="col-md-4">
76
+                        <div class="test_tab" id="inteligencia" onclick="inteligencia()">
77
+                            <p>INTELIGENCIA</p>
78
+                        </div>
79
+                    </div>
80
+                </div>
81
+            </div>
82
+            <div class="pruebas_grid">
83
+                <div class="comportamiento_body" id="comportamiento_body">
84
+                    <div class="row">
85
+                        <div class="col-md-4">
86
+                            <div class="body_prueba">
87
+                                <div class="modern-Checkbox">
88
+                                    <input type="checkbox" id="box-1">
89
+                                    <label for="box-1">CLEAVER</label>
90
+                                </div>
91
+                            </div>
92
+                        </div>
93
+                        <div class="col-md-4">
94
+                            <div class="body_prueba">
95
+                                <div class="modern-Checkbox">
96
+                                    <input type="checkbox" id="box-2">
97
+                                    <label for="box-2">ESTILO</label>
98
+                                </div>
99
+                            </div>
100
+                        </div>
101
+                        <div class="col-md-4">
102
+                            <div class="body_prueba">
103
+                                <div class="modern-Checkbox">
104
+                                    <input type="checkbox" id="box-3">
105
+                                    <label for="box-3">VALORES</label>
106
+                                </div>
107
+                            </div>
108
+                        </div>
109
+                        <div class="col-md-4">
110
+                            <div class="body_prueba">
111
+                                <div class="modern-Checkbox">
112
+                                    <input type="checkbox" id="box-4">
113
+                                    <label for="box-4">VALORES COMP.</label>
114
+                                </div>
115
+                            </div>
116
+                        </div>
117
+                        <div class="col-md-4">
118
+                            <div class="body_prueba">
119
+                                <div class="modern-Checkbox">
120
+                                    <input type="checkbox" id="box-5">
121
+                                    <label for="box-5">MOSS</label>
122
+                                </div>
123
+                            </div>
124
+                        </div>
125
+                        <div class="col-md-4">
126
+                            <div class="body_prueba">
127
+                                <div class="modern-Checkbox">
128
+                                    <input type="checkbox" id="box-6">
129
+                                    <label for="box-6">KOSTICK</label>
130
+                                </div>
131
+                            </div>
132
+                        </div>
133
+                        <div class="col-md-4">
134
+                            <div class="body_prueba">
135
+                                <div class="modern-Checkbox">
136
+                                    <input type="checkbox" id="box-7">
137
+                                    <label for="box-7">ZAVIC</label>
138
+                                </div>
139
+                            </div>
140
+                        </div>
141
+                        <div class="col-md-4">
142
+                            <div class="body_prueba">
143
+                                <div class="modern-Checkbox">
144
+                                    <input type="checkbox" id="box-8">
145
+                                    <label for="box-8">VALPER</label>
146
+                                </div>
147
+                            </div>
148
+                        </div>
149
+                        <div class="col-md-4">
150
+                            <div class="body_prueba">
151
+                                <div class="modern-Checkbox">
152
+                                    <input type="checkbox" id="box-9">
153
+                                    <label for="box-9">LIFO</label>
154
+                                </div>
155
+                            </div>
156
+                        </div>
157
+                    </div>
158
+                </div>
159
+
160
+
161
+
162
+                <div class="personalidad_body" id="personalidad_body">
163
+                    <div class="row">
164
+                        <div class="col-md-4">
165
+                            <div class="body_prueba">
166
+                                <div class="modern-Checkbox">
167
+                                    <input type="checkbox" id="box-10">
168
+                                    <label for="box-10">LUSCHER</label>
169
+                                </div>
170
+                            </div>
171
+                        </div>
172
+                        <div class="col-md-4">
173
+                            <div class="body_prueba">
174
+                                <div class="modern-Checkbox">
175
+                                    <input type="checkbox" id="box-11">
176
+                                    <label for="box-11">CPI</label>
177
+                                </div>
178
+                            </div>
179
+                        </div>
180
+                        <div class="col-md-4">
181
+                            <div class="body_prueba">
182
+                                <div class="modern-Checkbox">
183
+                                    <input type="checkbox" id="box-12">
184
+                                    <label for="box-12">PGV</label>
185
+                                </div>
186
+                            </div>
187
+                        </div>
188
+                        <div class="col-md-4">
189
+                            <div class="body_prueba">
190
+                                <div class="modern-Checkbox">
191
+                                    <input type="checkbox" id="box-13">
192
+                                    <label for="box-13">BFQ</label>
193
+                                </div>
194
+                            </div>
195
+                        </div>
196
+                        <div class="col-md-4">
197
+                            <div class="body_prueba">
198
+                                <div class="modern-Checkbox">
199
+                                    <input type="checkbox" id="box-14">
200
+                                    <label for="box-14">16FP</label>
201
+                                </div>
202
+                            </div>
203
+                        </div>
204
+                        <div class="col-md-4">
205
+                            <div class="body_prueba">
206
+                                <div class="modern-Checkbox">
207
+                                    <input type="checkbox" id="box-15">
208
+                                    <label for="box-15">PIP</label>
209
+                                </div>
210
+                            </div>
211
+                        </div>
212
+                        <div class="col-md-4">
213
+                            <div class="body_prueba">
214
+                                <div class="modern-Checkbox">
215
+                                    <input type="checkbox" id="box-16">
216
+                                    <label for="box-16">IMP</label>
217
+                                </div>
218
+                            </div>
219
+                        </div>
220
+                        <div class="col-md-4">
221
+                            <div class="body_prueba">
222
+                                <div class="modern-Checkbox">
223
+                                    <input type="checkbox" id="box-17">
224
+                                    <label for="box-17">PVC</label>
225
+                                </div>
226
+                            </div>
227
+                        </div>
228
+                        <div class="col-md-4">
229
+                            <div class="body_prueba">
230
+                                <div class="modern-Checkbox">
231
+                                    <input type="checkbox" id="box-18">
232
+                                    <label for="box-18">NIC</label>
233
+                                </div>
234
+                            </div>
235
+                        </div>
236
+                    </div>
237
+                </div>
238
+
239
+
240
+
241
+                <div class="inteligencia_body" id="inteligencia_body">
242
+                    <div class="row">
243
+                        <div class="col-md-4">
244
+                            <div class="body_prueba">
245
+                                <div class="modern-Checkbox">
246
+                                    <input type="checkbox" id="box-19">
247
+                                    <label for="box-19">TERMAN</label>
248
+                                </div>
249
+                            </div>
250
+                        </div>
251
+                        <div class="col-md-4">
252
+                            <div class="body_prueba">
253
+                                <div class="modern-Checkbox">
254
+                                    <input type="checkbox" id="box-20">
255
+                                    <label for="box-20">BETAIIR</label>
256
+                                </div>
257
+                            </div>
258
+                        </div>
259
+                        <div class="col-md-4">
260
+                            <div class="body_prueba">
261
+                                <div class="modern-Checkbox">
262
+                                    <input type="checkbox" id="box-21">
263
+                                    <label for="box-21">BETAIII</label>
264
+                                </div>
265
+                            </div>
266
+                        </div>
267
+                        <div class="col-md-4">
268
+                            <div class="body_prueba">
269
+                                <div class="modern-Checkbox">
270
+                                    <input type="checkbox" id="box-22">
271
+                                    <label for="box-22">IE</label>
272
+                                </div>
273
+                            </div>
274
+                        </div>
275
+                        <div class="col-md-4">
276
+                            <div class="body_prueba">
277
+                                <div class="modern-Checkbox">
278
+                                    <input type="checkbox" id="box-23">
279
+                                    <label for="box-23">RAVEN</label>
280
+                                </div>
281
+                            </div>
282
+                        </div>
283
+                        <div class="col-md-4">
284
+                            <div class="body_prueba">
285
+                                <div class="modern-Checkbox">
286
+                                    <input type="checkbox" id="box-24">
287
+                                    <label for="box-24">DOMINOS</label>
288
+                                </div>
289
+                            </div>
290
+                        </div>
291
+                        <div class="col-md-4">
292
+                            <div class="body_prueba">
293
+                                <div class="modern-Checkbox">
294
+                                    <input type="checkbox" id="box-25">
295
+                                    <label for="box-25">WONDERLIC</label>
296
+                                </div>
297
+                            </div>
298
+                        </div>
299
+                        <div class="col-md-4">
300
+                            <div class="body_prueba">
301
+                                <div class="modern-Checkbox">
302
+                                    <input type="checkbox" id="box-26">
303
+                                    <label for="box-26">COIR</label>
304
+                                </div>
305
+                            </div>
306
+                        </div>
307
+                    </div>
308
+                </div>
309
+
310
+
311
+                <div class="botones_interactivos_asignar">
312
+                    <div class="row">
313
+                        <div class="col-md-12">
314
+                            <a href="#" data-toggle="modal" data-target="#ayudaAsignar">Ayuda</a>
315
+                            <button>Asignar</button>
316
+                        </div>
317
+                    </div>
318
+                </div>
319
+            </div>
320
+        </div>
321
+        <?php include('footer.php') ?>
322
+    </div>
323
+</section>
324
+<script type="text/javascript">
325
+    function comportamiento() {
326
+        $("#comportamiento_body").css('display', 'block');
327
+        $("#personalidad_body").css('display', 'none');
328
+        $("#inteligencia_body").css('display', 'none');
329
+        $("#personalidad").removeClass("active");
330
+        $("#inteligencia").removeClass("active");
331
+        $("#comportamiento").addClass("active");
332
+    };
333
+</script>
334
+<script type="text/javascript">
335
+    function personalidad() {
336
+        $("#comportamiento_body").css('display', 'none');
337
+        $("#personalidad_body").css('display', 'block');
338
+        $("#inteligencia_body").css('display', 'none');
339
+        $("#comportamiento").removeClass("active");
340
+        $("#inteligencia").removeClass("active");
341
+        $("#personalidad").addClass("active");
342
+    };
343
+</script>
344
+<script type="text/javascript">
345
+    function inteligencia() {
346
+        $("#comportamiento_body").css('display', 'none');
347
+        $("#personalidad_body").css('display', 'none');
348
+        $("#inteligencia_body").css('display', 'block');
349
+        $("#comportamiento").removeClass("active");
350
+        $("#personalidad").removeClass("active");
351
+        $("#inteligencia").addClass("active");
352
+    };
353
+</script>
354
+
355
+<div class="modal fade" id="ayudaAsignar" role="dialog">
356
+    <div class="modal-dialog">
357
+
358
+      <!-- Modal content-->
359
+      <div class="modal-content">
360
+        <div class="modal-header">
361
+          <button type="button" class="close" data-dismiss="modal">&times;</button>
362
+          <h4 class="modal-title">Asistencia</h4>
363
+        </div>
364
+        <div class="modal-body">
365
+            <div class="data_notification">
366
+                <p>En el menú Pruebas encontrara la opción Aplicar , utilízala para seleccionar las pruebas que le serán aplicadas al candidato. Selecciona el código del candidato y marca las pruebas, una vez marcadas presiona el botón Asignar para comenzar la aplicación de las mismas.</p>
367
+        </div>
368
+      </div>
369
+    </div>
370
+</div>

+ 58 - 4
css/all.css

@@ -1693,7 +1693,7 @@ li.cabecera_li {
1693 1693
 }
1694 1694
 .content-section .main h1 {
1695 1695
     font-size: 27px;
1696
-    padding: 0 15px 30px;
1696
+    padding: 0 15px;
1697 1697
     color: #949494;
1698 1698
 }
1699 1699
 .main .panel a {
@@ -1930,9 +1930,9 @@ label {
1930 1930
     transition: all 0.3s;
1931 1931
 }
1932 1932
 .tabs_pruebas .test_tab p{
1933
-    margin: 0;
1933
+    margin: 0!important;
1934 1934
     letter-spacing: 9px;
1935
-    color: #fff;
1935
+    color: #fff!important;
1936 1936
 }
1937 1937
 .tabs_pruebas .test_tab:hover {
1938 1938
     background: #f81919;
@@ -1943,7 +1943,7 @@ label {
1943 1943
 }
1944 1944
 .comportamiento_body {
1945 1945
     display: block;
1946
-    margin-bottom: 80px;
1946
+    margin-bottom: 10px;
1947 1947
 }
1948 1948
 .personalidad_body {
1949 1949
     display: none;
@@ -2006,4 +2006,58 @@ label {
2006 2006
     position: relative;
2007 2007
     top: -2px;
2008 2008
     color: #fd4b4b;
2009
+}
2010
+.content-section .main p {
2011
+    color: #878787;
2012
+    padding: 0 15px;
2013
+    margin-bottom: 40px;
2014
+}
2015
+.datos_candidato {
2016
+    margin-bottom: 40px;
2017
+}
2018
+.datos_candidato label {
2019
+    font-size: 14px;
2020
+    color: #878787;
2021
+}
2022
+.datos_candidato select {
2023
+    border: 1px solid #d0d0d0;
2024
+    width: 100%;
2025
+    padding: 10px;
2026
+    color: #878787;
2027
+    cursor: pointer;
2028
+}
2029
+.datos_candidato input {
2030
+    border: 1px solid #d0d0d0;
2031
+    width: 100%;
2032
+    padding: 9px;
2033
+    color: #878787;
2034
+}
2035
+.botones_interactivos_asignar {
2036
+    text-align: right;
2037
+    margin-bottom: 50px;
2038
+}
2039
+.botones_interactivos_asignar a{
2040
+    font-size: 14px;
2041
+    color: #fd4b4b;
2042
+    transition: all 0.3s;
2043
+}
2044
+.botones_interactivos_asignar a:hover {
2045
+    color: #981111;
2046
+    transition: all 0.3s;
2047
+}
2048
+.botones_interactivos_asignar button {
2049
+    border: 1px solid #fd4b4b;
2050
+    color: #fff;
2051
+    background: #fd4b4b;
2052
+    padding: 10px 55px;
2053
+    font-size: 14px;
2054
+    position: relative;
2055
+    cursor: pointer;
2056
+    transition: all 0.3s;
2057
+}
2058
+.botones_interactivos_asignar button:hover {
2059
+    border: 1px solid #fd4b4b;
2060
+    color: #fd4b4b;
2061
+    background: transparent;
2062
+    transition: all 0.3s;
2009 2063
 }

+ 0 - 69
header.php

@@ -13,75 +13,6 @@
13 13
 
14 14
                     <div class="collapse navbar-collapse" id="navbarSupportedContent">
15 15
                         <ul class="nav navbar-nav ml-auto">
16
-                            <li id="mensajes" class="nav-item">
17
-                                <a class="nav-link" id="dropdownMensajes" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="far fa-envelope-open"></i></a>
18
-                                <div class="dropdown-menu dropdown-menu-right dropdown_noti" aria-labelledby="dropdownMensajes">
19
-                                    <div class="body_drop_message" tooltip-location="top" tooltip-animate tooltip="Hola, necesito asistencia en una de las secciones del sistema.">
20
-                                        <div class="row">
21
-                                            <div class="col-md-2">
22
-                                                <div class="rounded-pic">
23
-                                                    <img src="images/man_2.png" alt="">
24
-                                                </div>
25
-                                            </div>
26
-                                            <div class="col-md-6">
27
-                                                <h1>John Doe</h1>
28
-                                                <p>Hola, necesito asistencia en una de las secciones del sistema.</p>
29
-                                            </div>
30
-                                            <div class="col-md-4 panel_time_notification">
31
-                                                <a href="mensajes.php"><p>Hace 10 minutos.</p></a>
32
-                                            </div>
33
-                                        </div>
34
-                                    </div>
35
-                                    <div class="body_drop_message" tooltip-location="top" tooltip-animate tooltip="Hola, necesito una reunión con el gerente general.">
36
-                                        <div class="row">
37
-                                            <div class="col-md-2">
38
-                                                <div class="rounded-pic">
39
-                                                    <img src="images/man_2.png" alt="">
40
-                                                </div>
41
-                                            </div>
42
-                                            <div class="col-md-6">
43
-                                                <h1>The Rock</h1>
44
-                                                <p>Hola, necesito una reunión con el gerente general.</p>
45
-                                            </div>
46
-                                            <div class="col-md-4 panel_time_notification">
47
-                                                <a href="mensajes.php"><p>Hace 22 minutos.</p></a>
48
-                                            </div>
49
-                                        </div>
50
-                                    </div>
51
-                                    <div class="body_drop_message" tooltip-location="top" tooltip-animate tooltip="Hola, estoy buscando a la persona que secuestró a mi perro.">
52
-                                        <div class="row">
53
-                                            <div class="col-md-2">
54
-                                                <div class="rounded-pic">
55
-                                                    <img src="images/man_2.png" alt="">
56
-                                                </div>
57
-                                            </div>
58
-                                            <div class="col-md-6">
59
-                                                <h1>John Whick</h1>
60
-                                                <p>Hola, estoy buscando a la persona que secuestró a mi perro.</p>
61
-                                            </div>
62
-                                            <div class="col-md-4 panel_time_notification">
63
-                                                <a href="mensajes.php"><p>Hace 10 minutos.</p></a>
64
-                                            </div>
65
-                                        </div>
66
-                                    </div>
67
-                                    <div class="body_drop_message" tooltip-location="top" tooltip-animate tooltip="Hola, necesito realizar una queja con el departamento de taller, mi ferrari falló.">
68
-                                        <div class="row">
69
-                                            <div class="col-md-2">
70
-                                                <div class="rounded-pic">
71
-                                                    <img src="images/man_2.png" alt="">
72
-                                                </div>
73
-                                            </div>
74
-                                            <div class="col-md-6">
75
-                                                <h1>Paul Walker</h1>
76
-                                                <p>Hola, necesito realizar una queja con el departamento de taller, mi ferrari falló.</p>
77
-                                            </div>
78
-                                            <div class="col-md-4 panel_time_notification">
79
-                                                <a href="mensajes.php"><p>Hace 10 minutos.</p></a>
80
-                                            </div>
81
-                                        </div>
82
-                                    </div>
83
-                                </div>
84
-                            </li>
85 16
                             <li class="nav-item">
86 17
                                 <a class="nav-link" id="dropdownNotificaciones" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="far fa-bell"></i></a>
87 18
                                 <div class="dropdown-menu dropdown-menu-right dropdown_noti" aria-labelledby="dropdownNotificaciones">

+ 1 - 0
pruebas.php

@@ -13,6 +13,7 @@
13 13
     $(document).ready(function () {
14 14
         $(".list-unstyled").find('li').removeClass("active");
15 15
         $("#pruebas").addClass("active");
16
+        $("#listado").addClass("active");
16 17
     });
17 18
 </script>
18 19
 <?php include('sidebar.php') ?>       

+ 5 - 5
sidebar.php

@@ -52,16 +52,16 @@
52 52
                 <li id="pruebas">
53 53
                     <a href="#pageSubmenu2" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle"><i class="fas fa-paperclip"></i>Pruebas</a>
54 54
                     <ul class="collapse list-unstyled" id="pageSubmenu2">
55
-                        <li>
55
+                        <li id="listado">
56 56
                             <a href="pruebas.php">Listado de pruebas</a>
57 57
                         </li>
58
-                        <li>
59
-                            <a href="#">Aplicar</a>
58
+                        <li id="aplicar">
59
+                            <a href="asignar.php">Aplicar</a>
60 60
                         </li>
61
-                        <li>
61
+                        <li id="respuestas">
62 62
                             <a href="#">Respuestas</a>
63 63
                         </li>
64
-                        <li>
64
+                        <li id="calificaciones">
65 65
                             <a href="#">Calificaciones</a>
66 66
                         </li>
67 67
                     </ul>