55 lines
No EOL
1.9 KiB
Cheetah
55 lines
No EOL
1.9 KiB
Cheetah
<h1 class="page-header">Sensor Overview</h1>
|
|
|
|
<div class="col-md-12">
|
|
<div class="panel panel-default drop-shadow">
|
|
<div class="panel-heading">Local Sensors</div>
|
|
<div class="panel-body">
|
|
|
|
<table id="sensor-device-table" class="table table-hover table-condensed">
|
|
<thead>
|
|
<th class="col-md-4">Name</th>
|
|
<th class="col-md-3">Type</th>
|
|
<th class="col-md-2">Data</th>
|
|
<th class="col-md-2">Last Update</th>
|
|
</thead>
|
|
{{#sensors}}
|
|
<tr data-device-id="{{.getId()}}">
|
|
<td><a href="?id={{.getId()}}">{{.getName()}}</a></td>
|
|
<td>{{.getDeviceConfig().getClass().getSimpleName()}}</td>
|
|
<td>{{.getDeviceData()}}</td>
|
|
<td class="timestamp">{{.getDeviceData().getTimestamp()}}</td>
|
|
</tr>
|
|
{{/sensors}}
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
$(function (){
|
|
$(".toggle-switch").on("switchChange.bootstrapSwitch", function (event, state) {
|
|
$(this).closest('form').submit();
|
|
});
|
|
});
|
|
|
|
// Auto update
|
|
|
|
setInterval(function() {
|
|
fetch('/api/sensor')
|
|
.then(response => response.json())
|
|
.then(data => {
|
|
var table = document.getElementById('sensor-device-table');
|
|
|
|
for (const row of table.rows) {
|
|
var dataItem = data.find(item => item.id == row.dataset.deviceId);
|
|
|
|
if (dataItem) {
|
|
row.cells[2].innerHTML = dataItem.data?.valueStr;
|
|
row.cells[3].innerHTML = dataItem.data?.timestamp;
|
|
|
|
$(row.cells[3]).relTimestamp();
|
|
}
|
|
}
|
|
});
|
|
}, 3000);
|
|
</script> |