Requisitos de Certificación PSE
Las seis pantallas que PSE revisa durante la certificación. Las tablas describen los elementos típicos de cada pantalla — el diseño visual (iconos, títulos, layout, colores) queda a discreción del comercio. Solo los elementos listados como Obligatorio son requeridos para aprobar. Los textos marcados como literales deben aparecer exactamente como están escritos, y la información de contacto de ejemplo (+57 314 7258728, servicioasociado@viboral.tv) debe reemplazarse con los datos reales de servicio al cliente del comercio.
Pantalla 1 — Formulario de pago
Disparador: Estado inicial del checkout.
| Elemento | Descripción |
|---|---|
| Título | Datos para el pago PSE |
| Resumen | Tarjeta con Referencia y Valor a pagar (COP) |
| Campos | Tipo de persona, Tipo de documento, Número de documento (máx. 15), Nombre completo (máx. 64), Correo electrónico (máx. 120), Número de celular (máx. 10), Dirección (máx. 64), Entidad bancaria (typeahead) |
| Botón | Ir al banco (deshabilitado mientras envía: Procesando...) |
| Comportamiento | Persona Jurídica → NIT auto-seleccionado; Persona Natural → todos los tipos excepto NIT |
Obligatorio: recolectar los ocho campos listados y aplicar el comportamiento de Persona Natural/Jurídica.
Datos para el pago PSE
Pantalla 2 — Creando transacción
Disparador: Después del submit, esperando el proof registered. Al recibirlo, el navegador redirige automáticamente — sin acción del usuario.
| Elemento | Descripción |
|---|---|
| Spinner | Centrado |
| Título | Creando transacción |
| Cuerpo | Estamos preparando tu pago con el banco. |
| Botón | Cancelar (fantasma, regresa al formulario) |
Al recibir registered | window.location.href = pseUrl |
Obligatorio: redirigir automáticamente al recibir registered (nunca un botón manual). La redirección debe ocurrir en la misma ventana/pestaña — PSE prohíbe iframes o ventanas nuevas. Persistir intentHandle, bankName y amount antes de redirigir.
Creando transacción
Estamos preparando tu pago con el banco. Serás redirigido en un momento.
Pantalla 3 — Error temprano
Disparador: Proof failed llega antes de registered. Si llega después del regreso del banco, es Pantalla 5.
| Elemento | Descripción |
|---|---|
| Icono | Indicador de error |
| Título | Error |
| Cuerpo (A) | custom.detail = FAIL_EXCEEDEDLIMIT: "El monto de la transacción excede los límites establecidos. Por favor comuníquese con nuestras líneas de atención al cliente." |
| Cuerpo (B) | Cualquier otro detail: "No se pudo crear la transacción. Por favor intente más tarde o comuníquese con nuestras líneas de atención al cliente." |
| Contacto | Teléfono y Correo del comercio |
| Botón | Intentar de nuevo (reinicia el formulario) |
Obligatorio: mostrar el mensaje de error según custom.detail, mostrar teléfono y correo de contacto, y ofrecer al usuario una forma de reintentar.
Error
El monto excede los límites establecidos. Comunícate con atención al cliente.
Pantalla 4 — Procesando pago (PENDIENTE)
Disparador: Cliente llegó a la página de retorno; el proof final aún no llega.
| Elemento | Descripción |
|---|---|
| Spinner | Centrado |
| Título | Procesando pago |
| Info card | CUS (trazabilityCode), Banco, Valor (COP) |
| Callout PENDIENTE | Literal: "Su transacción está PENDIENTE. Por favor verifique si el débito fue realizado en el banco. Para consultas, comuníquese al teléfono +57 314 7258728 o al correo servicioasociado@viboral.tv" |
| Bloque verificación | Literal: "Esta página se actualizará automáticamente. Igualmente puede cerrar la ventana si desea y la transacción se confirmará en cuando se confirme el pago." |
| Contacto | Teléfono y Correo |
Obligatorio: los dos textos literales (callout PENDIENTE + bloque de verificación con la frase "puede cerrar la ventana"), teléfono y correo de contacto, y enviar el proof confirmed al montar la página exactamente una vez (proteger contra doble envío por StrictMode, recarga o navegación).
Procesando pago
Su transacción está PENDIENTE. Por favor verifique si el débito fue realizado en el banco. Para consultas, comuníquese al teléfono +57 314 7258728 o al correo servicioasociado@viboral.tv
Pantalla 5 — Pago rechazado
Disparador: Proof failed recibido después del regreso del banco (intent transiciona a rejected).
| Elemento | Descripción |
|---|---|
| Icono | Indicador de rechazo |
| Título | Pago rechazado |
| Cuerpo | La transacción no pudo ser procesada. Puedes intentar nuevamente. |
| Info card | CUS, Banco, Detalle (custom.detail literal, e.g., FAILED, NOT_AUTHORIZED) |
| Botón | Intentar de nuevo (enlaza a la raíz del checkout) |
Obligatorio: mostrar CUS, Banco y Detalle del rechazo, y ofrecer al usuario una forma de reintentar.
Pago rechazado
La transacción no pudo ser procesada. Puedes intentar nuevamente.
Pantalla 6 — Pago exitoso
Disparador: Proof prepared recibido. (committed y completed son estados posteriores de liquidación — no disparan esta pantalla.)
| Elemento | Descripción |
|---|---|
| Icono | Indicador de éxito |
| Título | Pago exitoso |
| Cuerpo | Su transacción ha sido procesada. Recibirá una notificación de confirmación en las siguientes 24 horas. |
| Info card | Referencia, Valor (COP), CUS (coreId preferido, trazabilityCode como fallback), Banco |
| Botón | Regresar al inicio |
Obligatorio: mostrar el comprobante con Referencia, Valor, CUS y Banco, y ofrecer al usuario una forma de regresar al inicio del comercio.
Pago exitoso
Su transacción ha sido procesada. Recibirá una notificación de confirmación en las siguientes 24 horas.
Siguiente paso
Una vez hayas validado los flujos de éxito y rechazo en sandbox y confirmado que las pantallas cumplen estos requisitos, el siguiente paso es coordinar con Kamin la certificación PSE y el paso a producción.
Historial de cambios
- Agregado• Version inicial