{% extends "base.html" %}
{% block main %}
<h1>Administration</h1>
<ul class="nav nav-tabs" id="adminTab" role="tablist">
<li class="nav-item" role="presentation">
<button class="nav-link active" id="admin-users-tab" data-bs-toggle="tab" data-bs-target="#admin-users-tab-pane" type="button" role="tab" aria-controls="admin-users-tab-pane" aria-selected="true">Users</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="admin-products-tab" data-bs-toggle="tab" data-bs-target="#admin-products-tab-pane" type="button" role="tab" aria-controls="admin-products-tab-pane" aria-selected="false">Products</button>
</li>
<li class="nav-item" role="presentation">
<button class="nav-link" id="admin-default-images-tab" data-bs-toggle="tab" data-bs-target="#admin-default-images-tab-pane" type="button" role="tab" aria-controls="admin-default-images-tab-pane" aria-selected="false">Default Images</button>
</li>
</ul>
<div class="tab-content" id="adminTabContent">
<section class="tab-pane fade pt-3 show active" id="admin-users-tab-pane" role="tabpanel">
<h2>Users</h2>
<form id="admin-newuser-form" method="post" action="/admin?adminchange=newuser" accept-charset="UTF-8">
<table class="table table-striped">
<tr>
<th>Username</th>
<th>E-Mail (optional)</th>
<th>Password</th>
<th>Member</th>
<th>Admin</th>
<th>Logout after purchase</th>
<th>Balance</th>
<th>Actions</th>
</tr>
<tr>
<td><input class="form-control" id="admin-newuser-username" type="text" name="username" placeholder="New username"></td>
<td><input class="form-control" id="admin-newuser-email" type="text" name="email" placeholder="New e-mail"></td>
<td><input class="form-control" id="admin-newuser-password" type="password" name="password" placeholder="New password"></td>
<td><input class="form-check-input" id="admin-newuser-ismember" type="checkbox" name="ismember"></td>
<td><input class="form-check-input" id="admin-newuser-isadmin" type="checkbox" name="isadmin"></td>
<td><input class="form-check-input" id="admin-newuser-logout-after-purchase" type="checkbox" name="logout_after_purchase"></td>
<td>
<div class="input-group mb-3">
<span class="input-group-text">CHF</span>
<input class="form-control" id="admin-newuser-balance" type="number" step="0.01" name="balance" value="0.00">
</div>
</td>
<td><input class="btn btn-success" type="submit" value="Create User"></td>
</tr>
{% for user in users %}
<tr>
<td>{{ user.name }}</td>
<td>{{ '✓' if user.email else '✗' }}</td>
<td>••••••••</td>
<td>{{ '✓' if user.is_member else '✗' }}</td>
<td>{{ '✓' if user.is_admin else '✗' }}</td>
<td>{{ '✓' if user.logout_after_purchase else '✗' }}</td>
<td>{{ user.balance | chf }}</td>
<td>
<div class="btn-group" role="group">
<a class="btn btn-primary" href="/moduser?userid={{ user.id }}">Edit</a>
<a class="btn btn-danger" href="/moduser?userid={{ user.id }}&change=del">Delete</a>
</div>
</td>
</tr>
{% endfor %}
</table>
</form>
</section>
<section class="tab-pane fade pt-3" id="admin-products-tab-pane" role="tabpanel">
<h2>Products</h2>
<form id="admin-newproduct-form" method="post" action="/admin?adminchange=newproduct" enctype="multipart/form-data" accept-charset="UTF-8">
<table class="table table-striped">
<tr>
<th>Name</th>
<th>Barcodes</th>
<th>Member price</th>
<th>Non-member price</th>
<th>Custom price</th>
<th>Stockable</th>
<th>Image</th>
<th>Actions</th>
</tr>
<tr>
<td><input class="form-control" id="admin-newproduct-name" type="text" name="name" placeholder="New product name"></td>
<td><input class="form-control" id="admin-newproduct-barcode" type="text" name="barcode" placeholder="Scan barcode to insert here"></td>
<td>
<div class="input-group mb-3">
<span class="input-group-text">CHF</span>
<input class="form-control" id="admin-newproduct-price-member" type="number" step="0.01" name="pricemember" value="0.00">
</div>
</td>
<td>
<div class="input-group mb-3">
<span class="input-group-text">CHF</span>
<input class="form-control" id="admin-newproduct-price-non-member" type="number" step="0.01" name="pricenonmember" value="0.00">
</div>
</td>
<td><input class="form-check-input" id="admin-custom-price" type="checkbox" name="custom_price"></td>
<td><input class="form-check-input" id="admin-newproduct-stockable" type="checkbox" name="stockable" checked="checked"></td>
<td><input class="form-control" id="admin-newproduct-image" name="image" type="file" accept="image/*"></td>
<td><input class="btn btn-success" type="submit" value="Create Product"></td>
</tr>
{% for product in products %}
<tr>
<td>{{ product.name }}</td>
<td>
{% set bcs = barcodes | selectattr('product_id', 'eq', product.id) | list %}
{% if bcs | length > 0 %}
{{ bcs[0].barcode }}
{% if bcs | length > 1 %}
<span class="badge bg-secondary">+{{ bcs | length - 1 }}</span>
{% endif %}
{% endif %}
</td>
<td>{{ product.price_member | chf }}</td>
<td>{{ product.price_non_member | chf }}</td>
<td>{{ '✓' if product.custom_price else '✗' }}</td>
<td>{{ '✓' if product.stockable else '✗' }}</td>
<td><img style="height: 2em;" src="/static/upload/thumbnails/products/{{ product.id }}.png" alt="Picture of {{ product.name }}" draggable="false"></td>
<td>
<div class="btn-group" role="group">
<a class="btn btn-primary" href="/modproduct?productid={{ product.id }}">Edit</a>
<a class="btn btn-danger" href="/modproduct?productid={{ product.id }}&change=del">Delete</a>
</div>
</td>
</tr>
{% endfor %}
</table>
</form>
</section>
<section class="tab-pane fade pt-3" id="admin-default-images-tab-pane" role="tabpanel">
<h2>Default Images</h2>
<form id="admin-default-images-form" method="post" action="/admin?adminchange=defaultimg" enctype="multipart/form-data" accept-charset="UTF-8">
<div class="row">
<div class="col-sm-2 g-4">
<div class="card h-100">
<img class="card-img-top" src="/static/upload/thumbnails/users/default.png" alt="Default user avatar" />
<div class="card-body">
<label class="card-title" for="admin-default-images-user">Default user avatar</label>
<div class="card-text">
<input class="form-control" id="admin-default-images-user" type="file" name="users" accept="image/*" />
</div>
</div>
</div>
</div>
<div class="col-sm-2 g-4">
<div class="card h-100">
<img class="card-img-top" src="/static/upload/thumbnails/products/default.png" alt="Default product image" />
<div class="card-body">
<label class="card-title" for="admin-default-images-product">Default product image</label>
<div class="card-text">
<input class="form-control" id="admin-default-images-product" type="file" name="products" accept="image/*" />
</div>
</div>
</div>
</div>
</div>
<p>
<input class="btn btn-primary" type="submit" value="Save changes">
</p>
</form>
</section>
{{ super() }}
{% endblock %}
{% block barcodewebsocket %}
let bcinput = document.getElementById("admin-newproduct-barcode");
bcinput.value = e.data;
bcinput.select();
bcinput.scrollIntoView();
{% endblock %}