Skip to content
Snippets Groups Projects
Verified Commit 7dadb5aa authored by hanfi's avatar hanfi
Browse files

add a checkin page for items

parent 5b86babc
Branches
Tags
No related merge requests found
import {Html5Qrcode} from "html5-qrcode";
var received_items = {};
var scanner = new Html5Qrcode("reader",{});
var scanner_audio = new Audio("/beep.wav");
scanner_audio.load();
function updateItemsView() {
var items = document.querySelector("#items");
items.innerHTML = "";
for (var item in received_items) {
var li = document.createElement("li");
li.innerHTML = "<button class=\"btn btn-primary\">"+received_items[item].item.uuid+"<span class=\"badge badge-light\">"+received_items[item].num+"</span></button>";
items.appendChild(li);
}
}
export async function addItemTag(form) {
if (form.value.length == 6) {
var response = await fetch("http://127.0.0.1:8000/tag/"+form.value);
if (response.status == 200) {
var tracking_item = await response.json();
received_items[tracking_item.uuid] = { "num":1, "item": tracking_item };
updateItemsView();
scanner_audio.play();
form.value = "";
}
}
}
async function onItemScanSuccess(item_uuid) {
scanner_audio.play();
await scanner.stop();
if (item_uuid.length == 36) {
if (item_uuid in received_items) {
received_items[item_uuid].num += 1;
} else {
received_items[item_uuid] = { "num":1, "item": null };
//FIXME: add error handling
var response = await fetch("http://127.0.0.1:8000/item/"+item_uuid);
if (response.status == 200) {
var tracking_item = await response.json();
received_items[item_uuid] = { "num":1, "item": tracking_item };
}
}
updateItemsView();
}
}
export async function scanItem() {
scanner.start({ facingMode: "user" }, { fps: 10, qrbox: { width: 250, height: 250 } }, onItemScanSuccess);
}
export async function checkinItems() {
for (var item in received_items) {
console.log(item, received_items[item]);
var response = await fetch("http://127.0.0.1:8000/checkin", {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
"item_uuid": received_items[item].item.uuid,
"storage_name": document.querySelector("#storage_select").value,
"num": received_items[item].num
})
});
var tracking_item = await response.json();
console.log(tracking_item);
}
}
export async function loadStorages() {
var response = await fetch("http://127.0.0.1:8000/storages");
var storages = await response.json();
var select = document.querySelector("#storage_select");
for (var i in storages) {
console.log(storages[i]);
var option = document.createElement("option");
option.textContent = storages[i].name;
option.value = storages[i].name;
select.appendChild(option);
}
}
<!DOCTYPE html>
<html lang="de">
<head>
<title>Paketshop: Checkin</title>
<module href="/components/head.html"></module>
</head>
<body>
<div class="container">
<h1>Checkin</h1>
<div class="row">
<div class="col-md-6">
<input class="form-control" type="text" placeholder="tag" onchange="lib.addItemTag(this,event)">
<button onclick="lib.scanItem()" class="btn btn-primary">Scan Item</button>
<ul id="items">
</ul>
</div>
<div class="col-md-6">
<select class="form-control" id="storage_select"></select>
<button onclick="lib.scanStorage()" class="btn btn-primary">Scan Storage</button>
<div id="storage"></div>
</div>
</div>
<div class="row">
<div id="reader" style="width: 500px; margin 0 auto;"></div>
</div>
<div class="row">
<button onclick="lib.checkinItems()" class="btn btn-primary">Submit Data</button>
</div>
</div>
<module href="/components/foot.html"></module>
<script>window.onload = function () { lib.loadStorages() };</script>
</body>
</html>
<!--<script src="./bootstrap.bundle.min.js"></script>-->
<script src="./bundle.js"></script>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">
<link rel="stylesheet" type="text/css" href="/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="/bootstrap-icons.css">
<link rel="stylesheet" type="text/css" href="/index.css">
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment