pablinux
3595e55a1e
- Implementado monitor de procesos Node.js con detección automática - Sistema de logging con niveles (Info, Warning, Error, Critical) - ConfigManager para gestión dinámica de apps monitoreadas - Interfaz web básica con escaneo de procesos - Integración con API central para reportar estados - User-Agent tracking para identificación de agentes - Persistencia de configuración en JSON - Logs almacenados en archivo con rotación - Sistema modular: monitor, interface, logger, config Estructura: - src/main.rs: Orquestador principal - src/monitor.rs: Monitoreo de procesos y envío a API - src/interface.rs: Servidor web Axum con endpoints - src/logger.rs: Sistema de logging a archivo y consola - src/config.rs: Gestión de configuración persistente - web/: Templates HTML para interfaz web - config/: Configuración de apps monitoreadas - logs/: Archivos de log del sistema Features implementadas: ✅ Detección automática de procesos Node.js ✅ Monitoreo de CPU y RAM por proceso ✅ Reportes periódicos a API central (cada 60s) ✅ Interfaz web en puerto 8080 ✅ Logs estructurados con timestamps ✅ Configuración dinámica sin reinicio ✅ Script de despliegue automatizado Próximos pasos: - Integración con systemd para control de procesos - Dashboard mejorado con cards de apps - Logs en tiempo real vía WebSocket - Start/Stop/Restart de aplicaciones
160 lines
4.3 KiB
HTML
160 lines
4.3 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>Gestionar Procesos - SIAX</title>
|
||
<style>
|
||
body {
|
||
background: #0f172a;
|
||
color: white;
|
||
font-family: sans-serif;
|
||
padding: 40px;
|
||
}
|
||
h1 {
|
||
color: #3b82f6;
|
||
}
|
||
h2 {
|
||
color: #60a5fa;
|
||
margin-top: 40px;
|
||
}
|
||
.process-item {
|
||
background: #1e293b;
|
||
padding: 15px;
|
||
margin: 10px 0;
|
||
border-radius: 8px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
.process-info {
|
||
flex-grow: 1;
|
||
}
|
||
.pid {
|
||
color: #22c55e;
|
||
font-weight: bold;
|
||
}
|
||
.path {
|
||
color: #94a3b8;
|
||
font-size: 12px;
|
||
margin-top: 5px;
|
||
}
|
||
.select-btn {
|
||
padding: 8px 16px;
|
||
background: #22c55e;
|
||
border: none;
|
||
color: white;
|
||
border-radius: 6px;
|
||
cursor: pointer;
|
||
font-size: 14px;
|
||
}
|
||
.select-btn:hover {
|
||
background: #16a34a;
|
||
}
|
||
.form-section {
|
||
background: #1e293b;
|
||
padding: 25px;
|
||
border-radius: 12px;
|
||
margin-top: 20px;
|
||
border: 2px solid #3b82f6;
|
||
transition: border-color 0.3s;
|
||
}
|
||
.form-group {
|
||
margin-bottom: 15px;
|
||
}
|
||
label {
|
||
display: block;
|
||
color: #60a5fa;
|
||
margin-bottom: 5px;
|
||
font-weight: bold;
|
||
}
|
||
input {
|
||
width: 100%;
|
||
padding: 10px;
|
||
background: #0f172a;
|
||
border: 2px solid #475569;
|
||
border-radius: 6px;
|
||
color: white;
|
||
font-size: 14px;
|
||
box-sizing: border-box;
|
||
}
|
||
input:focus {
|
||
outline: none;
|
||
border-color: #3b82f6;
|
||
}
|
||
small {
|
||
color: #94a3b8;
|
||
display: block;
|
||
margin-top: 5px;
|
||
}
|
||
.submit-btn {
|
||
padding: 12px 24px;
|
||
background: #3b82f6;
|
||
border: none;
|
||
color: white;
|
||
border-radius: 8px;
|
||
cursor: pointer;
|
||
font-size: 16px;
|
||
margin-top: 10px;
|
||
}
|
||
.submit-btn:hover {
|
||
background: #2563eb;
|
||
}
|
||
.back-btn {
|
||
display: inline-block;
|
||
padding: 10px 20px;
|
||
background: #64748b;
|
||
color: white;
|
||
text-decoration: none;
|
||
border-radius: 8px;
|
||
margin-top: 20px;
|
||
}
|
||
.back-btn:hover {
|
||
background: #475569;
|
||
}
|
||
.no-results {
|
||
background: #7f1d1d;
|
||
padding: 20px;
|
||
border-radius: 8px;
|
||
border-left: 4px solid #ef4444;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<h1>⚙️ Gestionar Procesos a Monitorear</h1>
|
||
|
||
<h2>📋 Procesos Node.js Detectados</h2>
|
||
{{PROCESSES_LIST}}
|
||
|
||
<h2>➕ Agregar Proceso Personalizado</h2>
|
||
<div class="form-section">
|
||
<form method="POST" action="/add-process">
|
||
<div class="form-group">
|
||
<label for="app_name">Nombre de la Aplicación:</label>
|
||
<input type="text" id="app_name" name="app_name" placeholder="Ej: app_tareas, fidelizacion, mi-api" required>
|
||
<small>💡 Este nombre se usará para identificar el proceso en el directorio de trabajo</small>
|
||
</div>
|
||
|
||
<div class="form-group">
|
||
<label for="port">Puerto:</label>
|
||
<input type="number" id="port" name="port" placeholder="Ej: 3000, 3001, 8080" required>
|
||
<small>💡 Puerto donde corre la aplicación</small>
|
||
</div>
|
||
|
||
<button type="submit" class="submit-btn">💾 Guardar y Monitorear</button>
|
||
</form>
|
||
</div>
|
||
|
||
<a href="/" class="back-btn">← Volver al Panel</a>
|
||
|
||
<script>
|
||
function fillForm(appName, pid) {
|
||
document.getElementById('app_name').value = appName;
|
||
document.querySelector('.form-section').scrollIntoView({ behavior: 'smooth' });
|
||
document.querySelector('.form-section').style.borderColor = '#22c55e';
|
||
setTimeout(() => {
|
||
document.querySelector('.form-section').style.borderColor = '#3b82f6';
|
||
}, 2000);
|
||
}
|
||
</script>
|
||
</body>
|
||
</html> |