@ -629,20 +629,46 @@ func VolumeDetails(data dash.VolumeDetailsData) templ.Component {
return templ_7745c5c3_Err
}
}
templ_7745c5c3_Err = templruntime . WriteString ( templ_7745c5c3_Buffer , 61 , "<!-- Actions Card --><div class=\"row\"><div class=\"col-12\"><div class=\"card shadow mb-4\"><div class=\"card-header py-3\"><h6 class=\"m-0 font-weight-bold text-primary\"><i class=\"fas fa-tools me-2\"></i>Actions</h6></div><div class=\"card-body\"><div class=\"btn-group\" role=\"group\"><button type=\"button\" class=\"btn btn-outline-danger\" title=\"Vacuum Volume\"><i class=\"fas fa-compress-alt me-1\"></i>Vacuum</button></ div><div cl ass=\"m t-3\"><small class=\"text-muted\"><i class=\"fas f a-info-circle me-1\"></i> Use these actions to perform maintenance operations on the volume.</small></div></div></div></div></div><! -- Last Updated --><d iv class=\"row\">< div class =\"col-12\"><small class=\"text-muted\"><i class=\"fas fa-clock me-1\"></i> Last updated: " )
templ_7745c5c3_Err = templruntime . WriteString ( templ_7745c5c3_Buffer , 61 , "<!-- Actions Card --><div class=\"row\"><div class=\"col-12\"><div class=\"card shadow mb-4\"><div class=\"card-header py-3\"><h6 class=\"m-0 font-weight-bold text-primary\"><i class=\"fas fa-tools me-2\"></i>Actions</h6></div><div class=\"card-body\"><div class=\"btn-group\" role=\"group\"><button type=\"button\" class=\"btn btn-outline-danger vacuum-btn \" title=\"Vacuum Volume\" data-volume-id=\"" )
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var41 string
templ_7745c5c3_Var41 , templ_7745c5c3_Err = templ . JoinStringErrs ( data . LastUpdated . Format ( "2006-01-02 15:04:05" ) )
templ_7745c5c3_Var41 , templ_7745c5c3_Err = templ . JoinStringErrs ( fmt . Sprintf ( "%d" , data . Volume . Id ) )
if templ_7745c5c3_Err != nil {
return templ . Error { Err : templ_7745c5c3_Err , FileName : ` view/app/volume_details.templ ` , Line : 378 , Col : 77 }
return templ . Error { Err : templ_7745c5c3_Err , FileName : ` view/app/volume_details.templ ` , Line : 360 , Col : 81 }
}
_ , templ_7745c5c3_Err = templ_7745c5c3_Buffer . WriteString ( templ . EscapeString ( templ_7745c5c3_Var41 ) )
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime . WriteString ( templ_7745c5c3_Buffer , 62 , "</small></div></div>" )
templ_7745c5c3_Err = templruntime . WriteString ( templ_7745c5c3_Buffer , 62 , "\" data-server=\"" )
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var42 string
templ_7745c5c3_Var42 , templ_7745c5c3_Err = templ . JoinStringErrs ( data . Volume . Server )
if templ_7745c5c3_Err != nil {
return templ . Error { Err : templ_7745c5c3_Err , FileName : ` view/app/volume_details.templ ` , Line : 361 , Col : 63 }
}
_ , templ_7745c5c3_Err = templ_7745c5c3_Buffer . WriteString ( templ . EscapeString ( templ_7745c5c3_Var42 ) )
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime . WriteString ( templ_7745c5c3_Buffer , 63 , "\"><i class=\"fas fa-compress-alt me-1\"></i>Vacuum</button></div><div class=\"mt-3\"><small class=\"text-muted\"><i class=\"fas fa-info-circle me-1\"></i> Use these actions to perform maintenance operations on the volume.</small></div></div></div></div></div><!-- Last Updated --><div class=\"row\"><div class=\"col-12\"><small class=\"text-muted\"><i class=\"fas fa-clock me-1\"></i> Last updated: " )
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var43 string
templ_7745c5c3_Var43 , templ_7745c5c3_Err = templ . JoinStringErrs ( data . LastUpdated . Format ( "2006-01-02 15:04:05" ) )
if templ_7745c5c3_Err != nil {
return templ . Error { Err : templ_7745c5c3_Err , FileName : ` view/app/volume_details.templ ` , Line : 381 , Col : 77 }
}
_ , templ_7745c5c3_Err = templ_7745c5c3_Buffer . WriteString ( templ . EscapeString ( templ_7745c5c3_Var43 ) )
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime . WriteString ( templ_7745c5c3_Buffer , 64 , "</small></div></div><!-- JavaScript for volume actions --><script>\n document.addEventListener('DOMContentLoaded', function() {\n // Add click handler for vacuum button\n const vacuumBtn = document.querySelector('.vacuum-btn');\n if (vacuumBtn) {\n vacuumBtn.addEventListener('click', function() {\n const volumeId = this.getAttribute('data-volume-id');\n const server = this.getAttribute('data-server');\n performVacuum(volumeId, server, this);\n });\n }\n });\n\n function performVacuum(volumeId, server, button) {\n // Disable button and show loading state\n const originalText = button.innerHTML;\n button.disabled = true;\n button.innerHTML = '<i class=\"fas fa-spinner fa-spin me-1\"></i>Vacuuming...';\n\n // Send vacuum request\n fetch(`/api/volumes/${volumeId}/${encodeURIComponent(server)}/vacuum`, {\n method: 'POST',\n headers: {\n 'Content-Type': 'application/json',\n }\n })\n .then(response => response.json())\n .then(data => {\n if (data.error) {\n showMessage(data.error, 'error');\n } else {\n showMessage(data.message || 'Volume vacuum started successfully', 'success');\n // Optionally refresh the page after a delay\n setTimeout(() => {\n window.location.reload();\n }, 2000);\n }\n })\n .catch(error => {\n console.error('Error:', error);\n showMessage('Failed to start vacuum operation', 'error');\n })\n .finally(() => {\n // Re-enable button\n button.disabled = false;\n button.innerHTML = originalText;\n });\n }\n\n function showMessage(message, type) {\n // Create toast notification\n const toast = document.createElement('div');\n toast.className = `alert alert-${type === 'error' ? 'danger' : 'success'} alert-dismissible fade show position-fixed`;\n toast.style.top = '20px';\n toast.style.right = '20px';\n toast.style.zIndex = '9999';\n toast.style.minWidth = '300px';\n \n toast.innerHTML = `\n ${message}\n <button type=\"button\" class=\"btn-close\" data-bs-dismiss=\"alert\"></button>\n `;\n \n document.body.appendChild(toast);\n \n // Auto-remove after 5 seconds\n setTimeout(() => {\n if (toast.parentNode) {\n toast.parentNode.removeChild(toast);\n }\n }, 5000);\n }\n </script>" )
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}