adsad

public/assets/js/ui-list.js

@@ -29,6 +29,7 @@ async function fetchContentItem(id, sectionId) {
 }
 
 async function openContentEditor(item, section) {
+  const versionId = Number(item?.version_id || 0);
   const id = Number(item?.id || 0);
   const name = item?.name || '';
   if (!id) return;
@@ -39,9 +40,9 @@ async function openContentEditor(item, section) {
   window.__currentEditorCtx = { id, mode: section.slug, section };
 
   if (window.EditorUI && typeof window.EditorUI.open === 'function') {
-    window.EditorUI.open({ id, name, html, section }, 'content');
+    window.EditorUI.open({ id, name, html, section, version_id: versionId }, 'content');
   } else if (window.__openEditor) {
-    window.__openEditor({ resource: 'content', id, name, html, section });
+    window.__openEditor({ resource: 'content', id, name, html, section, version_id: versionId });
   } else {
     toast('Editor ist nicht initialisiert.', false);
   }
@@ -189,11 +190,56 @@ export async function loadList(section) {
     return name.includes(q) || (api && api.includes(q));
   }
 
+  const versionCache = new Map();
+
+  async function loadVersionOptions(selectEl, itemId) {
+    if (!selectEl || !itemId) return;
+    if (versionCache.has(itemId)) {
+      const cached = versionCache.get(itemId);
+      renderVersionSelect(selectEl, cached.items, cached.activeId);
+      return;
+    }
+    try {
+      const res = await apiAction('content_versions.list', { method: 'GET', data: { content_id: itemId } });
+      const items = Array.isArray(res?.items) ? res.items : [];
+      const active = items.find(v => Number(v.is_active) === 1);
+      const activeId = active ? String(active.id) : (items[0] ? String(items[0].id) : '');
+      versionCache.set(itemId, { items, activeId });
+      renderVersionSelect(selectEl, items, activeId);
+    } catch {
+      renderVersionSelect(selectEl, [], '');
+    }
+  }
+
+  function renderVersionSelect(selectEl, items, activeId) {
+    selectEl.innerHTML = '';
+    if (!items.length) {
+      const opt = document.createElement('option');
+      opt.value = '';
+      opt.textContent = 'Keine Versionen';
+      opt.disabled = true;
+      selectEl.appendChild(opt);
+      selectEl.disabled = true;
+      return;
+    }
+    selectEl.disabled = false;
+    items.forEach(item => {
+      const opt = document.createElement('option');
+      opt.value = String(item.id);
+      opt.textContent = `#${item.version_no}` + (Number(item.is_active) === 1 ? ' (aktiv)' : '');
+      selectEl.appendChild(opt);
+    });
+    if (activeId) selectEl.value = activeId;
+  }
+
   function render(items) {
     list.innerHTML = items.map(item => {
       const name = esc(item.name || '');
       const apiName = isTemplate ? esc(item.api_name || '') : '';
       const apiLine = (isTemplate && apiName) ? `<div class='text-xs text-slate-500'>API: ${apiName}</div>` : '';
+      const versionSelect = `<select class="input h-8 py-0 text-xs min-w-[160px]" data-version-select="${item.id}" disabled>
+        <option value="">Versionen laden…</option>
+      </select>`;
       const nameCell = `<div class='min-w-48'>
         <div class='font-medium truncate' title="${name}">${name || '(ohne Name)'}</div>
         ${apiLine}
@@ -207,6 +253,7 @@ export async function loadList(section) {
       return `<div class='p-3 flex items-center gap-3'>
         ${nameCell}
         <div class='text-xs text-gray-500'>#${item.id}</div>
+        ${versionSelect}
         <div class='ms-auto flex gap-2'>${[openBtn, editTplBtn, testBtn, prevBtn, delBtn].filter(Boolean).join('')}</div>
       </div>`;
     }).join('');
@@ -250,6 +297,18 @@ export async function loadList(section) {
   applyFilter();
 
   function bindListHandlers(scope) {
+    scope.querySelectorAll('[data-version-select]').forEach(sel => {
+      const id = Number(sel.getAttribute('data-version-select') || 0);
+      sel.addEventListener('focus', () => loadVersionOptions(sel, id));
+      sel.addEventListener('click', () => loadVersionOptions(sel, id));
+      sel.addEventListener('change', () => {
+        const versionId = Number(sel.value || 0);
+        if (!versionId) return;
+        const item = data.find(it => Number(it.id) === id);
+        if (!item) return;
+        openContentEditor({ ...item, version_id: versionId }, section);
+      });
+    });
     scope.querySelectorAll('[data-open]').forEach(btn => btn.addEventListener('click', () => {
       const id = Number(btn.dataset.open || 0);
       const item = data.find(it => Number(it.id) === id);