166 lines
8.2 KiB
HTML
166 lines
8.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/boxicons@latest/css/boxicons.min.css'>
|
|
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
|
|
<link rel="stylesheet" href="../css/inicio.css">
|
|
<link rel="stylesheet" href="../font/bootstrap-icons.css">
|
|
<link rel="stylesheet" href="../css/consultar-api.css">
|
|
<title>API Candidatos</title>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- SIDEBAR -->
|
|
<section id="sidebar">
|
|
<a href="inicio.html" class="brand"><i class='bx bx-code-alt icon' ></i> LANIA</a>
|
|
|
|
<ul class="side-menu">
|
|
<li><a href="inicio.html"><i class='bx bxs-dashboard icon' ></i>Dashboard</a></li>
|
|
<li><a href="formulario-candidato.html" target="_blank"><i class='bx bxs-dashboard icon' ></i>Formulario de registro</a></li>
|
|
<li><a href="control-candidatos.php"><i class='bx bxs-dashboard icon' ></i>Control candidatos</a></li>
|
|
<li><a href="control-usuarios.php"><i class='bx bxs-dashboard icon' ></i>Control usuario</a></li>
|
|
<li><a href="consultar-api.html" class="active"><i class='bx bxs-data icon' ></i>API</a></li>
|
|
<li><a href="../controllers/cerrarSesion.php"><i class="bi bi-box-arrow-left icon"></i>Cerrar sesión</a></li>
|
|
</ul>
|
|
|
|
|
|
</section>
|
|
<!-- .SIDEBAR -->
|
|
|
|
|
|
<section id="content">
|
|
<!-- ========== MAIN ========== -->
|
|
<main>
|
|
|
|
<h1 class="title" style="margin: 2% 1%">API Candidatos</h1>
|
|
<div class="row">
|
|
<div class="col-md-6 mb-4">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h5>Credenciales del Cliente</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<form id="oauth-form">
|
|
<div class="mb-3">
|
|
<label for="clientId" class="form-label">Client ID</label>
|
|
<input type="text" class="form-control" id="clientId" required />
|
|
</div>
|
|
<div class="mb-3">
|
|
<label for="clientSecret" class="form-label">Client Secret</label>
|
|
<input type="password" class="form-control" id="clientSecret" required />
|
|
</div>
|
|
<button type="submit" class="btn btn-primary">Obtener Token</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-6 mb-4">
|
|
<div class="card" id="token-card">
|
|
<div class="card-header">
|
|
<h5>Estado de Autenticación</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div id="token-section" class="hidden">
|
|
<div class="success-message">
|
|
<p><strong>✓ Autenticación exitosa</strong></p>
|
|
<p><strong>Token tipo:</strong> <span id="token-type">-</span></p>
|
|
<p><strong>Token válido por:</strong> <span id="expires-in">-</span> segundos</p>
|
|
<p><small class="text-muted">El token de acceso se ha guardado de forma segura</small></p>
|
|
</div>
|
|
<button id="get-candidates" class="btn btn-success">Obtener Candidatos</button>
|
|
</div>
|
|
<div id="no-token-message">
|
|
<p class="text-muted">Ingrese sus credenciales y haga clic en "Obtener Token" para comenzar.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-12">
|
|
<div class="card" id="result-card">
|
|
<div class="card-header">
|
|
<h5>Resultados</h5>
|
|
</div>
|
|
<div class="card-body">
|
|
<div id="download-section" class="download-section hidden">
|
|
<h6 class="mb-3">📥 Descargar Datos</h6>
|
|
<div class="download-buttons">
|
|
<button id="download-json" class="btn btn-outline-primary download-btn">
|
|
JSON
|
|
</button>
|
|
<button id="download-csv" class="btn btn-outline-success download-btn">
|
|
CSV
|
|
</button>
|
|
<button id="download-excel" class="btn btn-outline-info download-btn">
|
|
Excel
|
|
</button>
|
|
</div>
|
|
<small class="text-muted d-block mt-2">
|
|
Total de registros: <span id="records-count">0</span>
|
|
</small>
|
|
</div>
|
|
|
|
<div id="candidates-section" class="hidden">
|
|
<h4 class="mb-3">Lista de Candidatos</h4>
|
|
<div class="table-responsive">
|
|
<table class="table table-striped table-bordered">
|
|
<thead>
|
|
<tr>
|
|
<th>ID</th>
|
|
<th>Nombre</th>
|
|
<th>Correo</th>
|
|
<th>Teléfono</th>
|
|
<th>Género</th>
|
|
<th>Rango Edad</th>
|
|
<th>Tipo Identificación</th>
|
|
<th>País</th>
|
|
<th>Estado</th>
|
|
<th>Municipio</th>
|
|
<th>Colonia</th>
|
|
<th>Nivel Estudio</th>
|
|
<th>Giro</th>
|
|
<th>Empresa/Institución</th>
|
|
<th>ID Examen</th>
|
|
<th>Nombre Examen</th>
|
|
<th>Motivo</th>
|
|
<th>Calificación</th>
|
|
<th>Consentimiento Publicidad</th>
|
|
<th>Fecha Entrada</th>
|
|
<th>Fecha Salida</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="candidates-table-body"></tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div id="api-response-section" class="hidden">
|
|
<h4 class="mb-3">Respuesta JSON</h4>
|
|
<pre id="api-response">Esperando respuesta...</pre>
|
|
</div>
|
|
<div id="error-section" class="hidden">
|
|
<div class="alert alert-danger" id="error-message"></div>
|
|
</div>
|
|
<div id="no-results-message">
|
|
<p class="text-muted">Obtenga un token y haga una solicitud para ver los resultados aquí.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
<!-- .......... MAIN .......... -->
|
|
</section>
|
|
|
|
|
|
<!-- <script src="assets/bootstrap/js/bootstrap.min.js"></script> -->
|
|
<script src="../js/consultar-api.js"></script>
|
|
<script src="../js/sidebar-navbar.js"></script>
|
|
<script src="../js/control-candidato.js"></script>
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>
|
|
|
|
<!-- <script src="https://website-widgets.pages.dev/dist/sienna.min.js" defer></script> -->
|
|
</body>
|
|
</html> |