ux: activity logging for all CRUD ops, batch status management, dashboard now shows recent activity

static/index.html

@@ -1110,6 +1110,7 @@
         </select>
         <button class="btn btn-sm btn-outline" onclick="loadAssets()">🔄 Refresh</button>
         <button class="btn btn-sm btn-accent" onclick="batchLookupAll()">🔍 Batch Lookup</button>
+        <button class="btn btn-sm btn-outline" onclick="showBatchStatusModal()">🏷️ Batch Status</button>
       </div>
     </div>
     <div id="assetsContent">
@@ -1569,7 +1570,7 @@ function renderDashStats(stats) {
 function renderBar(elId, items, labelKey, valueKey, max) {
   const el = document.getElementById(elId);
   if (!items || items.length === 0) {
-    el.innerHTML = '<div class="empty-state"><div class="es-icon">📭</div>No data</div>';
+    el.innerHTML = '<div class="empty-state"><div class="es-icon">📭</div>No data available — try different filters or check back later</div>';
     return;
   }
   const mx = max || Math.max(...items.map(i => i[valueKey]));
@@ -1599,7 +1600,7 @@ function renderDashStatusBars(stats) {
 function renderDashActivity(items) {
   const el = document.getElementById('dashActivity');
   if (!items || items.length === 0) {
-    el.innerHTML = '<div class="empty-state"><div class="es-icon">📭</div>No recent activity</div>';
+    el.innerHTML = '<div class="empty-state"><div class="es-icon">📭</div>No recent activity — check your filters</div>';
     return;
   }
   el.innerHTML = items.map(a => {
@@ -2069,6 +2070,58 @@ async function applyAllFoundNames() {
   }
   showToast(`Applied ${count} names`);
 }
+
+// ── Batch Status Update ──
+
+async function showBatchStatusModal() {
+  const confirmed = await showModal(
+    '🏷️ Batch Status Update',
+    `<div style="font-size:13px;color:var(--text2);margin-bottom:12px;">
+      Select assets by ID (from the current search results) and choose a new status.
+    </div>
+    <div style="margin-bottom:12px;">
+      <label style="display:block;font-size:12px;font-weight:600;margin-bottom:4px;color:var(--text);">Asset IDs (comma-separated)</label>
+      <input id="batchStatusIds" type="text" class="input-field" placeholder="e.g. 1, 5, 23, 44" style="width:100%;box-sizing:border-box;">
+    </div>
+    <div style="margin-bottom:12px;">
+      <label style="display:block;font-size:12px;font-weight:600;margin-bottom:4px;color:var(--text);">New Status</label>
+      <select id="batchStatusValue" class="input-field" style="width:100%;box-sizing:border-box;">
+        <option value="active">✅ Active</option>
+        <option value="maintenance" selected>🔄 Maintenance</option>
+        <option value="retired">⛔ Retired</option>
+      </select>
+    </div>
+    <div id="batchStatusResult" style="font-size:13px;"></div>`,
+    'Apply',
+    'btn-accent'
+  );
+  if (!confirmed) return;
+
+  const idsInput = document.getElementById('batchStatusIds');
+  const statusSelect = document.getElementById('batchStatusValue');
+  const resultEl = document.getElementById('batchStatusResult');
+
+  const ids = (idsInput.value || '').split(',').map(s => parseInt(s.trim())).filter(n => !isNaN(n) && n > 0);
+  if (ids.length === 0) {
+    resultEl.innerHTML = '<span style="color:var(--red);">❌ No valid asset IDs entered</span>';
+    return;
+  }
+  const status = statusSelect.value;
+
+  resultEl.innerHTML = '<span style="color:var(--text2);">⏳ Updating...</span>';
+  try {
+    const resp = await api('/api/assets/batch-status', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ ids, status }),
+    });
+    resultEl.innerHTML = `<span style="color:var(--green);">✅ ${resp.updated} asset(s) set to "${status}"</span>`;
+    loadAssets(); // Refresh the asset table
+  } catch (e) {
+    resultEl.innerHTML = `<span style="color:var(--red);">❌ ${esc(e.message)}</span>`;
+  }
+}
+
 // ═════════════════════════════════════════════════════════════════════════════
 async function loadSettingsCache() {
   try {
@@ -2912,7 +2965,7 @@ async function _loadActivity() {
 function renderActivity(items) {
   const el = document.getElementById('activityList');
   if (items.length === 0) {
-    el.innerHTML = '<div class="empty-state"><div class="es-icon">📋</div>No activity found</div>';
+    el.innerHTML = '<div class="empty-state"><div class="es-icon">📋</div>No activity logged yet. Activity appears here when admins make changes.</div>';
     document.getElementById('activityPagination').innerHTML = '';
     return;
   }