Skip to content

reyandres015/UI-Mockup

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 

Repository files navigation

🧠 Proyecto de Predicción de Estrés y Dashboard Analítico

Este repositorio contiene dos interfaces de usuario (UI) desarrolladas en Angular, cada una enfocada en un propósito distinto dentro del proyecto general de análisis y visualización de datos médicos y de negocio.


🚀 Estructura del Repositorio

🩺 Rama main

Interfaz principal relacionada con la predicción del nivel de estrés a partir de variables médicas.

  • Desarrollada en Angular
  • Conectada a un API backend (modelo predictivo y servicios REST)
  • Permite la entrada de datos médicos y muestra los resultados de predicción
  • Usa componentes modulares y un flujo de navegación enfocado en la evaluación individual

Características principales:

  • Integración con API para obtener resultados en tiempo real
  • Formularios dinámicos de ingreso de datos médicos
  • Resultados interpretables con indicadores visuales

📊 Rama machine-learning

Interfaz alternativa enfocada en un dashboard analítico con base en datos simulados.

  • UI desarrollada también en Angular
  • No consume API, trabaja con un JSON local de ejemplo (assets/data/productos.json)
  • Incluye gráficas, filtros, KPIs y alertas automáticas

Componentes incluidos:

  • Gráfico de burbujas: Precio vs Volumen, colores por cluster
  • Gráfico de barras: Ventas por categoría
  • Gráfico de línea: Evolución de ventas en el tiempo
  • Tabla de alertas: Genera advertencias automáticas como:
    • “Cluster 0: Stock muy alto - Reducir inventario”
    • “Cluster 2: Margen bajo - Revisar precios”

⚙️ Instalación y Ejecución

  1. Clonar el repositorio:

    git clone <URL_DEL_REPOSITORIO>
    cd <nombre-del-repositorio>
  2. Instalar dependencias:

    npm install
  3. Ejecutar el servidor de desarrollo:

    ng serve
  4. Abrir en el navegador:

    http://localhost:4200/
    

🔄 Cambiar entre ramas

Rama principal (predicción de estrés)

git checkout main

Rama de dashboard (análisis con JSON)

git checkout machine-learning

📁 Estructura general

public/
  ├── assets/
  │   └── data/
  │       └── productos.json  ← Datos de ejemplo (solo en machine-learning)
src/
 ├── app/
 │   ├── domain/
 │   ├── ui/
 └── environments/

🧩 Tecnologías utilizadas

  • Angular 19
  • FastAPI
  • ng2-charts / Chart.js
  • TypeScript
  • RxJS
  • Bootstrap / Tailwind (opcional según rama)
  • JSON local para simulación de datos

🧑‍💻 Autor

Andrés Rey
Proyecto académico - 8° semestre
Universidad Sergio Arboleda


📛 Licencia

Este proyecto es de uso académico y puede ser reutilizado con fines educativos o de investigación.


Angular TypeScript Chart.js Branch main Branch machine-learning

About

Este repositorio contiene dos interfaces de usuario (UI) desarrolladas en Angular, cada una enfocada en un propósito distinto dentro del proyecto general de análisis y visualización de datos médicos y de negocio.

Topics

Resources

Stars

Watchers

Forks

Contributors