From 259bbd1fed7f5769f8966bdfe89e8efad71f0e04 Mon Sep 17 00:00:00 2001 From: Hanzo_dev <2002samudiojohan@gmail.com> Date: Tue, 24 Feb 2026 16:39:38 -0500 Subject: [PATCH] feat: update routes with color and direction, improve admin routes view, and update firebase config/auth --- ...d1234abcd_add_color_direction_to_routes.py | 25 +++++++ backend/app/models/route.py | 2 + backend/app/schemas/route.py | 5 +- frontend/firebase.json | 3 +- frontend/src/components/auth/LoginForm.vue | 32 ++++----- frontend/src/components/auth/RegisterForm.vue | 68 ++++++++++++------ frontend/src/firebaseConfig.ts | 29 ++++---- frontend/src/views/AdminRoutes.vue | 72 ++++++++++++------- frontend/src/views/AuthView.vue | 7 +- frontend/src/views/SplashScreen.vue | 26 ++++++- 10 files changed, 185 insertions(+), 84 deletions(-) create mode 100644 backend/alembic/versions/ffcd1234abcd_add_color_direction_to_routes.py diff --git a/backend/alembic/versions/ffcd1234abcd_add_color_direction_to_routes.py b/backend/alembic/versions/ffcd1234abcd_add_color_direction_to_routes.py new file mode 100644 index 0000000..0929638 --- /dev/null +++ b/backend/alembic/versions/ffcd1234abcd_add_color_direction_to_routes.py @@ -0,0 +1,25 @@ +"""Add color and direction to routes + +Revision ID: ffcd1234abcd +Revises: 3fe72cd3f722 +Create Date: 2026-02-24 16:50:00.000000 + +""" +from typing import Sequence, Union +from alembic import op +import sqlalchemy as sa +import sqlmodel + +# revision identifiers, used by Alembic. +revision: str = 'ffcd1234abcd' +down_revision: Union[str, None] = '3fe72cd3f722' +branch_labels: Union[str, Sequence[str], None] = None +depends_on: Union[str, Sequence[str], None] = None + +def upgrade() -> None: + op.add_column('routes', sa.Column('color', sqlmodel.sql.sqltypes.AutoString(), nullable=True, server_default='#FEE715')) + op.add_column('routes', sa.Column('direction', sqlmodel.sql.sqltypes.AutoString(), nullable=True, server_default='outbound')) + +def downgrade() -> None: + op.drop_column('routes', 'direction') + op.drop_column('routes', 'color') diff --git a/backend/app/models/route.py b/backend/app/models/route.py index 91b3a1a..a1752fc 100644 --- a/backend/app/models/route.py +++ b/backend/app/models/route.py @@ -24,6 +24,8 @@ class Route(SQLModel, table=True): description: Optional[str] = None origin_city: str destination_city: str + color: str = Field(default="#FEE715") + direction: str = Field(default="outbound") distance_km: Optional[float] = None estimated_duration_minutes: Optional[int] = None average_speed_kmh: Optional[float] = None diff --git a/backend/app/schemas/route.py b/backend/app/schemas/route.py index bcf37f2..7d9f2f9 100644 --- a/backend/app/schemas/route.py +++ b/backend/app/schemas/route.py @@ -12,6 +12,8 @@ class RouteBase(BaseModel): description: Optional[str] = None origin_city: str destination_city: str + color: Optional[str] = "#FEE715" + direction: Optional[str] = "outbound" distance_km: Optional[float] = None estimated_duration_minutes: Optional[int] = None average_speed_kmh: Optional[float] = None @@ -29,6 +31,8 @@ class RouteUpdate(BaseModel): description: Optional[str] = None origin_city: Optional[str] = None destination_city: Optional[str] = None + color: Optional[str] = None + direction: Optional[str] = None distance_km: Optional[float] = None estimated_duration_minutes: Optional[int] = None average_speed_kmh: Optional[float] = None @@ -47,4 +51,3 @@ class RouteResponse(RouteBase): class Config: from_attributes = True - diff --git a/frontend/firebase.json b/frontend/firebase.json index 88f64a9..9293cda 100644 --- a/frontend/firebase.json +++ b/frontend/firebase.json @@ -1,6 +1,7 @@ { "hosting": { "public": "dist", + "cleanUrls": true, "ignore": [ "firebase.json", "**/.*", @@ -8,7 +9,7 @@ ], "rewrites": [ { - "source": "**", + "source": "!{/__/**,/__}", "destination": "/index.html" } ] diff --git a/frontend/src/components/auth/LoginForm.vue b/frontend/src/components/auth/LoginForm.vue index 9d25151..a74c0eb 100644 --- a/frontend/src/components/auth/LoginForm.vue +++ b/frontend/src/components/auth/LoginForm.vue @@ -15,18 +15,18 @@ const errorMessage = ref('') const showPassword = ref(false) const router = useRouter() const authStore = useAuthStore() - const handleLogin = async () => { isLoading.value = true errorMessage.value = '' + console.log('Iniciando Login con correo...') try { const response = await authService.login({ - // CRÍTICO: enviar email en minúsculas para evitar mismatch con el backend email: email.value.trim().toLowerCase(), password: password.value, keep_session: keepSession.value }) + console.log('Backend login exitoso:', response) authStore.login(response.access_token, response.role, response.full_name) @@ -37,12 +37,13 @@ const handleLogin = async () => { else router.push('/map') } catch (error: any) { + console.error('Error Login detallado:', error) if (!error.response) { - errorMessage.value = 'Error de conexión. Verifica tu internet.' + errorMessage.value = 'Error de conexión. Verifica tu internet o el estado del servidor.' } else if (error.response.status === 401) { errorMessage.value = 'Correo o contraseña incorrectos.' } else { - errorMessage.value = error.response?.data?.detail || 'Error en el servidor.' + errorMessage.value = `Error (${error.response.status}): ${error.response?.data?.detail || 'Error en el servidor.'}` } } finally { isLoading.value = false @@ -52,22 +53,21 @@ const handleLogin = async () => { const handleGoogleLogin = async () => { isLoading.value = true errorMessage.value = '' + console.log('Iniciando Google Login...') try { const { token } = await signInWithGoogle() - const response = await authService.googleLogin(token) - - authStore.login(response.access_token, response.role, response.full_name) - - const role = response.role.toUpperCase() - if (role === 'ADMIN') router.push('/admin') - else if (role === 'DRIVER') router.push('/driver') - else if (role === 'PROMOTER') router.push('/promoter') - else router.push('/map') - + console.log('Firebase token obtenido:', token ? 'SI' : 'NO (Redirecting...)') + + if (token) { + const response = await authService.googleLogin(token) + console.log('Backend Google login exitoso:', response) + authStore.login(response.access_token, response.role, response.full_name) + router.push('/map') + } } catch (error: any) { - errorMessage.value = 'Error al iniciar sesión con Google.' - console.error(error) + console.error('Error Google Login:', error) + errorMessage.value = `Error con Google: ${error.message || 'Error desconocido'}` } finally { isLoading.value = false } diff --git a/frontend/src/components/auth/RegisterForm.vue b/frontend/src/components/auth/RegisterForm.vue index 5f3048a..fbd5c39 100644 --- a/frontend/src/components/auth/RegisterForm.vue +++ b/frontend/src/components/auth/RegisterForm.vue @@ -22,23 +22,50 @@ const showPassword = ref(false) const handleRegister = async () => { isLoading.value = true errorMessage.value = '' + console.log('Intentando registrar usuario...') try { - await authService.registerPassenger({ + const cleanEmail = email.value.trim().toLowerCase() + const cleanPass = password.value + + const regResponse = await authService.registerPassenger({ full_name: fullName.value.trim(), - email: email.value.trim().toLowerCase(), - password: password.value + email: cleanEmail, + password: cleanPass }) + console.log('Registro exitoso en backend:', regResponse) analyticsService.logEvent({ event_name: 'sign_up', properties: { method: 'email' } }) - successMessage.value = '¡Cuenta creada! Ahora puedes iniciar sesión.' - setTimeout(() => { emit('success') }, 2000) + // Iniciar sesión automáticamente después del registro + console.log('Iniciando sesión automática...') + const response = await authService.login({ + email: cleanEmail, + password: cleanPass + }) + console.log('Login automático exitoso:', response) + + authStore.login(response.access_token, response.role, response.full_name) + + successMessage.value = '¡Cuenta creada con éxito!' + + // Redirigir casi de inmediato + setTimeout(() => { + router.push('/map') + }, 1000) + } catch (error: any) { - errorMessage.value = error.response?.data?.detail || 'Error al crear la cuenta.' + console.error('Error detallado de registro:', error) + if (error.response) { + errorMessage.value = `Error del servidor (${error.response.status}): ${error.response.data?.detail || 'Error desconocido'}` + } else if (error.request) { + errorMessage.value = 'No se recibió respuesta del servidor. ¿Backend caído?' + } else { + errorMessage.value = `Error: ${error.message}` + } } finally { isLoading.value = false } @@ -47,27 +74,28 @@ const handleRegister = async () => { const handleGoogleRegister = async () => { isLoading.value = true errorMessage.value = '' + console.log('Iniciando Google Register...') try { const { token } = await signInWithGoogle() - const response = await authService.googleLogin(token) + console.log('Firebase token obtenido:', token ? 'SI' : 'NO (Redirecting...)') + + if (token) { + const response = await authService.googleLogin(token) + console.log('Backend Google login exitoso:', response) - analyticsService.logEvent({ - event_name: 'sign_up', - properties: { method: 'google' } - }) + analyticsService.logEvent({ + event_name: 'sign_up', + properties: { method: 'google' } + }) - authStore.login(response.access_token, response.role, response.full_name) - - const role = response.role.toUpperCase() - if (role === 'ADMIN') router.push('/admin') - else if (role === 'DRIVER') router.push('/driver') - else if (role === 'PROMOTER') router.push('/promoter') - else router.push('/map') + authStore.login(response.access_token, response.role, response.full_name) + router.push('/map') + } } catch (error: any) { - errorMessage.value = 'Error al registrarse con Google. Intenta de nuevo.' - console.error(error) + console.error('Error Google Register:', error) + errorMessage.value = `Error con Google: ${error.message || 'Intenta de nuevo'}` } finally { isLoading.value = false } diff --git a/frontend/src/firebaseConfig.ts b/frontend/src/firebaseConfig.ts index 6d48c7e..1970102 100644 --- a/frontend/src/firebaseConfig.ts +++ b/frontend/src/firebaseConfig.ts @@ -31,17 +31,20 @@ const isMobile = () => { * - Uses signInWithRedirect on mobile (avoids popup blocking on mobile browsers) */ export const signInWithGoogle = async (): Promise<{ user: any; token: string }> => { - if (isMobile()) { - // On mobile, redirect flow is more reliable - await signInWithRedirect(auth, googleProvider); - // The page will reload; the result is handled by getGoogleRedirectResult() on app load - // We return a never-resolving promise to keep the UI in loading state - return new Promise(() => { }); - } else { - // On desktop, use popup - const result = await signInWithPopup(auth, googleProvider); - const token = await result.user.getIdToken(); - return { user: result.user, token }; + try { + if (isMobile()) { + console.log("DEBUG: Intentando signInWithRedirect..."); + await signInWithRedirect(auth, googleProvider); + return new Promise(() => { }); + } else { + console.log("DEBUG: Intentando signInWithPopup..."); + const result = await signInWithPopup(auth, googleProvider); + const token = await result.user.getIdToken(); + return { user: result.user, token }; + } + } catch (error: any) { + console.error("DEBUG: Error al iniciar Google:", error); + throw error; } }; @@ -58,8 +61,8 @@ export const getGoogleRedirectResult = async (): Promise<{ user: any; token: str return { user: result.user, token }; } return null; - } catch (error) { - console.error("Error getting redirect result:", error); + } catch (error: any) { + console.error("DEBUG: Error en getRedirectResult:", error); return null; } }; diff --git a/frontend/src/views/AdminRoutes.vue b/frontend/src/views/AdminRoutes.vue index a34737b..7a22174 100644 --- a/frontend/src/views/AdminRoutes.vue +++ b/frontend/src/views/AdminRoutes.vue @@ -293,16 +293,21 @@ function handleBack() { async function createRoute() { const name = prompt("Nombre de la nueva ruta:") if (!name) return - const route = await routesService.createRoute({ - name, - origin_city: 'David', - destination_city: 'Boquete', - status: 'active', - color: '#FEE715', - direction: 'outbound' - }) - routes.value = await routesService.getAllRoutes() - selectRoute(route) + try { + const route = await routesService.createRoute({ + name, + origin_city: 'David', + destination_city: 'Boquete', + status: 'active', + color: '#FEE715', + direction: 'outbound' + }) + routes.value = await routesService.getAllRoutes() + selectRoute(route) + } catch (err: any) { + console.error('Error creating route:', err) + alert('No se pudo crear la ruta: ' + (err.response?.data?.detail || err.message)) + } } async function selectRoute(route: Route) { @@ -312,14 +317,19 @@ async function selectRoute(route: Route) { async function updateRouteDetails() { if (!selectedRoute.value) return - await routesService.updateRoute(selectedRoute.value.id, { - name: selectedRoute.value.name, - origin_city: selectedRoute.value.origin_city, - destination_city: selectedRoute.value.destination_city, - average_speed_kmh: selectedRoute.value.average_speed_kmh, - status: selectedRoute.value.status, - color: selectedRoute.value.color - }) + try { + await routesService.updateRoute(selectedRoute.value.id, { + name: selectedRoute.value.name, + origin_city: selectedRoute.value.origin_city, + destination_city: selectedRoute.value.destination_city, + average_speed_kmh: selectedRoute.value.average_speed_kmh, + status: selectedRoute.value.status, + color: selectedRoute.value.color + }) + } catch (err: any) { + console.error('Error updating route:', err) + // Opcional: mostrar notificación sutil en lugar de alert recurrente + } } async function addStop() { @@ -331,11 +341,16 @@ async function addStop() { async function addExistingStop(stopId: string) { if (!selectedRoute.value) return - await routesService.addStopToRoute(selectedRoute.value.id, { - stop_id: stopId, - stop_order: routeStops.value.length + 1 - }) - routeStops.value = await routesService.getRouteStops(selectedRoute.value.id) + try { + await routesService.addStopToRoute(selectedRoute.value.id, { + stop_id: stopId, + stop_order: routeStops.value.length + 1 + }) + routeStops.value = await routesService.getRouteStops(selectedRoute.value.id) + } catch (err: any) { + console.error('Error adding stop:', err) + alert('Error al añadir parada: ' + (err.response?.data?.detail || err.message)) + } } async function updateStop(stop: BusStop) { @@ -364,9 +379,14 @@ async function removeStop(stop: BusStop) { async function deleteRoute() { if (!selectedRoute.value) return if (confirm(`Estás SEGURO de que quieres eliminar la ruta ${selectedRoute.value.name}? Esta acción es permanente.`)) { - await routesService.deleteRoute(selectedRoute.value.id) - selectedRoute.value = null - routes.value = await routesService.getAllRoutes() + try { + await routesService.deleteRoute(selectedRoute.value.id) + selectedRoute.value = null + routes.value = await routesService.getAllRoutes() + } catch (err: any) { + console.error('Error deleting route:', err) + alert('No se pudo eliminar la ruta: ' + (err.response?.data?.detail || err.message)) + } } } diff --git a/frontend/src/views/AuthView.vue b/frontend/src/views/AuthView.vue index 85eff93..849e099 100644 --- a/frontend/src/views/AuthView.vue +++ b/frontend/src/views/AuthView.vue @@ -26,9 +26,8 @@ onMounted(async () => { else if (role === 'PROMOTER') router.push('/promoter') else router.push('/map') } - } catch (e) { - // No redirect result pending, or error — ignore silently - console.warn('Google redirect result:', e) + } catch (e: any) { + console.error('Google redirect result error:', e) } }) @@ -42,7 +41,7 @@ onMounted(async () => { diff --git a/frontend/src/views/SplashScreen.vue b/frontend/src/views/SplashScreen.vue index 5a0e491..8f31a70 100644 --- a/frontend/src/views/SplashScreen.vue +++ b/frontend/src/views/SplashScreen.vue @@ -28,10 +28,14 @@ import { ref, onMounted } from 'vue' import { useRouter } from 'vue-router' import { useRouteStore } from '@/stores/route' import { useBusStopStore } from '@/stores/busStop' +import { useAuthStore } from '@/stores/auth' +import { authService } from '@/services/authService' +import { getGoogleRedirectResult } from '@/firebaseConfig' const router = useRouter() const routeStore = useRouteStore() const busStopStore = useBusStopStore() +const authStore = useAuthStore() const logoVisible = ref(false) const showLoading = ref(false) @@ -79,7 +83,23 @@ function navigate() { } async function performInitializationTasks() { - // Task 1: Check connection and load routes + // Task 1: Check for Google Redirect Result (Mobile Login) + statusMessage.value = 'Verificando sesión...' + try { + const googleResult = await getGoogleRedirectResult() + if (googleResult) { + statusMessage.value = 'Iniciando sesión con Google...' + const response = await authService.googleLogin(googleResult.token) + authStore.login(response.access_token, response.role, response.full_name) + statusMessage.value = `¡Bienvenido ${response.full_name}!` + // Wait a bit to show the welcome message + await new Promise(r => setTimeout(r, 800)) + } + } catch (error) { + console.error('Google Redirect handling failed:', error) + } + + // Task 2: Check connection and load routes statusMessage.value = 'Cargando datos de rutas...' try { await routeStore.loadRoutes() @@ -87,7 +107,7 @@ async function performInitializationTasks() { console.error('Error loading routes:', error) } - // Task 2: Load bus stops + // Task 3: Load bus stops statusMessage.value = 'Cargando paradas...' try { await busStopStore.loadBusStops() @@ -95,7 +115,7 @@ async function performInitializationTasks() { console.error('Error loading bus stops:', error) } - // Task 3: Prepared + // Task 4: Prepared statusMessage.value = 'Listo para usar' }