restock mode
This commit is contained in:
parent
d491033c29
commit
14cf8af14b
@ -1,6 +1,26 @@
|
||||
let uploadFileInput = document.getElementById('imgUpload');
|
||||
let fileName = document.getElementById('fileName');
|
||||
let imgUploadForm = document.getElementById('imgUploadForm');
|
||||
let scannerField = document.getElementById('scannerField');
|
||||
let btn_restock = document.getElementById('btn_restock');
|
||||
|
||||
let btn_save_2 = document.getElementById('btn_save_2');
|
||||
|
||||
let form_gtin = document.getElementById('form_gtin');
|
||||
|
||||
let modal_stage_1 = document.getElementById('modal-stage-1');
|
||||
let modal_stage_2 = document.getElementById('modal-stage-2');
|
||||
let modal_stage_3 = document.getElementById('modal-stage-3');
|
||||
|
||||
let modal_stage_2_result = document.getElementById("stage-2-result");
|
||||
|
||||
let modal_stage_2_amount = document.getElementById("stage-2-amount");
|
||||
|
||||
let globalData;
|
||||
|
||||
waitingForScan = false;
|
||||
let currentRestockProduct = null;
|
||||
|
||||
|
||||
function handleImagePresence(row) {
|
||||
// Check if /api/v1/image?id=row&check returns true
|
||||
@ -55,6 +75,10 @@ function silentFormSubmit() {
|
||||
};
|
||||
}
|
||||
|
||||
function enableScanner() {
|
||||
waitingForScan = true;
|
||||
scannerField.focus();
|
||||
}
|
||||
|
||||
uploadFileInput.addEventListener('change', function() {
|
||||
fileName.innerHTML = this.files[0].name;
|
||||
@ -62,4 +86,110 @@ uploadFileInput.addEventListener('change', function() {
|
||||
setTimeout(() => {
|
||||
refreshTableByName('products');
|
||||
}, 1000);
|
||||
});
|
||||
});
|
||||
|
||||
scannerField.style.fontSize = '1px';
|
||||
scannerField.style.height = '1px';
|
||||
scannerField.style.width = '1px';
|
||||
scannerField.style.opacity = '0';
|
||||
scannerField.style.position = 'relative';
|
||||
|
||||
// Make sure text fields is always centerd vertically
|
||||
window.addEventListener('scroll', function(event) {
|
||||
if(!waitingForScan) {
|
||||
return;
|
||||
}
|
||||
scannerField.y = document.documentElement.scrollTop + 20;
|
||||
scannerField.style.top = document.documentElement.scrollTop + 20 + "px";
|
||||
});
|
||||
|
||||
setInterval(() => {
|
||||
if(!waitingForScan) {
|
||||
return;
|
||||
}
|
||||
scannerField.focus();
|
||||
}, 1000);
|
||||
|
||||
btn_restock.addEventListener('click', function() {
|
||||
modal_stage_1.classList.remove('is-hidden');
|
||||
modal_stage_2.classList.add('is-hidden');
|
||||
modal_stage_3.classList.add('is-hidden');
|
||||
waitingForScan = true;
|
||||
});
|
||||
// Handle barcode scanner input
|
||||
scannerField.addEventListener('keydown', async function(event) {
|
||||
if(event.key != 'Enter') {
|
||||
return;
|
||||
}
|
||||
let barcode = scannerField.value;
|
||||
console.log('Barcode scanned:', barcode);
|
||||
scannerField.value = "";
|
||||
// createTemporaryNotification(`Barcode ${barcode} gescannt`, 'is-info');
|
||||
|
||||
|
||||
// Check if barcode is in the database
|
||||
let product = globalData.find(p => p.gtin == barcode);
|
||||
if(product) {
|
||||
console.log('Product found:', product);
|
||||
currentRestockProduct = product;
|
||||
modal_stage_2_amount.innerHTML = "Aktuelle Menge: " + product.stock;
|
||||
modal_stage_1.classList.add('is-hidden');
|
||||
modal_stage_2.classList.remove('is-hidden');
|
||||
modal_stage_3.classList.add('is-hidden');
|
||||
createTemporaryNotification(`<i class="bi bi-upc-scan"></i> Barcode scan: GTIN ${barcode} gefunden`, 'is-success');
|
||||
} else {
|
||||
modal_stage_1.classList.add('is-hidden');
|
||||
modal_stage_2.classList.add('is-hidden');
|
||||
modal_stage_3.classList.remove('is-hidden');
|
||||
form_gtin.value = barcode;
|
||||
}
|
||||
// modal_stage_2_result.innerHTML = product ? `<i class="bi bi-check"></i> Produkt gefunden: ${product.name}` : `<i class="bi bi-x"></i> Produkt nicht gefunden`;
|
||||
waitingForScan = false;
|
||||
|
||||
|
||||
// let product = globalData.find(p => p.gtin == barcode);
|
||||
// if(product) {
|
||||
// let event = new Event('click');
|
||||
// createTemporaryNotification(`<i class="bi bi-upc-scan"></i> Barcode scan: GTIN ${barcode} gefunden`, 'is-success');
|
||||
// document.getElementById(`product_${product.id}`).dispatchEvent(event);
|
||||
// } else {
|
||||
// createTemporaryNotification( `<i class="bi bi-upc-scan"></i> Barcode scan: GTIN ${barcode} nicht gefunden`, 'is-danger');
|
||||
// }
|
||||
});
|
||||
|
||||
function restock(amount) {
|
||||
currentRestockProduct.stock += amount;
|
||||
modal_stage_2_amount.innerHTML = "Aktuelle Menge: " + currentRestockProduct.stock;
|
||||
}
|
||||
|
||||
function applyStock() {
|
||||
let result = _api.patch('products', {
|
||||
"id": currentRestockProduct.id,
|
||||
"stock": currentRestockProduct.stock
|
||||
})
|
||||
if(result) {
|
||||
createTemporaryNotification('Bestand erfolgreich aktualisiert', 'is-success');
|
||||
modal_stage_2.classList.add('is-hidden');
|
||||
modal_stage_1.classList.remove('is-hidden');
|
||||
modal_stage_3.classList.add('is-hidden');
|
||||
enableScanner();
|
||||
} else {
|
||||
createTemporaryNotification('Fehler beim Aktualisieren des Bestands', 'is-danger');
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', async function() {
|
||||
let data = await returnTableDataByTableName('products');
|
||||
console.info(`Found ${data.count} products`);
|
||||
const result = data.result;
|
||||
globalData = result;
|
||||
});
|
||||
|
||||
// btn_save_2.addEventListener('click', async function() {
|
||||
// // Assume submission is valid
|
||||
// // Get the form data
|
||||
// // reload table
|
||||
// // close modal
|
||||
// });
|
||||
@ -186,13 +186,7 @@ function confirmedCart() {
|
||||
});
|
||||
}
|
||||
|
||||
function getCookie(name) {
|
||||
let value = "; " + document.cookie;
|
||||
let parts = value.split("; " + name + "=");
|
||||
if(parts.length == 2) {
|
||||
return parts.pop().split(";").shift();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Handle barcode scanner
|
||||
// Force the cursor to the scanner field
|
||||
|
||||
@ -1,11 +1,13 @@
|
||||
<%~ include("partials/base_head.eta", {"title": "Admin - Benutzer"}) %>
|
||||
<%~ include("partials/nav.eta") %>
|
||||
|
||||
<input id="scannerField" type="text"/>
|
||||
<section class="section container" id="mainSelect">
|
||||
<h1 class="title">Produktverwaltung</h1>
|
||||
<p class="heading"><button class="js-modal-trigger button" data-target="modal-js-example">
|
||||
Neues Produkt anlegen
|
||||
</button></p>
|
||||
</button><button class="js-modal-trigger button" data-target="modal-restock" id="btn_restock">
|
||||
Lager nachfüllen
|
||||
</button><br></p>
|
||||
|
||||
<input class="input" type="text" data-searchTargetId="productTable" placeholder="Nach Produkt suchen.." />
|
||||
<table class="table is-striped is-fullwidth is-hoverable" data-dataSource="products" id="productTable" data-pageSize="10">
|
||||
@ -148,6 +150,84 @@
|
||||
<button class="modal-close is-large" aria-label="close"></button>
|
||||
</div>
|
||||
|
||||
<div id="modal-restock" class="modal">
|
||||
<div class="modal-background"></div>
|
||||
|
||||
<div class="modal-content">
|
||||
<div class="box" id="modal-stage-1">
|
||||
<h2 class="title">Nachfüllen</h1>
|
||||
<center><h1 class="title"><i class="bi bi-upc-scan"></i></h1></center>
|
||||
Warten auf Scan....
|
||||
</div>
|
||||
<div class="box" id="modal-stage-2">
|
||||
<h2 class="title">Scan erfolgreich - Produktmenge eingeben</h1>
|
||||
<h3 class="subtitle" id="stage-2-amount">Aktuelle Menge: 0</h3>
|
||||
<div class="buttons">
|
||||
<button class="button is-info" onclick="restock(6)">+6</button>
|
||||
<button class="button is-info" onclick="restock(10)">+10</button>
|
||||
<button class="button is-info" onclick="restock(12)">+12</button>
|
||||
</div>
|
||||
<button class="button is-success" onclick="applyStock()">Änderungen speichern</button>
|
||||
<div id="stage-2-result"></div>
|
||||
</div>
|
||||
<div class="box" id="modal-stage-3">
|
||||
<h2 class="title">Scan erfolgreich - Produkt erstellen</h1>
|
||||
<form data-targetTable="products">
|
||||
<div class="field">
|
||||
<label class="label">Bezeichner</label>
|
||||
<div class="control has-icons-left">
|
||||
<input class="input" type="text" placeholder="Schokolade" value="" name="name">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="bi bi-file-earmark-person-fill"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">GTIN</label>
|
||||
<div class="control has-icons-left">
|
||||
<input id="form_gtin" class="input" type="number" placeholder="" value="" name="gtin" readonly>
|
||||
<span class="icon is-small is-left">
|
||||
<i class="bi bi-upc"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Lagermenge</label>
|
||||
<div class="control has-icons-left">
|
||||
<input class="input" type="number" placeholder="" value="" name="stock">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="bi bi-archive-fill"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Preis</label>
|
||||
<div class="control has-icons-left">
|
||||
<input class="input" type="number" placeholder="" value="" step=0.01 name="price">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="bi bi-currency-euro"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<input type="submit" class="button is-link" value="Save" data-actionBtn="save" data-extTable="productTable" id="btn_save_2">
|
||||
</div>
|
||||
<!--<div class="control">
|
||||
<button type="button" class="button is-link is-light" data-actionBtn="cancel">Cancel</button>
|
||||
</div>-->
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="modal-close is-large" aria-label="close"></button>
|
||||
</div>
|
||||
|
||||
<script src="/static/pages/admin_products.js"></script>
|
||||
<%~ include("partials/footer.eta") %>
|
||||
<%~ include("partials/base_foot.eta") %>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user