Hanzo_Dev/SIB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: decouple map search from global selection and fix offers anchoring/masking

Browse Source
This commit is contained in:
Johan Samudio
2026-02-28 22:01:16 -05:00
parent 147ea98cda
commit 69fbe3dcbc
1 changed files with 71 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/views/MapView.vue
View File

@ -50,6 +50,7 @@ const optimalStopPulse = ref<any>(null);
const showRouteDropdown = ref(false);
const routeCardRef = ref<HTMLElement | null>(null);
const mappingSequenceId = ref(0);
const wasSelectedFromMap = ref(false);
const alturaNavbar = ref(64);
// Search state
@ -276,6 +277,7 @@ watch(
} else {
// Clear markers when no route is selected
lastProcessedRouteId.value = null;
wasSelectedFromMap.value = false; // Reset selection origin
clearMapMarkers();
}
},
@ -393,6 +395,7 @@ async function updatePromoMarkers() {
async function selectRouteAndClose(routeId: string, routeName: string) {
console.log(`🤖 JARVIS: Iniciando viaje hacia ${routeName}`);
wasSelectedFromMap.value = true;
await routeStore.selectRoute(routeId, routeName);
showRouteDropdown.value = false;
showUberSearch.value = false; // Close the expanded search panel
@ -607,9 +610,9 @@ async function highlightOptimalStopForRoute() {
<div class="uber-search-container" :class="{ 'compact-mode': routeStore.selectedRouteId && !showUberSearch }">
<!-- Floating Triggers -->
<div v-if="!showUberSearch" class="triggers-row">
<!-- Shrunk Trigger (Icon only) -->
<!-- Shrunk Trigger (Icon only) - Only if selected from MAP -->
<div
v-if="routeStore.selectedRouteId"
v-if="routeStore.selectedRouteId && wasSelectedFromMap"
class="uber-search-trigger circular"
@click="openUberSearch"
title="Buscar"
@ -685,7 +688,7 @@ async function highlightOptimalStopForRoute() {
v-for="route in routeStore.allRoutes"
:key="route.id"
class="uber-result-item"
:class="{ 'selected-route': route.id === routeStore.selectedRouteId }"
:class="{ 'selected-route': route.id === routeStore.selectedRouteId && wasSelectedFromMap }"
@click="selectRouteAndClose(route.id, route.name)"
>
<div class="result-icon">
@ -702,9 +705,11 @@ async function highlightOptimalStopForRoute() {
</div> <!-- Fin uber-results -->
</div> <!-- Fin uber-search-panel -->
</Transition>
</div> <!-- Fin uber-search-container -->
</div> <!-- Ends uber-search-container -->
</div> <!-- Ends map-view -->
</div> <!-- Ends map-side -->
<!-- Offers Floating Card (Uber Eats style) -->
<!-- Offers Floating Card (Uber Eats style) - OUTSIDE map-side to avoid anchoring -->
<Transition name="sheet-slide">
<div v-if="showPromos && couponStore.coupons.length > 0" class="offers-sheet">
<!-- Header -->
@ -746,7 +751,6 @@ async function highlightOptimalStopForRoute() {
<span class="sheet-biz-name">{{ currentPromo.business?.name || 'Local' }}</span>
<h3 class="sheet-promo-title">{{ currentPromo.title }}</h3>
<button class="sheet-cta" @click="handlePromoClick(currentPromo)">Ver detalles</button>
<!-- CTA to business removed for simplification -->
</div>
</div>
</Transition>
@ -768,8 +772,6 @@ async function highlightOptimalStopForRoute() {
</div>
</div>
</Transition>
</div>
</div>
<!-- Modal for details removed as per request to eliminate extra markings -->
@ -929,7 +931,7 @@ async function highlightOptimalStopForRoute() {
OFFERS BOTTOM SHEET
═══════════════════════════════════════ */
.offers-sheet {
position: absolute;
position: fixed;
bottom: 80px; /* Separado del borde inferior/menú */
left: 50%;
transform: translateX(-50%) translateY(0);
@ -940,7 +942,7 @@ async function highlightOptimalStopForRoute() {
-webkit-backdrop-filter: blur(20px) saturate(180%);
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 24px;
z-index: 2000;
z-index: 3000; /* Aumentado para estar sobre todo */
padding: 12px;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
color: #000;