230 lines
7.4 KiB
HTML
230 lines
7.4 KiB
HTML
{{define "body_content"}}
|
|
{{ if ne .UserName "" }}
|
|
|
|
<div id="modal" class="modal">
|
|
<div class="modal-background"></div>
|
|
<div class="modal-card">
|
|
<header class="modal-card-head">
|
|
<p class="modal-card-title">Einstellungen</p>
|
|
</header>
|
|
<section class="modal-card-body">
|
|
<!-- Content ... -->
|
|
<div class="field"> <label id="label" class="label">Bezeichnung</label>
|
|
<div class="control has-icons-right">
|
|
<input id="alias" class="input" type="text" maxlength="16">
|
|
<span id="alias_exclamation" class="icon is-small is-right">
|
|
<i class="fas fa-exclamation-triangle"></i>
|
|
</span>
|
|
</div>
|
|
<p id="alias_errormsg" class="help is-danger"></p>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<div class="control">
|
|
<label class="checkbox">
|
|
<input id="checkbox" type="checkbox">
|
|
SMS Alarmierung aktiv
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="label">Alarmnummer (SMS)</label>
|
|
<div class="control has-icons-right">
|
|
<input id="smsnumber" class="input" type="text" maxlength="16">
|
|
<span id="smsnumber_exclamation" class="icon is-small is-right">
|
|
<i class="fas fa-exclamation-triangle"></i>
|
|
</span>
|
|
</div>
|
|
<p id="smsnumber_errormsg" class="help is-danger"></p>
|
|
</div>
|
|
|
|
<div class="is-size-7">
|
|
Device ID: <span id="deveui"></span>
|
|
</div>
|
|
</section>
|
|
<footer class="modal-card-foot">
|
|
<button id="modal-save" class="button is-success">OK</button>
|
|
<button id="modal-close" class="button">Cancel</button>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
|
|
{{range .LastMetrics}}
|
|
<div class="column is-full notification is-warning">
|
|
<p class="is-size-2 is-size-5-mobile has-text-centered has-text-weight-bold" ><span id="alias_{{.Deveui}}">{{.Alias}}</span><a class="show-modal" class="block-link"><span style="float:right;" class="icon is-size-4 is-size-5-mobile"><i class="fa fa-cog"></i></span></a></p>
|
|
<p id="alarmactive_{{.Deveui}}" hidden>{{.Alarmactive}}</p>
|
|
<p id="smsnumber_{{.Deveui}}" hidden>{{.Smsnumber}}</p>
|
|
<p id="lastmeasurement_{{.Deveui}}" class="has-text-centered">letzte übermittelte Messung: {{.Timestamp}}</p>
|
|
<div id="{{.Deveui}}">
|
|
<div class="column is-full notification is-warning">
|
|
<nav class="level">
|
|
<div class="level-item has-text-centered">
|
|
<a class="block-link" href="/graph.html?deveui={{.Deveui}}&property=t">
|
|
<div>
|
|
<p class="icon"><i class="fa fa-thermometer-half"></i></p>
|
|
<p id="temp_{{.Deveui}}" class="title">{{.Temperature}} °C</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<div class="level-item has-text-centered">
|
|
<a class="block-link" href="/graph.html?deveui={{.Deveui}}&property=h">
|
|
<div>
|
|
<p class="icon"><i class="fa fa-tint"></i></p>
|
|
<p id="humidity_{{.Deveui}}" class="title">{{.Humidity}} %</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<div class="level-item has-text-centered">
|
|
<a class="block-link" href="/graph.html?deveui={{.Deveui}}&property=w">
|
|
<div>
|
|
<p class="icon"><i class="fa fa-balance-scale"></i></p>
|
|
<p id="weight_{{.Deveui}}" class="title is-size-2 has-text-weight-bold">{{.Weight}} g</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<div class="level-item has-text-centered">
|
|
<a class="block-link" href="/graph.html?deveui={{.Deveui}}&property=p">
|
|
<div>
|
|
<p class="icon"><i class="fa fa-cloud"></i></p>
|
|
<p id="pressure_{{.Deveui}}" class="title">{{.Pressure}} hP</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<div class="level-item has-text-centered">
|
|
<a class="block-link" href="/graph.html?deveui={{.Deveui}}&property=vp">
|
|
<div>
|
|
<p class="icon"><i class="fa fa-battery-three-quarters"></i></p>
|
|
<p id="acculevel_{{.Deveui}}" class="title">{{.BatteryPercent}} %</p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
<div class="has-text-centered">
|
|
<span class="is-size-6 has-text-centered" id="paid_until_{{.Deveui}}">aktiv bis</span>
|
|
<span class="is-size-6 has-text-centered" id="paid_until_{{.Deveui}}">01.01.1234</span>
|
|
</div>
|
|
<div class="has-text-centered">
|
|
<a class="block-link" id="add_abo_{{.Deveui}}">
|
|
<span class="icon is-medium">
|
|
<i class="fa fa-2x fa-cart-plus"></i>
|
|
</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{{end}}
|
|
|
|
<script>
|
|
function validate(what, text) {
|
|
if (what == 'alias') {
|
|
var re = /^[a-zA-Z0-9 ]{1,16}$/;
|
|
} else if (what == 'smsnumber') {
|
|
var re = /^\+[0-9]{11,11}$/;
|
|
}
|
|
return re.test(text);
|
|
}
|
|
|
|
// A $( document ).ready() block.
|
|
$( document ).ready(function() {
|
|
$(".show-modal").click(function() {
|
|
$("#alias_exclamation").hide();
|
|
$("#smsnumber_exclamation").hide();
|
|
var alias = $(this).prev().html();
|
|
var deveui = $(this).prev().attr('id').replace("alias_","");
|
|
$('#deveui').html(deveui);
|
|
var alarmactive = $('#alarmactive_'+deveui).html();
|
|
var smsnumber = $('#smsnumber_'+deveui).html();
|
|
|
|
$("#alias").val(alias);
|
|
console.log(alarmactive);
|
|
if (alarmactive == "1") {
|
|
$('#checkbox').prop('checked', true);
|
|
} else {
|
|
$('#checkbox').prop('checked', false);
|
|
}
|
|
$("#smsnumber").val(smsnumber);
|
|
$("#modal").addClass("is-active");
|
|
});
|
|
|
|
$("#modal-close").click(function() {
|
|
console.log("blabla");
|
|
$("#modal").removeClass("is-active");
|
|
});
|
|
|
|
$("#modal-save").click(function() {
|
|
var alarmactive = "0";
|
|
if ($('#checkbox').prop('checked')) {
|
|
alarmactive = "1";
|
|
}
|
|
|
|
// Validation Code
|
|
var is_valid = true;
|
|
if (!validate('alias',$('#alias').val())) {
|
|
$('#alias_errormsg').html('Ungültige Bezeichnung; erlaubte Zeichen A-Z, 0-9 und Leerschlag');
|
|
$("#alias").addClass("is-danger");
|
|
$("#alias_exclamation").show();
|
|
is_valid = false;
|
|
} else {
|
|
$('#alias_errormsg').html('');
|
|
$("#alias").removeClass("is-danger");
|
|
$("#alias_exclamation").hide();
|
|
}
|
|
|
|
if (!validate('smsnumber',$('#smsnumber').val())) {
|
|
$('#smsnumber_errormsg').html('Beispiel einer gültigen SMS Nummer: +41761234567');
|
|
$("#smsnumber").addClass("is-danger");
|
|
$("#smsnumber_exclamation").show();
|
|
is_valid = false;
|
|
} else {
|
|
$('#smsnumber_errormsg').html('');
|
|
$("#smsnumber").removeClass("is-danger");
|
|
$("#smsnumber_exclamation").hide();
|
|
}
|
|
|
|
if (!(is_valid)) {
|
|
return;
|
|
}
|
|
|
|
$.ajax({
|
|
url: "save_scale_settings",
|
|
type: "get", //send it through get method
|
|
dataType: "json",
|
|
data: {
|
|
deveui: $('#deveui').html(),
|
|
alias: $('#alias').val(),
|
|
smsnumber: $("#smsnumber").val(),
|
|
alarmactive: alarmactive
|
|
},
|
|
success: function(response) {
|
|
console.log('save success');
|
|
if (response.rc == 0) {
|
|
$('#alias_'+$('#deveui').html()).html($('#alias').val());
|
|
var alarmactive = "0";
|
|
if ($('#checkbox').prop('checked')) {
|
|
alarmactive = "1";
|
|
}
|
|
$('#alarmactive_'+$('#deveui').html()).html(alarmactive);
|
|
$('#smsnumber_'+$('#deveui').html()).html($('#smsnumber').val());
|
|
}
|
|
},
|
|
error: function(xhr) {
|
|
console.log('save error');
|
|
//Do Something to handle error
|
|
}
|
|
});
|
|
|
|
console.log("save");
|
|
$("#modal").removeClass("is-active");
|
|
});
|
|
|
|
});
|
|
</script>
|
|
|
|
{{ else }}
|
|
<h4>Bitte zuerst <a href="login.html">einloggen</a></h4>
|
|
{{end}}
|
|
{{end}}
|