planetazuzu/codigo0
1
0
Fork 0
Code Issues Pull requests Actions 1 Packages Projects Releases Wiki Activity
codigo0/docs/ADMIN_PANEL_IMPLEMENTACION.md

8 KiB
Raw Blame History

🎛️ ADMIN PANEL - IMPLEMENTACIÓN COMPLETA

📋 RESUMEN EJECUTIVO

Se ha diseñado e implementado un sistema completo de administración de contenido para EMERGES TES que permite editar protocolos, guías, manual, vademécum, checklists y recursos sin modificar el código de la app.

✅ RESTRICCIONES CUMPLIDAS

  • ✅ NO se modifica src/data/procedures.ts ni searchProcedures()
  • ✅ NO se modifica src/data/drugs.ts ni searchDrugs()
  • ✅ NO rompe PWA offline - Content pack funciona offline con cache
  • ✅ NO cambia rutas existentes - Compatibilidad total
  • ✅ Versionado completo - Todo contenido es versionado y reversible

🏗️ ARQUITECTURA

1. Modelo de Datos Extendido

Ubicación: admin-panel/shared/types/content.ts

Interfaces TypeScript que extienden el modelo existente:

  • Protocol (extendido):

    • pasosRapidos: Pasos estructurados con metadata
    • checklist: Checklist integrado
    • dosisInline: Dosis de fármacos inline
    • herramientasContexto: Calculadoras, algoritmos, referencias
    • fuentes: Fuentes clínicas (ERC, SEMES, AHA)

  • Guide (extendido):

    • sections: 8 secciones con markdown y recursos
    • relations: Relaciones con protocolos y manuales
    • metadata: Objetivos de aprendizaje, audiencia

  • Drug (extendido):

    • frecuenciaUso: Frecuencia por contexto (primera/segunda línea)
    • contextos: Contextos específicos de uso
    • primeraLinea / segundaLinea: Indicaciones

  • ChecklistReusable: Checklists reutilizables (electrodos, preparación IOT, etc.)

  • ContentPack: Pack versionado para la app

2. Backend API

Ubicación: backend/src/

Autenticación y Autorización

  • routes/auth.js: Login, JWT, verificación de usuario
  • middleware/auth.js: Middleware de autenticación y permisos
  • RBAC: 5 roles con permisos granulares

Gestión de Contenido

  • routes/content.js: CRUD completo de contenido
    • GET /api/content - Listar con filtros
    • GET /api/content/:id - Obtener por ID
    • POST /api/content - Crear
    • PUT /api/content/:id - Actualizar
    • GET /api/content/:id/versions - Historial de versiones
    • POST /api/content/:id/validate - Validar contenido
    • GET /api/content/pack/latest - Content pack público

Base de Datos

  • Esquema: database/migrations/001_create_schema.sql
  • Tablas:
    • content_items: Items de contenido
    • content_versions: Versionado
    • content_relations: Relaciones entre contenidos
    • content_change_log: Auditoría
    • users: Usuarios y roles

3. Admin Panel React

Ubicación: admin-panel/

Estructura preparada para:

  • Dashboard con estadísticas
  • Biblioteca de contenido con filtros
  • Editores especializados:
    • Editor de Protocolo con vista previa "modo TES"
    • Editor de Checklist reutilizable
    • Editor de Guías Markdown con preview
    • Manager de Vademécum
  • Auditoría y versionado
  • Gestión de fuentes

4. Integración en App Principal

Ubicación: src/services/content-pack.ts

Sistema de "override" que:

  1. Intenta obtener content pack desde API
  2. Si existe y está validado, lo usa
  3. Si no, usa datos locales (src/data/)
  4. Funciona offline usando cache del último pack

IMPORTANTE: No modifica procedures.ts ni drugs.ts. Solo proporciona funciones para obtener contenido con override.

🚀 INSTALACIÓN Y CONFIGURACIÓN

Paso 1: Backend

cd backend

# 1. Instalar dependencias
npm install

# 2. Configurar .env
cp ENV_TEMPLATE.md .env
# Editar .env con credenciales de PostgreSQL

# 3. Crear usuario y base de datos (requiere sudo)
bash crear-usuario-y-bd.sh

# 4. Crear tablas
npm run db:create

# 5. Crear usuario admin
npm run seed:admin

# 6. Crear contenido de ejemplo
npm run seed:content

# 7. Iniciar servidor
npm run dev

Credenciales por defecto:

  • Email: admin@emerges-tes.local
  • Password: Admin123!
  • Role: super_admin

Paso 2: Admin Panel

cd admin-panel

# 1. Instalar dependencias
npm install

# 2. Configurar .env
echo "VITE_API_URL=http://localhost:3000" > .env

# 3. Iniciar desarrollo
npm run dev

Paso 3: Integración en App Principal

El servicio content-pack.ts ya está creado. Para usarlo:

import { getProtocolWithOverride } from '@/services/content-pack';
import { getProcedureById } from '@/data/procedures';

// En un componente
const protocol = await getProtocolWithOverride(
  'rcp-adulto-svb',
  getProcedureById('rcp-adulto-svb')
);

📦 SEED DATA

Checklists Creados

  1. Electrodos/Parches DESA (checklist-electrodos-desa)

    • 8 pasos críticos
    • Aplicable a RCP SVB y SVA

  2. Preparación Intubación (checklist-preparacion-intubacion)

    • 10 pasos organizados por categoría
    • Material, Verificación, Fármacos, Monitorización, Posicionamiento

  3. RCP Checklist (checklist-rcp-adulto-svb)

    • 10 pasos esenciales
    • Versión mejorada del checklist existente

Protocolos de Ejemplo

  1. RCP Adulto SVB Extendido (rcp-adulto-svb-extended)

    • Checklist integrado
    • Dosis inline (Adrenalina)
    • Herramientas de contexto
    • Fuentes clínicas (ERC 2021)

  2. Shock Hemorrágico Extendido (shock-hemorragico-extended)

    • Dosis inline (Ácido Tranexámico)
    • Fuentes clínicas (SEMES 2023)

🔐 ROLES Y PERMISOS

Rol Permisos
super_admin Acceso total (usuarios, contenido, sistema)
editor_clinico Editar protocolos, fármacos, checklists
editor_formativo Editar guías formativas y manuales
revisor Revisar y validar contenido
viewer Solo lectura

📝 FLUJO DE TRABAJO

Crear/Editar Contenido

  1. Editor crea/edita contenido → Estado: draft
  2. Editor envía para revisión → Estado: in_review
  3. Revisor revisa y valida → Estado: approved
  4. Super Admin publica → Estado: published
  5. App consume content pack con contenido publicado

Versionado

  • Cada cambio crea una nueva versión
  • Historial completo de versiones
  • Posibilidad de revertir a versión anterior
  • Log de auditoría de todos los cambios

🧪 TESTS Y VERIFICACIÓN

Checklist Manual

  1. ✅ Backend inicia correctamente
  2. ✅ Login funciona con credenciales por defecto
  3. ✅ Se puede crear contenido
  4. ✅ Se puede editar contenido
  5. ✅ Versionado funciona
  6. ✅ Content pack se genera correctamente
  7. ✅ App consume content pack offline

Tests Automatizados (Pendiente)

# Backend
cd backend
npm test

# Admin Panel
cd admin-panel
npm test

🔄 PRÓXIMOS PASOS

Fase 1: Completar Admin Panel UI

  • Dashboard con estadísticas
  • Biblioteca de contenido
  • Editores especializados
  • Vista de auditoría

Fase 2: Mejoras Backend

  • Endpoint de búsqueda avanzada
  • Exportación de content pack
  • Importación masiva
  • Validación de contenido más estricta

Fase 3: Integración Completa

  • Integrar content pack en componentes existentes
  • Notificaciones de actualizaciones
  • Sincronización automática

📚 DOCUMENTACIÓN ADICIONAL

  • Modelo de Datos: admin-panel/shared/types/content.ts
  • API Backend: backend/src/routes/
  • Servicio Content Pack: src/services/content-pack.ts
  • Seed Data: backend/scripts/seed-content.js

⚠️ IMPORTANTE

  1. NO modificar src/data/procedures.ts ni src/data/drugs.ts
  2. Cambiar contraseña del admin después del primer login
  3. Backup de base de datos antes de migraciones importantes
  4. Validar contenido antes de publicar
  5. Probar offline después de cambios en content pack

🎉 ESTADO ACTUAL

✅ Completado:

  • Modelo de datos extendido
  • Backend API completo (auth, CRUD, versionado)
  • Sistema de content pack
  • Seed data (2 protocolos, 3 checklists)
  • Integración en app principal (servicio)

🚧 En Progreso:

  • Admin Panel UI (estructura creada, componentes pendientes)

📋 Pendiente:

  • Tests automatizados
  • Documentación de API
  • Mejoras de UI/UX