5dc277f2b1
- style.css: navy token palette (--bg-0/1/2, --line, --text-1/2/3, --blue, --warn, --crit), single 2px radius, all box-shadows and the bg grid overlay removed, fonts via --font-ui/--font-data. - Components: .meter (3px hairline track, blue nominal fill, neutral 70/85 ticks, warn/crit flag), .tag (square 2px state chip + dot, pulse on progress, reduced-motion respected), .metarow (icon + text, no container), .panel/.list/.section-h primitives, boxless .stats with hairline dividers, buttons 2px (danger = crit outline). - funcmap: stateColor -> run/progress/warn/neutral/off (stopped is neutral, NOT red — operator-approved exception-color change), usageColor/tempColor -> nominal/warn/crit (thresholds unchanged); stateLabel Hungarian copy untouched (guarded by test). - layout.html: sprite nav icons (layout-grid/cloud/shield/cpu/wrench/ settings), alert banner emoji -> triangle-alert/info icons. - dashboard.html: meters with disk warn/crit flags (Fogyóban a hely / Kritikusan kevés hely), boxless stats (Leállítva 0 muted, >0 amber), single-panel stack list with 2px state edges, tags instead of badges, icon action buttons. - stacks.html: state tag + metarow rows; catalog keeps its grid. - setup minimalCSS retokened to v2 (drops GitHub-dark hexes). - Tests: §8 truth tables for stateColor/usageColor/tempColor + stateLabel byte-identity guard (red-proven vs pre-change funcmap: stopped->red and 0->green failed as required).
197 lines
11 KiB
HTML
197 lines
11 KiB
HTML
{{define "dashboard"}}
|
|
{{template "layout_start" .}}
|
|
|
|
<div class="page-header">
|
|
<h2>Vezérlőpult</h2>
|
|
<span class="domain-badge">{{.Domain}}</span>
|
|
</div>
|
|
|
|
<div class="stats-grid">
|
|
<a href="/stacks?filter=running" class="stat-card">
|
|
<div class="stat-value">{{.RunningCount}}</div>
|
|
<div class="stat-label">Futó alkalmazás</div>
|
|
</a>
|
|
<a href="/stacks?filter=stopped" class="stat-card {{if gt .StoppedCount 0}}stat-warn{{else}}stat-zero{{end}}">
|
|
<div class="stat-value">{{.StoppedCount}}</div>
|
|
<div class="stat-label">Leállítva</div>
|
|
</a>
|
|
<a href="/stacks" class="stat-card">
|
|
<div class="stat-value">{{.TotalCount}}</div>
|
|
<div class="stat-label">Összes alkalmazás</div>
|
|
</a>
|
|
</div>
|
|
|
|
{{if .SystemInfo.TotalMemMB}}
|
|
<div class="system-info-card">
|
|
<div class="system-info-items">
|
|
<div class="system-info-item meter {{usageColor .SystemInfo.MemPercent}}">
|
|
<div class="system-info-header">
|
|
<span class="system-info-label">Memória</span>
|
|
<span class="system-info-value">{{fmtMB .SystemInfo.UsedMemMB}} / {{fmtMB .SystemInfo.TotalMemMB}} ({{printf "%.0f" .SystemInfo.MemPercent}}%)</span>
|
|
</div>
|
|
<div class="meter-track">
|
|
<div class="meter-fill" style="width:{{printf "%.0f" .SystemInfo.MemPercent}}%"></div>
|
|
</div>
|
|
</div>
|
|
<div class="system-info-item meter {{usageColor .SystemInfo.CPUPercent}}">
|
|
<div class="system-info-header">
|
|
<span class="system-info-label">CPU</span>
|
|
<span class="system-info-value">{{printf "%.0f" .SystemInfo.CPUPercent}}%</span>
|
|
</div>
|
|
<div class="meter-track">
|
|
<div class="meter-fill" style="width:{{printf "%.0f" .SystemInfo.CPUPercent}}%"></div>
|
|
</div>
|
|
<div class="system-load-avg">Load: {{fmtLoad .SystemInfo.LoadAvg1}} / {{fmtLoad .SystemInfo.LoadAvg5}} / {{fmtLoad .SystemInfo.LoadAvg15}}</div>
|
|
</div>
|
|
{{if .SystemInfo.TemperatureCelsius}}
|
|
<div class="system-info-item system-info-item-compact">
|
|
<div class="system-info-header">
|
|
<span class="system-info-label"><svg class="ico ico-sm"><use href="#i-thermometer"/></svg> Hőmérséklet</span>
|
|
<span class="system-info-value temp-value state-text-{{tempColor .SystemInfo.TemperatureCelsius}}">{{fmtTemp .SystemInfo.TemperatureCelsius}}</span>
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
<div class="system-info-items" style="margin-top: 1rem;">
|
|
{{$duc := usageColor .SystemInfo.DiskPercent}}
|
|
<div class="system-info-item meter {{$duc}}">
|
|
<div class="system-info-header">
|
|
<span class="system-info-label">Rendszer (/)</span>
|
|
<span class="system-info-value">{{fmtGB .SystemInfo.DiskUsedGB}} / {{fmtGB .SystemInfo.DiskTotalGB}} ({{printf "%.0f" .SystemInfo.DiskPercent}}%)</span>
|
|
</div>
|
|
<div class="meter-track">
|
|
<div class="meter-fill" style="width:{{printf "%.0f" .SystemInfo.DiskPercent}}%"></div>
|
|
</div>
|
|
{{if eq $duc "warn"}}<div class="meter-flag"><svg class="ico"><use href="#i-triangle-alert"/></svg>Fogyóban a hely</div>{{else if eq $duc "crit"}}<div class="meter-flag"><svg class="ico"><use href="#i-triangle-alert"/></svg>Kritikusan kevés hely</div>{{end}}
|
|
</div>
|
|
{{range .StorageBars}}
|
|
{{if .Disconnected}}
|
|
<div class="system-info-item meter meter-empty storage-disconnected">
|
|
<div class="system-info-header">
|
|
<span class="system-info-label">{{.Label}}</span>
|
|
<span class="system-info-value">— <span class="state-text-neutral">Leválasztva</span></span>
|
|
</div>
|
|
<div class="meter-track"></div>
|
|
</div>
|
|
{{else}}
|
|
{{$uc := usageColor .Percent}}
|
|
<div class="system-info-item meter {{$uc}}">
|
|
<div class="system-info-header">
|
|
<span class="system-info-label">{{.Label}}</span>
|
|
<span class="system-info-value">{{fmtGB .UsedGB}} / {{fmtGB .TotalGB}} ({{printf "%.0f" .Percent}}%)</span>
|
|
</div>
|
|
<div class="meter-track">
|
|
<div class="meter-fill" style="width:{{printf "%.0f" .Percent}}%"></div>
|
|
</div>
|
|
{{if eq $uc "warn"}}<div class="meter-flag"><svg class="ico"><use href="#i-triangle-alert"/></svg>Fogyóban a hely</div>{{else if eq $uc "crit"}}<div class="meter-flag"><svg class="ico"><use href="#i-triangle-alert"/></svg>Kritikusan kevés hely</div>{{end}}
|
|
</div>
|
|
{{end}}
|
|
{{end}}
|
|
</div>
|
|
{{if .SettingsWarning}}
|
|
<div class="inline-warnings">
|
|
<div class="inline-warning inline-warning-error">
|
|
<span class="inline-warning-dot">●</span>
|
|
<span class="inline-warning-text">{{.SettingsWarning}}</span>
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
{{if .DiskWarnings}}
|
|
<div class="inline-warnings">
|
|
{{range .DiskWarnings}}
|
|
<div class="inline-warning inline-warning-{{.Level}}">
|
|
<span class="inline-warning-dot">●</span>
|
|
<span class="inline-warning-text">{{.Message}}</span>
|
|
{{if .Link}}<a href="{{.Link}}" class="inline-warning-link">{{.LinkText}} →</a>{{end}}
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if .BackupEnabled}}
|
|
<div class="backup-status-card">
|
|
<h3><a href="/backups" class="backup-card-link">Biztonsági mentés</a></h3>
|
|
{{if .BackupStatus}}
|
|
<div class="backup-info-row">
|
|
<span class="backup-label">Utolsó mentés:</span>
|
|
<span class="backup-value">
|
|
{{if .BackupStatus.Success}}
|
|
<span>{{.BackupStatus.LastRun.Format "2006-01-02 15:04"}}</span>
|
|
{{else}}
|
|
<span class="backup-status-fail">Sikertelen</span>
|
|
{{end}}
|
|
</span>
|
|
</div>
|
|
{{else}}
|
|
<div class="backup-info-row">
|
|
<span class="backup-label">Utolsó mentés:</span>
|
|
<span class="backup-value backup-status-none">Még nem futott</span>
|
|
</div>
|
|
{{end}}
|
|
{{if .DBDumpStatus}}
|
|
<div class="backup-info-row">
|
|
<span class="backup-label">Adatbázisok:</span>
|
|
<span class="backup-value">{{len .DBDumpStatus.Results}} mentve</span>
|
|
</div>
|
|
{{end}}
|
|
{{/* Cross-drive ("2. mentés") moved to the host agent in slice 8C — the dashboard handler no
|
|
longer provides CrossDrive* fields, so the old block was a dead reference that 500'd the
|
|
dashboard (gt <nil> 0). Removed in v0.41.2. */}}
|
|
</div>
|
|
{{end}}
|
|
|
|
<h3>Telepített alkalmazások</h3>
|
|
|
|
<div class="stack-list">
|
|
{{range .Stacks}}
|
|
<div class="stack-card stack-state-{{stateColor .State}}"{{if .Meta.Slug}} data-href="/apps/{{.Meta.Slug}}"{{end}}>
|
|
<div class="stack-info">
|
|
<img class="stack-logo" src="{{logoURL .Meta.Slug}}"
|
|
alt="{{.Meta.DisplayName}}" onerror="this.onerror=function(){this.style.display='none'};this.src='{{logoPNGURL .Meta.Slug}}'">
|
|
<div>
|
|
<strong class="stack-name">{{.Meta.DisplayName}}</strong>
|
|
{{if .Meta.Description}}<span class="stack-desc">{{.Meta.Description}}</span>{{end}}
|
|
</div>
|
|
</div>
|
|
<div class="stack-actions">
|
|
<span class="tag tag-{{stateColor .State}}"><span class="dot"></span>{{stateLabel .State}}</span>
|
|
{{if .Orphaned}}<span class="tag tag-warn">Elavult</span>{{end}}
|
|
{{$ms := index $.MissingStorage .Name}}{{if $ms}}<span class="tag tag-warn" title="Az alkalmazás adattárolója nem elérhető. Csatlakoztasd újra a meghajtót, vagy helyezd át az adatokat egy másik tárhelyre."><svg class="ico ico-sm"><use href="#i-triangle-alert"/></svg>Hiányzó tárhely: {{$ms}}</span>{{end}}
|
|
{{$nw := index $.NetworkWarnings .Name}}{{if $nw}}<span class="tag tag-warn" title="A hálózati tárhely (NAS) jelenleg nem érhető el. Az alkalmazás fut; az adatok elérése a NAS visszatértével helyreáll."><svg class="ico ico-sm"><use href="#i-triangle-alert"/></svg>Hálózati tárhely nem elérhető: {{$nw}}</span>{{end}}
|
|
{{if and .Deployed (routeUnpublished .State)}}<span class="tag tag-warn" title="A proxy (Traefik) csak egészséges konténerhez publikál nyilvános útvonalat. Amíg az alkalmazás nem egészséges, az URL 404-et ad, pedig a konténer fut."><svg class="ico ico-sm"><use href="#i-triangle-alert"/></svg>URL nem elérhető</span>{{end}}
|
|
|
|
{{if .Protected}}
|
|
<span class="tag"><svg class="ico ico-sm"><use href="#i-lock"/></svg>Védett</span>
|
|
{{if isOperational .State}}
|
|
<button class="btn btn-sm btn-warning" onclick="stackAction(event, '{{.Name}}', 'restart')" title="Újraindítás"><svg class="ico ico-sm"><use href="#i-rotate-cw"/></svg></button>
|
|
{{end}}
|
|
{{else if not .Deployed}}
|
|
<a href="/stacks/{{.Name}}/deploy" class="btn btn-sm btn-primary" onclick="return checkBeforeDeploy(event, '{{.Name}}')">Telepítés</a>
|
|
{{else}}
|
|
{{if isOperational .State}}
|
|
{{$subdomain := index $.Subdomains .Name}}
|
|
{{if $subdomain}}<a href="https://{{$subdomain}}.{{$.Domain}}{{.Meta.OpenPath}}" target="_blank" class="btn btn-sm btn-outline" onclick="event.stopPropagation()">Megnyitás <svg class="ico ico-sm"><use href="#i-external-link"/></svg></a>{{end}}
|
|
<button class="btn btn-sm btn-warning" onclick="stackAction(event, '{{.Name}}', 'restart')" title="Újraindítás"><svg class="ico ico-sm"><use href="#i-rotate-cw"/></svg></button>
|
|
<button class="btn btn-sm btn-danger" onclick="stackAction(event, '{{.Name}}', 'stop')" title="Leállítás"><svg class="ico ico-sm"><use href="#i-square"/></svg></button>
|
|
{{else}}
|
|
<button class="btn btn-sm btn-success" onclick="stackAction(event, '{{.Name}}', 'start')" title="Indítás"><svg class="ico ico-sm"><use href="#i-play"/></svg></button>
|
|
{{if not .Orphaned}}<button class="btn btn-sm btn-danger" onclick="removeStack('{{.Name}}')">Eltávolítás</button>{{end}}
|
|
{{end}}
|
|
<a href="/stacks/{{.Name}}/logs" class="btn btn-sm btn-outline">Napló</a>
|
|
{{if .Orphaned}}<button class="btn btn-sm btn-danger" onclick="deleteOrphanStack('{{.Name}}')">Törlés</button>{{end}}
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
{{else}}
|
|
<div class="empty-state">
|
|
<p>Nincs elérhető alkalmazás.</p>
|
|
</div>
|
|
{{end}}
|
|
</div>
|
|
|
|
|
|
{{template "layout_end" .}}
|
|
{{end}}
|