587 lines
33 KiB
HTML
587 lines
33 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="es">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Pacifictrans Go | Transporte Especial & Mensajería Cali - Buenaventura</title>
|
||
<meta name="description" content="Plataforma tecnológica de transporte especial intermunicipal y mensajería en el corredor Cali - Buenaventura. Agrupación inteligente de 4 pasajeros, Waze TSP y pagos 100% seguros con Bold.">
|
||
<meta property="og:title" content="Pacifictrans Go - Corredor Cali ↔ Buenaventura">
|
||
<meta property="og:description" content="Servicio puerta a puerta de 4 cupos y paquetería express. Monitoreo satelital y conductores asignados por cercanía de residencia.">
|
||
<meta property="og:type" content="website">
|
||
<meta name="theme-color" content="#080c14">
|
||
<link rel="stylesheet" href="/css/style.css">
|
||
</head>
|
||
<body>
|
||
|
||
<!-- NAVBAR -->
|
||
<header class="navbar">
|
||
<a href="#" class="brand">
|
||
<div class="brand-badge">P</div>
|
||
<div class="brand-text">
|
||
<h1 class="brand-title">Pacifictrans <span>Go</span></h1>
|
||
<span>Cali ↔ Buenaventura</span>
|
||
</div>
|
||
</a>
|
||
|
||
<nav class="nav-links">
|
||
<a href="#reservas" class="active">Pasajeros (Pooling)</a>
|
||
<a href="#fletes">Fletes & Encomiendas</a>
|
||
<a href="#radar">Radar de Flota</a>
|
||
<a href="#conductores">Conductores</a>
|
||
<a href="/PacifictransGo.apk" class="btn-apk-header" id="btn-download-header">
|
||
<svg width="18" height="18" viewBox="0 0 24 24" fill="currentColor">
|
||
<path d="M17.523 15.3414c-.5511 0-.9993-.4486-.9993-1.0001s.4482-1.0001.9993-1.0001c.552 0 1.0001.4486 1.0001 1.0001s-.4481 1.0001-1.0001 1.0001m-11.046 0c-.5511 0-.9993-.4486-.9993-1.0001s.4482-1.0001.9993-1.0001c.552 0 1.0001.4486 1.0001 1.0001s-.4481 1.0001-1.0001 1.0001m11.4045-6.02l1.997-3.4589c.1408-.2439.0573-.5552-.1866-.696-.2438-.1408-.5551-.0573-.696.1866l-2.0238 3.5054c-1.5037-.6873-3.1979-1.0772-4.9691-1.0772s-3.4654.3899-4.9691 1.0772l-2.0238-3.5054c-.1409-.2439-.4522-.3274-.696-.1866-.2439.1408-.3274.4521-.1866.696l1.997 3.4589c-3.7997 2.0623-6.375 5.9863-6.446 10.5369h24.646c-.071-4.5506-2.6463-8.4746-6.446-10.5369"/>
|
||
</svg>
|
||
Descargar APK Android
|
||
</a>
|
||
</nav>
|
||
</header>
|
||
|
||
<!-- HERO SECTION -->
|
||
<main>
|
||
<section class="hero">
|
||
<div class="hero-content">
|
||
<div class="hero-pill">
|
||
<span>⚡ Corredor Exclusivo Especial</span>
|
||
<span>•</span>
|
||
<span>100% Prepagado con Bold & Bre-B</span>
|
||
</div>
|
||
<h2 class="hero-title">Transporte Puerta a Puerta y Mensajería Express <span>Cali - Buenaventura</span></h2>
|
||
<p class="hero-desc">
|
||
Viajes agrupados inteligentemente en vehículos de 4 pasajeros. Salidas puntuales, geolocalización satelital en tiempo real, optimización de rutas TSP con Waze y asignación de conductores según cercanía de su residencia.
|
||
</p>
|
||
|
||
<div class="hero-badges">
|
||
<div class="badge-item">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"></path>
|
||
<circle cx="9" cy="7" r="4"></circle>
|
||
<path d="M22 21v-2a4 4 0 0 0-3-3.87"></path>
|
||
<path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
|
||
</svg>
|
||
<span><strong>4 Cupos</strong> por Vehículo</span>
|
||
</div>
|
||
|
||
<div class="badge-item">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
|
||
</svg>
|
||
<span><strong>$35.000 COP</strong> Tarifa Fija</span>
|
||
</div>
|
||
|
||
<div class="badge-item">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path>
|
||
</svg>
|
||
<span>Seguro Contractual & Bold</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="display: flex; gap: 1rem;">
|
||
<a href="#reservas" class="btn-primary" style="width: auto; padding: 0.9rem 1.8rem;">
|
||
Reservar Mi Cupo Ahora
|
||
</a>
|
||
<a href="#fletes" class="btn-primary" style="width: auto; padding: 0.9rem 1.8rem; background: rgba(255,255,255,0.06); color: #fff; border: 1px solid var(--border-glass);">
|
||
Cotizar Flete de Encomienda
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="hero-visual">
|
||
<div class="visual-container">
|
||
<img src="/images/hero-banner.jpg" alt="Pacifictrans Go Cali Buenaventura" class="hero-image">
|
||
|
||
<div class="floating-pool-card">
|
||
<div class="pool-status-row">
|
||
<div>
|
||
<span style="font-size: 0.75rem; text-transform: uppercase; color: var(--accent-cyan); font-weight: 700; letter-spacing: 0.05em;">Agrupación en Vivo</span>
|
||
<div style="font-weight: 700; font-size: 1.05rem;" id="seat-counter-text">3/4 Pasajeros Confirmados</div>
|
||
</div>
|
||
<div class="pool-seats">
|
||
<div class="seat-dot active">1</div>
|
||
<div class="seat-dot active">2</div>
|
||
<div class="seat-dot active">3</div>
|
||
<div class="seat-dot pending">4</div>
|
||
</div>
|
||
</div>
|
||
|
||
<p style="font-size: 0.82rem; color: var(--text-muted); line-height: 1.4;">
|
||
📍 Recogida en Cali: <strong>Puerta a puerta en su domicilio</strong>.<br>
|
||
🏁 Llegada en Buenaventura: <strong>Terminal, Muelle Turístico o El Piñal</strong>.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- MAIN PLATFORM APPS / TABS WRAPPER -->
|
||
<div class="main-wrapper" id="reservas">
|
||
<div class="tab-nav">
|
||
<button class="tab-btn active" data-tab="tab-pasajeros" id="tab-btn-pasajeros">
|
||
👥 1. Reserva Pasajeros (Geo-Pooling)
|
||
</button>
|
||
<button class="tab-btn" data-tab="tab-fletes" id="tab-btn-fletes">
|
||
📦 2. Mensajería & Fletes
|
||
</button>
|
||
<button class="tab-btn" data-tab="tab-radar" id="tab-btn-radar">
|
||
📡 3. Radar de Flota & Despacho
|
||
</button>
|
||
<button class="tab-btn" data-tab="tab-conductores" id="tab-btn-conductores">
|
||
🚗 4. Portal Conductor
|
||
</button>
|
||
<button class="tab-btn" data-tab="tab-tarifas" id="tab-btn-tarifas">
|
||
⚙️ 5. Tarifas & Precios
|
||
</button>
|
||
</div>
|
||
|
||
<!-- TAB 1: RESERVA PASAJEROS -->
|
||
<section class="tab-content active" id="tab-pasajeros">
|
||
<div class="glass-panel">
|
||
<div class="panel-header">
|
||
<h2>Agrupación Geoespacial de 4 Pasajeros</h2>
|
||
<p>El sistema agrupa automáticamente a 4 pasajeros dentro de un radio de 4 km en Cali y optimiza la ruta mediante algoritmo Nearest Neighbor TSP en Waze.</p>
|
||
</div>
|
||
|
||
<div class="grid-2col">
|
||
<!-- Formulario de Reserva -->
|
||
<div>
|
||
<div class="form-group">
|
||
<label class="form-label" for="pool-origin">Sentido del Viaje</label>
|
||
<select class="form-select" id="pool-origin">
|
||
<option value="CALI">Cali ➔ Buenaventura (Recogida Domicilio)</option>
|
||
<option value="BUENAVENTURA">Buenaventura ➔ Cali (Puntos Oficiales)</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="form-group" id="cali-address-group">
|
||
<label class="form-label" for="cali-address">Dirección de Recogida en Cali (Domicilio)</label>
|
||
<input type="text" class="form-input" id="cali-address" placeholder="Ej: Calle 5 #66-20, Barrio Limonar, Cali" value="Calle 9 #42-15, Los Cámbulos, Cali">
|
||
</div>
|
||
|
||
<div class="form-group" id="buena-stop-group">
|
||
<label class="form-label" for="buena-stop">Parada de Destino en Buenaventura</label>
|
||
<select class="form-select" id="buena-stop">
|
||
<option value="TERMINAL">Terminal de Transporte de Buenaventura</option>
|
||
<option value="MUELLE">Muelle Turístico</option>
|
||
<option value="PINAL">El Piñal</option>
|
||
<option value="SENA">Sena Buenaventura</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="grid-2col" style="gap: 1rem; margin-bottom: 0;">
|
||
<div class="form-group">
|
||
<label class="form-label" for="user-name">Nombre Completo</label>
|
||
<input type="text" class="form-input" id="user-name" placeholder="Tu Nombre" value="Andrea Montoya">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label" for="user-phone">WhatsApp (+57)</label>
|
||
<input type="tel" class="form-input" id="user-phone" placeholder="3167455877" value="3167455877">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="user-notes">Notas / Equipaje</label>
|
||
<input type="text" class="form-input" id="user-notes" placeholder="Maletín mediano de 10kg">
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Resumen y Pasarela Bold -->
|
||
<div class="summary-box">
|
||
<div>
|
||
<h3 style="font-size: 1.25rem; color: #fff; margin-bottom: 1rem;">Resumen de la Reserva</h3>
|
||
|
||
<div class="summary-item">
|
||
<span style="color: var(--text-muted);">Servicio:</span>
|
||
<span style="color: #fff; font-weight: 600;">Transporte Especial Intermunicipal</span>
|
||
</div>
|
||
<div class="summary-item">
|
||
<span style="color: var(--text-muted);">Capacidad del Vehículo:</span>
|
||
<span style="color: #fff; font-weight: 600;">Máximo 4 Pasajeros (1 cupo solicitado)</span>
|
||
</div>
|
||
<div class="summary-item">
|
||
<span style="color: var(--text-muted);">Recogida Puerta a Puerta:</span>
|
||
<span style="color: var(--accent-cyan); font-weight: 600;">Incluida en Cali</span>
|
||
</div>
|
||
<div class="summary-item">
|
||
<span style="color: var(--text-muted);">Navegación Conductor:</span>
|
||
<span style="color: #fff; font-weight: 600;">Waze Deep Link con TSP</span>
|
||
</div>
|
||
|
||
<div class="bold-gateway-badge">
|
||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<rect x="2" y="5" width="20" height="14" rx="2"></rect>
|
||
<line x1="2" y1="10" x2="22" y2="10"></line>
|
||
</svg>
|
||
<span>Pago 100% Prepagado con <strong>Bold Smart Checkout</strong> (QR Bre-B, Nequi, PSE)</span>
|
||
</div>
|
||
|
||
<!-- ALERTA DE REGLA DE NEGOCIO -->
|
||
<div style="background: rgba(6, 182, 212, 0.1); border: 1px solid rgba(6, 182, 212, 0.3); border-radius: 8px; padding: 0.85rem; font-size: 0.84rem; color: #cbd5e1; margin-bottom: 1rem;">
|
||
ℹ️ <strong>Protocolo de Notificación Oficial:</strong>
|
||
El disparo inmediato de notificación a los 4 pasajeros se ejecuta <strong>únicamente cuando el Administrador asigna el conductor</strong>, garantizando que el vehículo asignado sea el más cercano a su residencia en Cali.
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="summary-total">
|
||
<span style="font-weight: 600; color: #fff;">Tarifa por Pasajero:</span>
|
||
<span class="total-price">$35.000 COP</span>
|
||
</div>
|
||
|
||
<button class="btn-primary" id="btn-book-pool" style="margin-top: 1rem;">
|
||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<path d="M12 2v20M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6"></path>
|
||
</svg>
|
||
Confirmar y Pagar Cupo ($35.000 COP)
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Alerta tras completar cupo -->
|
||
<div id="pool-dispatch-alert" style="display: none; margin-top: 2rem; background: rgba(245, 158, 11, 0.12); border: 1px solid rgba(245, 158, 11, 0.4); border-radius: 14px; padding: 1.5rem;">
|
||
<div style="display: flex; gap: 1rem; align-items: flex-start;">
|
||
<span style="font-size: 2rem;">🚗💨</span>
|
||
<div>
|
||
<h4 style="color: #fbbf24; font-size: 1.15rem; margin-bottom: 0.4rem;">¡Vehículo con 4/4 Cupos Completados!</h4>
|
||
<p style="color: #cbd5e1; font-size: 0.92rem; margin-bottom: 0.75rem;">
|
||
El viaje ha cambiado su estado a <code>POOL_COMPLETED</code>. Se ha enviado una alerta inmediata al Administrador para seleccionar el conductor de acuerdo a la cercanía de su residencia en Cali respecto a la primera recogida.
|
||
</p>
|
||
<div style="font-size: 0.85rem; color: #94a3b8;">
|
||
📲 Una vez asignado, se disparará automáticamente el mensaje de WhatsApp a los 4 pasajeros con los datos del conductor y horario exacto de recogida.
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- TAB 2: FLETES Y ENCOMIENDAS -->
|
||
<section class="tab-content" id="tab-fletes">
|
||
<div class="glass-panel">
|
||
<div class="panel-header">
|
||
<h2>Cotizador Inteligente de Mensajería & Fletes</h2>
|
||
<p>Envíos seguros en el corredor Cali - Buenaventura. Tarifa exacta calculada por distancia, factor de peso/volumen y seguro obligatorio.</p>
|
||
</div>
|
||
|
||
<div class="grid-2col">
|
||
<div>
|
||
<div class="form-group">
|
||
<label class="form-label" for="package-type">Tipo de Encomienda / Paquete</label>
|
||
<select class="form-select" id="package-type">
|
||
<option value="1.0">Sobre / Documentos Urgentes (Factor 1.0)</option>
|
||
<option value="1.2" selected>Paquete Pequeño (hasta 5 kg) - Factor 1.2</option>
|
||
<option value="1.6">Paquete Mediano (hasta 15 kg) - Factor 1.6</option>
|
||
<option value="2.2">Carga Grande / Caja Pesada (hasta 30 kg) - Factor 2.2</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="declared-value">Valor Declarado de la Mercancía ($ COP)</label>
|
||
<input type="number" class="form-input" id="declared-value" placeholder="100000" value="150000">
|
||
<span style="font-size: 0.75rem; color: var(--text-dim); margin-top: 4px; display: block;">El seguro corresponde al 1% del valor declarado ante extravío o siniestro.</span>
|
||
</div>
|
||
|
||
<div class="grid-2col" style="gap: 1rem;">
|
||
<div class="form-group">
|
||
<label class="form-label" for="sender-phone">Teléfono Remitente (WhatsApp)</label>
|
||
<input type="tel" class="form-input" id="sender-phone" value="3167455877">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label" for="receiver-phone">Teléfono Destinatario (WhatsApp)</label>
|
||
<input type="tel" class="form-input" id="receiver-phone" value="3101234567">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="package-desc">Descripción del Contenido</label>
|
||
<input type="text" class="form-input" id="package-desc" placeholder="Repuestos automotrices / Ropa / Medicamentos">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="summary-box">
|
||
<div>
|
||
<h3 style="font-size: 1.25rem; color: #fff; margin-bottom: 1rem;">Fórmula Oficial de Liquidación</h3>
|
||
<div style="background: rgba(0,0,0,0.4); border-radius: 8px; padding: 0.75rem; font-family: monospace; font-size: 0.8rem; color: #38bdf8; margin-bottom: 1rem;">
|
||
Tarifa = (Base + [115 Km × $1.200]) × Factor + Seguro (1%)
|
||
</div>
|
||
|
||
<div class="summary-item">
|
||
<span style="color: var(--text-muted);">Tarifa Base Logística:</span>
|
||
<span style="color: #fff; font-weight: 600;" id="freight-base-cost">$25.000 COP</span>
|
||
</div>
|
||
<div class="summary-item">
|
||
<span style="color: var(--text-muted);">Costo por Distancia (115 km):</span>
|
||
<span style="color: #fff; font-weight: 600;" id="freight-dist-cost">$165.600 COP</span>
|
||
</div>
|
||
<div class="summary-item">
|
||
<span style="color: var(--text-muted);">Seguro de Mercancía:</span>
|
||
<span style="color: var(--accent-emerald); font-weight: 600;" id="freight-insurance-cost">$1.500 COP</span>
|
||
</div>
|
||
|
||
<div class="bold-gateway-badge">
|
||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||
<circle cx="12" cy="12" r="10"></circle>
|
||
<polyline points="12 6 12 12 16 14"></polyline>
|
||
</svg>
|
||
<span>100% Prepagado antes del despacho con Bold Smart Checkout</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="summary-total">
|
||
<span style="font-weight: 600; color: #fff;">Flete Total Liquidado:</span>
|
||
<span class="total-price" id="freight-total-price">$197.100 COP</span>
|
||
</div>
|
||
|
||
<button class="btn-primary" style="margin-top: 1rem;">
|
||
Generar Guía y Enlace de Pago Bold
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- TAB 3: RADAR DE FLOTA & DESPACHO -->
|
||
<section class="tab-content" id="tab-radar">
|
||
<div class="glass-panel">
|
||
<div class="panel-header">
|
||
<h2>Radar Satelital GPS & Asignación por Residencia</h2>
|
||
<p>Visualización en tiempo real de la flota en el corredor Cali - Buenaventura y asignación inteligente de conductores basada en la distancia de su lugar de residencia a la primera recogida.</p>
|
||
</div>
|
||
|
||
<!-- Radar Visualizer -->
|
||
<div class="radar-screen" id="radar-canvas-container">
|
||
<div class="radar-grid"></div>
|
||
<div class="radar-sweep"></div>
|
||
|
||
<div class="corridor-line"></div>
|
||
<div class="corridor-point cali" title="Cali"></div>
|
||
<div class="corridor-point dagua" title="Dagua"></div>
|
||
<div class="corridor-point lobo" title="Loboguerrero"></div>
|
||
<div class="corridor-point buena" title="Buenaventura"></div>
|
||
|
||
<div style="position: absolute; bottom: 15px; left: 20px; font-size: 0.8rem; color: #64748b; font-family: monospace;">
|
||
🟢 Cali (Km 0) ── 🔵 Dagua (Km 45) ── 🔵 Loboguerrero (Km 60) ── 🟡 Buenaventura (Km 115)
|
||
</div>
|
||
|
||
<div class="radar-vehicle" style="top: 45%; left: 22%;" title="Renault Duster - Carlos Mario">🚗</div>
|
||
<div class="radar-vehicle" style="top: 48%; left: 52%;" title="Toyota Fortuner - Hernán Darío">🚙</div>
|
||
<div class="radar-vehicle" style="top: 43%; left: 78%;" title="Chevrolet Tracker - Mauricio V.">🚗</div>
|
||
</div>
|
||
|
||
<!-- Sugerencia de Conductores por Residencia -->
|
||
<div>
|
||
<h3 style="font-size: 1.25rem; color: #fff; margin-bottom: 0.5rem;">Conductores Sugeridos para el Viaje Actual</h3>
|
||
<p style="font-size: 0.88rem; color: var(--text-muted); margin-bottom: 1.25rem;">
|
||
Ordenados según la cercanía entre su domicilio registrado en Cali y la 1ª recogida del grupo de pasajeros.
|
||
</p>
|
||
|
||
<div id="suggested-drivers-list">
|
||
<!-- Renderizado dinámicamente por app.js -->
|
||
</div>
|
||
|
||
<div id="schedule-dispatch-result" style="display: none; margin-top: 1.5rem;"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- TAB 4: PORTAL CONDUCTOR -->
|
||
<section class="tab-content" id="tab-conductores">
|
||
<div class="glass-panel">
|
||
<div class="panel-header">
|
||
<h2>Vinculación Oficial de Conductores</h2>
|
||
<p>Únete a la flota oficial de Pacifictrans Go. Registra tu vehículo y sube tus documentos para validación administrativa.</p>
|
||
</div>
|
||
|
||
<div class="grid-2col">
|
||
<div>
|
||
<div class="form-group">
|
||
<label class="form-label" for="driver-name">Nombre y Apellidos</label>
|
||
<input type="text" class="form-input" id="driver-name" placeholder="Nombre del conductor">
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="driver-residence">Lugar de Residencia en Cali (Barrio / Comuna)</label>
|
||
<input type="text" class="form-input" id="driver-residence" placeholder="Ej: Barrio Granada, Comuna 2, Cali">
|
||
</div>
|
||
|
||
<div class="grid-2col" style="gap: 1rem; margin-bottom: 0;">
|
||
<div class="form-group">
|
||
<label class="form-label" for="driver-plate">Placa del Vehículo</label>
|
||
<input type="text" class="form-input" id="driver-plate" placeholder="Ej: WLZ-890">
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label" for="driver-model">Marca y Modelo</label>
|
||
<input type="text" class="form-input" id="driver-model" placeholder="Renault Duster 2024">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<div class="form-group">
|
||
<label class="form-label">Documentación Obligatoria (Appwrite Storage)</label>
|
||
|
||
<div style="display: flex; flex-direction: column; gap: 0.75rem;">
|
||
<div style="background: rgba(15, 23, 42, 0.9); border: 1px dashed var(--border-glass); padding: 0.85rem; border-radius: 8px; display: flex; justify-content: space-between; align-items: center;">
|
||
<span style="font-size: 0.85rem; color: #cbd5e1;">📄 SOAT Vigente</span>
|
||
<button style="background: rgba(6, 182, 212, 0.15); border: 1px solid var(--accent-cyan); color: var(--accent-cyan); padding: 4px 10px; border-radius: 4px; font-size: 0.75rem; cursor: pointer;">Subir Archivo</button>
|
||
</div>
|
||
|
||
<div style="background: rgba(15, 23, 42, 0.9); border: 1px dashed var(--border-glass); padding: 0.85rem; border-radius: 8px; display: flex; justify-content: space-between; align-items: center;">
|
||
<span style="font-size: 0.85rem; color: #cbd5e1;">📄 Revisión Técnico-Mecánica</span>
|
||
<button style="background: rgba(6, 182, 212, 0.15); border: 1px solid var(--accent-cyan); color: var(--accent-cyan); padding: 4px 10px; border-radius: 4px; font-size: 0.75rem; cursor: pointer;">Subir Archivo</button>
|
||
</div>
|
||
|
||
<div style="background: rgba(15, 23, 42, 0.9); border: 1px dashed var(--border-glass); padding: 0.85rem; border-radius: 8px; display: flex; justify-content: space-between; align-items: center;">
|
||
<span style="font-size: 0.85rem; color: #cbd5e1;">📄 Tarjeta de Operación Especial</span>
|
||
<button style="background: rgba(6, 182, 212, 0.15); border: 1px solid var(--accent-cyan); color: var(--accent-cyan); padding: 4px 10px; border-radius: 4px; font-size: 0.75rem; cursor: pointer;">Subir Archivo</button>
|
||
</div>
|
||
|
||
<div style="background: rgba(15, 23, 42, 0.9); border: 1px dashed var(--border-glass); padding: 0.85rem; border-radius: 8px; display: flex; justify-content: space-between; align-items: center;">
|
||
<span style="font-size: 0.85rem; color: #cbd5e1;">📄 Licencia de Conducción C1 / C2</span>
|
||
<button style="background: rgba(6, 182, 212, 0.15); border: 1px solid var(--accent-cyan); color: var(--accent-cyan); padding: 4px 10px; border-radius: 4px; font-size: 0.75rem; cursor: pointer;">Subir Archivo</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<button class="btn-primary" style="margin-top: 1rem;">
|
||
Enviar Solicitud de Vinculación
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- TAB 5: CONFIGURACIÓN DE PRECIOS Y TARIFAS -->
|
||
<section class="tab-content" id="tab-tarifas">
|
||
<div class="glass-panel">
|
||
<div class="panel-header">
|
||
<h2>⚙️ Configuración de Tarifas y Precios</h2>
|
||
<p>Ajuste dinámico de precios para pasajeros, mensajería, fletes, comisiones y penalidades. Los cambios se guardan en tiempo real en la base de datos MongoDB y se reflejan inmediatamente en toda la plataforma.</p>
|
||
</div>
|
||
|
||
<form id="form-tariffs-config">
|
||
<div class="grid-2col">
|
||
<!-- Columna 1: Transporte de Pasajeros y Plataforma -->
|
||
<div>
|
||
<h3 style="color: var(--accent-cyan); font-size: 1.15rem; margin-bottom: 1.25rem;">👥 Transporte de Pasajeros</h3>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-tarifa-pasajero">Tarifa Fija por Pasajero ($ COP)</label>
|
||
<input type="number" class="form-input" id="cfg-tarifa-pasajero" value="35000" min="5000" step="1000" required>
|
||
<span style="font-size: 0.75rem; color: var(--text-dim); margin-top: 4px; display: block;">Cobro fijo por cupo en vehículo de 4 pasajeros Cali ↔ Buenaventura.</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-radio-pooling">Radio Máximo de Agrupación en Cali (Metros)</label>
|
||
<input type="number" class="form-input" id="cfg-radio-pooling" value="4000" min="500" step="500" required>
|
||
<span style="font-size: 0.75rem; color: var(--text-dim); margin-top: 4px; display: block;">Distancia máxima geoespacial ($near) para agrupar pasajeros en el mismo vehículo.</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-penalidad">Penalidad por Cancelación Tardía ($ COP)</label>
|
||
<input type="number" class="form-input" id="cfg-penalidad" value="15000" min="0" step="1000" required>
|
||
<span style="font-size: 0.75rem; color: var(--text-dim); margin-top: 4px; display: block;">Cobro automático en Bold si el usuario cancela con viaje ya asignado/activo.</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-comision">Comisión de la Plataforma (%)</label>
|
||
<input type="number" class="form-input" id="cfg-comision" value="15" min="0" max="50" step="1" required>
|
||
<span style="font-size: 0.75rem; color: var(--text-dim); margin-top: 4px; display: block;">Porcentaje retenido por Pacifictrans Go sobre cada servicio completado.</span>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Columna 2: Mensajería y Fletes -->
|
||
<div>
|
||
<h3 style="color: var(--accent-amber); font-size: 1.15rem; margin-bottom: 1.25rem;">📦 Mensajería y Fletes Especiales</h3>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-base-paquete">Tarifa Base Logística ($ COP)</label>
|
||
<input type="number" class="form-input" id="cfg-base-paquete" value="25000" min="5000" step="1000" required>
|
||
<span style="font-size: 0.75rem; color: var(--text-dim); margin-top: 4px; display: block;">Costo base fijo de recepción y despacho de paquetería.</span>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-km-paquete">Costo por Kilómetro Recorrido ($ COP / Km)</label>
|
||
<input type="number" class="form-input" id="cfg-km-paquete" value="1200" min="100" step="50" required>
|
||
<span style="font-size: 0.75rem; color: var(--text-dim); margin-top: 4px; display: block;">Multiplicador por distancia en el corredor (115 km Cali-Buenaventura).</span>
|
||
</div>
|
||
|
||
<div class="grid-2col" style="gap: 1rem; margin-bottom: 0;">
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-factor-sobre">Factor Sobre (Doc.)</label>
|
||
<input type="number" class="form-input" id="cfg-factor-sobre" value="1.0" min="0.5" max="3" step="0.1" required>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-factor-mediano">Factor Mediano (15kg)</label>
|
||
<input type="number" class="form-input" id="cfg-factor-mediano" value="1.6" min="0.5" max="5" step="0.1" required>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="grid-2col" style="gap: 1rem; margin-bottom: 0;">
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-factor-grande">Factor Grande (30kg)</label>
|
||
<input type="number" class="form-input" id="cfg-factor-grande" value="2.2" min="1" max="10" step="0.1" required>
|
||
</div>
|
||
<div class="form-group">
|
||
<label class="form-label" for="cfg-seguro-base">Seguro Base ($ COP)</label>
|
||
<input type="number" class="form-input" id="cfg-seguro-base" value="5000" min="0" step="500" required>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Botón de Guardado y Estado -->
|
||
<div style="margin-top: 2rem; border-top: 1px solid var(--border-glass); padding-top: 1.5rem; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem;">
|
||
<div id="tariffs-save-status" style="font-size: 0.92rem; color: #94a3b8;">
|
||
💾 Tarifas sincronizadas con MongoDB.
|
||
</div>
|
||
<button type="submit" class="btn-primary" id="btn-save-tariffs" style="width: auto; padding: 0.9rem 2.5rem;">
|
||
💾 Guardar y Aplicar Nuevas Tarifas
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- SECCIÓN DESCARGA APK -->
|
||
<section class="download-card" id="descarga-apk">
|
||
<div>
|
||
<span style="color: #22c55e; font-weight: 700; text-transform: uppercase; font-size: 0.8rem; letter-spacing: 0.08em;">App Oficial Android</span>
|
||
<h3 style="font-size: 2.2rem; color: #fff; margin-top: 0.25rem; margin-bottom: 0.75rem;">Pacifictrans Go Móvil</h3>
|
||
<p style="color: var(--text-muted); max-width: 500px; font-size: 1rem;">
|
||
Instala la aplicación nativa en tu dispositivo Android. Accede a navegación por Waze en un toque, pagos instantáneos con Bold y seguimiento en vivo de tu viaje.
|
||
</p>
|
||
</div>
|
||
|
||
<a href="/PacifictransGo.apk" class="btn-apk-large" id="btn-download-apk-footer">
|
||
<svg width="28" height="28" viewBox="0 0 24 24" fill="currentColor">
|
||
<path d="M17.523 15.3414c-.5511 0-.9993-.4486-.9993-1.0001s.4482-1.0001.9993-1.0001c.552 0 1.0001.4486 1.0001 1.0001s-.4481 1.0001-1.0001 1.0001m-11.046 0c-.5511 0-.9993-.4486-.9993-1.0001s.4482-1.0001.9993-1.0001c.552 0 1.0001.4486 1.0001 1.0001s-.4481 1.0001-1.0001 1.0001m11.4045-6.02l1.997-3.4589c.1408-.2439.0573-.5552-.1866-.696-.2438-.1408-.5551-.0573-.696.1866l-2.0238 3.5054c-1.5037-.6873-3.1979-1.0772-4.9691-1.0772s-3.4654.3899-4.9691 1.0772l-2.0238-3.5054c-.1409-.2439-.4522-.3274-.696-.1866-.2439.1408-.3274.4521-.1866.696l1.997 3.4589c-3.7997 2.0623-6.375 5.9863-6.446 10.5369h24.646c-.071-4.5506-2.6463-8.4746-6.446-10.5369"/>
|
||
</svg>
|
||
Descargar PacifictransGo.apk (37.1 MB)
|
||
</a>
|
||
</section>
|
||
</div>
|
||
</main>
|
||
|
||
<!-- FOOTER -->
|
||
<footer class="footer">
|
||
<div style="max-width: 1280px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem;">
|
||
<div>
|
||
<strong style="color: #fff;">Pacifictrans Go</strong> — Transporte Especial Cali - Buenaventura
|
||
</div>
|
||
<div>
|
||
Atención y Soporte WhatsApp: <a href="https://wa.me/573167455877" target="_blank" style="color: var(--accent-cyan); text-decoration: none;">+57 316 745 5877</a>
|
||
</div>
|
||
<div>
|
||
© 2026 Almeira Group. Todos los derechos reservados.
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="/js/app.js"></script>
|
||
</body>
|
||
</html>
|