work on abo code

This commit is contained in:
Joerg Lehmann 2019-07-25 20:18:20 +02:00
parent b5f257fd46
commit e053b64625
1 changed files with 87 additions and 4 deletions

View File

@ -31,8 +31,7 @@
<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">
<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>
@ -50,6 +49,22 @@ Device ID: <span id="deveui"></span>
</div>
</div>
<div id="cart" class="modal">
<div class="modal-background"></div>
<div class="modal-card">
<header class="modal-card-head">
<p class="modal-card-title">Abos</p>
</header>
<section class="modal-card-body">
<!-- Content ... -->
</section>
<footer class="modal-card-foot">
<button id="cart-pay" class="button is-success">Bezahlen</button>
<button id="cart-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>
@ -105,10 +120,24 @@ Device ID: <span id="deveui"></span>
<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 is-size-7">
<p class="abo_add_years_text" id="abo_add_years_text_{.Deveui}}">&nbsp;</p>
</div>
<div class="has-text-centered">
<a class="block-link" id="add_abo_{{.Deveui}}">
<p class="abo_add_years" id="abo_add_years_{{.Deveui}}" hidden>0</p>
<a class="block-link abo_plus is-unselectable" id="abo_plus_{{.Deveui}}">
<span class="icon is-medium">
<i class="fa fa-2x fa-cart-plus"></i>
<i class="fa fa-lg fa-plus"></i>
</span>
</a>
<a class="block-link abo_pay is-unselectable" id="abo_{{.Deveui}}">
<span class="icon is-medium">
<i class="fa fa-2x fa-shopping-cart"></i>
</span>
</a>
<a class="block-link abo_minus is-unselectable" id="abo_minus_{{.Deveui}}">
<span class="icon is-medium">
<i class="fa fa-lg fa-minus"></i>
</span>
</a>
</div>
@ -118,6 +147,7 @@ Device ID: <span id="deveui"></span>
{{end}}
<script>
function validate(what, text) {
if (what == 'alias') {
var re = /^[a-zA-Z0-9 ]{1,16}$/;
@ -149,6 +179,59 @@ $(".show-modal").click(function() {
$("#modal").addClass("is-active");
});
$(".abo_pay").click(function() {
console.log("pay...");
el = $(this).parent().find(".abo_add_years");
counter = Number(el.html());
if (counter > 0) {
$("#cart").addClass("is-active");
}
});
$("#cart-close").click(function() {
console.log("blabla");
$("#cart").removeClass("is-active");
});
$("#cart-pay").click(function() {
console.log("hoopla");
$("#cart").removeClass("is-active");
});
$(".abo_plus").click(function() {
console.log("abo_plus");
el = $(this).parent().find(".abo_add_years");
el_text = $(this).parent().parent().find(".abo_add_years_text");
counter = Number(el.html());
if (counter < 3) {
counter = counter + 1;
el.html(counter);
if (counter == 1) {
el_text.html("+" + counter + " Jahr");
} else {
el_text.html("+" + counter + " Jahre");
}
}
});
$(".abo_minus").click(function() {
console.log("abo_minus");
el = $(this).parent().find(".abo_add_years");
el_text = $(this).parent().parent().find(".abo_add_years_text");
counter = Number(el.html());
if (counter > 0) {
counter = counter - 1;
el.html(counter);
if (counter == 0) {
el_text.html("&nbsp;");
} else if (counter == 1) {
el_text.html("+" + counter + " Jahr");
} else {
el_text.html("+" + counter + " Jahre");
}
}
});
$("#modal-close").click(function() {
console.log("blabla");
$("#modal").removeClass("is-active");