- **Corrección de Sincronización de Estado:** Se soluciona un problema crítico donde las modificaciones de datos (ej. cambiar una contraseña o eliminar una asociación) no se reflejaban visualmente en la tabla hasta que se recargaba la página. Se ha refactorizado el manejo del estado para garantizar que todos los componentes se actualicen instantáneamente después de una acción. - **Actualización Global de Contraseñas:** Se mejora la lógica de actualización de contraseñas. Ahora, al cambiar la clave de un usuario, el cambio se refleja en **todos** los equipos a los que dicho usuario está asociado en la tabla, no solo en la fila desde donde se inició la acción. - **Mejoras en Gestión de Componentes:** - Se implementa la librería `@tanstack/react-table` en el componente `GestionComponentes.tsx`. - La tabla de "Administración" ahora cuenta con filtrado global de registros y ordenamiento por columnas, mejorando su usabilidad y manteniendo consistencia con la tabla principal de equipos. - **Corrección de Tipos en TypeScript:** Se resuelven errores de tipo (`Property 'id' does not exist on type 'never'`) en la definición de las columnas de la tabla (`SimpleTable.tsx`) mediante el tipado explícito con `CellContext`, mejorando la robustez y la experiencia de desarrollo.
Inventario IT 🖥️
Inventario IT es un sistema de gestión de inventario de hardware diseñado para ser poblado tanto por scripts automáticos como por gestión manual. Permite tener un registro centralizado y detallado de todos los equipos informáticos de una organización, sus componentes y su historial de cambios.
El sistema se compone de un backend RESTful API desarrollado en ASP.NET Core y un frontend interactivo de tipo SPA (Single Page Application) construido con React, TypeScript y Vite.
🚀 Funcionalidades Principales
El sistema está diseñado en torno a la gestión y visualización de activos de TI, con un fuerte énfasis en la calidad y consistencia de los datos.
📋 Módulo de Equipos
- Vista Principal Centralizada: Una tabla paginada, con capacidad de búsqueda y filtrado por sector, que muestra todos los equipos del inventario.
- Detalle Completo del Equipo: Al hacer clic en un equipo, se abre una vista detallada con toda su información:
- Datos Principales: Hostname, IP, MAC, OS, etc.
- Componentes Asociados: Lista detallada de discos, módulos de RAM, usuarios asociados,CPU, Motherboard, RAM instalada, etc.
- Estado en Tiempo Real: Indicador visual que muestra si el equipo está
En líneaoSin conexiónmediante un ping. - Historial de Cambios: Un registro cronológico de todas las modificaciones realizadas en el equipo.
- Acciones Remotas:
- Wake On Lan (WOL): 🚀 Botón para enviar un "Magic Packet" a través de un servidor SSH y encender un equipo de forma remota.
✍️ Gestión Manual vs. Automática
- Origen de Datos: El sistema diferencia entre datos generados por scripts automáticos (
⚙️ Automático) y los introducidos manualmente (⌨️ Manual). - Protección de Datos: Las entradas automáticas están protegidas contra modificaciones o eliminaciones desde la UI, asegurando la integridad de los datos recopilados en campo.
- CRUD Completo para Entradas Manuales:
- Creación de nuevos equipos con sus propiedades básicas.
- Edición de los campos principales de un equipo manual.
- Asociación manual de componentes (Discos, RAM, Usuarios).
- Eliminación segura de equipos y componentes de origen manual.
🗂️ Módulo de Administración
- Gestión de Sectores: Un CRUD completo para crear, editar y eliminar los sectores o departamentos de la organización.
- Limpieza de Datos Maestros: Una potente herramienta para asegurar la consistencia de los datos.
- Visualización de Valores Únicos: Permite ver todos los valores distintos existentes para un tipo de componente (ej:
Microsoft Windows 10 Pro,w10,Windows 10) y cuántos equipos usan cada uno. - Unificación de Valores: ✏️ Permite reemplazar todas las instancias de un valor incorrecto (ej:
w10) por uno correcto (ej:Microsoft Windows 10 Pro) en toda la base de datos con un solo clic. - Eliminación de Registros Maestros: 🗑️ Permite eliminar componentes maestros (ej: un módulo de RAM) que ya no están en uso por ningún equipo.
- Visualización de Valores Únicos: Permite ver todos los valores distintos existentes para un tipo de componente (ej:
🎨 UI/UX
- Interfaz Moderna y Responsiva: Construida con Vite, React y TypeScript para una experiencia rápida y fluida.
- Notificaciones en Tiempo Real: El sistema utiliza
react-hot-toastpara dar feedback instantáneo sobre el estado de las operaciones (Cargando, Éxito, Error). - Consistencia de Datos Mejorada: Uso de campos de autocompletado que sugieren valores existentes para campos como CPU, OS y Motherboard, reduciendo errores humanos.
- Validación de Entradas: Validación de formato en tiempo real para campos críticos como la MAC Address, con auto-formateo para ayudar al usuario.
🛠️ Stack Tecnológico
Backend (backend/)
- Framework: ASP.NET Core 9
- Lenguaje: C#
- Acceso a Datos: Dapper (Micro ORM)
- Base de Datos: Microsoft SQL Server
- Comandos Remotos: Renci.SshNet para ejecución de comandos SSH (Wake On Lan)
Frontend (frontend/)
- Framework/Librería: React 19
- Lenguaje: TypeScript
- Gestión de Tabla: TanStack Table v8
- Notificaciones: React Hot Toast
- Tooltips: React Tooltip
- Build Tool: Vite
🚀 Puesta en Marcha (Getting Started)
Siga estos pasos para configurar y ejecutar el proyecto en un entorno de desarrollo local.
Prerrequisitos
- .NET SDK 9.0 o superior.
- Node.js v20.x o superior (con npm).
- Microsoft SQL Server (2019 o superior) y SQL Server Management Studio (SSMS).
- Un editor de código como Visual Studio Code.
1. Clonar el Repositorio
git clone <URL_DEL_REPOSITORIO_GITEA>
cd nombre-del-repositorio
2. Configuración de la Base de Datos
- Abra SSMS y conecte a su instancia de SQL Server.
- Cree una nueva base de datos llamada
InventarioDB. - Ejecute el script
dboInventarioDB.txt(ubicado en la raíz del proyecto o en la carpetabackend/) sobre la base de datos recién creada. Esto creará todas las tablas, relaciones y claves necesarias.
3. Configuración del Backend
-
Navegue al directorio del backend:
cd backend. -
Abra el archivo
appsettings.json. -
Modifique la
ConnectionStringpara que apunte a su instancia de SQL Server, asegurándose de que el usuario (User IdyPassword) tenga permisos sobre la base de datosInventarioDB."ConnectionStrings": { "DefaultConnection": "Server=NOMBRE_SU_SERVIDOR;Database=InventarioDB;User Id=su_usuario_sql;Password=su_contraseña;TrustServerCertificate=True" } -
En el mismo archivo, configure las credenciales del servidor SSH que se usará para la función Wake On Lan en la sección
SshSettings."SshSettings": { "Host": "", "Port": , "User": "", "Password": "" } -
Instale las dependencias y ejecute el backend:
dotnet restore dotnet runLa API estará disponible en
http://localhost:5198y la UI de Swagger en la misma URL.
4. Configuración del Frontend
- En una nueva terminal, navegue al directorio del frontend:
cd frontend. - Instale las dependencias:
npm install - El frontend ya está configurado para apuntar a la URL del backend (
http://localhost:5198) en el archivoSimpleTable.tsx. Si ha cambiado el puerto del backend, deberá actualizar esta constanteBASE_URL. - Ejecute el frontend en modo de desarrollo:
La aplicación web estará disponible en
npm run devhttp://localhost:5173(o el puerto que indique Vite).