refactor(ui): simplify node details and auth toggle
This commit is contained in:
@@ -161,19 +161,17 @@
|
||||
<input type="radio" class="btn-check" name="auth_mode" id="authModePassword" value="password" autocomplete="off" checked>
|
||||
<label class="auth-toggle-option" for="authModePassword">
|
||||
<span class="auth-toggle-label">Password</span>
|
||||
<span class="auth-toggle-text">Use SSH password auth</span>
|
||||
</label>
|
||||
|
||||
<input type="radio" class="btn-check" name="auth_mode" id="authModeKey" value="key" autocomplete="off">
|
||||
<label class="auth-toggle-option" for="authModeKey">
|
||||
<span class="auth-toggle-label">Key File</span>
|
||||
<span class="auth-toggle-text">Upload a key instead</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="auth-mode-panel" data-auth-panel="password">
|
||||
<label class="form-label">Password</label>
|
||||
<input type="password" class="form-control" name="ssh_password" placeholder="SSH password" data-auth-input="password">
|
||||
<input type="password" class="form-control" name="ssh_password" placeholder="Password" data-auth-input="password">
|
||||
</div>
|
||||
|
||||
<div class="auth-mode-panel d-none" data-auth-panel="key">
|
||||
|
||||
@@ -8,7 +8,6 @@
|
||||
</div>
|
||||
<div class="d-flex flex-wrap gap-2">
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/actions/refresh"><button class="btn btn-outline-primary"><i class="ti ti-refresh me-2"></i>Refresh Stats</button></form>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/actions/apt-upgrade"><button class="btn btn-outline-warning"><i class="ti ti-package me-2"></i>Apt Update/Upgrade</button></form>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/actions/wake"><button class="btn btn-outline-secondary"><i class="ti ti-bolt me-2"></i>Wake</button></form>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/actions/restart"><button class="btn btn-outline-secondary"><i class="ti ti-rotate-clockwise-2 me-2"></i>Restart</button></form>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/actions/shutdown"><button class="btn btn-danger"><i class="ti ti-power me-2"></i>Shutdown</button></form>
|
||||
@@ -59,55 +58,43 @@
|
||||
<div class="col-12 col-xl-4">
|
||||
<article class="card border-0 shadow-sm h-100">
|
||||
<div class="card-body p-4">
|
||||
<h2 class="h4 mb-3">Quick Commands</h2>
|
||||
<div class="d-grid gap-2 mb-4">
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/commands">
|
||||
<input type="hidden" name="label" value="apt-update">
|
||||
<input type="hidden" name="command" value="sudo apt update">
|
||||
<button class="btn btn-outline-secondary w-100 text-start" type="submit"><i class="ti ti-package-import me-2"></i>Apt Update</button>
|
||||
</form>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/commands">
|
||||
<input type="hidden" name="label" value="apt-upgrade">
|
||||
<input type="hidden" name="command" value="sudo apt update && sudo apt upgrade -y">
|
||||
<button class="btn btn-outline-secondary w-100 text-start" type="submit"><i class="ti ti-package-export me-2"></i>Apt Upgrade</button>
|
||||
</form>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/commands">
|
||||
<input type="hidden" name="label" value="disk-usage">
|
||||
<input type="hidden" name="command" value="df -h">
|
||||
<button class="btn btn-outline-secondary w-100 text-start" type="submit"><i class="ti ti-device-imac-stats me-2"></i>Disk Usage</button>
|
||||
</form>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/commands">
|
||||
<input type="hidden" name="label" value="failed-services">
|
||||
<input type="hidden" name="command" value="systemctl --failed">
|
||||
<button class="btn btn-outline-secondary w-100 text-start" type="submit"><i class="ti ti-alert-circle me-2"></i>Failed Services</button>
|
||||
</form>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/commands">
|
||||
<input type="hidden" name="label" value="docker-ps">
|
||||
<input type="hidden" name="command" value="docker ps -a">
|
||||
<button class="btn btn-outline-secondary w-100 text-start" type="submit"><i class="ti ti-brand-docker me-2"></i>Docker PS</button>
|
||||
</form>
|
||||
<div class="system-summary vstack gap-3">
|
||||
<div class="system-summary-item">
|
||||
<div class="chip-icon system-summary-icon">
|
||||
<i class="{{nodeIconClass $data.Node.Distro $data.Node.PackageManager}}"></i>
|
||||
</div>
|
||||
|
||||
<h3 class="h6 mb-3">Custom Command</h3>
|
||||
<form method="post" action="/nodes/{{$data.Node.ID}}/commands">
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Label</label>
|
||||
<input class="form-control" type="text" name="label" value="custom-command">
|
||||
<div class="min-w-0">
|
||||
<div class="system-summary-label">Distribution</div>
|
||||
<div class="system-summary-value text-truncate">{{$data.Node.Distro}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="system-summary-item">
|
||||
<div class="chip-icon system-summary-icon">
|
||||
<i class="{{packageManagerIconClass $data.Node.PackageManager}}"></i>
|
||||
</div>
|
||||
<div class="min-w-0">
|
||||
<div class="system-summary-label">Package Manager</div>
|
||||
<div class="system-summary-value text-truncate">{{packageManagerLabel $data.Node.PackageManager}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="system-summary-stats">
|
||||
<div class="system-summary-stat">
|
||||
<span class="text-body-secondary">Architecture</span>
|
||||
<span class="text-end">{{$data.Node.Architecture}}</span>
|
||||
</div>
|
||||
<div class="system-summary-stat">
|
||||
<span class="text-body-secondary">Kernel</span>
|
||||
<span class="text-end">{{$data.Node.KernelVersion}}</span>
|
||||
</div>
|
||||
<div class="system-summary-stat">
|
||||
<span class="text-body-secondary">Memory</span>
|
||||
<span class="text-end">{{if $data.Node.MemoryTotalMB}}{{$data.Node.MemoryTotalMB}} MB{{else}}-{{end}}</span>
|
||||
</div>
|
||||
<div class="system-summary-stat">
|
||||
<span class="text-body-secondary">Disk</span>
|
||||
<span class="text-end">{{if $data.Node.DiskTotalGB}}{{$data.Node.DiskTotalGB}} GB{{else}}-{{end}}</span>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label class="form-label">Command</label>
|
||||
<textarea class="form-control" name="command" rows="4" placeholder="journalctl -n 100" required></textarea>
|
||||
</div>
|
||||
<button class="btn btn-primary" type="submit"><i class="ti ti-player-play me-2"></i>Run Command</button>
|
||||
</form>
|
||||
<hr class="my-4">
|
||||
<div class="vstack gap-2 small">
|
||||
<div class="d-flex justify-content-between gap-3"><span class="text-body-secondary">Package Manager</span><span class="text-end">{{$data.Node.PackageManager}}</span></div>
|
||||
<div class="d-flex justify-content-between gap-3"><span class="text-body-secondary">Architecture</span><span class="text-end">{{$data.Node.Architecture}}</span></div>
|
||||
<div class="d-flex justify-content-between gap-3"><span class="text-body-secondary">Kernel</span><span class="text-end">{{$data.Node.KernelVersion}}</span></div>
|
||||
<div class="d-flex justify-content-between gap-3"><span class="text-body-secondary">CPU Model</span><span class="text-end">{{$data.Node.CPUModel}}</span></div>
|
||||
<div class="d-flex justify-content-between gap-3"><span class="text-body-secondary">Memory</span><span class="text-end">{{if $data.Node.MemoryTotalMB}}{{$data.Node.MemoryTotalMB}} MB{{else}}-{{end}}</span></div>
|
||||
<div class="d-flex justify-content-between gap-3"><span class="text-body-secondary">Disk</span><span class="text-end">{{if $data.Node.DiskTotalGB}}{{$data.Node.DiskTotalGB}} GB{{else}}-{{end}}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
Reference in New Issue
Block a user