Agenda Online

Widget público para que pacientes reserven horas directamente desde la web de tu centro, con integración de pago Flow. Cubre desde la selección de sucursal y terapeuta hasta el cobro online y la creación automática de la factura/pago en Lexa.

1. Activar la agenda online

Como administrador, ve a Configuración → Agenda Online y activa la opción principal. Completa los parámetros básicos:

Para que el widget muestre horarios disponibles, cada terapeuta debe tener:

• Horario configurado en Terapeutas → → Agenda.
• Marcado como "bookeable online".

Cada servicio que quieras exponer debe estar marcado como "bookeable online" en Servicios → .

2. Código para insertar en tu web

En Configuración → Agenda Online encuentras el código de embed listo para copiar. Es un <iframe> como este:

<iframe
  src="https://lexaterapias.com/Book/tu-slug"
  width="100%"
  height="700"
  frameborder="0"
  style="border:none;">
</iframe>

Reemplaza tu-slug por el slug que ves en la página de configuración (normalmente es el nombre de tu empresa en minúsculas y sin espacios).

Pégalo en cualquier bloque HTML / "custom HTML" de tu página web (WordPress, Wix, Squarespace, HTML plano). El widget se adapta al contenedor.

3. Flujo de reserva paso a paso

1. Paciente abre tu sitio (ej. cognitivo.cl) → ve el widget embebido
2. Elige sucursal, servicio, terapeuta, fecha, hora
3. Llena datos personales (nombre, RUT, teléfono, email)
4. Confirma la reserva
   → Se crea el Appointment en Lexa con estado "Programado"
5. Si tu agenda exige pago online:
   (a) Paciente hace clic en "Pagar ahora"
   (b) Redirigido a flow.cl → paga con tarjeta/transferencia
   (c) Flow confirma el pago al servidor de Lexa (webhook interno)
   (d) Lexa crea automáticamente el Invoice + Payment
   (e) Flow redirige al paciente a la URL de retorno que configuraste

4. URL de retorno tras el pago

Por defecto, después de pagar, el paciente vuelve a la página de confirmación de Lexa (lexaterapias.com/Book/PaymentResult). Si prefieres que regrese a tu propio dominio (ej. cognitivo.cl/pago-confirmado), completa el campo "URL de retorno tras el pago" en la configuración.

• Si queda vacío → se mantiene el comportamiento por defecto (página de Lexa).
• Si ingresas una URL → Flow redirige allí después del pago.

Qué envía Flow a tu URL

Flow hace una llamada POST a tu URL con un campo en el form body:

Tu página debe estar preparada para aceptar esa petición POST. Si solo quieres mostrar un mensaje de "Gracias por tu pago" una página estática alcanza — pero si quieres mostrar el detalle del pago (monto, sucursal, servicio, etc.) necesitas consultar el estado a la API de Lexa con ese token.

Endpoint de consulta de estado

GET  https://lexaterapias.com/Book/PaymentResult?handler=CheckStatus&token={TOKEN}

Responde JSON:

{ "status": "paid" }   // paid | pending | rejected | cancelled | unknown

5. Ejemplo: página de retorno en WordPress

La forma más simple con WordPress es crear una página (ej. /pago-confirmado) y agregar un bloque de HTML personalizado con JavaScript que consulte el estado y actualice la vista.

Opción A — WordPress con bloque HTML (sin PHP)

Ventaja: no necesitas tocar el servidor ni plugins de código. Desventaja: el status se consulta desde el navegador, no desde PHP.

1. Crea una página en WordPress: Páginas → Añadir → Título "Pago confirmado" (la URL quedará tipo cognitivo.cl/pago-confirmado/).
2. En Lexa, configura URL de retorno = https://cognitivo.cl/pago-confirmado/.
3. En la página, agrega un bloque HTML personalizado con este contenido:

<div id="pagoBox" style="max-width:560px;margin:40px auto;padding:32px;border:1px solid #e5e7eb;border-radius:12px;text-align:center;font-family:system-ui,sans-serif;">
  <div id="pagoIcon" style="font-size:48px;margin-bottom:12px;">⏳</div>
  <h2 id="pagoTitle" style="margin:0 0 8px;">Verificando tu pago...</h2>
  <p id="pagoMsg" style="color:#6b7280;margin:0;">Un momento por favor</p>
  <div id="pagoDetalle" style="display:none;margin-top:24px;text-align:left;"></div>
  <a href="/" style="display:inline-block;margin-top:24px;padding:10px 20px;background:#6D28D9;color:#fff;border-radius:8px;text-decoration:none;">Volver al inicio</a>
</div>

<script>
(function(){
  // 1. Rescatar token: Flow lo manda por POST, WordPress puede recibirlo como query
  //    gracias al plugin (opción B) o podemos rescatarlo de la querystring si se configura asi.
  //    Fallback: leer de sessionStorage si se setea desde otro paso.
  const params = new URLSearchParams(window.location.search);
  let token = params.get('token');

  // Si Flow hizo POST directo, el token estara en el body; lo dejamos vacio y mostramos mensaje generico.
  if (!token) {
    document.getElementById('pagoTitle').textContent = '¡Gracias por tu pago!';
    document.getElementById('pagoMsg').textContent = 'Recibiras la confirmacion en tu correo en los proximos minutos.';
    document.getElementById('pagoIcon').textContent = '✅';
    return;
  }

  // 2. Consultar estado a la API de Lexa
  const apiUrl = 'https://lexaterapias.com/Book/PaymentResult?handler=CheckStatus&token=' + encodeURIComponent(token);

  let attempts = 0;
  const maxAttempts = 15;  // 15 * 3s = 45s

  function check() {
    attempts++;
    fetch(apiUrl)
      .then(r => r.json())
      .then(data => {
        if (data.status === 'paid') {
          document.getElementById('pagoTitle').textContent = '¡Pago confirmado!';
          document.getElementById('pagoMsg').textContent = 'Tu reserva quedo confirmada. Te enviamos los detalles al correo.';
          document.getElementById('pagoIcon').textContent = '✅';
        } else if (data.status === 'rejected' || data.status === 'cancelled') {
          document.getElementById('pagoTitle').textContent = 'Pago no completado';
          document.getElementById('pagoMsg').textContent = 'El pago no se proceso. Intenta nuevamente desde la pagina de reserva.';
          document.getElementById('pagoIcon').textContent = '❌';
        } else if (attempts < maxAttempts) {
          setTimeout(check, 3000);
        } else {
          document.getElementById('pagoTitle').textContent = 'Verificacion en curso';
          document.getElementById('pagoMsg').textContent = 'Tu pago se esta procesando. Recibiras confirmacion por correo.';
        }
      })
      .catch(() => {
        if (attempts < maxAttempts) setTimeout(check, 5000);
      });
  }

  check();
})();
</script>

Nota sobre el token: Flow envía el token en el body POST (no en la querystring). Si tu tema WordPress acepta POST sin redirigir, el token está en $_POST['token'] y puedes pasarlo al JS vía un bloque PHP. Si usas un hosting estándar (la mayoría) sin lógica de servidor en esa página, la página igual se renderiza pero sin token — el JS muestra un mensaje genérico de "Gracias por tu pago". Para detalle real del pago ve la opción B.

Opción B — WordPress con PHP (detalle completo)

Si tienes acceso a PHP (plugin como "Code Snippets" o un template custom), puedes rescatar el token del POST y consumir la API de Lexa desde el servidor para obtener el detalle:

<?php
// Colocar este PHP al inicio de la página (template o Code Snippet con tag php)
$token = $_POST['token'] ?? $_GET['token'] ?? null;
$statusData = null;

if ($token) {
    $apiUrl = 'https://lexaterapias.com/Book/PaymentResult?handler=CheckStatus&token=' . urlencode($token);
    $response = wp_remote_get($apiUrl, ['timeout' => 10]);
    if (!is_wp_error($response)) {
        $statusData = json_decode(wp_remote_retrieve_body($response), true);
    }
}
?>

<div style="max-width:560px;margin:40px auto;padding:32px;border:1px solid #e5e7eb;border-radius:12px;text-align:center;font-family:system-ui,sans-serif;">
  <?php if ($statusData && $statusData['status'] === 'paid'): ?>
      <div style="font-size:48px;margin-bottom:12px;">✅</div>
      <h2 style="margin:0 0 8px;">¡Pago confirmado!</h2>
      <p style="color:#6b7280;margin:0;">Tu reserva quedo confirmada. Te enviamos los detalles al correo.</p>
  <?php elseif ($statusData && ($statusData['status'] === 'rejected' || $statusData['status'] === 'cancelled')): ?>
      <div style="font-size:48px;margin-bottom:12px;">❌</div>
      <h2>Pago no completado</h2>
      <p>El pago no se proceso. Intenta nuevamente desde la pagina de reserva.</p>
  <?php elseif ($statusData): ?>
      <div style="font-size:48px;margin-bottom:12px;">⏳</div>
      <h2>Verificacion en curso</h2>
      <p>Tu pago se esta procesando. Recibiras confirmacion por correo.</p>
  <?php else: ?>
      <div style="font-size:48px;margin-bottom:12px;">✅</div>
      <h2>¡Gracias por tu pago!</h2>
      <p>Recibiras la confirmacion en tu correo en los proximos minutos.</p>
  <?php endif; ?>

  <a href="/" style="display:inline-block;margin-top:24px;padding:10px 20px;background:#6D28D9;color:#fff;border-radius:8px;text-decoration:none;">Volver al inicio</a>
</div>

6. Preguntas frecuentes

¿Si el paciente cierra el navegador después de pagar, la cita queda confirmada?

Sí. Lexa recibe la confirmación del pago directamente desde el servidor de Flow (vía webhook interno), independiente de que el navegador del paciente vuelva o no a tu URL de retorno. La URL de retorno es solo para la experiencia visual del usuario.

¿El email de confirmación lo manda Lexa o Flow?

Ambos. Flow envía un comprobante de pago (con el logo y datos del comercio). Lexa envía un email con los detalles de la cita (terapeuta, fecha, sucursal, dirección).

¿Puedo tener una URL de retorno distinta por sucursal?

No. La URL de retorno es por empresa, no por sucursal. Si manejas varios dominios y necesitas ruteo distinto, usa una sola URL de retorno que internamente (en tu servidor) decida a dónde mandar al usuario según los datos que recuperes con el token.

¿Qué pasa si desactivo la agenda online temporalmente?

El widget muestra un mensaje de "agenda no disponible". Los pagos y citas existentes no se ven afectados.