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

@@ -99,6 +99,7 @@
<span>Templates:</span>
<select id="buildTemplateSelect"><option value="">— Load —</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 as template…</button>
</div>
<ul id="buildTemplateList" style="margin-top:0.5rem; font-size:0.85rem;"></ul>
@@ -159,7 +160,7 @@
list.forEach(function(t) { var o = document.createElement('option'); o.value = t.id; o.textContent = t.name; sel.appendChild(o); });
var ul = document.getElementById('buildTemplateList');
ul.innerHTML = list.map(function(t) {
return '<li>' + escapeHtml(t.name) + ' <button type="button" class="btn btn-outline btn-sm load-tpl" data-id="' + t.id + '">Load</button> <button type="button" class="btn btn-outline btn-sm del-tpl" data-id="' + t.id + '">Delete</button></li>';
return '<li>' + escapeHtml(t.name) + ' <button type="button" class="btn btn-outline btn-sm load-tpl" data-id="' + t.id + '">Load</button> <button type="button" class="btn btn-outline btn-sm upd-tpl" data-id="' + t.id + '" title="Save current content into this template">Update</button> <button type="button" class="btn btn-outline btn-sm del-tpl" data-id="' + t.id + '">Delete</button></li>';
}).join('') || '<li>No templates</li>';
ul.querySelectorAll('.load-tpl').forEach(function(b) {
b.onclick = function() {
@@ -170,6 +171,9 @@
});
};
});
ul.querySelectorAll('.upd-tpl').forEach(function(b) {
b.onclick = function() { updateTemplate(b.getAttribute('data-id')); };
});
ul.querySelectorAll('.del-tpl').forEach(function(b) {
b.onclick = function() {
if (!confirm('Delete template?')) return;
@@ -178,6 +182,12 @@
});
}).catch(function() {});
}
function updateTemplate(tid) {
var body = { user_data: document.getElementById('buildUserData').value, meta_data: document.getElementById('buildMetaData').value, network_config: document.getElementById('buildNetworkConfig').value };
authFetch('/api/cloudinit-templates/' + encodeURIComponent(tid), { method: 'PUT', headers: {'Content-Type':'application/json'}, body: JSON.stringify(body) }).then(function(r) { return r.json(); }).then(function(d) {
if (d.ok) { fetchTemplates(); alert('Template updated'); } else alert(d.error || 'Update failed');
}).catch(function() { alert('Update failed'); });
}
function loadTemplateFromSelect() {
var s = document.getElementById('buildTemplateSelect');
if (s && s.value) authFetch('/api/cloudinit-templates/' + s.value).then(function(r) { return r.json(); }).then(function(t) {
@@ -200,6 +210,11 @@
});
};
document.getElementById('buildTemplateLoad').onclick = loadTemplateFromSelect;
document.getElementById('buildTemplateUpdate').onclick = function() {
var s = document.getElementById('buildTemplateSelect');
if (!s || !s.value) { alert('Select a template to update'); return; }
updateTemplate(s.value);
};
document.getElementById('buildTemplateSave').onclick = saveTemplate;
fetchBuildStatus();