9b5b0d59a6
- Paso intermedio /solicitud/[id]: el cliente elige llamada, WhatsApp o formulario (crearLead ahora redirige aquí, no a /fotos). - /formulario: FormularioZonas permite añadir varias zonas, cada una con tipo, m², acabado, notas y fotos; /fotos queda como redirect. - guardarDetallesYFotos: guarda fotos (antes, por zona) y notas (por zona), agrega los campos del lead (m² suma, tipo único o 'integral', calidad más alta, tasteText concatenado) para el presupuesto orientativo inmediato, y señala perfilCompleto al flujo externo. - Elimina FotosUploader (sustituido por FormularioZonas). Verificado en navegador: 2 zonas → presupuesto al instante + notas por zona + evento de perfil en DB. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
83 lines
2.8 KiB
TypeScript
83 lines
2.8 KiB
TypeScript
import Link from 'next/link';
|
|
import { notFound } from 'next/navigation';
|
|
import { getPublicLead } from '@/lib/funnel/public-queries';
|
|
import TenantBrand from '@/components/funnel/TenantBrand';
|
|
|
|
export const dynamic = 'force-dynamic';
|
|
|
|
const CANALES = [
|
|
{
|
|
slug: 'llamada',
|
|
icon: '📞',
|
|
titulo: 'Que te llamemos',
|
|
descripcion:
|
|
'Un asistente te llama y te hace unas preguntas rápidas. Lo más cómodo: no escribes nada.',
|
|
cta: 'Quiero que me llamen',
|
|
},
|
|
{
|
|
slug: 'whatsapp',
|
|
icon: '💬',
|
|
titulo: 'Por WhatsApp',
|
|
descripcion:
|
|
'Seguimos por chat a tu ritmo. Puedes mandar fotos y notas cuando quieras.',
|
|
cta: 'Seguir por WhatsApp',
|
|
},
|
|
{
|
|
slug: 'formulario',
|
|
icon: '📝',
|
|
titulo: 'Rellenar un formulario',
|
|
descripcion:
|
|
'Tú lo cuentas zona por zona y subes las fotos. Recibes el presupuesto al instante.',
|
|
cta: 'Rellenar el formulario',
|
|
},
|
|
] as const;
|
|
|
|
export default async function ChooserPage({ params }: { params: Promise<{ id: string }> }) {
|
|
const { id } = await params;
|
|
const data = await getPublicLead(id);
|
|
if (!data) notFound();
|
|
|
|
const { lead, tenant } = data;
|
|
|
|
return (
|
|
<>
|
|
{tenant && <TenantBrand nombreEmpresa={tenant.nombreEmpresa} logoUrl={tenant.logoUrl} />}
|
|
<div className="container py-10 max-w-2xl flex flex-col gap-6">
|
|
<div className="flex flex-col gap-2">
|
|
<span className="text-xs font-semibold uppercase tracking-widest text-gray-400">
|
|
Elige cómo seguir
|
|
</span>
|
|
<h1 className="text-2xl font-black tracking-tight text-black">
|
|
¿Cómo prefieres contarnos tu reforma, {lead.nombre.split(' ')[0]}?
|
|
</h1>
|
|
<p className="text-sm text-gray-500 leading-relaxed">
|
|
Tú eliges. Por cualquiera de las tres nos das lo que necesitamos para preparar tu render
|
|
y tu presupuesto.
|
|
</p>
|
|
</div>
|
|
|
|
<div className="flex flex-col gap-3">
|
|
{CANALES.map((c) => (
|
|
<Link
|
|
key={c.slug}
|
|
href={`/solicitud/${id}/${c.slug}`}
|
|
className="group bg-white border border-gray-200 rounded-xl p-5 shadow-sm flex items-center gap-4 transition-all hover:border-black hover:shadow-md"
|
|
>
|
|
<span className="text-3xl shrink-0" aria-hidden="true">
|
|
{c.icon}
|
|
</span>
|
|
<div className="flex flex-col gap-0.5 min-w-0">
|
|
<span className="text-base font-bold text-black">{c.titulo}</span>
|
|
<span className="text-sm text-gray-500 leading-snug">{c.descripcion}</span>
|
|
<span className="text-sm font-semibold text-[color:var(--brand,#0a0a0a)] mt-1">
|
|
{c.cta} →
|
|
</span>
|
|
</div>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</>
|
|
);
|
|
}
|