From 6cc0bfd1d79074df790272b8091b1f0226d14283 Mon Sep 17 00:00:00 2001 From: zwlucas Date: Fri, 29 May 2026 15:57:37 -0300 Subject: feat: upload project Signed-off-by: zwlucas --- frontend/src/routes/(admin)/admin/+page.server.js | 27 ++ frontend/src/routes/(admin)/admin/+page.svelte | 432 ++++++++++++++++++++++ frontend/src/routes/+layout.svelte | 50 +++ frontend/src/routes/+page.svelte | 164 ++++++++ frontend/src/routes/+page.ts | 33 ++ frontend/src/routes/login/+page.server.js | 51 +++ frontend/src/routes/login/+page.svelte | 61 +++ frontend/src/routes/services/[id]/+page.svelte | 261 +++++++++++++ frontend/src/routes/status/[id]/+page.svelte | 278 ++++++++++++++ frontend/src/routes/status/[id]/+page.ts | 22 ++ 10 files changed, 1379 insertions(+) create mode 100644 frontend/src/routes/(admin)/admin/+page.server.js create mode 100644 frontend/src/routes/(admin)/admin/+page.svelte create mode 100644 frontend/src/routes/+layout.svelte create mode 100644 frontend/src/routes/+page.svelte create mode 100644 frontend/src/routes/+page.ts create mode 100644 frontend/src/routes/login/+page.server.js create mode 100644 frontend/src/routes/login/+page.svelte create mode 100644 frontend/src/routes/services/[id]/+page.svelte create mode 100644 frontend/src/routes/status/[id]/+page.svelte create mode 100644 frontend/src/routes/status/[id]/+page.ts (limited to 'frontend/src/routes') diff --git a/frontend/src/routes/(admin)/admin/+page.server.js b/frontend/src/routes/(admin)/admin/+page.server.js new file mode 100644 index 0000000..bdf498b --- /dev/null +++ b/frontend/src/routes/(admin)/admin/+page.server.js @@ -0,0 +1,27 @@ +const API = 'http://localhost:8080/api'; + +export async function load({ locals }) { + const token = locals.token; + + const headers = token ? { Authorization: `Bearer ${token}` } : {}; + + const res = await fetch(`${API}/services`, { headers }); + if (!res.ok) { + return { services: [], error: 'Falha ao carregar serviços', token: token ?? '' }; + } + const services = await res.json(); + + const servicesWithStats = await Promise.all( + services.map(async (svc) => { + try { + const statsRes = await fetch(`${API}/services/${svc.id}/stats`, { headers }); + if (statsRes.ok) { + svc.stats = await statsRes.json(); + } + } catch { /* ignore */ } + return svc; + }) + ); + + return { services: servicesWithStats, error: null, token: token ?? '' }; +} diff --git a/frontend/src/routes/(admin)/admin/+page.svelte b/frontend/src/routes/(admin)/admin/+page.svelte new file mode 100644 index 0000000..24b56db --- /dev/null +++ b/frontend/src/routes/(admin)/admin/+page.svelte @@ -0,0 +1,432 @@ + + + + Admin — YAUM + + +
+
+

Painel de Controle

+

Gerenciamento de serviços monitorados

+
+ + ← Dashboard + +
+ +
+ +
+ +{#if data.error} +
+

{data.error}

+
+{:else if services.length === 0} +
+

Nenhum serviço cadastrado

+
+{:else} + {#each [...new Set(services.map((s) => s.group_name || 'Geral'))].sort() as group} +
+

{group}

+
+ + + + + + + + + + + + + {#each services.filter((s) => (s.group_name || 'Geral') === group) as svc (svc.id)} + + + + + + + + + {/each} + +
IDNomeStatusSLA 30dAções
{svc.id}{svc.name} + + {svc.last_heartbeat?.is_up ?? true ? 'UP' : 'DOWN'} + + + {svc.stats ? svc.stats.uptime_30d.toFixed(2) + '%' : '—'} + +
+ + + + +
+
+
+
+ {/each} +{/if} + + +{#if showForm} + +
+
e.stopPropagation()} + > +
+

+ {editingSvc ? 'Editar Serviço' : 'Novo Serviço'} +

+ +
+ +
+ {#if editingSvc} + + {/if} + +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+

Opcionais

+ +
+ + +
+ +
+ + +
+ +
+ + +
+
+ + {#if formError} +

{formError}

+ {/if} + +
+ + +
+
+
+
+{/if} + + diff --git a/frontend/src/routes/+layout.svelte b/frontend/src/routes/+layout.svelte new file mode 100644 index 0000000..9ed74ce --- /dev/null +++ b/frontend/src/routes/+layout.svelte @@ -0,0 +1,50 @@ + + +
+ {#if maintenance} +
+
+ + + +

{maintenance.title}

+
+
+ {/if} + +
+
+
+ + ● YAUM + + +
+ +
+
+ +
+ {@render children()} +
+
diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte new file mode 100644 index 0000000..511460a --- /dev/null +++ b/frontend/src/routes/+page.svelte @@ -0,0 +1,164 @@ + + + + YAUM — Yet Another Uptime Monitor + + +
+

Dashboard

+

Status dos serviços monitorados

+
+ +{#if error} +
+ + + +

{error}

+ +
+{:else if services.length === 0} +
+
+ + + +
+

Nenhum serviço sendo monitorado

+

Adicione o primeiro serviço para começar

+ +
+{:else} + {#each [...new Set(services.map((s) => s.group_name || 'Geral'))].sort() as group} +
+

{group}

+
+ {#each services.filter((s) => (s.group_name || 'Geral') === group) as svc (svc.id)} + + {/each} +
+
+ {/each} + +
+ +
+{/if} + + (showModal = false)} + oncreated={handleCreated} +/> diff --git a/frontend/src/routes/+page.ts b/frontend/src/routes/+page.ts new file mode 100644 index 0000000..ba70169 --- /dev/null +++ b/frontend/src/routes/+page.ts @@ -0,0 +1,33 @@ +import type { Service, Heartbeat } from '$lib/types'; + +export interface EnhancedService extends Service { + heartbeats: Heartbeat[]; +} + +export async function load({ fetch }) { + let services: EnhancedService[] = []; + let error = ''; + + try { + const res = await fetch('/api/services'); + if (!res.ok) throw new Error(`HTTP ${res.status}`); + const list: Service[] = await res.json(); + + services = await Promise.all( + list.map(async (svc) => { + try { + const hres = await fetch(`/api/services/${svc.id}/history`); + if (!hres.ok) throw new Error(`HTTP ${hres.status}`); + const heartbeats: Heartbeat[] = await hres.json(); + return { ...svc, heartbeats }; + } catch { + return { ...svc, heartbeats: [] }; + } + }) + ); + } catch (e) { + error = 'Não foi possível conectar ao servidor'; + } + + return { services, error }; +} diff --git a/frontend/src/routes/login/+page.server.js b/frontend/src/routes/login/+page.server.js new file mode 100644 index 0000000..4272ef7 --- /dev/null +++ b/frontend/src/routes/login/+page.server.js @@ -0,0 +1,51 @@ +import { redirect } from '@sveltejs/kit'; + +const API = 'http://localhost:8080/api'; + +export async function load({ cookies }) { + const token = cookies.get('auth_token'); + if (token) { + const res = await fetch(`${API}/auth/verify`, { + headers: { Authorization: `Bearer ${token}` } + }); + if (res.ok) { + throw redirect(302, '/admin'); + } + } + return {}; +} + +export const actions = { + default: async ({ request, cookies }) => { + const data = await request.formData(); + const username = data.get('username'); + const password = data.get('password'); + + if (!username || !password) { + return { error: 'Preencha todos os campos' }; + } + + const res = await fetch(`${API}/auth/login`, { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify({ username, password }) + }); + + if (!res.ok) { + const err = await res.json().catch(() => ({})); + return { error: err.error || 'Credenciais inválidas' }; + } + + const { token } = await res.json(); + + cookies.set('auth_token', token, { + httpOnly: true, + secure: process.env.NODE_ENV === 'production', + sameSite: 'lax', + path: '/', + maxAge: 7 * 24 * 60 * 60 + }); + + throw redirect(302, '/admin'); + } +}; diff --git a/frontend/src/routes/login/+page.svelte b/frontend/src/routes/login/+page.svelte new file mode 100644 index 0000000..a472c89 --- /dev/null +++ b/frontend/src/routes/login/+page.svelte @@ -0,0 +1,61 @@ + + + + Login — YAUM + + +
+
+
+

YAUM

+

Yet Another Uptime Monitor

+
+ +
+
+
+ + +
+ +
+ + +
+ + {#if form?.error} +

{form.error}

+ {/if} + + +
+
+ +

+ ← Voltar ao Dashboard +

+
+
diff --git a/frontend/src/routes/services/[id]/+page.svelte b/frontend/src/routes/services/[id]/+page.svelte new file mode 100644 index 0000000..36ea105 --- /dev/null +++ b/frontend/src/routes/services/[id]/+page.svelte @@ -0,0 +1,261 @@ + + + + {svc?.name ?? 'Detalhes'} — YAUM + + +{#if loading} +
+
+
+{:else if !svc} +
+

Serviço não encontrado

+
+{:else} +
+ + ← Voltar + +
+ +
+

{svc.name}

+

{svc.url}

+
+ +
+ + {#if stats} +
+

+ Uptime +

+
+ {#each [ + { label: '24h', uptime: stats.uptime_24h, checks: stats.total_checks_24h, avg: stats.avg_response_ms_24h }, + { label: '7 dias', uptime: stats.uptime_7d, checks: stats.total_checks_7d, avg: stats.avg_response_ms_7d }, + { label: '30 dias', uptime: stats.uptime_30d, checks: stats.total_checks_30d, avg: stats.avg_response_ms_30d } + ] as item} +
+
+ + {item.label} + + + {item.checks} checks + +
+
+ + {item.uptime.toFixed(2)}% + + + {item.avg.toFixed(0)}ms méd. + +
+
+ {/each} +
+
+ {/if} + + +
+

+ Tempo de Resposta (ms) +

+
+ {#if history.length === 0} +
+ Sem dados ainda +
+ {:else if history.length === 1} +
+ + {history[0].response_time_ms} + ms + + + {history[0].is_up ? 'Online' : 'Offline'} — + {history[0].status_code || 'timeout'} + +
+ {:else} + + {#each yTicks as tick} + + {tick.val} + {/each} + + `${d.x},${d.y}`).join(' ')} + fill="none" + stroke="var(--green)" + stroke-width="2" + stroke-linecap="round" + stroke-linejoin="round" + /> + + {#each dots as d} + + {/each} + + {/if} +
+
+ {history[0]?.tested_at ? new Date(history[0].tested_at).toLocaleTimeString() : ''} + {history[history.length - 1]?.tested_at + ? new Date(history[history.length - 1].tested_at).toLocaleTimeString() + : ''} +
+
+ + +
+

+ Últimas Verificações +

+
+ {#each history.slice().reverse() as h} +
+
+
+ + + {#if h.status_code > 0} + {h.status_code} + {:else} + TIMEOUT + {/if} + +
+
+ {h.response_time_ms}ms + {#if h.error_message} + + {/if} +
+
+ {#if expandedError === h.id && h.error_message} +
+ 
{h.error_message}
+
+ {/if} +
+ {/each} +
+
+
+{/if} diff --git a/frontend/src/routes/status/[id]/+page.svelte b/frontend/src/routes/status/[id]/+page.svelte new file mode 100644 index 0000000..afc59a2 --- /dev/null +++ b/frontend/src/routes/status/[id]/+page.svelte @@ -0,0 +1,278 @@ + + + + {svc?.name ?? 'Status'} — YAUM + + +
+ {#if !svc} +
+
+ + + +
+

Serviço não encontrado

+

+ ← Voltar ao início +

+
+ {:else} + +
+ + ← Voltar ao Dashboard + +
+ + +
+ {#if isUp === null} +
+

Aguardando verificação

+ {:else} +
+ {#if isUp} + + + + {:else} + + + + {/if} +
+

+ {isUp ? 'Operando Normalmente' : 'Fora do Ar'} +

+ {/if} + +
+

{svc.name}

+

{svc.url}

+
+ + {#if stats} +
+
+

SLA 30 dias

+

+ {stats.uptime_30d.toFixed(2)}% +

+
+
+
+

Latência Média

+

+ {stats.avg_response_ms_30d.toFixed(0)}ms +

+
+
+
+

Total de Checks

+

{stats.total_checks_30d}

+
+
+ {/if} +
+ +
+ + {#if stats} +
+

+ Uptime +

+
+ {#each [ + { label: 'Últimas 24h', uptime: stats.uptime_24h, checks: stats.total_checks_24h, avg: stats.avg_response_ms_24h }, + { label: 'Últimos 7 dias', uptime: stats.uptime_7d, checks: stats.total_checks_7d, avg: stats.avg_response_ms_7d }, + { label: 'Últimos 30 dias', uptime: stats.uptime_30d, checks: stats.total_checks_30d, avg: stats.avg_response_ms_30d } + ] as item} +
+
+ {item.label} + {item.checks} checks +
+
+ + {item.uptime.toFixed(2)}% + + {item.avg.toFixed(0)}ms méd. +
+
+ {/each} +
+
+ {/if} + + +
+

+ Tempo de Resposta (ms) +

+
+ {#if history.length === 0} +
+ Sem dados ainda +
+ {:else if history.length === 1} +
+ + {history[0].response_time_ms} + ms + + + {history[0].is_up ? 'Online' : 'Offline'} — {history[0].status_code || 'timeout'} + +
+ {:else} + + {#each yTicks as tick} + + {tick.val} + {/each} + `${d.x},${d.y}`).join(' ')} + fill="none" stroke="var(--green)" stroke-width="2" + stroke-linecap="round" stroke-linejoin="round" + /> + {#each dots as d} + + {/each} + + {/if} +
+
+ {history[0]?.tested_at ? new Date(history[0].tested_at).toLocaleTimeString() : ''} + {history[history.length - 1]?.tested_at ? new Date(history[history.length - 1].tested_at).toLocaleTimeString() : ''} +
+
+
+ + +
+

+ Histórico de Verificações +

+ {#if history.length === 0} +

Nenhuma verificação registrada

+ {:else} +
+ + + + + + + + + + + + {#each [...history].reverse() as h} + + + + + + + + {/each} + +
HorárioStatusCódigoLatênciaErro
+ {new Date(h.tested_at).toLocaleString('pt-BR')} + + + {h.is_up ? 'UP' : 'DOWN'} + + + {h.status_code > 0 ? h.status_code : '—'} + + {h.response_time_ms}ms + + {#if h.error_message} + + {#if expandedError === h.id} + 
{(h as any).error_message}
+ {/if} + {:else} + — + {/if} +
+
+ {/if} +
+ {/if} +
diff --git a/frontend/src/routes/status/[id]/+page.ts b/frontend/src/routes/status/[id]/+page.ts new file mode 100644 index 0000000..4351aae --- /dev/null +++ b/frontend/src/routes/status/[id]/+page.ts @@ -0,0 +1,22 @@ +import type { PageLoad } from './$types'; + +export const load: PageLoad = async ({ params, fetch }) => { + const id = params.id; + + const [servicesRes, historyRes, statsRes] = await Promise.all([ + fetch(`http://localhost:8080/api/services`).catch(() => null), + fetch(`http://localhost:8080/api/services/${id}/history`).catch(() => null), + fetch(`http://localhost:8080/api/services/${id}/stats`).catch(() => null) + ]); + + const services = servicesRes?.ok ? await servicesRes.json() : []; + const svc = services.find((s: any) => s.id === Number(id)); + const history = historyRes?.ok ? await historyRes.json() : []; + const stats = statsRes?.ok ? await statsRes.json() : null; + + return { + service: svc ?? null, + history, + stats + }; +}; -- cgit v1.2.3