marsalva/Portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Actualizar index.html

Browse Source
This commit is contained in:
marsalva
2026-04-03 17:02:42 +00:00
parent 966b22b072
commit 6c5ca32828
1 changed files with 27 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
index.html
View File

@@ -85,13 +85,33 @@
</div>
</header>
<div class="w-full relative z-10">
<div id="tabAvisos" class="tab-content active px-5 pt-6 pb-6">
<div onclick="window.location.href='plan-tranquilidad.html?token=' + urlToken" class="cursor-pointer mb-8 fade-in relative group overflow-hidden bg-slate-900 rounded-[2rem] p-6 shadow-2xl border border-slate-800 transition-all hover:shadow-blue-500/20 hover:-translate-y-1">
<div class="absolute -top-24 -right-24 w-48 h-48 bg-blue-500 rounded-full blur-[80px] opacity-30 group-hover:opacity-50 transition-opacity"></div>
<div class="absolute -bottom-24 -left-24 w-48 h-48 bg-amber-500 rounded-full blur-[80px] opacity-20 group-hover:opacity-40 transition-opacity"></div>
<div id="promo-banner" onclick="window.location.href='plan-tranquilidad.html?token=' + urlToken" class="hidden cursor-pointer mb-6 fade-in transition-all hover:shadow-lg hover:-translate-y-1 active:scale-[0.98] rounded-[2rem] overflow-hidden shadow-md">
<img src="https://i.postimg.cc/30d993sK/Disen-o-sin-ti-tulo-20.jpg" alt="Plan Tranquilidad Marsalva" class="w-full h-auto object-cover border border-slate-200 rounded-[2rem]">
<div class="relative z-10 flex flex-col items-center text-center">
<div class="w-12 h-12 bg-white/10 backdrop-blur-md rounded-2xl flex items-center justify-center mb-4 border border-white/10 shadow-inner">
<i data-lucide="zap" class="w-6 h-6 text-amber-400"></i>
</div>
<h2 class="text-xs font-black text-slate-400 uppercase tracking-widest mb-4 ml-2 fade-in fade-in-delay-1">Tus Reparaciones</h2> <div id="activeServicesContainer" class="space-y-5 fade-in fade-in-delay-1"></div>
<h3 class="text-white font-black text-lg leading-tight mb-2 tracking-wide flex items-center justify-center gap-2">
<span class="text-blue-400">**</span><i data-lucide="wrench" class="w-4 h-4 text-slate-300"></i> ¡NO ESPERES A UNA AVERÍA! ÚNETE AL PLAN TRANQUILIDAD HOY
</h3>
<p class="text-slate-300 text-xs font-medium leading-relaxed px-2 mb-6">
Olvídate de facturas sorpresa. Cobertura de URGENCIAS y REVISIÓN ANUAL incluida.
</p>
<button class="w-full bg-gradient-to-r from-amber-400 to-amber-500 text-amber-950 font-black py-4 rounded-xl shadow-[0_0_20px_rgba(245,158,11,0.3)] uppercase tracking-widest text-[11px] flex items-center justify-center gap-2 group-hover:scale-[1.02] transition-transform">
DAR DE ALTA MI PLAN CON UN CLICK <i data-lucide="chevron-right" class="w-4 h-4"></i>
</button>
</div>
</div>
```
Y ya lo tienes. Cuando el cliente pulse en cualquier parte de ese banner negro, le llevará mágicamente a `plan-tranquilidad.html` con su token de seguridad arrastrado automáticamente para que pueda firmar y pagar.
<div id="activeServicesContainer" class="space-y-5 fade-in fade-in-delay-1"></div>
<div id="noActiveServices" class="hidden text-center p-8 bg-white rounded-[2.5rem] shadow-sm border border-slate-100 mt-2">
<div class="w-16 h-16 bg-emerald-50 text-emerald-500 rounded-full flex items-center justify-center mx-auto mb-4"><i data-lucide="check-circle-2" class="w-8 h-8"></i></div>
@@ -359,17 +379,8 @@
if (!data.ok) throw new Error("Token inválido");
const servicesList = data.services || [];
currentQuotes = data.quotes || [];
// 🛑 LÓGICA DEL BANNER: Si NO tiene suscripción activa, se lo enseñamos
const promoBanner = document.getElementById('promo-banner');
if (promoBanner) {
if (data.subscription) {
promoBanner.classList.add('hidden'); // Ya tiene el plan, lo ocultamos
} else {
promoBanner.classList.remove('hidden'); // No tiene el plan, lo mostramos
}
}
currentQuotes = data.quotes || [];
renderPortal(data.client, data.company, servicesList);
@@ -524,29 +535,6 @@ if (hasUnseenPending && isAvisosTab) {
</div>`;
});
container.innerHTML = html;
<div onclick="openQuoteModal(${q.id})" class="bg-white p-5 rounded-[2rem] shadow-sm border ${isViewed ? 'border-slate-100' : 'border-blue-400 ring-2 ring-blue-50'} relative cursor-pointer active:scale-95 transition-all text-left">
${!isViewed ? '<div class="absolute top-5 right-5 w-3 h-3 bg-red-500 rounded-full animate-pulse shadow-sm border-2 border-white"></div>' : ''}
<div class="flex items-center gap-3 mb-3">
<div class="w-10 h-10 rounded-xl ${isViewed ? 'bg-slate-50 text-slate-400' : 'bg-blue-50 text-blue-600'} flex items-center justify-center shrink-0">
<i data-lucide="file-text" class="w-5 h-5"></i>
</div>
<div class="flex-1 min-w-0">
<p class="text-[9px] font-black text-slate-400 uppercase tracking-widest leading-none mb-1">REF #${refStr}</p>
<h3 class="font-black text-slate-800 text-sm leading-tight pr-6 truncate">${titleStr}</h3>
${statusBadge}
</div>
</div>
<div class="flex justify-between items-end border-t border-slate-100 pt-3 mt-1">
<span class="text-[10px] font-bold text-slate-500 flex items-center gap-1"><i data-lucide="calendar" class="w-3 h-3"></i> ${dateStr}</span>
<span class="text-lg font-black text-slate-800">${amountStr}€</span>
</div>
${quickPayButton}
</div>`;
});
container.innerHTML = html;
updateQuotesBadges(unseenCount);