fix: fully decouple schedules from map search UI and center offers

This commit is contained in:
2026-02-28 22:08:34 -05:00
parent 69fbe3dcbc
commit 23b7bd4539

View File

@ -51,6 +51,7 @@ const showRouteDropdown = ref(false);
const routeCardRef = ref<HTMLElement | null>(null); const routeCardRef = ref<HTMLElement | null>(null);
const mappingSequenceId = ref(0); const mappingSequenceId = ref(0);
const wasSelectedFromMap = ref(false); const wasSelectedFromMap = ref(false);
const isInternalSelection = ref(false);
const alturaNavbar = ref(64); const alturaNavbar = ref(64);
// Search state // Search state
@ -259,6 +260,12 @@ async function initializeMap() {
watch( watch(
() => routeStore.selectedRouteId, () => routeStore.selectedRouteId,
async (routeId, oldRouteId) => { async (routeId, oldRouteId) => {
// Si la selección no viene de dentro de MapView (selectRouteAndClose),
// reseteamos el flag de origen Mapa para que el buscador no se "fije"
if (!isInternalSelection.value) {
wasSelectedFromMap.value = false;
}
// ALWAYS clear markers first when route changes - do this immediately // ALWAYS clear markers first when route changes - do this immediately
if (oldRouteId !== routeId) { if (oldRouteId !== routeId) {
console.log(`Route changing from ${oldRouteId} to ${routeId} - clearing markers`) console.log(`Route changing from ${oldRouteId} to ${routeId} - clearing markers`)
@ -395,6 +402,7 @@ async function updatePromoMarkers() {
async function selectRouteAndClose(routeId: string, routeName: string) { async function selectRouteAndClose(routeId: string, routeName: string) {
console.log(`🤖 JARVIS: Iniciando viaje hacia ${routeName}`); console.log(`🤖 JARVIS: Iniciando viaje hacia ${routeName}`);
isInternalSelection.value = true;
wasSelectedFromMap.value = true; wasSelectedFromMap.value = true;
await routeStore.selectRoute(routeId, routeName); await routeStore.selectRoute(routeId, routeName);
showRouteDropdown.value = false; showRouteDropdown.value = false;
@ -404,6 +412,7 @@ async function selectRouteAndClose(routeId: string, routeName: string) {
if (routeStore.selectedRouteStops.length > 0) { if (routeStore.selectedRouteStops.length > 0) {
await highlightOptimalStopForRoute(); await highlightOptimalStopForRoute();
} }
isInternalSelection.value = false;
} }
async function updateActiveUnits() { async function updateActiveUnits() {
if (!isLoaded.value) return; if (!isLoaded.value) return;
@ -607,7 +616,7 @@ async function highlightOptimalStopForRoute() {
</div> </div>
<!-- Uber-like Search Interface --> <!-- Uber-like Search Interface -->
<div class="uber-search-container" :class="{ 'compact-mode': routeStore.selectedRouteId && !showUberSearch }"> <div class="uber-search-container" :class="{ 'compact-mode': routeStore.selectedRouteId && wasSelectedFromMap && !showUberSearch }">
<!-- Floating Triggers --> <!-- Floating Triggers -->
<div v-if="!showUberSearch" class="triggers-row"> <div v-if="!showUberSearch" class="triggers-row">
<!-- Shrunk Trigger (Icon only) - Only if selected from MAP --> <!-- Shrunk Trigger (Icon only) - Only if selected from MAP -->
@ -633,7 +642,7 @@ async function highlightOptimalStopForRoute() {
<!-- Nuevo Banner de Parada Cercana Alineado (Redimensionado y con ETA) --> <!-- Nuevo Banner de Parada Cercana Alineado (Redimensionado y con ETA) -->
<Transition name="banner-slide"> <Transition name="banner-slide">
<div <div
v-if="paradaCercana && routeStore.selectedRouteId && !showETACard && !isBannerClosing" v-if="paradaCercana && routeStore.selectedRouteId && !showETACard && !isBannerClosing && wasSelectedFromMap"
class="best-stop-banner-compact" class="best-stop-banner-compact"
> >
<div class="banner-icon-bg"> <div class="banner-icon-bg">
@ -932,9 +941,9 @@ async function highlightOptimalStopForRoute() {
═══════════════════════════════════════ */ ═══════════════════════════════════════ */
.offers-sheet { .offers-sheet {
position: fixed; position: fixed;
bottom: 80px; /* Separado del borde inferior/menú */ top: 50%;
left: 50%; left: 50%;
transform: translateX(-50%) translateY(0); transform: translate(-50%, -50%);
width: 92%; width: 92%;
max-width: 400px; max-width: 400px;
background: rgba(255, 255, 255, 0.85); background: rgba(255, 255, 255, 0.85);
@ -947,7 +956,7 @@ async function highlightOptimalStopForRoute() {
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
color: #000; color: #000;
overflow: hidden; overflow: hidden;
transition: transform 0.6s cubic-bezier(0.32, 0.72, 0, 1), opacity 0.5s ease; transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.5s ease;
} }
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
@ -1701,7 +1710,7 @@ html.light-theme .uber-search-trigger-compact {
} }
.sheet-slide-enter-from, .sheet-slide-enter-from,
.sheet-slide-leave-to { .sheet-slide-leave-to {
transform: translateX(-50%) translateY(110%) scale(0.95); transform: translate(-50%, -50%) scale(0.8);
opacity: 0; opacity: 0;
} }