FormularioConstancias/index.php at master · elveon97/FormularioConstancias · GitHub

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
<!--
Buscar iconos para la version 4.0 de fontaweso [Version que se maneja en este sistema]
https://fontawesome.com/v4.7.0/icons/
-->

<?php
require_once "php/conexion.php";
$obj = new conectar();
$conexion = $obj -> conexion();

if($_POST){
  //Se reciben los parametros por _$GET
  $folio = $_POST['folio'];
  $result = mysqli_query($conexion, "SELECT constancia.folio, evento.nombre, cursante.nombre, fecha_emision, comentario FROM ((constancia INNER JOIN evento ON constancia.evento = evento.evento_id) INNER JOIN cursante ON constancia.cursante = cursante.cursante_id) WHERE folio = $folio");
}
?>
<!DOCTYPE html>

<html>

<head>
  <meta name="author" content="PracticantesServicioSocial">
  <meta charset="utf-8">

  <link rel="stylesheet" href="librerias/bootstrap/bootstrap.min.css">
  <link rel="stylesheet" type="text/css" href="librerias/fontawesome/css/font-awesome.css">
  <link rel="stylesheet" type="text/css" href="librerias/alertify/css/alertify.css">
  <link rel="stylesheet" type="text/css" href="librerias/alertify/css/themes/bootstrap.css">

  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
  <link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.5.2/css/buttons.dataTables.min.css">

  <script src="librerias/jquery.min.js"></script>
  <script src="librerias/bootstrap/popper.min.js"></script>
  <script src="librerias/bootstrap/bootstrap.min.js"></script>
  <script src="librerias/alertify/alertify.js"></script>

  <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>


  <script type="text/javascript">
  function visualizar(id){

    location.href="visorPdf.php?nombrePdf=archivosValidarCurso/"+id+"/validarCurso"+id+".pdf";
  }

  $(document).ready(function(){
    //Cuando se clicke el boton para buscar la constancia...
    $("#btnBuscarConstancia").click(function(){
      //Obtener el folio de la constancia
      var folioJS = $("#folioConstancia").val();
      if(folioJS == '') {
        alertify.error("Ingresa el folio de la constancia");
        $("#resultadoBusquedaConstancia").css("display", "none");
      }
      else{
        //Si el campo de la constancia no esta vacio hacer la busqueda de la constancia
        //Enviar al archivo consultarConstancia.php el folio para validar que existe la constancia...
        $.post("php/consultarConstancia.php", {"folio":folioJS}, function(data){
          //En el valor data se encuentra el resultado del json despues de haber sido procesado por el archivo consultarConstancia.
          if(data == 0){
            alertify.error("El folio de la constancia ingresado no se encuentra en la base de datos");
            $("#folioConstancia").val("");
            $("#resultadoBusquedaConstancia").css("display", "none");
          }
          else{
            $.post("php/getDatosConstancias.php", {"folio":data}, function(data){
              //Verificar que el curso se encuentre validado!
              if(data.existeDir == "False"){
                //Si no se encuentra valiado, mostrarle una alerta al usuario y en el apartado de ver validacion, mostrarle un mensaje:
                //"Este curso no esta validado!", pero si mostrarle el resto de datos de la constancia!
                alertify.warning("Este curso no esta validado");
                //Cargarle los datos a la tabla!
                while (data.folio.length < 8) data.folio = "0" + data.folio;
                $("#cuerpoTabla").html("");
                var tr = `<tr>
                  <td>`+data.folio+`</td>
                  <td>`+data.nombreEvento+`</td>
                  <td>`+data.nombreCursante+`</td>
                  <td>`+data.nombreInstancia+`</td>
                  <td>`+data.fechaInicio+`</td>
                  <td>`+data.fechaFin+`</td>
                  <td>`+data.fechaEmision+`</td>
                  <td>`+data.duracion+`</td>
                  <td>`+data.comentarios+`</td>
                  <td> <h5><span class="badge badge-warning">Este curso no esta validado</span></h5> </td>
                </tr>`;
                $("#cuerpoTabla").append(tr)
              }else{
                //Si el curso si se encuentra validado mostrar el icono de archivo para que pueda consultar la validacion del curso!
                alertify.success("Curso validado, click en el icono del archivo para ver validación");
                //Cargarle los datos a la tabla!
                while (data.folio.length < 8) data.folio = "0" + data.folio;
                $("#cuerpoTabla").html("");
                var tr = `<tr>
                  <td>`+data.folio+`</td>
                  <td>`+data.nombreEvento+`</td>
                  <td>`+data.nombreCursante+`</td>
                  <td>`+data.nombreInstancia+`</td>
                  <td>`+data.fechaInicio+`</td>
                  <td>`+data.fechaFin+`</td>
                  <td>`+data.fechaEmision+`</td>
                  <td>`+data.duracion+`</td>
                  <td>`+data.comentarios+`</td>
                  <td>

                      <span class="btn btn-primary btn-sm" onclick="visualizar('`+data.idEvento+`')">
                          <span class="fa fa-file"></span>
                      </span>

                  </td>
                </tr>`;
                $("#cuerpoTabla").append(tr)
              }
            },"json");
            //Mostrar el container de la tabla si el folio ingresado si se encuentra en la base de datos...
            $("#resultadoBusquedaConstancia").css("display", "block");
          }
        },"json");
      }//Cierre else

    });

    $('#tabla').DataTable({
      "language": {
        "sProcessing":     "Procesando...",
        "sLengthMenu":     "Mostrar _MENU_ registros",
        "sZeroRecords":    "No se encontraron resultados",
        "sEmptyTable":     "Ningún dato disponible en esta tabla",
        "sInfo":           "",
        "sInfoEmpty":      "",
        "sInfoFiltered":   "",
        "sInfoPostFix":    "",
        "sSearch":         "Buscar:",
        "sUrl":            "",
        "sInfoThousands":  ",",
        "sLoadingRecords": "Cargando...",
        "oPaginate": {
          "sFirst":    "",
          "sLast":     "",
          "sNext":     "",
          "sPrevious": ""
        },
        "oAria": {
          "sSortAscending":  ": Activar para ordenar la columna de manera ascendente",
          "sSortDescending": ": Activar para ordenar la columna de manera descendente"
        }
      },
      "searching": false,
      "bPaginate": false,
    });

  });


  </script>

  <title>Página de Inicio</title>

</head>

<body>

  <div class="container">
    <div class="row align-items-center justify-content-between">
      <div class="col-4">
        <img src="img/logo.jpg" alt="CUSur">
      </div>
      <div class="col-2">
        <!-- Substituir la referencia de index.php por el nombre final que tendra el archivo del login -->
        <a href="loguin.php" class="btn btn-info">
          <span class="fa fa-sign-in mr-1"></span>
          Iniciar Sesión
        </a>
      </div>
    </div>
  </div>

  <div class="container">

    <div class="row justify-content-center">
      <div class="col-4">
        <h3><span class="badge">Libro digital de constancias CUSUR</span></h3>
      </div>
    </div>

    <div class="row justify-content-center">
      <div class="w-75 col-8">
        <span class="text-justify">En el presente sistema encontraras registrados el total de reconocimientos, diplomas y Constancias
          emitidos en las diferentes dependencias del Centro Universitario del Sur, con el fin de consulta
          y validación de las mismas.
        </span>
      </div>
    </div>

    <div class="row justify-content-center">
      <div class="col-0" style="margin-top:4em;">
        <h4><span>Buscador</span></h4>
      </div>
    </div>

    <div class="form-group form-row justify-content-center">
      <label class="col-form-label" style="margin-rigth:0px;"><span class="fa fa-asterisk text-success" style="font-size:0.7rem;"></span>Número de Folio</label>
      <div class="col-4">
        <input id="folioConstancia" type="text" class="form-control" placeholder="Ingresa el número de folio de la constancia" name="folioConstancia" required>
      </div>
      <div class="col-1">
        <button type="submit" class="btn btn-primary" id="btnBuscarConstancia">Buscar constancia</button>
      </div>
    </div>
  </div>

  <div class="container float-left" id="resultadoBusquedaConstancia" style="display: none;">
    <div class="col-lg">
      <div class="card">
        <div class="card-header">
          <div class="card-body">
            <table id="tabla" class="display nowrap">
              <thead>
                <tr>
                  <th>Folio</th>
                  <th>Nombre capacitación</th>
                  <th>Nombre cursante</th>
                  <th>Instancia Emisora</th>
                  <th>Fecha Inicio Curso</th>
                  <th>Fecha Fin Curso</th>
                  <th>Fecha Emisión Constancia</th>
                  <th>Número de Horas</th>
                  <th>Comentarios</th>
                  <th>Ver validacion</th>
                </tr>
              </thead>
              <tbody id="cuerpoTabla">

              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>

  </div>


</body>

</html>