closes #6

2026-02-16 09:16:54 +01:00
parent 87ba23cf57
commit 092811fda8
2 changed files with 102 additions and 64 deletions
--- a/app/assets/js/device-type-edit-form.js
+++ b/app/assets/js/device-type-edit-form.js
@@ -0,0 +1,88 @@
+(() => {
+    function addPortRow() {
+        const body = document.getElementById('port-definition-body');
+        if (!body) {
+            return;
+        }
+
+        const emptyRow = body.querySelector('tr td em');
+        if (emptyRow) {
+            const emptyTableRow = emptyRow.closest('tr');
+            if (emptyTableRow) {
+                emptyTableRow.remove();
+            }
+        }
+
+        const rowCount = body.querySelectorAll('tr').length;
+        const index = rowCount;
+        const number = rowCount + 1;
+
+        const optionsTemplate = document.getElementById('port-type-options-template');
+        const portTypeOptions = optionsTemplate
+            ? optionsTemplate.innerHTML
+            : '<option value="">- Kein Typ -</option>';
+
+        const row = document.createElement('tr');
+        row.innerHTML = `
+            <td>${number}</td>
+            <td>
+                <input type="hidden" name="port_rows[${index}][id]" value="">
+                <input type="text" name="port_rows[${index}][name]" value="" placeholder="z.B. Gi1/0/1">
+            </td>
+            <td>
+                <select name="port_rows[${index}][port_type_id]">
+                    ${portTypeOptions}
+                </select>
+            </td>
+            <td>
+                <label class="inline-checkbox">
+                    <input type="checkbox" name="port_rows[${index}][delete]" value="1">
+                    entfernen
+                </label>
+            </td>
+        `;
+
+        body.appendChild(row);
+    }
+
+    function bindAddPortRowButton() {
+        const addButton = document.getElementById('add-port-row');
+        if (!addButton || addButton.dataset.portRowBound === '1') {
+            return;
+        }
+        addButton.addEventListener('click', addPortRow);
+        addButton.dataset.portRowBound = '1';
+    }
+
+    function bindDeleteButton() {
+        const deleteButton = document.getElementById('device-type-delete');
+        if (!deleteButton || deleteButton.dataset.deleteBound === '1') {
+            return;
+        }
+
+        deleteButton.addEventListener('click', () => {
+            const id = Number(deleteButton.dataset.deviceTypeId || '0');
+            if (id <= 0) {
+                return;
+            }
+
+            if (window.confirm('Diesen Gerätetyp wirklich löschen? Alle zugeordneten Geräte werden angepasst.')) {
+                // TODO: Delete-Endpoint/Flow ist noch nicht implementiert.
+                window.alert('Löschen noch nicht implementiert');
+            }
+        });
+
+        deleteButton.dataset.deleteBound = '1';
+    }
+
+    function init() {
+        bindAddPortRowButton();
+        bindDeleteButton();
+    }
+
+    if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', init);
+    } else {
+        init();
+    }
+})();