Add update functionality for cloud-init templates in the dashboard

Implement a new API endpoint to update existing cloud-init templates, allowing users to modify template attributes such as name, user_data, meta_data, and network_config. Enhance the dashboard UI to include an update button for templates, along with associated JavaScript for handling update requests. This improves user experience by enabling direct template modifications from the interface.
This commit is contained in:
nearxos
2026-02-22 17:18:50 +02:00
parent fd56ed4049
commit 196b13c2fa
3 changed files with 62 additions and 2 deletions

View File

@@ -449,6 +449,7 @@
<div class="inner" style="margin-top:0.5rem;">
<p><strong>Templates:</strong> <select id="buildTemplateSelect"><option value="">— Load a template —</option></select>
<button type="button" id="buildTemplateLoad" class="btn btn-outline btn-sm">Load</button>
<button type="button" id="buildTemplateUpdate" class="btn btn-outline btn-sm" title="Save current content into the selected template">Update</button>
<button type="button" id="buildTemplateSave" class="btn btn-outline btn-sm">Save current as template…</button></p>
<ul id="buildTemplateList" class="backups-mono" style="font-size:0.85rem; list-style:none; padding:0;"></ul>
<label>user-data (YAML)</label>
@@ -824,11 +825,14 @@
}
if (listEl) {
listEl.innerHTML = list.map(function(t) {
return '<li><span>' + escapeHtml(t.name) + '</span> <button type="button" class="btn btn-outline btn-sm template-load-btn" data-id="' + escapeHtml(t.id) + '">Load</button> <button type="button" class="btn btn-outline btn-sm template-del-btn" data-id="' + escapeHtml(t.id) + '">Delete</button></li>';
return '<li><span>' + escapeHtml(t.name) + '</span> <button type="button" class="btn btn-outline btn-sm template-load-btn" data-id="' + escapeHtml(t.id) + '">Load</button> <button type="button" class="btn btn-outline btn-sm template-upd-btn" data-id="' + escapeHtml(t.id) + '" title="Save current content into this template">Update</button> <button type="button" class="btn btn-outline btn-sm template-del-btn" data-id="' + escapeHtml(t.id) + '">Delete</button></li>';
}).join('') || '<li>No templates saved.</li>';
listEl.querySelectorAll('.template-load-btn').forEach(function(btn) {
btn.onclick = function() { loadTemplate(btn.getAttribute('data-id')); };
});
listEl.querySelectorAll('.template-upd-btn').forEach(function(btn) {
btn.onclick = function() { updateTemplate(btn.getAttribute('data-id')); };
});
listEl.querySelectorAll('.template-del-btn').forEach(function(btn) {
btn.onclick = function() {
if (!confirm('Delete this template?')) return;
@@ -849,6 +853,19 @@
if (nc) nc.value = t.network_config || '';
}).catch(function() {});
}
function updateTemplate(id) {
var ud = document.getElementById('buildUserData');
var md = document.getElementById('buildMetaData');
var nc = document.getElementById('buildNetworkConfig');
fetch('/api/cloudinit-templates/' + encodeURIComponent(id), { method: 'PUT', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({
user_data: ud ? ud.value : '',
meta_data: md ? md.value : '',
network_config: nc ? nc.value : ''
})}).then(function(r) { return r.json(); }).then(function(d) {
if (d.ok) { fetchCloudInitTemplates(); alert('Template updated'); }
else alert(d.error || 'Update failed');
}).catch(function() { alert('Update failed'); });
}
function saveTemplate() {
var name = prompt('Template name');
if (!name || !name.trim()) return;
@@ -972,6 +989,8 @@
if (variantSel) variantSel.onchange = fetchRaspiosUrl;
var templateLoadBtn = document.getElementById('buildTemplateLoad');
if (templateLoadBtn) templateLoadBtn.onclick = function() { var s = document.getElementById('buildTemplateSelect'); if (s && s.value) loadTemplate(s.value); };
var templateUpdateBtn = document.getElementById('buildTemplateUpdate');
if (templateUpdateBtn) templateUpdateBtn.onclick = function() { var s = document.getElementById('buildTemplateSelect'); if (s && s.value) updateTemplate(s.value); else alert('Select a template to update'); };
var templateSaveBtn = document.getElementById('buildTemplateSave');
if (templateSaveBtn) templateSaveBtn.onclick = saveTemplate;
setInterval(fetchStatus, 2000);