weed admin UI dynamically show columns (#6939)

* show counts for rack and disk type

* dynamically display columns if more than one value

* adjust ui
This commit is contained in:
Chris Lu
2025-07-02 21:49:37 -07:00
committed by GitHub
parent ac82dd7c07
commit 080dce80eb
6 changed files with 696 additions and 507 deletions

View File

@@ -45,26 +45,6 @@ templ ClusterCollections(data dash.ClusterCollectionsData) {
</div>
</div>
<div class="col-xl-3 col-md-6 mb-4">
<div class="card border-left-success shadow h-100 py-2">
<div class="card-body">
<div class="row no-gutters align-items-center">
<div class="col mr-2">
<div class="text-xs font-weight-bold text-success text-uppercase mb-1">
Active Collections
</div>
<div class="h5 mb-0 font-weight-bold text-gray-800">
{fmt.Sprintf("%d", countActiveCollections(data.Collections))}
</div>
</div>
<div class="col-auto">
<i class="fas fa-check-circle fa-2x text-gray-300"></i>
</div>
</div>
</div>
</div>
</div>
<div class="col-xl-3 col-md-6 mb-4">
<div class="card border-left-info shadow h-100 py-2">
<div class="card-body">
@@ -104,11 +84,8 @@ templ ClusterCollections(data dash.ClusterCollectionsData) {
</div>
</div>
</div>
</div>
<!-- Second Row of Summary Cards -->
<div class="row mb-4">
<div class="col-xl-6 col-md-6 mb-4">
<div class="col-xl-3 col-md-6 mb-4">
<div class="card border-left-secondary shadow h-100 py-2">
<div class="card-body">
<div class="row no-gutters align-items-center">
@@ -127,26 +104,6 @@ templ ClusterCollections(data dash.ClusterCollectionsData) {
</div>
</div>
</div>
<div class="col-xl-6 col-md-6 mb-4">
<div class="card border-left-dark shadow h-100 py-2">
<div class="card-body">
<div class="row no-gutters align-items-center">
<div class="col mr-2">
<div class="text-xs font-weight-bold text-dark text-uppercase mb-1">
Data Centers
</div>
<div class="h5 mb-0 font-weight-bold text-gray-800">
{fmt.Sprintf("%d", countUniqueCollectionDataCenters(data.Collections))}
</div>
</div>
<div class="col-auto">
<i class="fas fa-building fa-2x text-gray-300"></i>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Collections Table -->
@@ -163,12 +120,10 @@ templ ClusterCollections(data dash.ClusterCollectionsData) {
<thead>
<tr>
<th>Collection Name</th>
<th>Data Center</th>
<th>Volumes</th>
<th>Files</th>
<th>Size</th>
<th>Disk Types</th>
<th>Status</th>
<th>Actions</th>
</tr>
</thead>
@@ -178,9 +133,6 @@ templ ClusterCollections(data dash.ClusterCollectionsData) {
<td>
<strong>{collection.Name}</strong>
</td>
<td>
<span class="badge bg-light text-dark">{collection.DataCenter}</span>
</td>
<td>
<div class="d-flex align-items-center">
<i class="fas fa-database me-2 text-muted"></i>
@@ -210,11 +162,6 @@ templ ClusterCollections(data dash.ClusterCollectionsData) {
<span class="text-muted">Unknown</span>
}
</td>
<td>
<span class={fmt.Sprintf("badge bg-%s", getStatusColor(collection.Status))}>
{collection.Status}
</span>
</td>
<td>
<div class="btn-group btn-group-sm">
<button type="button" class="btn btn-outline-primary btn-sm"
@@ -337,24 +284,6 @@ templ ClusterCollections(data dash.ClusterCollectionsData) {
</div>
}
func countActiveCollections(collections []dash.CollectionInfo) int {
count := 0
for _, collection := range collections {
if collection.Status == "active" {
count++
}
}
return count
}
func countUniqueCollectionDataCenters(collections []dash.CollectionInfo) int {
dcMap := make(map[string]bool)
for _, collection := range collections {
dcMap[collection.DataCenter] = true
}
return len(dcMap)
}
func getDiskTypeColor(diskType string) string {
switch diskType {
case "ssd":