initial commit

hameter/web/templates/meters.html

@@ -0,0 +1,70 @@
+{% extends "base.html" %}
+{% block title %}Meters - HAMeter{% endblock %}
+{% block page_title %}Meters{% endblock %}
+
+{% block top_actions %}
+<a href="/config/meters/add" class="btn btn-primary btn-sm">Add Meter</a>
+{% endblock %}
+
+{% block content %}
+<div class="restart-banner hidden" id="restart-banner">
+    Pipeline restart required to apply changes.
+    <button class="btn btn-primary btn-sm" onclick="restartPipeline()">Restart Now</button>
+</div>
+
+{% if meters %}
+<div class="table-container">
+    <table class="data-table">
+        <thead>
+            <tr>
+                <th>Name</th>
+                <th>ID</th>
+                <th>Protocol</th>
+                <th>Type</th>
+                <th>Unit</th>
+                <th>Multiplier</th>
+                <th>Cost Tracking</th>
+                <th>Actions</th>
+            </tr>
+        </thead>
+        <tbody>
+            {% for meter in meters %}
+            <tr>
+                <td>{{ meter.name }}</td>
+                <td><code>{{ meter.id }}</code></td>
+                <td><span class="badge badge-protocol">{{ meter.protocol|upper }}</span></td>
+                <td>{{ meter.device_class or '--' }}</td>
+                <td>{{ meter.unit_of_measurement }}</td>
+                <td>{{ meter.multiplier }}</td>
+                <td>{% if meter.cost_factors %}<span class="badge badge-cost">{{ meter.cost_factors|length }} rate{{ 's' if meter.cost_factors|length != 1 }}</span>{% else %}--{% endif %}</td>
+                <td class="actions-cell">
+                    <a href="/config/meters/{{ meter.id }}/edit" class="btn btn-sm btn-secondary">Edit</a>
+                    <a href="/calibration?meter={{ meter.id }}" class="btn btn-sm btn-secondary">Calibrate</a>
+                    <button class="btn btn-sm btn-danger" onclick="deleteMeter({{ meter.id }}, '{{ meter.name }}')">Delete</button>
+                </td>
+            </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+</div>
+{% else %}
+<div class="empty-state">
+    <p>No meters configured.</p>
+    <p><a href="/config/meters/add" class="btn btn-primary">Add Meter</a> or <a href="/discovery" class="btn btn-secondary">Run Discovery</a></p>
+</div>
+{% endif %}
+
+<script>
+async function deleteMeter(id, name) {
+    if (!confirm('Delete meter "' + name + '" (ID: ' + id + ')?')) return;
+    const resp = await fetch('/api/config/meters/' + id, {method: 'DELETE'});
+    const data = await resp.json();
+    if (data.ok) {
+        showToast('Meter deleted', 'success');
+        setTimeout(() => location.reload(), 500);
+    } else {
+        showToast(data.error || 'Delete failed', 'error');
+    }
+}
+</script>
+{% endblock %}