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

Implement Smart Location: auto-detect user location if preference is enabled, hide location button, and handle permission denial by resetting preference

Browse Source
This commit is contained in:
Johan Samudio
2026-03-01 12:15:08 -05:00
parent d0d75b8c98
commit 4d7b472c6c
20 changed files with 852 additions and 344 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/src/components/auth/LoginForm.vue
View File

@ -3,8 +3,10 @@ import { ref } from 'vue'
import { useRouter } from 'vue-router'
import { useAuthStore } from '@/stores/auth'
import { supabase } from '@/supabase'
import { useI18n } from 'vue-i18n'
const emit = defineEmits(['toggle'])
const { t } = useI18n()
const email = ref('')
const password = ref('')
@ -14,6 +16,7 @@ const errorMessage = ref('')
const showPassword = ref(false)
const router = useRouter()
const authStore = useAuthStore()
const handleLogin = async () => {
isLoading.value = true
errorMessage.value = ''
@ -26,9 +29,9 @@ const handleLogin = async () => {
} catch (error: any) {
console.error('Error Login:', error)
if (error.message?.includes('Invalid login credentials')) {
errorMessage.value = 'Correo o contraseña incorrectos.'
errorMessage.value = t('auth.invalidCreds')
} else {
errorMessage.value = `Error: ${error.message || 'Error desconocido.'}`
errorMessage.value = `${t('common.error')}: ${error.message || t('common.noData')}`
}
} finally {
isLoading.value = false
@ -59,7 +62,7 @@ const handleGoogleLogin = async () => {
// Se redirige automáticamente
} catch (error: any) {
console.error('Error Google Login:', error)
errorMessage.value = `Error con Google: ${error.message || 'Error desconocido'}`
errorMessage.value = `Error Google: ${error.message || t('common.error')}`
} finally {
isLoading.value = false
}
@ -76,12 +79,12 @@ const handleGoogleLogin = async () => {
@click="handleGoogleLogin"
>
<img src="https://www.gstatic.com/firebasejs/ui/2.0.0/images/auth/google.svg" width="20" height="20" alt="Google" />
<span>Continuar con Google</span>
<span>{{ t('auth.googleLogin') }}</span>
</button>
<div class="divider">
<span class="divider-line"></span>
<span class="divider-text">o con correo</span>
<span class="divider-text">{{ t('auth.orEmail') }}</span>
<span class="divider-line"></span>
</div>
@ -89,14 +92,14 @@ const handleGoogleLogin = async () => {
<form @submit.prevent="handleLogin">
<!-- Email -->
<div class="field">
<label class="field-label" for="login-email">Correo electrónico</label>
<label class="field-label" for="login-email">{{ t('auth.emailLabel') }}</label>
<div class="input-wrap">
<span class="material-icons input-icon">alternate_email</span>
<input
id="login-email"
type="email"
v-model="email"
placeholder="tu@correo.com"
:placeholder="t('auth.emailPlaceholder')"
required
autocomplete="email"
class="field-input"
@ -106,7 +109,7 @@ const handleGoogleLogin = async () => {
<!-- Contraseña -->
<div class="field">
<label class="field-label" for="login-password">Contraseña</label>
<label class="field-label" for="login-password">{{ t('auth.passLabel') }}</label>
<div class="input-wrap">
<span class="material-icons input-icon">lock</span>
<input
@ -135,7 +138,7 @@ const handleGoogleLogin = async () => {
<span class="keep-box" :class="{ 'keep-box--on': keepSession }">
<span v-if="keepSession" class="material-icons keep-check">check</span>
</span>
<span class="keep-label">Mantener sesión iniciada</span>
<span class="keep-label">{{ t('auth.keepSession') }}</span>
</label>
<!-- Error -->
@ -147,14 +150,14 @@ const handleGoogleLogin = async () => {
<!-- Botón enviar -->
<button type="submit" class="submit-btn" :disabled="isLoading">
<span v-if="isLoading" class="btn-spinner"></span>
<span>{{ isLoading ? 'Ingresando...' : 'Iniciar Sesión' }}</span>
<span>{{ isLoading ? t('auth.loggingIn') : t('auth.loginTab') }}</span>
</button>
</form>
<!-- Switch a registro -->
<p class="switch-text">
¿No tienes cuenta?
<button type="button" class="switch-link" @click="emit('toggle')">Regístrate aquí</button>
{{ t('auth.noAccount') }}
<button type="button" class="switch-link" @click="emit('toggle')">{{ t('auth.registerHere') }}</button>
</p>
</div>
</template>