scan error feedback

ref #1
This commit is contained in:
Philipp Dormann 2021-03-17 18:52:37 +01:00
parent f5537278ab
commit 1fc0490590
2 changed files with 26 additions and 7 deletions

View File

@ -4,6 +4,7 @@
function init(el) {
el.focus();
}
let lastscan_error = "";
let lastscan_time = "";
let lastscan_laptime = "";
let lastscan_totaldistance = "";
@ -13,7 +14,7 @@
$: hours = (time.getHours() + "").padStart(2, "0");
$: minutes = (time.getMinutes() + "").padStart(2, "0");
$: seconds = (time.getSeconds() + "").padStart(2, "0");
const interval = setInterval(() => {
setInterval(() => {
time = new Date();
}, 1000);
</script>
@ -36,12 +37,20 @@
</div>
<div class="p-5 min-h-screen">
{$stationinfo}
<h1 class="mr-6 text-6xl font-semibold text-center text-gray-900">
<h1 class="mr-6 text-7xl font-semibold text-center text-gray-900">
{hours}:{minutes}:{seconds}
</h1>
<section class="px-4 py-24 mx-auto max-w-7xl">
<div class="mx-auto space-y-5 w-full md:w-1/2">
{#if lastscan_error}
<div
class="text-white px-6 py-4 border-0 rounded relative bg-red-500 mt-2"
>
<span class="inline-block align-middle">
<b class="capitalize">Error!</b><br />{lastscan_error}
</span>
</div>
{/if}
<form
class="space-y-4"
onsubmit="event.preventDefault();"
@ -53,6 +62,7 @@
blubb: { Authorization: "Bearer " + $apikey },
data: { card, station: JSON.parse($stationinfo).id },
});
lastscan_error = "";
axios
.request({
method: "GET",
@ -75,6 +85,7 @@
})
.catch(function (e) {
console.log(e.response);
lastscan_error = e.response.data.message;
});
}
card = "";

View File

@ -10,17 +10,25 @@
<p class="block text-sm font-bold text-gray-700 mt-2">API Key</p>
<p class="block text-sm text-gray-700">{$apikey}</p>
<p class="block text-sm font-bold text-gray-700 mt-2">Station Description</p>
<p class="block text-sm text-gray-700">{JSON.parse($stationinfo).description}</p>
<p class="block text-sm text-gray-700">
{JSON.parse($stationinfo).description}
</p>
<p class="block text-sm font-bold text-gray-700 mt-2">Station ID</p>
<p class="block text-sm text-gray-700">{JSON.parse($stationinfo).id}</p>
<p class="block text-sm font-bold text-gray-700 mt-2">Track ID</p>
<p class="block text-sm text-gray-700">{JSON.parse($stationinfo).track.id}</p>
<p class="block text-sm font-bold text-gray-700 mt-2">Track Name</p>
<p class="block text-sm text-gray-700">{JSON.parse($stationinfo).track.name}</p>
<p class="block text-sm text-gray-700">
{JSON.parse($stationinfo).track.name}
</p>
<p class="block text-sm font-bold text-gray-700 mt-2">Track Distance</p>
<p class="block text-sm text-gray-700">{JSON.parse($stationinfo).track.distance}</p>
<p class="block text-sm text-gray-700">
{JSON.parse($stationinfo).track.distance}
</p>
<p class="block text-sm font-bold text-gray-700 mt-2">minimum lap time</p>
<p class="block text-sm text-gray-700">{JSON.parse($stationinfo).track.minimumLapTime}s</p>
<p class="block text-sm text-gray-700">
{JSON.parse($stationinfo).track.minimumLapTime}s
</p>
<p class="block text-sm font-bold text-gray-700 mt-2">Language</p>
<div class="w-full">
<div class="inline-block mr-2 mt-2">