83 lines
3.8 KiB
HTML
83 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Sensor Konfiguration</title>
|
||
<link rel="stylesheet" href="/static/style.css">
|
||
</head>
|
||
<body>
|
||
<header class="header">
|
||
<div class="header-content">
|
||
<div class="logo">
|
||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||
<rect width="40" height="40" rx="8" fill="#667eea"/>
|
||
<path d="M12 20L18 26L28 14" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
|
||
</svg>
|
||
<span class="logo-text">Sensor Manager</span>
|
||
</div>
|
||
<nav class="nav">
|
||
<a href="/" class="nav-link {% if active_page == 'table1' %}active{% endif %}">Tabelle 1</a>
|
||
<a href="/table/table2" class="nav-link {% if active_page == 'table2' %}active{% endif %}">Tabelle 2</a>
|
||
<a href="/table/table3" class="nav-link {% if active_page == 'table3' %}active{% endif %}">Tabelle 3</a>
|
||
<a href="/settings" class="nav-link {% if active_page == 'settings' %}active{% endif %}">⚙️ Einstellungen</a>
|
||
</nav>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="container">
|
||
<h1>🔧 Sensor Konfiguration - {{ table_id | upper }}</h1>
|
||
<div id="message" class="message"></div>
|
||
<div class="table-wrapper">
|
||
<table id="sensorTable">
|
||
<thead>
|
||
<tr>
|
||
<th>Bezeichnung</th>
|
||
<th>Adresse</th>
|
||
<th>Type</th>
|
||
<th>Faktor</th>
|
||
<th>MQTT</th>
|
||
<th>InfluxDB</th>
|
||
<th>Aktionen</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="tableBody">
|
||
{% for row in rows %}
|
||
<tr data-row="{{ loop.index0 }}">
|
||
<td><input type='text' class='text-input' data-field='bezeichnung' value='{{ row.bezeichnung }}' /></td>
|
||
<td><input type='text' class='text-input' data-field='adresse' value='{{ row.adresse }}' /></td>
|
||
<td><input type='text' class='text-input' data-field='type' value='{{ row.type }}' /></td>
|
||
<td><input type='text' class='text-input' data-field='faktor' value='{{ row.faktor }}' /></td>
|
||
<td>
|
||
<label class='switch'>
|
||
<input type='checkbox' class='bool-input' data-field='mqtt' {% if row.mqtt %}checked{% endif %} />
|
||
<span class='slider'></span>
|
||
</label>
|
||
</td>
|
||
<td>
|
||
<label class='switch'>
|
||
<input type='checkbox' class='bool-input' data-field='influxdb' {% if row.influxdb %}checked{% endif %} />
|
||
<span class='slider'></span>
|
||
</label>
|
||
</td>
|
||
<td>
|
||
<button class="delete-btn" onclick="deleteRow(this)">🗑️</button>
|
||
</td>
|
||
</tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<div class="button-group">
|
||
<button class="add-btn" onclick="addRow()">➕ Zeile hinzufügen</button>
|
||
<button class="save-btn" onclick="saveTable()">💾 Speichern</button>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
const tableId = "{{ table_id }}";
|
||
</script>
|
||
<script src="/static/script.js"></script>
|
||
</body>
|
||
</html>
|