forked from val-lop20/Pagina-de-Asistencia-MAC
184 lines
7.1 KiB
HTML
184 lines
7.1 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="es">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>API Documentation - Sistema MAC</title>
|
||
<style>
|
||
body {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||
max-width: 1200px;
|
||
margin: 0 auto;
|
||
padding: 20px;
|
||
background: #f5f5f5;
|
||
}
|
||
.header {
|
||
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
||
color: white;
|
||
padding: 40px;
|
||
border-radius: 10px;
|
||
margin-bottom: 30px;
|
||
}
|
||
.endpoint {
|
||
background: white;
|
||
padding: 20px;
|
||
margin-bottom: 15px;
|
||
border-radius: 8px;
|
||
border-left: 4px solid #667eea;
|
||
}
|
||
.method {
|
||
display: inline-block;
|
||
padding: 4px 12px;
|
||
border-radius: 4px;
|
||
font-weight: bold;
|
||
font-size: 12px;
|
||
margin-right: 10px;
|
||
}
|
||
.GET { background: #28a745; color: white; }
|
||
.POST { background: #007bff; color: white; }
|
||
.PUT { background: #ffc107; color: black; }
|
||
.DELETE { background: #dc3545; color: white; }
|
||
code {
|
||
background: #f4f4f4;
|
||
padding: 2px 6px;
|
||
border-radius: 3px;
|
||
font-family: 'Courier New', monospace;
|
||
}
|
||
.auth-badge {
|
||
display: inline-block;
|
||
padding: 4px 10px;
|
||
background: #ff6b6b;
|
||
color: white;
|
||
border-radius: 4px;
|
||
font-size: 11px;
|
||
margin-left: 10px;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="header">
|
||
<h1>📚 API Documentation</h1>
|
||
<p>Sistema de Asistencia MAC - FES Acatlán UNAM</p>
|
||
<p><strong>Version:</strong> 1.0.0 | <strong>Base URL:</strong> /api/</p>
|
||
</div>
|
||
|
||
<div class="endpoint">
|
||
<h2>🔐 Authentication Endpoints</h2>
|
||
|
||
<h3><span class="method POST">POST</span> /api/auth/login/</h3>
|
||
<p>Iniciar sesión con número de cuenta</p>
|
||
<pre><code>{
|
||
"account_number": "12345678"
|
||
}</code></pre>
|
||
|
||
<h3><span class="method GET">GET</span> /api/auth/profile/ <span class="auth-badge">AUTH</span></h3>
|
||
<p>Obtener perfil del usuario autenticado</p>
|
||
|
||
<h3><span class="method POST">POST</span> /api/auth/token/refresh/</h3>
|
||
<p>Refrescar access token</p>
|
||
|
||
<h3><span class="method POST">POST</span> /api/auth/logout/</h3>
|
||
<p>Cerrar sesión del usuario</p>
|
||
</div>
|
||
|
||
<div class="endpoint">
|
||
<h2>📅 Events Endpoints</h2>
|
||
|
||
<h3><span class="method GET">GET</span> /api/events/</h3>
|
||
<p>Listar todos los eventos activos</p>
|
||
|
||
<h3><span class="method GET">GET</span> /api/events/{id}/</h3>
|
||
<p>Obtener detalles de un evento específico</p>
|
||
</div>
|
||
|
||
<div class="endpoint">
|
||
<h2>✅ Attendance Endpoints</h2>
|
||
|
||
<h3><span class="method POST">POST</span> /api/attendance/ <span class="auth-badge">AUTH</span></h3>
|
||
<p>Registrar asistencia a un evento (solo asistentes)</p>
|
||
<pre><code>{
|
||
"event_id": 1,
|
||
"account_number": "12345678"
|
||
}</code></pre>
|
||
|
||
<h3><span class="method GET">GET</span> /api/attendance/stats/?account_number=12345678 <span class="auth-badge">AUTH</span></h3>
|
||
<p>Obtener estadísticas de asistencia de un estudiante</p>
|
||
|
||
<h3><span class="method GET">GET</span> /api/attendance/my/?account_number=12345678 <span class="auth-badge">AUTH</span></h3>
|
||
<p>Obtener lista de asistencias del estudiante</p>
|
||
|
||
<h3><span class="method GET">GET</span> /api/attendance/recent/ <span class="auth-badge">AUTH</span></h3>
|
||
<p>Obtener asistencias recientes (solo asistentes)</p>
|
||
</div>
|
||
|
||
<div class="endpoint">
|
||
<h2>🔑 Authentication</h2>
|
||
<p>La API utiliza <strong>JWT (JSON Web Tokens)</strong> para autenticación.</p>
|
||
<p>Para endpoints que requieren autenticación, incluye el header:</p>
|
||
<pre><code>Authorization: Bearer <your_access_token></code></pre>
|
||
|
||
<h3>Flujo de autenticación:</h3>
|
||
<ol>
|
||
<li>Envía tu número de cuenta a <code>/api/auth/login/</code></li>
|
||
<li>Recibe <code>access_token</code> y <code>refresh_token</code></li>
|
||
<li>Usa el <code>access_token</code> en el header de las peticiones</li>
|
||
<li>Cuando expire (1 hora), usa el <code>refresh_token</code> en <code>/api/auth/token/refresh/</code></li>
|
||
</ol>
|
||
</div>
|
||
|
||
<div class="endpoint">
|
||
<h2>⚙️ System Configuration</h2>
|
||
|
||
<h3><span class="method GET">GET</span> /api/auth/system-config/ <span class="auth-badge">AUTH</span></h3>
|
||
<p>Obtener configuración del sistema (% mínimo, tiempos de registro, etc.)</p>
|
||
</div>
|
||
|
||
<div class="endpoint">
|
||
<h2>📖 Quick Links</h2>
|
||
<ul>
|
||
<li><a href="/api/">API Root (JSON)</a></li>
|
||
<li><a href="/admin/">Admin Panel</a></li>
|
||
<li><a href="/">Frontend Application</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="endpoint">
|
||
<h2>ℹ️ Response Codes</h2>
|
||
<table style="width: 100%; border-collapse: collapse;">
|
||
<tr style="background: #f8f9fa;">
|
||
<th style="padding: 10px; text-align: left; border-bottom: 2px solid #dee2e6;">Code</th>
|
||
<th style="padding: 10px; text-align: left; border-bottom: 2px solid #dee2e6;">Descripción</th>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;"><code>200</code></td>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;">Petición exitosa</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;"><code>201</code></td>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;">Recurso creado exitosamente</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;"><code>400</code></td>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;">Petición inválida (error en datos)</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;"><code>401</code></td>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;">No autenticado</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;"><code>403</code></td>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;">Sin permisos</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;"><code>404</code></td>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;">Recurso no encontrado</td>
|
||
</tr>
|
||
<tr>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;"><code>500</code></td>
|
||
<td style="padding: 10px; border-bottom: 1px solid #dee2e6;">Error del servidor</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
</body>
|
||
</html>
|