feat(mi-dia): app /hoy + CRM ligero para vendedores
- App Mi día: KPIs, mis actividades, mis leads con acciones rápidas (contactado/intento/agenda cita/descartar con motivo), captura rápida de lead (409 en duplicado por teléfono), vista equipo para coordinadores - API: GET /api/mi-dia/resumen, POST /api/leads, /leads/:id/estado, /leads/:id/descartar; mapeo Usuario.mondayUserId (seed listo para cuando inviten a los vendedores a Monday) - Landing: tarjeta Mi día; tests api 188, mi-dia 8, landing 4
This commit is contained in:
@@ -2,9 +2,9 @@ import { describe, it, expect } from 'vitest'
|
||||
import { MODULOS } from './modulos'
|
||||
|
||||
describe('MODULOS', () => {
|
||||
it('expone los 5 módulos del ecosistema', () => {
|
||||
expect(MODULOS).toHaveLength(5)
|
||||
expect(MODULOS.map((m) => m.id)).toEqual(['cotizador', 'alta-clientes', 'cobranza', 'agente-ia', 'tableros'])
|
||||
it('expone los 6 módulos del ecosistema', () => {
|
||||
expect(MODULOS).toHaveLength(6)
|
||||
expect(MODULOS.map((m) => m.id)).toEqual(['cotizador', 'alta-clientes', 'cobranza', 'agente-ia', 'tableros', 'mi-dia'])
|
||||
})
|
||||
|
||||
it('cada módulo tiene nombre, descripción y URL válida', () => {
|
||||
@@ -22,6 +22,7 @@ describe('MODULOS', () => {
|
||||
expect(urls['cobranza']).toBe('/pay/')
|
||||
expect(urls['agente-ia']).toBe('/ai/')
|
||||
expect(urls['tableros']).toBe('/dash/')
|
||||
expect(urls['mi-dia']).toBe('/hoy/')
|
||||
})
|
||||
|
||||
it('no hay ids ni URLs duplicadas', () => {
|
||||
|
||||
@@ -37,4 +37,10 @@ export const MODULOS: Modulo[] = [
|
||||
descripcion: 'KPIs comerciales, inventario y cobranza en tiempo real',
|
||||
url: '/dash/',
|
||||
},
|
||||
{
|
||||
id: 'mi-dia',
|
||||
nombre: 'Mi día',
|
||||
descripcion: 'Agenda del vendedor: leads, actividades y captura rápida',
|
||||
url: '/hoy/',
|
||||
},
|
||||
]
|
||||
|
||||
12
apps/mi-dia/index.html
Normal file
12
apps/mi-dia/index.html
Normal file
@@ -0,0 +1,12 @@
|
||||
<!doctype html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>FRASA Desarrollos — Mi día</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
3897
apps/mi-dia/package-lock.json
generated
Normal file
3897
apps/mi-dia/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
27
apps/mi-dia/package.json
Normal file
27
apps/mi-dia/package.json
Normal file
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "mi-dia",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc -b && vite build",
|
||||
"test": "vitest run",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@fontsource/inter": "^5.3.0",
|
||||
"react": "^19.0.0",
|
||||
"react-dom": "^19.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tailwindcss/vite": "^4.0.0",
|
||||
"@types/react": "^19.0.2",
|
||||
"@types/react-dom": "^19.0.2",
|
||||
"@vitejs/plugin-react": "^4.3.4",
|
||||
"tailwindcss": "^4.0.0",
|
||||
"typescript": "~5.6.3",
|
||||
"vite": "^6.0.7",
|
||||
"vitest": "^2.1.8"
|
||||
}
|
||||
}
|
||||
38
apps/mi-dia/src/components/AuthGate.tsx
Normal file
38
apps/mi-dia/src/components/AuthGate.tsx
Normal file
@@ -0,0 +1,38 @@
|
||||
import { useState, type ReactNode } from 'react'
|
||||
import { getSesion, logout, type Sesion } from '../services/auth'
|
||||
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" y botón "Salir".
|
||||
*/
|
||||
export default function AuthGate({ children }: { children: ReactNode }) {
|
||||
const [sesion, setSesion] = useState<Sesion | null>(() => getSesion())
|
||||
|
||||
if (!sesion) {
|
||||
return <LoginScreen onLogin={() => setSesion(getSesion())} />
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-white text-neutral-900">
|
||||
<div className="border-b border-neutral-200">
|
||||
<div className="mx-auto flex max-w-6xl items-center justify-between px-4 py-2">
|
||||
<span className="text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
{sesion.usuario.nombre} · {sesion.usuario.rol}
|
||||
</span>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
logout()
|
||||
setSesion(null)
|
||||
}}
|
||||
className="text-xs font-bold uppercase tracking-widest text-accent transition-colors duration-150 hover:text-accent-hover"
|
||||
>
|
||||
Salir
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{children}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
11
apps/mi-dia/src/components/KpiCard.tsx
Normal file
11
apps/mi-dia/src/components/KpiCard.tsx
Normal file
@@ -0,0 +1,11 @@
|
||||
import type { ReactNode } from 'react'
|
||||
|
||||
export default function KpiCard({ titulo, valor, detalle }: { titulo: string; valor: ReactNode; detalle?: string }) {
|
||||
return (
|
||||
<div className="border border-neutral-200 bg-white p-6">
|
||||
<p className="text-xs font-bold uppercase tracking-widest text-neutral-500">{titulo}</p>
|
||||
<p className="mt-2 text-3xl font-light text-neutral-900">{valor}</p>
|
||||
{detalle && <p className="mt-2 text-xs text-neutral-500">{detalle}</p>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
88
apps/mi-dia/src/components/LoginScreen.tsx
Normal file
88
apps/mi-dia/src/components/LoginScreen.tsx
Normal file
@@ -0,0 +1,88 @@
|
||||
import { useState, type FormEvent } from 'react'
|
||||
import { login, ErrorLogin, type UsuarioSesion } from '../services/auth'
|
||||
|
||||
/** Pantalla de login StudioBlank: marca FRASA, usuario + contraseña, Enter envía */
|
||||
export default function LoginScreen({ onLogin }: { onLogin: (usuario: UsuarioSesion) => void }) {
|
||||
const [username, setUsername] = useState('')
|
||||
const [password, setPassword] = useState('')
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [cargando, setCargando] = useState(false)
|
||||
|
||||
async function enviar(e: FormEvent) {
|
||||
e.preventDefault()
|
||||
setError(null)
|
||||
setCargando(true)
|
||||
try {
|
||||
onLogin(await login(username, password))
|
||||
} catch (err) {
|
||||
setError(err instanceof ErrorLogin ? err.message : 'Usuario o contraseña incorrectos')
|
||||
} finally {
|
||||
setCargando(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="flex min-h-screen items-center justify-center bg-white px-4">
|
||||
<div className="w-full max-w-sm">
|
||||
<div className="mb-10 text-center">
|
||||
<p className="text-lg font-bold tracking-widest">FRASA</p>
|
||||
<p className="mt-2 text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
Acceso al ecosistema
|
||||
</p>
|
||||
</div>
|
||||
<form onSubmit={enviar} className="space-y-6">
|
||||
<div>
|
||||
<label
|
||||
htmlFor="login-usuario"
|
||||
className="mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500"
|
||||
>
|
||||
Usuario
|
||||
</label>
|
||||
<input
|
||||
id="login-usuario"
|
||||
type="text"
|
||||
value={username}
|
||||
onChange={(e) => setUsername(e.target.value)}
|
||||
autoComplete="username"
|
||||
autoFocus
|
||||
required
|
||||
className="w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label
|
||||
htmlFor="login-password"
|
||||
className="mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500"
|
||||
>
|
||||
Contraseña
|
||||
</label>
|
||||
<input
|
||||
id="login-password"
|
||||
type="password"
|
||||
value={password}
|
||||
onChange={(e) => setPassword(e.target.value)}
|
||||
autoComplete="current-password"
|
||||
required
|
||||
className="w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
{error && (
|
||||
<p
|
||||
role="alert"
|
||||
className="border border-red-700 px-4 py-3 text-xs font-bold uppercase tracking-widest text-red-700"
|
||||
>
|
||||
{error}
|
||||
</p>
|
||||
)}
|
||||
<button
|
||||
type="submit"
|
||||
disabled={cargando}
|
||||
className="w-full bg-accent px-5 py-3 text-xs font-bold uppercase tracking-widest text-white transition-colors duration-150 hover:bg-accent-hover disabled:opacity-50"
|
||||
>
|
||||
{cargando ? 'Entrando…' : 'Entrar'}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
23
apps/mi-dia/src/index.css
Normal file
23
apps/mi-dia/src/index.css
Normal file
@@ -0,0 +1,23 @@
|
||||
@import "tailwindcss";
|
||||
|
||||
@theme {
|
||||
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
|
||||
--color-accent: #1B4332;
|
||||
--radius-sm: 0;
|
||||
--radius-md: 0;
|
||||
--radius-lg: 0;
|
||||
--radius-xl: 0;
|
||||
--radius-2xl: 0;
|
||||
--radius-3xl: 0;
|
||||
}
|
||||
|
||||
@layer base {
|
||||
body {
|
||||
@apply bg-white text-neutral-900 antialiased;
|
||||
}
|
||||
|
||||
*:focus-visible {
|
||||
outline: 2px solid #1B4332;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
}
|
||||
64
apps/mi-dia/src/lib/mi-dia.test.ts
Normal file
64
apps/mi-dia/src/lib/mi-dia.test.ts
Normal file
@@ -0,0 +1,64 @@
|
||||
import { describe, expect, it } from 'vitest'
|
||||
import {
|
||||
esActividadVencida,
|
||||
esRolConEquipo,
|
||||
formatoFechaCorta,
|
||||
hoyLocal,
|
||||
MOTIVOS_NO_COMPRA,
|
||||
ORIGENES_LEAD,
|
||||
textoDiasRestantes,
|
||||
} from './mi-dia'
|
||||
|
||||
describe('catálogos', () => {
|
||||
it('orígenes = labels reales de la columna Origen del board Leads', () => {
|
||||
expect([...ORIGENES_LEAD]).toEqual(['WhatsApp', 'Web', 'Recomendado', 'Facebook', 'Otro'])
|
||||
})
|
||||
|
||||
it('motivos de descarte = vocabulario CRM (igual que el API)', () => {
|
||||
expect(MOTIVOS_NO_COMPRA).toContain('Precio')
|
||||
expect(MOTIVOS_NO_COMPRA).toContain('Timing')
|
||||
expect(MOTIVOS_NO_COMPRA).toHaveLength(7)
|
||||
})
|
||||
})
|
||||
|
||||
describe('esRolConEquipo', () => {
|
||||
it('coordinador, corporativo y admin ven equipo; vendedor no', () => {
|
||||
expect(esRolConEquipo('coordinador')).toBe(true)
|
||||
expect(esRolConEquipo('corporativo')).toBe(true)
|
||||
expect(esRolConEquipo('admin')).toBe(true)
|
||||
expect(esRolConEquipo('vendedor')).toBe(false)
|
||||
})
|
||||
})
|
||||
|
||||
describe('formatoFechaCorta', () => {
|
||||
it('recorta el año', () => {
|
||||
expect(formatoFechaCorta('2026-08-29')).toBe('29/08')
|
||||
})
|
||||
|
||||
it('tolera cadenas mal formadas devolviéndolas tal cual', () => {
|
||||
expect(formatoFechaCorta('sin-fecha')).toBe('sin-fecha')
|
||||
})
|
||||
})
|
||||
|
||||
describe('textoDiasRestantes', () => {
|
||||
it('hoy, mañana y n días', () => {
|
||||
expect(textoDiasRestantes(0)).toBe('Vence hoy')
|
||||
expect(textoDiasRestantes(1)).toBe('Vence mañana')
|
||||
expect(textoDiasRestantes(5)).toBe('Vence en 5 días')
|
||||
})
|
||||
})
|
||||
|
||||
describe('esActividadVencida', () => {
|
||||
it('compara contra la fecha de hoy', () => {
|
||||
expect(esActividadVencida('2026-08-27', '2026-08-28')).toBe(true)
|
||||
expect(esActividadVencida('2026-08-28', '2026-08-28')).toBe(false)
|
||||
expect(esActividadVencida('2026-08-29', '2026-08-28')).toBe(false)
|
||||
expect(esActividadVencida('', '2026-08-28')).toBe(false)
|
||||
})
|
||||
})
|
||||
|
||||
describe('hoyLocal', () => {
|
||||
it('devuelve YYYY-MM-DD', () => {
|
||||
expect(hoyLocal()).toMatch(/^\d{4}-\d{2}-\d{2}$/)
|
||||
})
|
||||
})
|
||||
96
apps/mi-dia/src/lib/mi-dia.ts
Normal file
96
apps/mi-dia/src/lib/mi-dia.ts
Normal file
@@ -0,0 +1,96 @@
|
||||
// Tipos y transformaciones de la app "Mi día" (espejo del contrato del API)
|
||||
|
||||
export interface LeadMiDia {
|
||||
id: string
|
||||
nombre: string
|
||||
telefono: string
|
||||
email: string
|
||||
estado: string
|
||||
origen: string
|
||||
updatedAt: string
|
||||
}
|
||||
|
||||
export interface ActividadMiDia {
|
||||
id: string
|
||||
nombre: string
|
||||
tipo: string
|
||||
fecha: string // 'YYYY-MM-DD'
|
||||
estado: string
|
||||
}
|
||||
|
||||
export interface ApartadoPorVencer {
|
||||
id: string
|
||||
nombre: string
|
||||
unidadCodigo: string
|
||||
fechaLimite: string // 'YYYY-MM-DD'
|
||||
estado: string
|
||||
diasRestantes: number
|
||||
}
|
||||
|
||||
export interface ResumenMiDia {
|
||||
generadoEn: string
|
||||
sinMapeoMonday: boolean
|
||||
misLeads: LeadMiDia[]
|
||||
misActividadesHoy: ActividadMiDia[]
|
||||
apartadosPorVencer: ApartadoPorVencer[]
|
||||
misOportunidades: { porEtapa: Record<string, number> } | null
|
||||
notaOportunidades: string | null
|
||||
conteos: {
|
||||
leadsNuevosSemana: number
|
||||
actividadesAbiertas: number
|
||||
}
|
||||
equipo?: {
|
||||
leadsNuevosSinAsignar: number
|
||||
porVendedor: { mondayUserId: number; nombre: string | null; leadsAsignados: number }[]
|
||||
}
|
||||
}
|
||||
|
||||
// Labels reales de la columna status 'Origen' del board Leads (verificados en Monday)
|
||||
export const ORIGENES_LEAD = ['WhatsApp', 'Web', 'Recomendado', 'Facebook', 'Otro'] as const
|
||||
|
||||
// Categorías del dropdown Motivo No Compra (vocabulario CRM FRASA, igual que el API)
|
||||
export const MOTIVOS_NO_COMPRA = [
|
||||
'Precio',
|
||||
'Producto',
|
||||
'Ubicacion',
|
||||
'Financiamiento',
|
||||
'Competencia',
|
||||
'Cliente',
|
||||
'Timing',
|
||||
] as const
|
||||
|
||||
export type MotivoNoCompra = (typeof MOTIVOS_NO_COMPRA)[number]
|
||||
|
||||
const ROLES_CON_EQUIPO = ['coordinador', 'corporativo', 'admin']
|
||||
|
||||
/** ¿El rol ve la sección de equipo? (misma regla que el API) */
|
||||
export function esRolConEquipo(rol: string): boolean {
|
||||
return ROLES_CON_EQUIPO.includes(rol)
|
||||
}
|
||||
|
||||
/** 'YYYY-MM-DD' → 'dd/mm' (sin año: la agenda es de esta semana) */
|
||||
export function formatoFechaCorta(fecha: string): string {
|
||||
const [, m, d] = fecha.split('-')
|
||||
if (!m || !d) return fecha
|
||||
return `${d}/${m}`
|
||||
}
|
||||
|
||||
/** Texto de urgencia de un apartado según los días que faltan */
|
||||
export function textoDiasRestantes(dias: number): string {
|
||||
if (dias <= 0) return 'Vence hoy'
|
||||
if (dias === 1) return 'Vence mañana'
|
||||
return `Vence en ${dias} días`
|
||||
}
|
||||
|
||||
/** ¿La fecha de una actividad ya pasó? (vencida, para marcarla en la lista) */
|
||||
export function esActividadVencida(fecha: string, hoy: string): boolean {
|
||||
return fecha !== '' && fecha < hoy
|
||||
}
|
||||
|
||||
/** Fecha local 'YYYY-MM-DD' de hoy (para comparar contra las del API) */
|
||||
export function hoyLocal(): string {
|
||||
const d = new Date()
|
||||
const m = String(d.getMonth() + 1).padStart(2, '0')
|
||||
const dd = String(d.getDate()).padStart(2, '0')
|
||||
return `${d.getFullYear()}-${m}-${dd}`
|
||||
}
|
||||
17
apps/mi-dia/src/main.tsx
Normal file
17
apps/mi-dia/src/main.tsx
Normal file
@@ -0,0 +1,17 @@
|
||||
import { StrictMode } from 'react'
|
||||
import { createRoot } from 'react-dom/client'
|
||||
import '@fontsource/inter/300.css'
|
||||
import '@fontsource/inter/400.css'
|
||||
import '@fontsource/inter/500.css'
|
||||
import '@fontsource/inter/700.css'
|
||||
import './index.css'
|
||||
import AuthGate from './components/AuthGate'
|
||||
import MiDiaPage from './pages/MiDiaPage'
|
||||
|
||||
createRoot(document.getElementById('root')!).render(
|
||||
<StrictMode>
|
||||
<AuthGate>
|
||||
<MiDiaPage />
|
||||
</AuthGate>
|
||||
</StrictMode>,
|
||||
)
|
||||
484
apps/mi-dia/src/pages/MiDiaPage.tsx
Normal file
484
apps/mi-dia/src/pages/MiDiaPage.tsx
Normal file
@@ -0,0 +1,484 @@
|
||||
import { useCallback, useEffect, useState, type FormEvent } from 'react'
|
||||
import KpiCard from '../components/KpiCard'
|
||||
import {
|
||||
esActividadVencida,
|
||||
esRolConEquipo,
|
||||
formatoFechaCorta,
|
||||
hoyLocal,
|
||||
MOTIVOS_NO_COMPRA,
|
||||
ORIGENES_LEAD,
|
||||
textoDiasRestantes,
|
||||
type LeadMiDia,
|
||||
type MotivoNoCompra,
|
||||
type ResumenMiDia,
|
||||
} from '../lib/mi-dia'
|
||||
import { cambiarEstadoLead, crearLead, descartarLead, fetchResumenMiDia } from '../services/mi-dia'
|
||||
import { getSesion } from '../services/auth'
|
||||
|
||||
function TituloSeccion({ children }: { children: string }) {
|
||||
return <h2 className="mb-4 text-xs font-bold uppercase tracking-widest text-neutral-500">{children}</h2>
|
||||
}
|
||||
|
||||
function EstadoVacio({ mensaje }: { mensaje: string }) {
|
||||
return (
|
||||
<div className="flex h-24 items-center justify-center border border-dashed border-neutral-300">
|
||||
<p className="text-xs font-bold uppercase tracking-widest text-neutral-400">{mensaje}</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const CLASE_BOTON_ACCION =
|
||||
'border border-accent px-3 py-1.5 text-xs font-bold uppercase tracking-widest text-accent transition-colors duration-150 hover:bg-accent hover:text-white disabled:opacity-50'
|
||||
|
||||
/** Modal de descarte: motivo (dropdown CRM) + comentario opcional */
|
||||
function ModalDescartar({
|
||||
lead,
|
||||
onCancelar,
|
||||
onConfirmar,
|
||||
enviando,
|
||||
}: {
|
||||
lead: LeadMiDia
|
||||
onCancelar: () => void
|
||||
onConfirmar: (motivo: MotivoNoCompra, comentario: string) => void
|
||||
enviando: boolean
|
||||
}) {
|
||||
const [motivo, setMotivo] = useState<MotivoNoCompra>(MOTIVOS_NO_COMPRA[0])
|
||||
const [comentario, setComentario] = useState('')
|
||||
return (
|
||||
<div className="fixed inset-0 z-10 flex items-center justify-center bg-black/40 px-4" role="dialog" aria-modal="true">
|
||||
<div className="w-full max-w-md border border-neutral-300 bg-white p-6">
|
||||
<p className="text-xs font-bold uppercase tracking-widest text-neutral-500">Descartar lead</p>
|
||||
<p className="mt-2 text-lg font-light">{lead.nombre}</p>
|
||||
<form
|
||||
className="mt-6 space-y-4"
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault()
|
||||
onConfirmar(motivo, comentario.trim())
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<label htmlFor="motivo-descarte" className="mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
Motivo
|
||||
</label>
|
||||
<select
|
||||
id="motivo-descarte"
|
||||
value={motivo}
|
||||
onChange={(e) => setMotivo(e.target.value as MotivoNoCompra)}
|
||||
className="w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none"
|
||||
>
|
||||
{MOTIVOS_NO_COMPRA.map((m) => (
|
||||
<option key={m} value={m}>
|
||||
{m}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="comentario-descarte" className="mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
Comentario (opcional)
|
||||
</label>
|
||||
<textarea
|
||||
id="comentario-descarte"
|
||||
value={comentario}
|
||||
onChange={(e) => setComentario(e.target.value)}
|
||||
rows={3}
|
||||
className="w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex justify-end gap-3">
|
||||
<button
|
||||
type="button"
|
||||
onClick={onCancelar}
|
||||
disabled={enviando}
|
||||
className="border border-neutral-300 px-5 py-2 text-xs font-bold uppercase tracking-widest text-neutral-500 transition-colors duration-150 hover:border-neutral-500 disabled:opacity-50"
|
||||
>
|
||||
Cancelar
|
||||
</button>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={enviando}
|
||||
className="bg-accent px-5 py-2 text-xs font-bold uppercase tracking-widest text-white transition-colors duration-150 hover:bg-accent-hover disabled:opacity-50"
|
||||
>
|
||||
{enviando ? 'Descartando…' : 'Descartar'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
/** Fila de lead con acciones rápidas (contactado / intento / cita / descartar) */
|
||||
function FilaLead({
|
||||
lead,
|
||||
onAccion,
|
||||
onDescartar,
|
||||
enviando,
|
||||
}: {
|
||||
lead: LeadMiDia
|
||||
onAccion: (estado: string, fecha?: string) => void
|
||||
onDescartar: () => void
|
||||
enviando: boolean
|
||||
}) {
|
||||
const [conCita, setConCita] = useState(false)
|
||||
const [fechaCita, setFechaCita] = useState('')
|
||||
return (
|
||||
<li className="border border-neutral-200 p-4">
|
||||
<div className="flex flex-wrap items-center justify-between gap-3">
|
||||
<div>
|
||||
<p className="text-sm font-medium">{lead.nombre}</p>
|
||||
<p className="mt-1 text-xs text-neutral-500">
|
||||
{lead.telefono || 'Sin teléfono'}
|
||||
{lead.origen ? ` · ${lead.origen}` : ''}
|
||||
</p>
|
||||
</div>
|
||||
<span className="border border-neutral-300 px-2 py-1 text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
{lead.estado || 'Sin estado'}
|
||||
</span>
|
||||
</div>
|
||||
<div className="mt-3 flex flex-wrap items-center gap-2">
|
||||
<button type="button" disabled={enviando} onClick={() => onAccion('CONTACTADO')} className={CLASE_BOTON_ACCION}>
|
||||
Contactado
|
||||
</button>
|
||||
<button type="button" disabled={enviando} onClick={() => onAccion('Intento de contacto')} className={CLASE_BOTON_ACCION}>
|
||||
Intento
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
disabled={enviando}
|
||||
onClick={() => (conCita ? onAccion('AGENDA CITA', fechaCita || undefined) : setConCita(true))}
|
||||
className={CLASE_BOTON_ACCION}
|
||||
>
|
||||
{conCita ? 'Confirmar cita' : 'Agenda cita'}
|
||||
</button>
|
||||
{conCita && (
|
||||
<input
|
||||
type="date"
|
||||
aria-label="Fecha de la cita"
|
||||
value={fechaCita}
|
||||
onChange={(e) => setFechaCita(e.target.value)}
|
||||
className="border border-neutral-300 px-2 py-1.5 text-xs focus:border-accent focus:outline-none"
|
||||
/>
|
||||
)}
|
||||
<button
|
||||
type="button"
|
||||
disabled={enviando}
|
||||
onClick={onDescartar}
|
||||
className="border border-red-700 px-3 py-1.5 text-xs font-bold uppercase tracking-widest text-red-700 transition-colors duration-150 hover:bg-red-700 hover:text-white disabled:opacity-50"
|
||||
>
|
||||
Descartar
|
||||
</button>
|
||||
</div>
|
||||
</li>
|
||||
)
|
||||
}
|
||||
|
||||
export default function MiDiaPage() {
|
||||
const nombreVendedor = getSesion()?.usuario.nombre ?? ''
|
||||
const rol = getSesion()?.usuario.rol ?? 'vendedor'
|
||||
const [resumen, setResumen] = useState<ResumenMiDia | null>(null)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [cargando, setCargando] = useState(true)
|
||||
const [enviando, setEnviando] = useState(false)
|
||||
const [aviso, setAviso] = useState<string | null>(null)
|
||||
const [descartando, setDescartando] = useState<LeadMiDia | null>(null)
|
||||
|
||||
// Captura rápida
|
||||
const [capNombre, setCapNombre] = useState('')
|
||||
const [capTelefono, setCapTelefono] = useState('')
|
||||
const [capOrigen, setCapOrigen] = useState<string>(ORIGENES_LEAD[0])
|
||||
const [capNotas, setCapNotas] = useState('')
|
||||
const [capEnviando, setCapEnviando] = useState(false)
|
||||
const [capMensaje, setCapMensaje] = useState<{ tipo: 'ok' | 'error'; texto: string } | null>(null)
|
||||
|
||||
const cargar = useCallback(async () => {
|
||||
setCargando(true)
|
||||
try {
|
||||
setResumen(await fetchResumenMiDia())
|
||||
setError(null)
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'No se pudo cargar tu día')
|
||||
} finally {
|
||||
setCargando(false)
|
||||
}
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
void cargar()
|
||||
}, [cargar])
|
||||
|
||||
/** Ejecuta una acción sobre un lead y refresca el resumen */
|
||||
async function ejecutar(accion: () => Promise<unknown>, mensajeError: string) {
|
||||
setEnviando(true)
|
||||
setAviso(null)
|
||||
try {
|
||||
await accion()
|
||||
await cargar()
|
||||
} catch (err) {
|
||||
setAviso(err instanceof Error ? err.message : mensajeError)
|
||||
} finally {
|
||||
setEnviando(false)
|
||||
}
|
||||
}
|
||||
|
||||
async function enviarCaptura(e: FormEvent) {
|
||||
e.preventDefault()
|
||||
setCapEnviando(true)
|
||||
setCapMensaje(null)
|
||||
try {
|
||||
await crearLead({
|
||||
nombre: capNombre.trim(),
|
||||
...(capTelefono.trim() !== '' ? { telefono: capTelefono.trim() } : {}),
|
||||
...(capOrigen !== '' ? { origen: capOrigen } : {}),
|
||||
...(capNotas.trim() !== '' ? { notas: capNotas.trim() } : {}),
|
||||
})
|
||||
setCapMensaje({ tipo: 'ok', texto: 'Lead registrado, se asignará por round-robin' })
|
||||
setCapNombre('')
|
||||
setCapTelefono('')
|
||||
setCapNotas('')
|
||||
} catch (err) {
|
||||
setCapMensaje({ tipo: 'error', texto: err instanceof Error ? err.message : 'No se pudo registrar el lead' })
|
||||
} finally {
|
||||
setCapEnviando(false)
|
||||
}
|
||||
}
|
||||
|
||||
const hoy = hoyLocal()
|
||||
|
||||
return (
|
||||
<main className="mx-auto max-w-6xl px-4 py-8">
|
||||
<div className="mb-8 flex items-end justify-between">
|
||||
<div>
|
||||
<p className="text-xs font-bold uppercase tracking-widest text-accent">FRASA · Mi día</p>
|
||||
<h1 className="mt-2 text-3xl font-light text-neutral-900">{nombreVendedor}</h1>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => void cargar()}
|
||||
disabled={cargando}
|
||||
className="border border-accent px-5 py-2 text-xs font-bold uppercase tracking-widest text-accent transition-colors duration-150 hover:bg-accent hover:text-white disabled:opacity-50"
|
||||
>
|
||||
{cargando ? 'Actualizando…' : 'Actualizar'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{error && (
|
||||
<p role="alert" className="mb-8 border border-amber-700 px-4 py-3 text-xs font-bold uppercase tracking-widest text-amber-700">
|
||||
Sin datos del API — {error}
|
||||
</p>
|
||||
)}
|
||||
{aviso && (
|
||||
<p role="alert" className="mb-8 border border-red-700 px-4 py-3 text-xs font-bold uppercase tracking-widest text-red-700">
|
||||
{aviso}
|
||||
</p>
|
||||
)}
|
||||
{resumen?.sinMapeoMonday && (
|
||||
<p className="mb-8 border border-neutral-300 px-4 py-3 text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
Tu usuario aún no está vinculado a Monday; las acciones siguen funcionando
|
||||
</p>
|
||||
)}
|
||||
|
||||
{!resumen && cargando && <EstadoVacio mensaje="Cargando…" />}
|
||||
|
||||
{resumen && (
|
||||
<>
|
||||
<section aria-label="Indicadores del día" className="grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
|
||||
<KpiCard titulo="Leads asignados" valor={resumen.misLeads.length} />
|
||||
<KpiCard
|
||||
titulo="Actividades de hoy"
|
||||
valor={resumen.misActividadesHoy.length}
|
||||
detalle={`${resumen.conteos.actividadesAbiertas} abiertas en total`}
|
||||
/>
|
||||
<KpiCard titulo="Apartados por vencer" valor={resumen.apartadosPorVencer.length} detalle="próximos 7 días" />
|
||||
<KpiCard titulo="Leads nuevos esta semana" valor={resumen.conteos.leadsNuevosSemana} />
|
||||
</section>
|
||||
|
||||
<section aria-label="Mis actividades" className="mt-12">
|
||||
<TituloSeccion>Mis actividades</TituloSeccion>
|
||||
{resumen.misActividadesHoy.length === 0 ? (
|
||||
<EstadoVacio mensaje="Sin actividades para hoy" />
|
||||
) : (
|
||||
<ul className="space-y-2">
|
||||
{resumen.misActividadesHoy.map((a) => (
|
||||
<li key={a.id} className="flex items-center justify-between gap-3 border border-neutral-200 px-4 py-3">
|
||||
<p className="text-sm">
|
||||
{a.nombre}
|
||||
{a.tipo ? <span className="ml-2 text-xs uppercase tracking-widest text-neutral-400">{a.tipo}</span> : null}
|
||||
</p>
|
||||
<span
|
||||
className={`text-xs font-bold uppercase tracking-widest ${
|
||||
esActividadVencida(a.fecha, hoy) ? 'text-red-700' : 'text-neutral-500'
|
||||
}`}
|
||||
>
|
||||
{formatoFechaCorta(a.fecha)}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</section>
|
||||
|
||||
{resumen.apartadosPorVencer.length > 0 && (
|
||||
<section aria-label="Apartados por vencer" className="mt-12">
|
||||
<TituloSeccion>Apartados por vencer</TituloSeccion>
|
||||
<ul className="space-y-2">
|
||||
{resumen.apartadosPorVencer.map((a) => (
|
||||
<li key={a.id} className="flex flex-wrap items-center justify-between gap-3 border border-neutral-200 px-4 py-3">
|
||||
<p className="text-sm">
|
||||
{a.nombre}
|
||||
{a.unidadCodigo ? <span className="ml-2 text-xs text-neutral-400">{a.unidadCodigo}</span> : null}
|
||||
</p>
|
||||
<span
|
||||
className={`text-xs font-bold uppercase tracking-widest ${
|
||||
a.diasRestantes <= 1 ? 'text-red-700' : 'text-amber-700'
|
||||
}`}
|
||||
>
|
||||
{textoDiasRestantes(a.diasRestantes)} · {formatoFechaCorta(a.fechaLimite)}
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</section>
|
||||
)}
|
||||
|
||||
<section aria-label="Mis leads" className="mt-12">
|
||||
<TituloSeccion>Mis leads</TituloSeccion>
|
||||
{resumen.misLeads.length === 0 ? (
|
||||
<EstadoVacio mensaje="Sin leads asignados" />
|
||||
) : (
|
||||
<ul className="space-y-2">
|
||||
{resumen.misLeads.map((lead) => (
|
||||
<FilaLead
|
||||
key={lead.id}
|
||||
lead={lead}
|
||||
enviando={enviando}
|
||||
onAccion={(estado, fecha) => void ejecutar(() => cambiarEstadoLead(lead.id, estado, fecha), 'No se pudo actualizar el lead')}
|
||||
onDescartar={() => setDescartando(lead)}
|
||||
/>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</section>
|
||||
|
||||
<section aria-label="Captura rápida de lead" className="mt-12">
|
||||
<TituloSeccion>Captura rápida de lead</TituloSeccion>
|
||||
<form onSubmit={enviarCaptura} className="grid gap-4 border border-neutral-200 p-6 sm:grid-cols-2">
|
||||
<div>
|
||||
<label htmlFor="cap-nombre" className="mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
Nombre
|
||||
</label>
|
||||
<input
|
||||
id="cap-nombre"
|
||||
type="text"
|
||||
value={capNombre}
|
||||
onChange={(e) => setCapNombre(e.target.value)}
|
||||
required
|
||||
className="w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="cap-telefono" className="mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
Teléfono
|
||||
</label>
|
||||
<input
|
||||
id="cap-telefono"
|
||||
type="tel"
|
||||
value={capTelefono}
|
||||
onChange={(e) => setCapTelefono(e.target.value)}
|
||||
className="w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="cap-origen" className="mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
Origen
|
||||
</label>
|
||||
<select
|
||||
id="cap-origen"
|
||||
value={capOrigen}
|
||||
onChange={(e) => setCapOrigen(e.target.value)}
|
||||
className="w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none"
|
||||
>
|
||||
{ORIGENES_LEAD.map((o) => (
|
||||
<option key={o} value={o}>
|
||||
{o}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="cap-notas" className="mb-2 block text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
Notas
|
||||
</label>
|
||||
<input
|
||||
id="cap-notas"
|
||||
type="text"
|
||||
value={capNotas}
|
||||
onChange={(e) => setCapNotas(e.target.value)}
|
||||
className="w-full border border-neutral-300 px-4 py-3 text-sm focus:border-accent focus:outline-none"
|
||||
/>
|
||||
</div>
|
||||
{capMensaje && (
|
||||
<p
|
||||
role="status"
|
||||
className={`border px-4 py-3 text-xs font-bold uppercase tracking-widest sm:col-span-2 ${
|
||||
capMensaje.tipo === 'ok' ? 'border-accent text-accent' : 'border-red-700 text-red-700'
|
||||
}`}
|
||||
>
|
||||
{capMensaje.texto}
|
||||
</p>
|
||||
)}
|
||||
<div className="sm:col-span-2">
|
||||
<button
|
||||
type="submit"
|
||||
disabled={capEnviando}
|
||||
className="bg-accent px-5 py-3 text-xs font-bold uppercase tracking-widest text-white transition-colors duration-150 hover:bg-accent-hover disabled:opacity-50"
|
||||
>
|
||||
{capEnviando ? 'Registrando…' : 'Registrar lead'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
|
||||
{esRolConEquipo(rol) && resumen.equipo && (
|
||||
<section aria-label="Equipo" className="mt-12">
|
||||
<TituloSeccion>Equipo</TituloSeccion>
|
||||
<p className="mb-4 text-sm text-neutral-500">
|
||||
Leads nuevos sin asignar: <strong>{resumen.equipo.leadsNuevosSinAsignar}</strong>
|
||||
</p>
|
||||
{resumen.equipo.porVendedor.length === 0 ? (
|
||||
<EstadoVacio mensaje="Sin leads asignados en el equipo" />
|
||||
) : (
|
||||
<ul className="space-y-2">
|
||||
{resumen.equipo.porVendedor.map((v) => (
|
||||
<li key={v.mondayUserId} className="flex items-center justify-between border border-neutral-200 px-4 py-3">
|
||||
<p className="text-sm">{v.nombre ?? `Monday #${v.mondayUserId}`}</p>
|
||||
<span className="text-xs font-bold uppercase tracking-widest text-neutral-500">
|
||||
{v.leadsAsignados} lead(s)
|
||||
</span>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
</section>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
|
||||
{descartando && (
|
||||
<ModalDescartar
|
||||
lead={descartando}
|
||||
enviando={enviando}
|
||||
onCancelar={() => setDescartando(null)}
|
||||
onConfirmar={(motivo, comentario) => {
|
||||
const lead = descartando
|
||||
setDescartando(null)
|
||||
void ejecutar(
|
||||
() => descartarLead(lead.id, motivo, comentario === '' ? undefined : comentario),
|
||||
'No se pudo descartar el lead',
|
||||
)
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</main>
|
||||
)
|
||||
}
|
||||
77
apps/mi-dia/src/services/auth.ts
Normal file
77
apps/mi-dia/src/services/auth.ts
Normal file
@@ -0,0 +1,77 @@
|
||||
// Sesión de autenticación contra el API Gateway (JWT guardado en localStorage)
|
||||
const API_URL = import.meta.env.VITE_API_URL ?? 'http://192.168.10.123:3000/api'
|
||||
const STORAGE_KEY = 'frasa_auth'
|
||||
|
||||
export interface UsuarioSesion {
|
||||
nombre: string
|
||||
rol: string
|
||||
asignacion: string | null
|
||||
}
|
||||
|
||||
export interface Sesion {
|
||||
token: string
|
||||
usuario: UsuarioSesion
|
||||
}
|
||||
|
||||
/** Error de login con mensaje genérico (no filtra si el usuario existe) */
|
||||
export class ErrorLogin extends Error {
|
||||
constructor(message = 'Usuario o contraseña incorrectos') {
|
||||
super(message)
|
||||
this.name = 'ErrorLogin'
|
||||
}
|
||||
}
|
||||
|
||||
export function getSesion(): Sesion | null {
|
||||
try {
|
||||
const raw = localStorage.getItem(STORAGE_KEY)
|
||||
if (!raw) return null
|
||||
const sesion = JSON.parse(raw) as Sesion
|
||||
if (typeof sesion?.token !== 'string' || !sesion.usuario) return null
|
||||
return sesion
|
||||
} catch {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
export function getToken(): string | null {
|
||||
return getSesion()?.token ?? null
|
||||
}
|
||||
|
||||
export function logout(): void {
|
||||
localStorage.removeItem(STORAGE_KEY)
|
||||
}
|
||||
|
||||
/** POST /auth/login; guarda token + usuario en localStorage */
|
||||
export async function login(username: string, password: string): Promise<UsuarioSesion> {
|
||||
let res: Response
|
||||
try {
|
||||
res = await fetch(`${API_URL}/auth/login`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ username, password }),
|
||||
})
|
||||
} catch {
|
||||
throw new ErrorLogin('No se pudo conectar con el servidor')
|
||||
}
|
||||
if (!res.ok) throw new ErrorLogin()
|
||||
const data = (await res.json()) as Sesion
|
||||
localStorage.setItem(STORAGE_KEY, JSON.stringify({ token: data.token, usuario: data.usuario }))
|
||||
return data.usuario
|
||||
}
|
||||
|
||||
/**
|
||||
* Agrega Authorization: Bearer a un RequestInit si hay sesión.
|
||||
* Sin token devuelve el init tal cual (las llamadas siguen iguales que antes).
|
||||
*/
|
||||
export function conAuth(init: RequestInit = {}): RequestInit {
|
||||
const token = getToken()
|
||||
if (!token) return init
|
||||
return { ...init, headers: { ...(init.headers as Record<string, string>), Authorization: `Bearer ${token}` } }
|
||||
}
|
||||
|
||||
/** Si el API responde 401: cierra sesión y recarga para volver al login */
|
||||
export function manejar401(res: Response): void {
|
||||
if (res.status !== 401) return
|
||||
logout()
|
||||
if (typeof window !== 'undefined') window.location.reload()
|
||||
}
|
||||
54
apps/mi-dia/src/services/mi-dia.ts
Normal file
54
apps/mi-dia/src/services/mi-dia.ts
Normal file
@@ -0,0 +1,54 @@
|
||||
// Cliente del API para la app "Mi día" (mismas convenciones que las demás apps)
|
||||
import type { ResumenMiDia } from '../lib/mi-dia'
|
||||
import { conAuth, manejar401 } from './auth'
|
||||
|
||||
const API_URL = import.meta.env.VITE_API_URL ?? 'http://192.168.10.123:3000/api'
|
||||
|
||||
async function fetchJson<T>(path: string, init: RequestInit = {}): Promise<T> {
|
||||
const res = await fetch(`${API_URL}${path}`, conAuth(init))
|
||||
manejar401(res)
|
||||
if (!res.ok) {
|
||||
const body = (await res.json().catch(() => null)) as { error?: string } | null
|
||||
throw new Error(body?.error ?? `Error ${res.status}`)
|
||||
}
|
||||
return (await res.json()) as T
|
||||
}
|
||||
|
||||
export function fetchResumenMiDia(): Promise<ResumenMiDia> {
|
||||
return fetchJson<ResumenMiDia>('/mi-dia/resumen')
|
||||
}
|
||||
|
||||
export interface LeadCreado {
|
||||
id: string
|
||||
estado: string
|
||||
}
|
||||
|
||||
/** Crea un lead; en duplicado (409) lanza Error con el mensaje del API */
|
||||
export async function crearLead(datos: {
|
||||
nombre: string
|
||||
telefono?: string
|
||||
origen?: string
|
||||
notas?: string
|
||||
}): Promise<LeadCreado> {
|
||||
return fetchJson<LeadCreado>('/leads', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(datos),
|
||||
})
|
||||
}
|
||||
|
||||
export function cambiarEstadoLead(itemId: string, estado: string, fecha?: string): Promise<unknown> {
|
||||
return fetchJson(`/leads/${itemId}/estado`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(fecha !== undefined && fecha !== '' ? { estado, fecha } : { estado }),
|
||||
})
|
||||
}
|
||||
|
||||
export function descartarLead(itemId: string, motivo: string, comentario?: string): Promise<unknown> {
|
||||
return fetchJson(`/leads/${itemId}/descartar`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(comentario !== undefined && comentario !== '' ? { motivo, comentario } : { motivo }),
|
||||
})
|
||||
}
|
||||
22
apps/mi-dia/tsconfig.app.json
Normal file
22
apps/mi-dia/tsconfig.app.json
Normal file
@@ -0,0 +1,22 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2022",
|
||||
"useDefineForClassFields": true,
|
||||
"lib": ["ES2022", "DOM", "DOM.Iterable"],
|
||||
"module": "ESNext",
|
||||
"skipLibCheck": true,
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"moduleDetection": "force",
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"noUncheckedSideEffectImports": true,
|
||||
"types": ["vite/client"]
|
||||
},
|
||||
"include": ["src"]
|
||||
}
|
||||
7
apps/mi-dia/tsconfig.json
Normal file
7
apps/mi-dia/tsconfig.json
Normal file
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"files": [],
|
||||
"references": [
|
||||
{ "path": "./tsconfig.app.json" },
|
||||
{ "path": "./tsconfig.node.json" }
|
||||
]
|
||||
}
|
||||
19
apps/mi-dia/tsconfig.node.json
Normal file
19
apps/mi-dia/tsconfig.node.json
Normal file
@@ -0,0 +1,19 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2023",
|
||||
"lib": ["ES2023"],
|
||||
"module": "ESNext",
|
||||
"skipLibCheck": true,
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"verbatimModuleSyntax": true,
|
||||
"moduleDetection": "force",
|
||||
"noEmit": true,
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true,
|
||||
"noUncheckedSideEffectImports": true
|
||||
},
|
||||
"include": ["vite.config.ts", "vitest.config.ts"]
|
||||
}
|
||||
9
apps/mi-dia/vite.config.ts
Normal file
9
apps/mi-dia/vite.config.ts
Normal file
@@ -0,0 +1,9 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
import tailwindcss from '@tailwindcss/vite'
|
||||
|
||||
// La app se sirve detrás de NGINX bajo el prefijo /hoy
|
||||
export default defineConfig({
|
||||
base: '/hoy/',
|
||||
plugins: [react(), tailwindcss()],
|
||||
})
|
||||
8
apps/mi-dia/vitest.config.ts
Normal file
8
apps/mi-dia/vitest.config.ts
Normal file
@@ -0,0 +1,8 @@
|
||||
import { defineConfig } from 'vitest/config'
|
||||
|
||||
// Config de tests separada para no mezclar los tipos de Vite y Vitest
|
||||
export default defineConfig({
|
||||
test: {
|
||||
environment: 'node',
|
||||
},
|
||||
})
|
||||
Reference in New Issue
Block a user