39499-vm/index.php

<?php
declare(strict_types=1);

require_once __DIR__ . '/includes/taxilanz.php';
app_boot();

$featuredOffers = featured_offers(6);
$rides = recent_rides(5);
$bookings = recent_bookings(5);
$rideSummary = event_summary();
$oldRide = old_form('ride_request');

render_page_start(
    'Solicitar taxi y activar recomendaciones',
    'Pide un taxi en Lanzarote, recibe ETA inmediata y desbloquea reservas recomendadas mientras esperas.',
    'home'
);
?>
<section class="row g-4 align-items-start mb-4">
    <div class="col-12 col-xl-7">
        <div class="hero-shell p-4 p-lg-5 mb-4">
            <div class="row g-4 align-items-center">
                <div class="col-12 col-lg-8">
                    <div class="eyebrow mb-3">Taxi confirmado + monetizacion contextual</div>
                    <h1 class="display-title mb-3">Hoy en Lanzarote, pide tu taxi y aprovecha la espera.</h1>
                    <p class="lead text-secondary mb-4">TaxiLanz conecta la solicitud, la confirmacion y las mejores recomendaciones de la zona en un flujo limpio, rapido y listo para demo.</p>
                    <div class="d-flex flex-wrap gap-2">
                        <span class="metric-pill">Confirmacion inmediata</span>
                        <span class="metric-pill">Top 3 ofertas relevantes</span>
                        <span class="metric-pill">Reserva sin pago</span>
                    </div>
                </div>
                <div class="col-12 col-lg-4">
                    <div class="metric-grid">
                        <div class="metric-card">
                            <span class="metric-label">Solicitudes</span>
                            <strong><?= count($rides) ?></strong>
                            <small>registradas en esta demo</small>
                        </div>
                        <div class="metric-card">
                            <span class="metric-label">Reservas</span>
                            <strong><?= count($bookings) ?></strong>
                            <small>cerradas desde recomendaciones</small>
                        </div>
                        <div class="metric-card">
                            <span class="metric-label">Eventos</span>
                            <strong><?= array_sum($rideSummary) ?></strong>
                            <small>tracking basico activo</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="card-shell p-4 p-lg-5" id="request-taxi">
            <div class="section-head mb-4">
                <div>
                    <div class="eyebrow">Flujo principal</div>
                    <h2 class="section-title mb-1">Solicitar taxi</h2>
                    <p class="text-secondary mb-0">Introduce origen, destino y una hora opcional. Confirmaremos un ETA de demo y activaremos recomendaciones afines.</p>
                </div>
                <span class="status-badge">Paso 1</span>
            </div>
            <form action="/rides/" method="post" class="row g-3" novalidate>
                <div class="col-12 col-md-6">
                    <label class="form-label" for="pickup_label">Origen</label>
                    <input class="form-control form-control-app" id="pickup_label" name="pickup_label" type="text" placeholder="Hotel, aeropuerto o punto de recogida" value="<?= h($oldRide['pickup_label'] ?? '') ?>" required data-route-source>
                </div>
                <div class="col-12 col-md-6">
                    <label class="form-label" for="destination_label">Destino</label>
                    <input class="form-control form-control-app" id="destination_label" name="destination_label" type="text" placeholder="Marina, playa, restaurante o atraccion" value="<?= h($oldRide['destination_label'] ?? '') ?>" required data-route-destination>
                </div>
                <div class="col-12 col-md-6">
                    <label class="form-label" for="scheduled_for">Hora opcional</label>
                    <input class="form-control form-control-app" id="scheduled_for" name="scheduled_for" type="datetime-local" value="<?= h($oldRide['scheduled_for'] ?? '') ?>" data-min-now>
                </div>
                <div class="col-12 col-md-6">
                    <div class="route-preview h-100">
                        <span class="route-preview-label">Vista previa</span>
                        <strong data-route-preview>Origen → Destino</strong>
                        <small class="text-secondary">Tu solicitud se marcara como confirmada y se usara para decidir las recomendaciones del bloque siguiente.</small>
                    </div>
                </div>
                <div class="col-12 d-flex flex-column flex-sm-row gap-2 pt-2">
                    <button class="btn btn-app-primary" type="submit">Pedir taxi</button>
                    <a class="btn btn-app-secondary" href="/operations/">Ver actividad reciente</a>
                </div>
            </form>
        </div>
    </div>

    <div class="col-12 col-xl-5">
        <div class="card-shell p-4 mb-4">
            <div class="section-head mb-3">
                <div>
                    <div class="eyebrow">Cómo funciona</div>
                    <h2 class="section-title mb-1">Thin slice operativo</h2>
                </div>
                <span class="status-badge">MVP</span>
            </div>
            <ol class="workflow-list mb-0 ps-3">
                <li>Se crea una solicitud de taxi con origen, destino y hora opcional.</li>
                <li>Se confirma el trayecto con ETA de demo y se registra el evento inicial.</li>
                <li>Se recomiendan 3 offers publicadas segun contexto y prioridad.</li>
                <li>El usuario entra en una oferta, completa la reserva y ve la confirmacion.</li>
            </ol>
        </div>

        <div class="card-shell p-4">
            <div class="section-head mb-3">
                <div>
                    <div class="eyebrow">Actividad reciente</div>
                    <h2 class="section-title mb-1">Ultimos movimientos</h2>
                </div>
                <a class="text-link" href="/operations/">Abrir operaciones</a>
            </div>
            <div class="stack-list">
                <?php if (!$rides): ?>
                    <div class="empty-state compact">
                        <strong>No hay solicitudes aun.</strong>
                        <p class="mb-0 text-secondary">Crea la primera para ver la confirmacion y las recomendaciones activadas.</p>
                    </div>
                <?php else: ?>
                    <?php foreach ($rides as $ride): ?>
                        <a class="list-row" href="/rides/confirmed.php?ride=<?= urlencode($ride['uuid']) ?>">
                            <div>
                                <strong><?= h($ride['pickup_label']) ?> → <?= h($ride['destination_label']) ?></strong>
                                <div class="text-secondary small">ETA <?= h((string) $ride['eta_minutes']) ?> min · <?= h(format_datetime($ride['created_at'])) ?></div>
                            </div>
                            <span class="status-badge subtle"><?= h(status_label($ride['status'])) ?></span>
                        </a>
                    <?php endforeach; ?>
                <?php endif; ?>
            </div>
        </div>
    </div>
</section>

<section class="card-shell p-4 p-lg-5 mb-4">
    <div class="section-head mb-4">
        <div>
            <div class="eyebrow">Mientras esperas</div>
            <h2 class="section-title mb-1">Offers destacadas para empezar la demo</h2>
            <p class="text-secondary mb-0">Estas experiencias y servicios se siembran automaticamente y sirven de base para las recomendaciones de cada ride.</p>
        </div>
        <span class="status-badge">12 seeds</span>
    </div>
    <div class="row g-3">
        <?php foreach ($featuredOffers as $offer): ?>
            <div class="col-12 col-md-6 col-xl-4">
                <article class="offer-card h-100">
                    <img src="<?= h($offer['image_url']) ?>" class="offer-image" alt="<?= h($offer['title']) ?>" loading="lazy" width="640" height="420">
                    <div class="offer-body">
                        <div class="offer-meta">
                            <span class="chip"><?= h(category_label($offer['category'])) ?></span>
                            <span class="text-secondary small"><?= h($offer['location_label'] ?? 'Lanzarote') ?></span>
                        </div>
                        <h3 class="offer-title"><?= h($offer['title']) ?></h3>
                        <p class="offer-text"><?= h(excerpt_for_offer($offer)) ?></p>
                        <div class="offer-footer">
                            <div>
                                <strong><?= h(format_currency($offer['price_from'])) ?></strong>
                                <small class="text-secondary d-block"><?= h((string) $offer['duration_minutes']) ?> min aprox.</small>
                            </div>
                            <a class="btn btn-app-secondary btn-sm" href="/offers/?slug=<?= urlencode($offer['slug']) ?>">Ver detalle</a>
                        </div>
                    </div>
                </article>
            </div>
        <?php endforeach; ?>
    </div>
</section>
<?php render_page_end(); ?>