01Tipo de proyecto

02Elija una fecha

03Elija una hora

04Fotos y detalles

05Confirmar

1 · ¿Qué estamos viendo?

Esto decide qué estimador enviamos y cuánto tiempo reservamos.

2 · Elija una fecha

Lunes a viernes 8:30 AM – 1:00 PM. Programamos hasta con ocho semanas de anticipación.

DomLunMarMiéJueVieSáb

Horarios disponiblesGris = cerrado o sin disponibilidad

3 · Elija un bloque de hora

Seleccione una fecha primero.

Elija una fecha arriba para ver los horarios disponibles.

4 · Fotos y detalles del proyecto

Dos o tres fotos de la línea de la cerca le ahorran un viaje a todos y le dan un número más preciso.

Agregar fotos Toque para elegir, o arrástrelas aquí · hasta 3 · JPG o PNG

Para el desarrollador: la disponibilidad en vivo y la sincronización bidireccional están simuladas en esta construcción. Reemplace loadAvailability() con una llamada a su middleware, que debería consultar Google Calendar freeBusy.query o Microsoft Graph /me/calendar/getSchedule para los calendarios de los estimadores. Al enviar, createCalendarEvent() debería hacer POST a calendar.events.insert (Google) o /me/events (Microsoft Graph) con el cliente como asistente, lo cual también es lo que envía la notificación a Teams. Los tokens OAuth deben permanecer del lado del servidor. La pantalla de confirmación ya emite un .ics válido para que el flujo funcione de principio a fin antes de que llegue esa integración.