vm management

static/main.js

@@ -708,17 +708,21 @@ async function renderVMAdmin() {
       const btn = tr.querySelector(sel);
       if (!btn) return;
       btn.onclick = async () => {
+        setRowBusy(tr, true);
         btn.disabled = true;
         try {
           if (action === 'migrate') {
             const target = getTarget();
             const resp = await vmAction(sid, action, target);
-            // show expandable status row
+            // show expandable status row (spinner already set via setRowBusy)
             const row = ensureMigRow(tr, colSpan);
             setMigRowVisible(row, true);
             const log = row.querySelector('.mig-log');
             const srcNode = resp.source_node;
             const upid = resp.upid;
+            const stopSig = { done: false };
+            tailTaskLog(upid, srcNode, log, stopSig);
+
             log.textContent = `Starting offline migrate to ${target} (UPID: ${upid || '—'})...`;
             // update badge immediately
             const badgeCell = tr.children[4];
@@ -727,15 +731,17 @@ async function renderVMAdmin() {
             await pollTask(upid, srcNode, (st) => {
               const lines = [];
               for (const k of ['type', 'status', 'pid', 'starttime', 'user', 'node', 'endtime', 'exitstatus']) {
-                if (st[k] !== undefined) lines.push(`${k}: ${st[k]}`);
+                if (st && st[k] !== undefined) lines.push(`${k}: ${st[k]}`);
               }
               log.textContent = lines.join('\n') || '—';
             }, async (finalSt) => {
+              stopSig.done = true;
               const exit = (finalSt && finalSt.exitstatus) ? String(finalSt.exitstatus) : '';
               const ok = exit.toUpperCase() === 'OK';
-              const badgeCell2 = tr.children[4];
-              if (badgeCell2) badgeCell2.innerHTML = ok ? badge('running', 'ok') : badge('migrate error', 'err');
+              const badgeCell = tr.children[4];
+              if (badgeCell) badgeCell.innerHTML = ok ? badge('running', 'ok') : badge('migrate error', 'err');
               log.textContent += (log.textContent ? '\n' : '') + (ok ? 'Migration finished successfully.' : ('Migration failed: ' + (exit || 'unknown error')));
+              setRowBusy(tr, false);
               await doRefresh();
             });
           } else {
@@ -747,7 +753,7 @@ async function renderVMAdmin() {
             log.textContent += (log.textContent ? '\n' : '') + (ok ? 'Migration finished successfully.' : ('Migration failed: ' + (exit || 'unknown error')));
             await doRefresh();
           }
-        } catch (e) { alert('ERROR: ' + e.message); }
+        } catch (e) { showToast('Error', 'ERROR: ' + e.message, 'danger'); }
         btn.disabled = false;
       };
     };
@@ -798,4 +804,78 @@ function ensureMigRow(mainTr, colSpan) {
 }
 function setMigRowVisible(row, vis) {
   row.classList.toggle('d-none', !vis);
+}
+
+function setRowBusy(tr, busy) {
+  const nameCell = tr.children[2];
+  if (!nameCell) return;
+  let spin = nameCell.querySelector('.op-spin');
+  if (busy) {
+    if (!spin) {
+      const span = document.createElement('span');
+      span.className = 'op-spin spinner-border spinner-border-sm align-middle ms-2';
+      span.setAttribute('role', 'status');
+      span.setAttribute('aria-hidden', 'true');
+      nameCell.appendChild(span);
+    }
+  } else {
+    if (spin) spin.remove();
+  }
+}
+
+
+function showToast(title, body, variant) {
+  const cont = document.getElementById('toast-container');
+  if (!cont) { console.warn('toast container missing'); return; }
+  const id = 't' + Math.random().toString(36).slice(2);
+  const vcls = {
+    success: 'text-bg-success',
+    info: 'text-bg-info',
+    warning: 'text-bg-warning',
+    danger: 'text-bg-danger',
+    secondary: 'text-bg-secondary'
+  }[variant || 'secondary'];
+  const el = document.createElement('div');
+  el.className = 'toast align-items-center ' + vcls;
+  el.setAttribute('role', 'alert');
+  el.setAttribute('aria-live', 'assertive');
+  el.setAttribute('aria-atomic', 'true');
+  el.innerHTML = `
+    <div class="d-flex">
+      <div class="toast-body">
+        <strong>${title || ''}</strong>${title ? ': ' : ''}${body || ''}
+      </div>
+      <button type="button" class="btn-close btn-close-white me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
+    </div>`;
+  cont.appendChild(el);
+  const t = new bootstrap.Toast(el, { delay: 5000 });
+  t.show();
+  el.addEventListener('hidden.bs.toast', () => el.remove());
+}
+
+
+async function tailTaskLog(upid, node, preEl, stopSignal) {
+  let start = 0;
+  const delay = (ms) => new Promise(r => setTimeout(r, ms));
+  const append = (txt) => {
+    if (!preEl) return;
+    preEl.textContent = (preEl.textContent ? preEl.textContent + '\n' : '') + txt;
+    preEl.scrollTop = preEl.scrollHeight;
+  };
+  while (!stopSignal.done) {
+    try {
+      const r = await fetch('/api/task-log?upid=' + encodeURIComponent(upid) + '&node=' + encodeURIComponent(node) + '&start=' + start);
+      const d = await r.json();
+      if (d && d.ok) {
+        const lines = Array.isArray(d.lines) ? d.lines : [];
+        for (const ln of lines) {
+          if (ln && typeof ln.t === 'string') append(ln.t);
+        }
+        start = d.next_start ?? start;
+      }
+    } catch (e) {
+      // transient errors ignored
+    }
+    await delay(1500);
+  }
 }