josedario87
b9ba7a80db
Remove unused files and code: - Delete test/debug endpoints (test.get.ts, public.get.ts, user.get.ts, debug-config backup) - Remove unused OAuth wrapper (oauth-authentik.ts) - Clean up debug console.log statements - Simplify code comments Fix TypeScript errors: - Add @types/node dependency - Create index.d.ts with User interface extension - Fix UButton color props (red→error, gray→neutral) - Add type assertions in protected.get.ts Update documentation: - Enhance README.md as template documentation - Update SETUP.md with correct API routes (/api/auth/* instead of /auth/*) - Add NUXT_OAUTH_AUTHENTIK_SERVER_URL_INTERNAL documentation - Update endpoint documentation This commit prepares the repository to be used as a template for future Nuxt 4 + Authentik OAuth projects.
120 lines
3.8 KiB
Vue
120 lines
3.8 KiB
Vue
<script setup lang="ts">
|
|
const { loggedIn, user } = useUserSession()
|
|
|
|
// Estado de conexión (solo en cliente)
|
|
const isOnline = ref(true)
|
|
|
|
onMounted(() => {
|
|
// Inicializar estado de conexión
|
|
isOnline.value = navigator.onLine
|
|
|
|
// Escuchar cambios de conexión
|
|
const handleOnline = () => { isOnline.value = true }
|
|
const handleOffline = () => { isOnline.value = false }
|
|
|
|
window.addEventListener('online', handleOnline)
|
|
window.addEventListener('offline', handleOffline)
|
|
|
|
onUnmounted(() => {
|
|
window.removeEventListener('online', handleOnline)
|
|
window.removeEventListener('offline', handleOffline)
|
|
})
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="min-h-screen">
|
|
<header class="border-b border-gray-200 dark:border-gray-800">
|
|
<div class="container mx-auto px-4 py-4 flex justify-between items-center">
|
|
<h1 class="text-2xl font-bold">Seguidor de Lotes</h1>
|
|
<UserMenu />
|
|
</div>
|
|
</header>
|
|
|
|
<main class="container mx-auto px-4 py-8">
|
|
<div v-if="loggedIn" class="space-y-6">
|
|
<UCard>
|
|
<template #header>
|
|
<h2 class="text-xl font-semibold">Bienvenido, {{ user?.name }}!</h2>
|
|
</template>
|
|
|
|
<div class="space-y-4">
|
|
<p>Has iniciado sesión correctamente.</p>
|
|
|
|
<div class="grid gap-4 md:grid-cols-2">
|
|
<UCard>
|
|
<template #header>
|
|
<h3 class="font-semibold">Información del Usuario</h3>
|
|
</template>
|
|
<dl class="space-y-2 text-sm">
|
|
<div>
|
|
<dt class="font-medium">Email:</dt>
|
|
<dd class="text-gray-600 dark:text-gray-400">{{ user?.email }}</dd>
|
|
</div>
|
|
<div>
|
|
<dt class="font-medium">Usuario:</dt>
|
|
<dd class="text-gray-600 dark:text-gray-400">{{ user?.username }}</dd>
|
|
</div>
|
|
<div v-if="user?.groups?.length">
|
|
<dt class="font-medium">Grupos:</dt>
|
|
<dd class="text-gray-600 dark:text-gray-400">{{ user.groups.join(', ') }}</dd>
|
|
</div>
|
|
</dl>
|
|
</UCard>
|
|
|
|
<UCard>
|
|
<template #header>
|
|
<h3 class="font-semibold">Estado PWA</h3>
|
|
</template>
|
|
<div class="space-y-2 text-sm">
|
|
<div class="flex items-center gap-2">
|
|
<div class="w-2 h-2 rounded-full" :class="isOnline ? 'bg-green-500' : 'bg-red-500'"></div>
|
|
<span>{{ isOnline ? 'En línea' : 'Sin conexión' }}</span>
|
|
</div>
|
|
<p class="text-gray-600 dark:text-gray-400">
|
|
La aplicación funciona offline gracias al service worker
|
|
</p>
|
|
</div>
|
|
</UCard>
|
|
</div>
|
|
</div>
|
|
</UCard>
|
|
|
|
<UCard>
|
|
<template #header>
|
|
<h3 class="font-semibold">Páginas Protegidas</h3>
|
|
</template>
|
|
<div class="flex gap-2">
|
|
<UButton to="/dashboard" color="primary">
|
|
Ir al Dashboard
|
|
</UButton>
|
|
<UButton to="/profile" color="neutral">
|
|
Ver Perfil
|
|
</UButton>
|
|
</div>
|
|
</UCard>
|
|
</div>
|
|
|
|
<div v-else class="text-center space-y-4">
|
|
<UCard>
|
|
<template #header>
|
|
<h2 class="text-xl font-semibold">Bienvenido a Seguidor de Lotes</h2>
|
|
</template>
|
|
|
|
<div class="space-y-4">
|
|
<p>Por favor, inicia sesión para acceder a la aplicación.</p>
|
|
|
|
<UButton
|
|
to="/login"
|
|
color="primary"
|
|
size="lg"
|
|
>
|
|
Iniciar Sesión
|
|
</UButton>
|
|
</div>
|
|
</UCard>
|
|
</div>
|
|
</main>
|
|
</div>
|
|
</template>
|