133 lines
5.2 KiB
HTML
133 lines
5.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Registro - Demo</title>
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body {
|
|
font-family: Arial, sans-serif;
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
min-height: 100vh;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.container {
|
|
background: white;
|
|
padding: 40px;
|
|
border-radius: 10px;
|
|
box-shadow: 0 10px 40px rgba(0,0,0,0.2);
|
|
max-width: 400px;
|
|
width: 100%;
|
|
}
|
|
h1 { margin-bottom: 20px; color: #333; }
|
|
input, select {
|
|
width: 100%;
|
|
padding: 12px;
|
|
margin-bottom: 15px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 5px;
|
|
}
|
|
.btn {
|
|
width: 100%;
|
|
padding: 12px;
|
|
background: #667eea;
|
|
color: white;
|
|
border: none;
|
|
border-radius: 5px;
|
|
cursor: pointer;
|
|
font-size: 16px;
|
|
}
|
|
.btn:hover { background: #5568d3; }
|
|
a { color: #667eea; text-decoration: none; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<h1>📝 Registrarse</h1>
|
|
<form id="registerForm">
|
|
<input type="email" id="email" placeholder="Email" required>
|
|
<input type="password" id="password" placeholder="Contraseña" required>
|
|
<select id="plan">
|
|
<option value="base" {% if plan == 'base' %}selected{% endif %}>Base</option>
|
|
<option value="pro" {% if plan == 'pro' %}selected{% endif %}>Pro</option>
|
|
<option value="premium" {% if plan == 'premium' %}selected{% endif %}>Premium</option>
|
|
</select>
|
|
<select id="rubro">
|
|
<option value="gimnasio" {% if rubro == 'gimnasio' or rubro == 'gimnasios' %}selected{% endif %}>Gimnasio</option>
|
|
<option value="restaurante" {% if rubro == 'restaurante' %}selected{% endif %}>Restaurante</option>
|
|
<option value="danza" {% if rubro == 'danza' %}selected{% endif %}>Danza</option>
|
|
<option value="cosmeticos" {% if rubro == 'cosmeticos' %}selected{% endif %}>Cosméticos</option>
|
|
<option value="despachos" {% if rubro == 'despachos' %}selected{% endif %}>Despachos</option>
|
|
<option value="educacion" {% if rubro == 'educacion' %}selected{% endif %}>Educación</option>
|
|
<option value="tienda" {% if rubro == 'tienda' %}selected{% endif %}>Tienda</option>
|
|
</select>
|
|
<button type="submit" class="btn">Registrarse</button>
|
|
</form>
|
|
<p style="text-align: center; margin-top: 15px;">
|
|
<a href="/login">¿Ya tienes cuenta? Inicia sesión</a>
|
|
</p>
|
|
</div>
|
|
|
|
<script>
|
|
document.getElementById('registerForm').addEventListener('submit', async (e) => {
|
|
e.preventDefault();
|
|
|
|
const email = document.getElementById('email').value;
|
|
const password = document.getElementById('password').value;
|
|
const plan = document.getElementById('plan').value;
|
|
const rubro = document.getElementById('rubro').value;
|
|
|
|
if (!email || !password) {
|
|
alert('❌ Por favor completa email y contraseña');
|
|
return;
|
|
}
|
|
|
|
const data = {
|
|
email: email,
|
|
password: password,
|
|
plan: plan,
|
|
rubro: rubro
|
|
};
|
|
|
|
console.log('Enviando registro:', data);
|
|
|
|
try {
|
|
const res = await fetch('/register', {
|
|
method: 'POST',
|
|
headers: {'Content-Type': 'application/json'},
|
|
body: JSON.stringify(data)
|
|
});
|
|
|
|
console.log('Respuesta del servidor:', res.status, res.statusText);
|
|
|
|
let result;
|
|
try {
|
|
result = await res.json();
|
|
} catch (e) {
|
|
// Si no es JSON, el servidor devolvió HTML (error 500)
|
|
const text = await res.text();
|
|
console.error('❌ Servidor devolvió HTML en vez de JSON:', text.substring(0, 200));
|
|
alert('❌ Error del servidor. Revisa la consola para más detalles.');
|
|
return;
|
|
}
|
|
|
|
console.log('Resultado:', result);
|
|
|
|
if (result.success) {
|
|
// Registro exitoso - mostrar mensaje y redirigir al login
|
|
alert(result.message || '✅ Registro exitoso. Por favor inicia sesión.');
|
|
window.location.href = result.redirect || '/login';
|
|
} else {
|
|
alert('❌ Error: ' + (result.error || 'Error al registrarse'));
|
|
}
|
|
} catch (error) {
|
|
console.error('Error en registro:', error);
|
|
alert('❌ Error de conexión. Verifica la consola para más detalles.');
|
|
}
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|