Files
analiticaNucleo/nuxt4-app/app/pages/profile.vue
josedario87 aa76fea286 Refactor: Adaptar todos los componentes al sistema de temas
- Reemplazar colores hardcoded del tema café con variables --brand-*
  - #c08040 → var(--brand-primary-strong)
  - #d99a56 → var(--brand-primary)
  - #f0c07c → var(--brand-accent)
  - #1c140c → var(--brand-surface)
  - #3a2a16 → var(--brand-border)
  - #1b1209, #14100b → var(--brand-bg)

- Reemplazar colores de tipos de café con variables --coffee-*
  - #a855f7 → var(--coffee-uva)
  - #f97316 → var(--coffee-oreado)
  - #06b6d4 → var(--coffee-mojado)
  - #22c55e → var(--coffee-verde)

- Reemplazar clases gray-scale de Tailwind con variables de tema
  - text-gray-400, text-gray-500 → text-[var(--brand-text-muted)]
  - bg-gray-700/30 → bg-[var(--brand-surface)]

- Todos los componentes ahora responden dinámicamente a cambios de tema

Archivos adaptados:
- Páginas: error, informe-ingresos, panorama, explorer, metabase-debug, profile, notifications, settings
- Componentes de ingresos: GraficaSerieIngresos, GraficaSerieInversion, GraficaDinamicaPagadoDeposito, GraficaAcumuladoresUva, TotalesIngresoCompra, TotalesMonetarios, TotalesVerde, SecosVendidos, TopClientes, VistaTablaIngresos, VistaTablaIngresosConClientes, FiltrosActivos
- Componentes de comparativa: CosechasHeatmap, CosechasPorTipo, CosechasEvolucion, CosechasTotales
- Componentes de UI: ClienteSelector, DateRangeSelector, MetadatosCard, MaintenanceMode
- Componentes de auth: UserAvatar, UserMetadata
- Componentes de clientes: ClienteCard, VistaTablaClientes
- Componentes de rechazos: RechazoCard, RechazosRechazoCard, RechazosSubproductos
- Componentes de metabase: MetabaseCardDisplay, MetabaseCardsTable
2025-10-30 17:54:42 -06:00

90 lines
3.0 KiB
Vue

<script setup lang="ts">
const { user, isAuthenticated } = useAuthentik()
</script>
<template>
<UDashboardLayout>
<UDashboardPanel grow>
<UDashboardNavbar
title="Mi Perfil"
description="Gestiona tu información personal y preferencias de cuenta"
/>
<UDashboardPanelContent>
<div class="max-w-4xl mx-auto space-y-8">
<!-- Coming Soon Banner -->
<UCard>
<div class="text-center py-12 space-y-6">
<div class="flex justify-center">
<div class="w-24 h-24 rounded-full bg-blue-50 dark:bg-blue-950/30 flex items-center justify-center">
<UIcon name="i-lucide-user" class="size-12 text-blue-600 dark:text-blue-400" />
</div>
</div>
<div>
<h2 class="text-3xl font-bold text-gray-900 dark:text-white mb-2">
Página en construcción
</h2>
<p class="text-lg text-gray-600 dark:text-[var(--brand-text-muted)] mb-4">
Estamos trabajando en esta funcionalidad
</p>
<p class="text-sm text-gray-500 dark:text-gray-500 max-w-md mx-auto">
Pronto podrás gestionar tu perfil, actualizar tu información personal, cambiar tu foto de perfil y más.
</p>
</div>
<div class="flex justify-center gap-3">
<UButton
to="/"
color="primary"
icon="i-lucide-home"
>
Volver al inicio
</UButton>
</div>
</div>
</UCard>
<!-- Current User Info Preview -->
<UCard v-if="user">
<template #header>
<h3 class="text-lg font-semibold text-gray-900 dark:text-white">
Información actual del usuario
</h3>
</template>
<div class="space-y-4">
<div>
<label class="text-sm font-medium text-gray-700 dark:text-gray-300">
Nombre de usuario
</label>
<p class="mt-1 text-gray-900 dark:text-white">
{{ user.username || 'No especificado' }}
</p>
</div>
<div>
<label class="text-sm font-medium text-gray-700 dark:text-gray-300">
Nombre completo
</label>
<p class="mt-1 text-gray-900 dark:text-white">
{{ user.name || 'No especificado' }}
</p>
</div>
<div>
<label class="text-sm font-medium text-gray-700 dark:text-gray-300">
Email
</label>
<p class="mt-1 text-gray-900 dark:text-white">
{{ user.email || 'No especificado' }}
</p>
</div>
</div>
</UCard>
</div>
</UDashboardPanelContent>
</UDashboardPanel>
</UDashboardLayout>
</template>