Project-Name-Here/hydrationhub
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Frontend product + user select

Browse Source
This commit is contained in:
Leon Meier 2025-02-24 23:34:49 +01:00
parent 5a68622b7a
commit 3706ed07d2
3 changed files with 62 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
static/pages/product_select.js
View File

@ -8,10 +8,28 @@ const baseStruct = document.getElementById("baseStruct");
let globalData;
// On load
document.addEventListener('DOMContentLoaded', function() {
let data = await returnTableDataByTableName('product');
document.addEventListener('DOMContentLoaded', async function() {
let data = await returnTableDataByTableName('products');
console.info(`Found ${data.count} products`);
const result = data.result;
globalData = result;
for(let i = 0; i < result.length; i++) {
let product = result[i];
if(product.visible) {
let newDiv = baseStruct.cloneNode(true);
newDiv.id = `product_${product.id}`;
newDiv.style.display = 'block';
newDiv.querySelector('.product_name').innerText = product.name;
newDiv.querySelector('.product_description').innerText = product.description || "";
let price = parseFloat(product.price).toFixed(2);
newDiv.querySelector('.product_price').innerText = price + " €";
newDiv.querySelector('.product_ean').innerText = product.gtin;
newDiv.querySelector('.product_image').src = product.image || "https://bulma.io/assets/images/placeholders/1280x960.png";
mainSelectionDiv.appendChild(newDiv);
}
}
});

4
static/pages/user_select.js
View File

@ -81,10 +81,14 @@ function handleUserClick(e) {
console.log(`Clicked on user with id ${userId}`);
let user = globalData.find(u => u.id == userId);
currentUser = user;
console.log(user);
if(user.code) {
pinPadModal.classList.add('is-active');
// Automatically focus on the first input field
pinInput1.focus();
} else {
pinValue = "0000";
validatePin();
}
}

66
views/product_select.eta
View File

@ -1,38 +1,48 @@
<%~ include("partials/base_head.eta", {"title": "Dashboard"}) %>
<%~ include("partials/nav.eta") %>
<section class="section">
<div class="container columns" id="mainSelect">
</div>
<section class="section main-content">
<div class="container">
<div class="columns">
<!-- Main content in the middle -->
<div class="column is-three-quarters columns is-multiline" id="mainSelect">
<!-- This will be populated by JS with the templated content from the hidden section -->
</div>
<!-- Empty sidebar on the right -->
<div class="column is-one-quarter">
<h2 class="title is-4" >Ausgewählte Produkte</h2>
</div>
</div>
</div>
</section>
<hidden>
<!-- Base Button -->
<div class="column" id="baseStruct">
<div class="card" >
<div class="card-image">
<figure class="image is-4by3">
<img
src="https://bulma.io/assets/images/placeholders/1280x960.png"
alt="Placeholder image"
/>
</figure>
</div>
<div class="card-content">
<p class="title is-4">CocaCola lol</p>
<p class="subtitle is-6">0123456789</p>
</div>
<footer class="card-footer">
<p class="card-footer-item">
<span> 9.99€ </span>
</p>
</footer>
</div>
</div>
<!-- Base Button -->
<div class="column is-one-quarter" id="baseStruct">
<div class="card">
<div class="card-image">
<figure class="image is-4by3">
<img
src="https://bulma.io/assets/images/placeholders/1280x960.png"
alt="Placeholder image"
class="product_image"
/>
</figure>
</div>
<div class="card-content">
<p class="title is-4 product_name">CocaCola</p>
<p class="subtitle is-6 product_ean">0123456789</p>
<p class="product_description">Explainer</p>
</div>
<footer class="card-footer">
<p class="card-footer-item">
<span class="product_price"> 9.99€ </span>
</p>
</footer>
</div>
</div>
</hidden>
<%~ include("partials/footer.eta") %>
<script src="/static/pages/product_select.js"></script>
<%~ include("partials/base_foot.eta") %>
<%~ include("partials/base_foot.eta") %>