Files
vctp2/components/views/snapshots.templ
Nathan Coad 5736dc6929
Some checks failed
continuous-integration/drone/push Build is failing
avoid vcenter totals pages scanning whole database
2026-02-09 13:44:43 +11:00

229 lines
7.0 KiB
Plaintext

package views
import "vctp/components/core"
type SnapshotEntry struct {
Label string
Link string
Count int64
Group string
}
type VcenterLink struct {
Name string
Link string
}
type VcenterTotalsEntry struct {
Snapshot string
RawTime int64
VmCount int64
VcpuTotal int64
RamTotalGB int64
}
type VcenterTotalsMeta struct {
ViewType string
TypeLabel string
HourlyLink string
DailyLink string
HourlyClass string
DailyClass string
}
type VcenterChartData struct {
ConfigJSON string
}
templ SnapshotHourlyList(entries []SnapshotEntry) {
@SnapshotListPage("Hourly Inventory Snapshots", "inventory snapshots captured hourly", entries)
}
templ SnapshotDailyList(entries []SnapshotEntry) {
@SnapshotListPage("Daily Inventory Snapshots", "daily summaries of hourly inventory snapshots", entries)
}
templ SnapshotMonthlyList(entries []SnapshotEntry) {
@SnapshotListPage("Monthly Inventory Snapshots", "monthly summary aggregated from daily snapshots", entries)
}
templ SnapshotListPage(title string, subtitle string, entries []SnapshotEntry) {
<!DOCTYPE html>
<html lang="en">
@core.Header()
<body class="flex flex-col min-h-screen web2-bg">
<main class="flex-grow web2-shell space-y-8">
<section class="web2-header">
<div class="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
<div>
<div class="web2-pill">Snapshot Library</div>
<h1 class="mt-3 text-4xl font-bold">{ title }</h1>
<p class="mt-2 text-sm text-slate-600">{ subtitle }</p>
</div>
<a class="web2-button" href="/">Back to Dashboard</a>
</div>
</section>
<section class="web2-card">
<div class="flex items-center justify-between gap-3 mb-4 flex-wrap">
<h2 class="text-lg font-semibold">Available Exports</h2>
<span class="web2-badge">{ len(entries) } files</span>
</div>
<div class="overflow-hidden border border-slate-200 rounded">
<table class="web2-table">
<thead>
<tr>
<th>Snapshot</th>
<th>Records</th>
<th class="text-right">Download</th>
</tr>
</thead>
<tbody>
for i, entry := range entries {
if entry.Group != "" && (i == 0 || entries[i-1].Group != entry.Group) {
<tr class="web2-group-row">
<td colspan="3" class="font-semibold text-slate-700">{ entry.Group }</td>
</tr>
}
<tr>
<td>
<div class="flex flex-col">
<span class="text-sm font-semibold text-slate-700">{ entry.Label }</span>
</div>
</td>
<td>
<span class="web2-badge">{ entry.Count } records</span>
</td>
<td class="text-right">
<a class="web2-link" href={ entry.Link }>Download XLSX</a>
</td>
</tr>
}
</tbody>
</table>
</div>
</section>
</main>
</body>
@core.Footer()
</html>
}
templ VcenterList(links []VcenterLink) {
<!DOCTYPE html>
<html lang="en">
@core.Header()
<body class="flex flex-col min-h-screen web2-bg">
<main class="flex-grow web2-shell space-y-8">
<section class="web2-header">
<div class="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
<div>
<div class="web2-pill">vCenter Inventory</div>
<h1 class="mt-3 text-4xl font-bold">Monitored vCenters</h1>
<p class="mt-2 text-sm text-slate-600">Select a vCenter to view snapshot totals over time.</p>
</div>
<a class="web2-button" href="/">Back to Dashboard</a>
</div>
</section>
<section class="web2-card">
<div class="flex items-center justify-between gap-3 mb-4 flex-wrap">
<h2 class="text-lg font-semibold">vCenters</h2>
<span class="web2-badge">{ len(links) } total</span>
</div>
<div class="overflow-hidden border border-slate-200 rounded">
<table class="web2-table">
<thead>
<tr>
<th>vCenter</th>
<th class="text-right">Totals</th>
</tr>
</thead>
<tbody>
for _, link := range links {
<tr>
<td class="font-semibold text-slate-700">{ link.Name }</td>
<td class="text-right">
<a class="web2-link" href={ link.Link }>View Totals</a>
</td>
</tr>
}
</tbody>
</table>
</div>
</section>
</main>
</body>
@core.Footer()
</html>
}
templ VcenterTotalsPage(vcenter string, entries []VcenterTotalsEntry, chart VcenterChartData, meta VcenterTotalsMeta) {
<!DOCTYPE html>
<html lang="en">
@core.Header()
<body class="flex flex-col min-h-screen web2-bg">
<main class="flex-grow web2-shell web2-shell-wide space-y-8 max-w-screen-2xl mx-auto" style="max-width: 1400px; width: 100%;">
<section class="web2-header">
<div class="flex flex-col gap-4 md:flex-row md:items-center md:justify-between">
<div>
<div class="web2-pill">vCenter Totals</div>
<h1 class="mt-3 text-4xl font-bold">Totals for { vcenter }</h1>
<p class="mt-2 text-sm text-slate-600">{ meta.TypeLabel } snapshots of VM count, vCPU, and RAM over time.</p>
</div>
<div class="flex gap-3">
<a class="web2-button secondary" href="/vcenters">All vCenters</a>
<a class="web2-button" href="/">Dashboard</a>
</div>
</div>
<div class="web3-button-group mt-8 mb-3">
<a class={ meta.HourlyClass } href={ meta.HourlyLink }>Hourly Detail (45d)</a>
<a class={ meta.DailyClass } href={ meta.DailyLink }>Daily Aggregated</a>
</div>
</section>
<section class="web2-card">
<div class="flex items-center justify-between gap-3 mb-4 flex-wrap">
<h2 class="text-lg font-semibold">{ meta.TypeLabel } Snapshots</h2>
<span class="web2-badge">{ len(entries) } records</span>
</div>
if chart.ConfigJSON != "" {
<div class="mb-6 overflow-auto">
<div class="web3-chart-frame">
<canvas id="vcenter-totals-chart" class="web3-chart-canvas" role="img" aria-label="Totals over time" data-chart-config={ chart.ConfigJSON }></canvas>
<div id="vcenter-totals-tooltip" class="web3-chart-tooltip" aria-hidden="true"></div>
</div>
<script>
window.Web3Charts.renderFromDataset({
canvasId: "vcenter-totals-chart",
tooltipId: "vcenter-totals-tooltip",
})
</script>
</div>
}
<div class="overflow-hidden border border-slate-200 rounded">
<table class="web2-table">
<thead>
<tr>
<th>Snapshot Time</th>
<th class="text-right">VMs</th>
<th class="text-right">vCPUs</th>
<th class="text-right">RAM (GB)</th>
</tr>
</thead>
<tbody>
for _, entry := range entries {
<tr>
<td>{ entry.Snapshot }</td>
<td class="text-right">{ entry.VmCount }</td>
<td class="text-right">{ entry.VcpuTotal }</td>
<td class="text-right">{ entry.RamTotalGB }</td>
</tr>
}
</tbody>
</table>
</div>
</section>
</main>
</body>
@core.Footer()
</html>
}