pablinux
8822e9e6b5
- Añadir campos al modelo MonitoredApp: * service_name: Nombre del servicio systemd * path: WorkingDirectory de la aplicación * entry_point: Archivo de entrada (server.js, app.js, etc.) * node_bin: Ruta completa al binario de node/python * mode: Modo de ejecución (production, development, test) * service_file_path: Ruta al archivo .service de systemd * registered_at: Timestamp de registro (ISO 8601) - Actualizar discovery.rs para extraer toda la información: * Parsear ExecStart para obtener node_bin y entry_point * Extraer NODE_ENV para determinar el modo * Guardar ruta completa al archivo .service * Usar add_app_full() con información completa - Integrar ConfigManager en AppManager: * Guardar automáticamente en monitored_apps.json al registrar apps * Eliminar del JSON al desregistrar apps * Extraer metadata desde ServiceConfig (puerto, entry_point, mode, etc.) - Mantener retrocompatibilidad con JSON antiguo mediante campos deprecated - Todos los nuevos campos usan #[serde(default)] para evitar errores de deserialización
245 lines
10 KiB
HTML
245 lines
10 KiB
HTML
<!doctype html>
|
|
<html class="dark" lang="es" dir="ltr">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
|
<title>Éxito - SIAX Monitor</title>
|
|
<link rel="icon" type="image/svg+xml" href="/static/icon/favicon.svg" />
|
|
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
<link
|
|
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap"
|
|
rel="stylesheet"
|
|
/>
|
|
<script>
|
|
tailwind.config = {
|
|
darkMode: "class",
|
|
theme: {
|
|
extend: {
|
|
colors: {
|
|
primary: "#137fec",
|
|
"background-light": "#f6f7f8",
|
|
"background-dark": "#101922",
|
|
},
|
|
fontFamily: { display: ["Inter", "sans-serif"] },
|
|
borderRadius: {
|
|
DEFAULT: "0.25rem",
|
|
lg: "0.5rem",
|
|
xl: "0.75rem",
|
|
full: "9999px",
|
|
},
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style>
|
|
body {
|
|
font-family: "Inter", sans-serif;
|
|
}
|
|
.material-symbols-outlined {
|
|
font-variation-settings:
|
|
"FILL" 0,
|
|
"wght" 400,
|
|
"GRAD" 0,
|
|
"opsz" 24;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body
|
|
class="bg-background-light dark:bg-background-dark font-display text-white min-h-screen flex flex-col"
|
|
>
|
|
<!-- Sticky Top Navigation -->
|
|
<header
|
|
class="sticky top-0 z-50 w-full border-b border-solid border-[#283039] bg-background-dark/80 backdrop-blur-md px-4 md:px-10 py-3"
|
|
>
|
|
<div
|
|
class="max-w-[1200px] mx-auto flex items-center justify-between whitespace-nowrap"
|
|
>
|
|
<div class="flex items-center gap-8">
|
|
<div class="flex items-center gap-4 text-white">
|
|
<div
|
|
class="size-8 bg-primary rounded-lg flex items-center justify-center"
|
|
>
|
|
<img
|
|
src="/static/icon/logo.png"
|
|
alt="Logo"
|
|
class="w-full h-full object-cover"
|
|
/>
|
|
</div>
|
|
<h2
|
|
class="text-white text-lg font-bold leading-tight tracking-[-0.015em]"
|
|
>
|
|
SIAX Monitor
|
|
</h2>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-1 justify-end gap-6 items-center">
|
|
<nav class="hidden md:flex items-center gap-6">
|
|
<a
|
|
class="text-[#9dabb9] text-sm font-medium hover:text-white transition-colors"
|
|
href="/"
|
|
>
|
|
Panel
|
|
</a>
|
|
<a
|
|
class="text-[#9dabb9] text-sm font-medium hover:text-white transition-colors"
|
|
href="/scan"
|
|
>
|
|
Escanear
|
|
</a>
|
|
<a
|
|
class="text-[#9dabb9] text-sm font-medium hover:text-white transition-colors"
|
|
href="/select"
|
|
>
|
|
Selecionar Detectada
|
|
</a>
|
|
<a
|
|
class="text-[#9dabb9] text-sm font-medium hover:text-white transition-colors"
|
|
href="/logs"
|
|
>
|
|
Registros
|
|
</a>
|
|
</nav>
|
|
<button
|
|
class="hidden lg:flex cursor-pointer items-center justify-center rounded-lg h-9 px-4 bg-primary text-white text-sm font-bold transition-opacity hover:opacity-90"
|
|
onclick="window.location.href = '/register'"
|
|
>
|
|
<span>Nueva App</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="flex-1 flex items-center justify-center px-4 py-16">
|
|
<div class="max-w-2xl w-full">
|
|
<!-- Success Card -->
|
|
<div
|
|
class="rounded-xl border border-green-500/30 bg-green-500/10 p-8 text-center space-y-6"
|
|
>
|
|
<!-- Success Icon -->
|
|
<div class="flex justify-center">
|
|
<div
|
|
class="flex items-center justify-center w-24 h-24 rounded-full bg-green-500/20 border-4 border-green-500/30"
|
|
>
|
|
<span
|
|
class="material-symbols-outlined text-green-400"
|
|
style="font-size: 60px"
|
|
>check_circle</span
|
|
>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Success Message -->
|
|
<div class="space-y-2">
|
|
<h1
|
|
class="text-white text-3xl font-black leading-tight tracking-[-0.033em]"
|
|
>
|
|
Operation Successful!
|
|
</h1>
|
|
<p class="text-green-400 text-lg font-medium">
|
|
The process has been added to monitoring
|
|
successfully
|
|
</p>
|
|
</div>
|
|
|
|
<!-- Application Info -->
|
|
<div
|
|
class="rounded-xl border border-[#283039] bg-[#161f2a] p-6 space-y-4"
|
|
>
|
|
<div class="flex items-center justify-between">
|
|
<span class="text-[#9dabb9] text-sm font-medium"
|
|
>Nombre de Aplicación</span
|
|
>
|
|
<span class="text-white text-sm font-bold"
|
|
>{{APP_NAME}}</span
|
|
>
|
|
</div>
|
|
<div class="border-t border-[#283039]"></div>
|
|
<div class="flex items-center justify-between">
|
|
<span class="text-[#9dabb9] text-sm font-medium"
|
|
>Puerto</span
|
|
>
|
|
<span class="text-white text-sm font-bold"
|
|
>{{PORT}}</span
|
|
>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Info Message -->
|
|
<div
|
|
class="rounded-xl border border-primary/30 bg-primary/10 p-4"
|
|
>
|
|
<div class="flex items-start gap-3">
|
|
<span
|
|
class="material-symbols-outlined text-primary mt-0.5"
|
|
>info</span
|
|
>
|
|
<p class="text-[#9dabb9] text-sm text-left">
|
|
The monitor will start reporting metrics in the
|
|
next cycle (60 segundos...You can view the
|
|
application status on the dashboard.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Action Buttons -->
|
|
<div
|
|
class="flex flex-col sm:flex-row gap-3 justify-center pt-4"
|
|
>
|
|
<a
|
|
href="/"
|
|
class="flex items-center justify-center rounded-lg h-12 px-6 bg-primary hover:brightness-110 text-white text-sm font-bold transition-all gap-2"
|
|
>
|
|
<span class="material-symbols-outlined text-[18px]"
|
|
>home</span
|
|
>
|
|
<span>Ir al Panel</span>
|
|
</a>
|
|
<a
|
|
href="/select"
|
|
class="flex items-center justify-center rounded-lg h-12 px-6 bg-[#1c2730] hover:bg-[#283039] border border-[#283039] text-white text-sm font-bold transition-colors gap-2"
|
|
>
|
|
<span class="material-symbols-outlined text-[18px]"
|
|
>add_circle</span
|
|
>
|
|
<span>Agregar Otra</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Auto-redirect countdown -->
|
|
<div class="mt-6 text-center">
|
|
<p class="text-[#9dabb9] text-sm">
|
|
Redirigiendo al panel en
|
|
<span id="countdown" class="text-white font-bold"
|
|
>5</span
|
|
>
|
|
segundos...
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<script>
|
|
// Auto-redirect countdown
|
|
let segundos...5;
|
|
const countdownElement = document.getElementById("countdown");
|
|
|
|
const interval = setInterval(() => {
|
|
segundos...
|
|
if (countdownElement) {
|
|
countdownElement.textContent = seconds;
|
|
}
|
|
|
|
if (segundos... 0) {
|
|
clearInterval(interval);
|
|
window.location.href = "/";
|
|
}
|
|
}, 1000);
|
|
</script>
|
|
</body>
|
|
</html>
|