Fix auth form visibility (static imports + remove transition) and map zoom logic synchronization

This commit is contained in:
2026-03-01 14:28:25 -05:00
parent b7e6731c54
commit ae2b65609a
2 changed files with 27 additions and 14 deletions

View File

@ -1,13 +1,11 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted } from 'vue' import { ref, onMounted } from 'vue'
import { useRouter, useRoute } from 'vue-router' import { useRouter, useRoute } from 'vue-router'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
const { t } = useI18n()
import LoginForm from '@/components/auth/LoginForm.vue' import LoginForm from '@/components/auth/LoginForm.vue'
import RegisterForm from '@/components/auth/RegisterForm.vue' import RegisterForm from '@/components/auth/RegisterForm.vue'
const { t } = useI18n()
const isLogin = ref(true) const isLogin = ref(true)
const toggleAuth = () => { isLogin.value = !isLogin.value } const toggleAuth = () => { isLogin.value = !isLogin.value }
const router = useRouter() const router = useRouter()
@ -67,11 +65,9 @@ onMounted(() => {
{{ sessionExpiredMessage }} {{ sessionExpiredMessage }}
</div> </div>
<!-- Formularios con transición --> <!-- Formularios directos para evitar bugs de transición -->
<Transition name="auth-slide" mode="out-in">
<LoginForm v-if="isLogin" @toggle="toggleAuth" /> <LoginForm v-if="isLogin" @toggle="toggleAuth" />
<RegisterForm v-else @toggle="toggleAuth" @success="isLogin = true" /> <RegisterForm v-else @toggle="toggleAuth" @success="isLogin = true" />
</Transition>
</div> </div>
<!-- Footer --> <!-- Footer -->

View File

@ -48,6 +48,7 @@ const userCoords = ref<{ lat: number; lng: number } | null>(null);
const optimalStopPulse = ref<any>(null); const optimalStopPulse = ref<any>(null);
const showRouteDropdown = ref(false); const showRouteDropdown = ref(false);
const isInternalSelection = ref(false); const isInternalSelection = ref(false);
const forceDetailedZoom = ref(false);
const alturaNavbar = ref(64); const alturaNavbar = ref(64);
// Search state // Search state
@ -385,6 +386,14 @@ async function updateMapMarkers(skipZoom = false) {
return; return;
} }
// SI SE REQUIERE ZOOM DETALLADO (selección manual desde el mapa)
if (forceDetailedZoom.value) {
console.log('🤖 JARVIS: Aplicando zoom detallado a la parada más cercana...');
await highlightOptimalStopForRoute();
forceDetailedZoom.value = false; // Consumimos el flag
isInternalSelection.value = false; // Limpiamos el flag de control
}
// All stop markers loop removed per request to avoid marking stops on map // All stop markers loop removed per request to avoid marking stops on map
} finally { } finally {
isUpdatingMarkers.value = false; isUpdatingMarkers.value = false;
@ -438,17 +447,23 @@ 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}`);
if (routeStore.selectedRouteId === routeId) {
// Si la ruta ya estaba seleccionada, solo hacemos el zoom y cerramos
showUberSearch.value = false;
showRouteDropdown.value = false;
await highlightOptimalStopForRoute();
return;
}
isInternalSelection.value = true; isInternalSelection.value = true;
forceDetailedZoom.value = true;
routeStore.wasSelectedFromMap = true; routeStore.wasSelectedFromMap = true;
await routeStore.selectRoute(routeId, routeName); await routeStore.selectRoute(routeId, routeName);
showRouteDropdown.value = false; showRouteDropdown.value = false;
showUberSearch.value = false; // Close the expanded search panel showUberSearch.value = false; // Close the expanded search panel
// Highlight the optimal stop ONLY in this flow when initiated from the map search // El zoom detallado ocurrirá dentro de updateMapMarkers cuando terminen de cargar los datos
if (routeStore.selectedRouteStops.length > 0) {
await highlightOptimalStopForRoute();
}
isInternalSelection.value = false;
} }
async function updateActiveUnits() { async function updateActiveUnits() {
if (!isLoaded.value) return; if (!isLoaded.value) return;
@ -574,7 +589,9 @@ async function highlightOptimalStopForRoute() {
const stopObj = paradaCercana.value as BusStop; const stopObj = paradaCercana.value as BusStop;
console.log(`🤖 JARVIS: Parada óptima detectada: ${stopObj.name}`); console.log(`🤖 JARVIS: Parada óptima detectada: ${stopObj.name}`);
// Ya no centramos o hacemos zoom aquí manual porque la nueva gráfica de updateMapMarkers ajusta bounds y engloba location. // Restaurar centrado y zoom en la parada óptima para que el usuario la vea claramente
setCenter(stopObj.latitude, stopObj.longitude);
setZoom(17); // Zoom más cercano para ver la parada y alrededores
// Añadir el PULSO NARANJA // Añadir el PULSO NARANJA
if (optimalStopPulse.value && typeof optimalStopPulse.value.setMap === 'function') { if (optimalStopPulse.value && typeof optimalStopPulse.value.setMap === 'function') {