80 lines
6.0 KiB
PHP
80 lines
6.0 KiB
PHP
<x-filament-widgets::widget>
|
||
<x-filament::section>
|
||
<div class="rounded-3xl border border-white/80 bg-gradient-to-br from-white via-white to-primary-50/70 p-6 shadow-sm">
|
||
<div class="flex flex-col gap-6 xl:flex-row xl:items-end xl:justify-between">
|
||
<div class="space-y-3">
|
||
<p class="text-xs font-semibold uppercase tracking-[0.24em] text-primary-600">Executive snapshot</p>
|
||
<div class="flex items-center gap-3">
|
||
<div>
|
||
<h2 class="text-3xl font-semibold tracking-tight text-gray-950">Comisión atribuible</h2>
|
||
<p class="mt-2 text-sm text-gray-600">KPI principal del funnel.</p>
|
||
</div>
|
||
<span class="inline-flex h-8 w-8 items-center justify-center rounded-full border border-gray-200 bg-white text-sm text-gray-500" title="La comisión atribuible resume el valor económico capturado por la demo.">ℹ️</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex flex-col gap-3 sm:flex-row sm:items-stretch">
|
||
<div class="min-w-[240px] rounded-3xl border border-gray-950/5 bg-gray-950 p-6 text-white shadow-sm">
|
||
<p class="text-[11px] font-bold uppercase tracking-[0.22em] text-white/60">KPI principal</p>
|
||
<p class="mt-3 text-4xl font-semibold tracking-tight">€{{ number_format($commission, 0) }}</p>
|
||
<div class="mt-3 flex items-center gap-2 text-sm text-white/70">
|
||
<span>Booking atribuido</span>
|
||
<span class="inline-flex h-6 w-6 items-center justify-center rounded-full border border-white/10 bg-white/5 text-[11px]" title="Suma de commission_amount en las reservas generadas por el funnel.">ℹ️</span>
|
||
</div>
|
||
</div>
|
||
|
||
<a href="{{ route('home') }}" class="inline-flex items-center justify-center rounded-2xl bg-primary-600 px-5 py-4 text-sm font-semibold text-white shadow-sm transition hover:bg-primary-500">
|
||
Ver front demo
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mt-6 grid gap-3 md:grid-cols-2 xl:grid-cols-4">
|
||
<article class="rounded-2xl border border-white/80 bg-white/90 p-4 shadow-sm">
|
||
<div class="flex items-center justify-between gap-3">
|
||
<p class="text-[11px] font-bold uppercase tracking-[0.18em] text-gray-500">Taxi</p>
|
||
<span class="inline-flex h-6 w-6 items-center justify-center rounded-full bg-gray-100 text-[11px] text-gray-500" title="Total de rides creados.">ℹ️</span>
|
||
</div>
|
||
<p class="mt-3 text-2xl font-semibold tracking-tight text-gray-950">{{ number_format($rides) }}</p>
|
||
</article>
|
||
<article class="rounded-2xl border border-white/80 bg-white/90 p-4 shadow-sm">
|
||
<div class="flex items-center justify-between gap-3">
|
||
<p class="text-[11px] font-bold uppercase tracking-[0.18em] text-gray-500">Bookings</p>
|
||
<span class="inline-flex h-6 w-6 items-center justify-center rounded-full bg-gray-100 text-[11px] text-gray-500" title="Reservas cerradas desde la demo.">ℹ️</span>
|
||
</div>
|
||
<p class="mt-3 text-2xl font-semibold tracking-tight text-gray-950">{{ number_format($bookingsCount) }}</p>
|
||
</article>
|
||
<article class="rounded-2xl border border-white/80 bg-white/90 p-4 shadow-sm">
|
||
<div class="flex items-center justify-between gap-3">
|
||
<p class="text-[11px] font-bold uppercase tracking-[0.18em] text-gray-500">CTR</p>
|
||
<span class="inline-flex h-6 w-6 items-center justify-center rounded-full bg-gray-100 text-[11px] text-gray-500" title="Relación view → click sobre las recomendaciones visibles.">ℹ️</span>
|
||
</div>
|
||
<p class="mt-3 text-2xl font-semibold tracking-tight text-gray-950">{{ $clickThrough }}%</p>
|
||
</article>
|
||
<article class="rounded-2xl border border-white/80 bg-white/90 p-4 shadow-sm">
|
||
<div class="flex items-center justify-between gap-3">
|
||
<p class="text-[11px] font-bold uppercase tracking-[0.18em] text-gray-500">GMV</p>
|
||
<span class="inline-flex h-6 w-6 items-center justify-center rounded-full bg-gray-100 text-[11px] text-gray-500" title="Volumen bruto de las reservas registradas.">ℹ️</span>
|
||
</div>
|
||
<p class="mt-3 text-2xl font-semibold tracking-tight text-gray-950">€{{ number_format($gmv, 0) }}</p>
|
||
</article>
|
||
</div>
|
||
|
||
<div class="mt-6 grid gap-3 md:grid-cols-3">
|
||
<article class="rounded-2xl border border-gray-200 bg-white/80 p-4 shadow-sm">
|
||
<p class="text-[11px] font-bold uppercase tracking-[0.18em] text-gray-500">Espera útil</p>
|
||
<p class="mt-2 text-2xl font-semibold tracking-tight text-gray-950">{{ number_format($views) }}</p>
|
||
</article>
|
||
<article class="rounded-2xl border border-gray-200 bg-white/80 p-4 shadow-sm">
|
||
<p class="text-[11px] font-bold uppercase tracking-[0.18em] text-gray-500">Detalle oferta</p>
|
||
<p class="mt-2 text-2xl font-semibold tracking-tight text-gray-950">{{ number_format($clicks) }}</p>
|
||
</article>
|
||
<article class="rounded-2xl border border-gray-200 bg-white/80 p-4 shadow-sm">
|
||
<p class="text-[11px] font-bold uppercase tracking-[0.18em] text-gray-500">Ride → booking</p>
|
||
<p class="mt-2 text-2xl font-semibold tracking-tight text-gray-950">{{ $rideToBooking }}%</p>
|
||
</article>
|
||
</div>
|
||
</div>
|
||
</x-filament::section>
|
||
</x-filament-widgets::widget>
|