99 lines
3.3 KiB
JavaScript
99 lines
3.3 KiB
JavaScript
function addRow() {
|
|
const tableBody = document.getElementById('tableBody');
|
|
const rowCount = tableBody.querySelectorAll('tr').length;
|
|
|
|
const newRow = document.createElement('tr');
|
|
newRow.setAttribute('data-row', rowCount);
|
|
newRow.innerHTML = `
|
|
<td><input type='text' class='text-input' data-field='bezeichnung' value='' /></td>
|
|
<td><input type='text' class='text-input' data-field='adresse' value='' /></td>
|
|
<td><input type='text' class='text-input' data-field='type' value='' /></td>
|
|
<td><input type='text' class='text-input' data-field='faktor' value='1.0' /></td>
|
|
<td>
|
|
<label class='switch'>
|
|
<input type='checkbox' class='bool-input' data-field='mqtt' />
|
|
<span class='slider'></span>
|
|
</label>
|
|
</td>
|
|
<td>
|
|
<label class='switch'>
|
|
<input type='checkbox' class='bool-input' data-field='influxdb' />
|
|
<span class='slider'></span>
|
|
</label>
|
|
</td>
|
|
<td>
|
|
<button class="delete-btn" onclick="deleteRow(this)">🗑️</button>
|
|
</td>
|
|
`;
|
|
|
|
tableBody.appendChild(newRow);
|
|
}
|
|
|
|
function deleteRow(button) {
|
|
const row = button.closest('tr');
|
|
if (confirm('Möchten Sie diese Zeile wirklich löschen?')) {
|
|
row.remove();
|
|
updateRowIndices();
|
|
}
|
|
}
|
|
|
|
function updateRowIndices() {
|
|
const rows = document.querySelectorAll('#tableBody tr');
|
|
rows.forEach((row, index) => {
|
|
row.setAttribute('data-row', index);
|
|
});
|
|
}
|
|
|
|
async function saveTable() {
|
|
const rows = [];
|
|
const tableRows = document.querySelectorAll('#tableBody tr');
|
|
|
|
tableRows.forEach((row) => {
|
|
const bezeichnung = row.querySelector("input[data-field='bezeichnung']").value;
|
|
const adresse = row.querySelector("input[data-field='adresse']").value;
|
|
const type = row.querySelector("input[data-field='type']").value;
|
|
const faktor = row.querySelector("input[data-field='faktor']").value;
|
|
const mqtt = row.querySelector("input[data-field='mqtt']").checked;
|
|
const influxdb = row.querySelector("input[data-field='influxdb']").checked;
|
|
|
|
rows.push({
|
|
bezeichnung,
|
|
adresse,
|
|
type,
|
|
faktor,
|
|
mqtt,
|
|
influxdb
|
|
});
|
|
});
|
|
|
|
try {
|
|
const response = await fetch('/api/save', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify({
|
|
table_id: tableId,
|
|
rows: rows
|
|
})
|
|
});
|
|
|
|
const messageDiv = document.getElementById('message');
|
|
if (response.ok) {
|
|
messageDiv.className = 'message success';
|
|
messageDiv.textContent = '✓ Erfolgreich gespeichert!';
|
|
} else {
|
|
messageDiv.className = 'message error';
|
|
messageDiv.textContent = '✗ Fehler beim Speichern!';
|
|
}
|
|
|
|
setTimeout(() => {
|
|
messageDiv.style.display = 'none';
|
|
}, 3000);
|
|
} catch (error) {
|
|
const messageDiv = document.getElementById('message');
|
|
messageDiv.className = 'message error';
|
|
messageDiv.textContent = '✗ Verbindungsfehler!';
|
|
}
|
|
}
|