Consult AS Technology
c77b4c0628
Fase 1 - UI: dark mode, skeletons, toasts Fase 2 - Filtros: avanzados Mi día, búsqueda global Ctrl+K Fase 3 - Datos: export Excel, notas apartados, auditoría Fase 4 - Dashboard: gráficas vendedor + métricas uso Fase 5 - Responsive: tablets optimizadas Fase 6 - PWA: IndexedDB offline, push notifications Backend: 3 tablas nuevas, 6 services, 6 endpoints nuevos 721 API tests + fronts verdes.
52 lines
2.1 KiB
TypeScript
52 lines
2.1 KiB
TypeScript
import { useState, type ReactNode } from 'react'
|
|
import { getSesion, logout, type Sesion } from '../services/auth'
|
|
import CambiarPasswordModal from './CambiarPasswordModal'
|
|
import LoginScreen from './LoginScreen'
|
|
|
|
/**
|
|
* Gate de autenticación: sin sesión solo se ve el login; con sesión se ve la
|
|
* app con una barra discreta "nombre · rol", "Contraseña" (modal de cambio)
|
|
* y botón "Salir".
|
|
*/
|
|
export default function AuthGate({ children }: { children: ReactNode }) {
|
|
const [sesion, setSesion] = useState<Sesion | null>(() => getSesion())
|
|
const [modalPassword, setModalPassword] = useState(false)
|
|
|
|
if (!sesion) {
|
|
return <LoginScreen onLogin={() => setSesion(getSesion())} />
|
|
}
|
|
|
|
return (
|
|
<div className="min-h-screen bg-[#F8FAFC] dark:bg-[#0F172A] text-[#111827] dark:text-[#E2E8F0] dark:bg-[#0F172A] dark:text-[#E2E8F0]">
|
|
<div className="border-b border-[#E5E7EB] bg-white dark:border-[#1E293B] dark:bg-[#1E293B]">
|
|
<div className="mx-auto flex max-w-[1280px] items-center justify-between px-4 py-2 sm:px-6">
|
|
<span className="text-xs font-medium text-[#64748B] dark:text-[#94A3B8]">
|
|
{sesion.usuario.nombre} · {sesion.usuario.rol}
|
|
</span>
|
|
<div className="flex items-center gap-4">
|
|
<button
|
|
type="button"
|
|
onClick={() => setModalPassword(true)}
|
|
className="rounded-lg px-2 py-1 text-xs font-medium text-[#64748B] dark:text-[#94A3B8] transition-colors duration-100 hover:text-[#111827] dark:text-[#E2E8F0]"
|
|
>
|
|
Contraseña
|
|
</button>
|
|
<button
|
|
type="button"
|
|
onClick={() => {
|
|
logout()
|
|
setSesion(null)
|
|
}}
|
|
className="rounded-lg px-2 py-1 text-xs font-medium text-accent transition-colors duration-100 hover:text-accent-hover"
|
|
>
|
|
Salir
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{children}
|
|
{modalPassword && <CambiarPasswordModal onCerrar={() => setModalPassword(false)} />}
|
|
</div>
|
|
)
|
|
}
|