implemented ui functions for managing products, uploading images and editiing users
This commit is contained in:
24
views/admin/dashboard.eta
Normal file
24
views/admin/dashboard.eta
Normal file
@ -0,0 +1,24 @@
|
||||
<%~ include("partials/base_head.eta", {"title": "Dashboard"}) %>
|
||||
<%~ include("partials/nav.eta") %>
|
||||
|
||||
<section class="section container" id="mainSelect">
|
||||
<h1 class="title">Administration</h1>
|
||||
<!-- Big buttons linking to the different admin pages (Produkte, Benutzer, Bericht) -->
|
||||
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-4">
|
||||
<a href="/admin/products" class="button is-large is-fullwidth is-primary">Produkte</a>
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
<a href="/admin/users" class="button is-large is-fullwidth is-primary">Benutzer</a>
|
||||
</div>
|
||||
<div class="column is-4">
|
||||
<a href="/admin/reports" class="button is-large is-fullwidth is-primary">Berichte</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<%~ include("partials/footer.eta") %>
|
||||
<!-- <script src="/static/pages/admin_.js"></script>-->
|
||||
<%~ include("partials/base_foot.eta") %>
|
153
views/admin/products.eta
Normal file
153
views/admin/products.eta
Normal file
@ -0,0 +1,153 @@
|
||||
<%~ include("partials/base_head.eta", {"title": "Admin - Benutzer"}) %>
|
||||
<%~ include("partials/nav.eta") %>
|
||||
|
||||
<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>
|
||||
|
||||
<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>
|
||||
|
||||
<script src="/static/pages/admin_products.js"></script>
|
||||
<%~ include("partials/footer.eta") %>
|
||||
<%~ include("partials/base_foot.eta") %>
|
96
views/admin/users.eta
Normal file
96
views/admin/users.eta
Normal file
@ -0,0 +1,96 @@
|
||||
<%~ include("partials/base_head.eta", {"title": "Admin - Benutzer"}) %>
|
||||
<%~ include("partials/nav.eta") %>
|
||||
|
||||
<section class="section container" id="mainSelect">
|
||||
<h1 class="title">Benutzerverwaltung</h1>
|
||||
<p class="heading"><button class="js-modal-trigger button" data-target="modal-js-example">
|
||||
Neuen Konakt anlegen
|
||||
</button></p>
|
||||
<table class="table is-striped is-fullwidth is-hoverable" data-dataSource="user" id="userTable" data-pageSize="10">
|
||||
<thead>
|
||||
<tr>
|
||||
<th data-dataCol = "id">Id</th>
|
||||
<th data-dataCol = "name">Name</th>
|
||||
<th data-dataCol = "email">E-Mail</th>
|
||||
<th data-dataCol = "code" data-type="bool" data-edit-transfer="disable">Code</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="userTable">
|
||||
<ul class="pagination-list">
|
||||
|
||||
</ul>
|
||||
</nav>
|
||||
</section>
|
||||
|
||||
|
||||
<!-- 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="user">
|
||||
<h2 class="title">Neuer Benutzer</h1>
|
||||
<div class="field">
|
||||
<label class="label">Name</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">E-Mail</label>
|
||||
<div class="control has-icons-left">
|
||||
<input class="input" type="email" placeholder="test@example.org" value="" name="email">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="bi bi-envelope"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<label class="label">Pin</label>
|
||||
<div class="control has-icons-left">
|
||||
<input class="input" type="text" placeholder="" value="" name="code">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="bi bi-chat-fill"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<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>
|
||||
|
||||
|
||||
<%~ include("partials/footer.eta") %>
|
||||
<script src="/static/pages/admin_users.js"></script>
|
||||
<%~ include("partials/base_foot.eta") %>
|
Reference in New Issue
Block a user