hydrationhub/views/admin/products.eta
2025-03-19 23:16:11 +01:00

237 lines
7.5 KiB
Plaintext

<%~ 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 buttons">
<button class="js-modal-trigger button" data-target="modal-js-example">
Neues Produkt anlegen
</button><button class="js-modal-trigger button" data-target="modal-restock" id="btn_restock">
Lager nachfüllen / Anpassen
</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">
<thead>
<tr>
<th data-dataCol = "id">Id</th>
<th data-dataCol = "name">Name</th>
<th data-dataCol = "gtin">GTIN</th>
<th data-dataCol = "price">Preis</th>
<th data-dataCol = "stock">Lagermenge</th>
<th data-dataCol = "visible" data-type="bool">Sichtbarkeit</th>
<th data-dataCol = "FUNC:INLINE" data-ColHandler=handleImagePresence>Bild hinterlegt</th>
<th data-fnc="actions" data-actions="edit,delete">Aktionen</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<nav class="pagination is-hidden" role="navigation" aria-label="pagination" data-targetTable="productTable">
<ul class="pagination-list">
</ul>
</nav>
</section>
<!-- Image upload modal -->
<div id="imageModal" class="modal">
<div class="modal-background"></div>
<div class="modal-content">
<div class="box">
<form id="imgUploadForm" enctype="multipart/form-data" method="post" action="/api/v1/image">
<h2 class="title">Bild hochladen</h1>
<div class="file has-name">
<label class="file-label">
<input id="imgUpload" class="file-input" type="file" name="image" />
<span class="file-cta">
<span class="file-icon">
<i class="fas fa-upload"></i>
</span>
<span class="file-label"> Datei wählen… </span>
</span>
<span class="file-name" id="fileName"></span>
</label>
</div>
<br>
</form>
<div class="control">
<input type="button" class="button is-link" value="Hochladen" onclick="silentFormSubmit()">
</div>
</div>
</div>
</div>
<!-- TODO: Mark required fields as required; add handling for validation -->
<div id="modal-js-example" class="modal">
<div class="modal-background"></div>
<div class="modal-content">
<div class="box entryPhase is-hidden">
<h2 class="title">Neuer Kontakt</h1>
<i class="bi bi-arrow-clockwise title"></i>
</div>
<div class="box entryPhase">
<form data-targetTable="products">
<h2 class="title">Neuer Benutzer</h1>
<div class="field">
<label class="label">Bezeichner</label>
<div class="control has-icons-left">
<input class="input" type="text" placeholder="John Doe" 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 class="input" type="number" placeholder="" value="" name="gtin">
<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">
<div class="control">
<label class="checkbox">
<input type="checkbox" value="" name="visible">
In der Liste anzeigen</a>
</label>
</div>
</div>
<div class="field is-grouped">
<div class="control">
<input type="submit" class="button is-link" value="Save" data-actionBtn="save">
</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>
<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(-1)">-1</button>
<button class="button is-info" onclick="restock(1)">+1</button>
<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") %>