# Portal de Requisición de Vacantes · GLM

Frontend responsive en **Vite + React + TypeScript** para gestionar requisiciones, aprobaciones, reclutamiento, SLA y capacidad del equipo de RRHH de GomezLee Marketing.

## Ejecutar

Requiere Node.js 20.19+ o 22.12+.

```bash
npm install
npm run dev
```

Comandos de validación:

```bash
npm run lint
npm run check
npm run build
npm run preview
```

La aplicación se publica bajo `/requisicion-vacantes/`, configurado en `vite.config.ts` mediante:

```ts
base: '/requisicion-vacantes/'
```

## Experiencias disponibles

- **Dirección de RRHH:** tablero global, aprobaciones, detalle y audit trail, activación de reclutamiento, reportes con filtros y planeación de capacidad con reasignación.
- **Administración:** cola financiera, detalle de salario y presupuesto, aprobación o rechazo final.
- **Coordinación / Reclutamiento:** nueva requisición, borradores y estados, pipeline e historial de cada solicitud.
- **Acceso:** pantalla de Google simulada. El botón permite entrar al prototipo; no realiza autenticación real.

El selector de rol del encabezado permite recorrer las tres experiencias mientras se valida el frontend.

## Lógica representada

- Flujo secuencial: Solicitante → RRHH → Administración → activación por Dirección de RRHH → reclutamiento.
- El SLA inicia al enviar la requisición y separa tiempo de aprobación de tiempo de reclutamiento.
- Solicitudes con varias vacantes generan IDs individuales dentro de un ID de grupo.
- Solicitudes con fecha futura distante se evalúan como **cumple / no cumple**.
- Semáforo SLA verde, amarillo y rojo.
- Etapas: Búsqueda, 1.ª entrevista, 2.ª entrevista, Referencias, Exámenes médicos y Seleccionado.
- Datos financieros ocultos para Coordinación.
- Audit trail por requisición y notificaciones accionables.

## Preparación para Supabase y n8n

El prototipo utiliza datos demostrativos compactos y `sessionStorage` para que todos los flujos sean navegables sin backend. El estado está centralizado en `src/state/PortalContext.tsx`; el contrato de sustitución se encuentra en `src/services/portal-gateway.ts`.

Al integrar el backend:

1. Implementar `PortalGateway` con Supabase.
2. Reemplazar las operaciones de `PortalContext` por llamadas al gateway.
3. Resolver el rol desde la sesión de Google/Supabase y aplicar las políticas RLS equivalentes.
4. Disparar webhooks de n8n después de enviar, aprobar, rechazar, activar, reasignar o cerrar.
5. Sustituir los catálogos locales por tablas de países, ciudades, clientes, posiciones, feriados y SLA.

Variables sugeridas están documentadas en `.env.example`. Ninguna credencial debe incluirse en el repositorio.

## Estructura

```text
src/
  components/   Componentes de navegación, estados, modales y tableros
  data/         Catálogos y dataset demostrativo mínimo
  pages/        Vistas por función y rol
  services/     Contrato para la futura integración
  state/        Estado y acciones del prototipo
  types.ts      Modelo de dominio compartido
  utils.ts      Etiquetas, SLA, fechas y formato
```

El diseño usa Arial y la paleta oficial GLM: azul `#4F758B`, verde `#6CC24A`, acero `#6B8FA3`, naranja `#FF6A13` y dorado `#F0C75E`.