Initial content
This commit is contained in:
@@ -0,0 +1,33 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link href="/css/bootstrap.min.css" rel="stylesheet" />
|
||||
<link href="/font/bootstrap-icons.min.css" rel="stylesheet">
|
||||
{{#if (isDevelopment) }}
|
||||
<script src="/admin/bundle.js"></script>
|
||||
{{/if }}
|
||||
<script src="/htmx.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container-fluid">
|
||||
<div class="row bg-info text-white py-2 px-1">
|
||||
<div class="col align-baseline pt-1">SPORTS STORE ADMIN</div>
|
||||
<div class="col-auto text-end">
|
||||
{{#if user }}
|
||||
({{user.name}})
|
||||
<button class="btn btn-secondary"
|
||||
hx-post="/admin/signout" hx-target="body"
|
||||
hx-push-url="/admin/signin">
|
||||
<i class="bi bi-box-arrow-right"></i>
|
||||
</button>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row p-2">
|
||||
<div class="col-2" id="area_buttons"></div>
|
||||
<div class="col" id="content" hx-get="{{content}}"
|
||||
hx-trigger="load"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,19 @@
|
||||
<swap_wrapper hx-swap-oob="innerHTML:#area_buttons">
|
||||
<div class="d-grid gap-2" >
|
||||
<button id="products_btn" class="btn {{ buttonClass "products" mode }}"
|
||||
hx-get="/api/products/table" hx-target="#content"
|
||||
hx-push-url="/admin/products">
|
||||
Products
|
||||
</button>
|
||||
<button id="orders_btn" class="btn {{ buttonClass "orders" mode }}"
|
||||
hx-get="/api/orders/table" hx-target="#content"
|
||||
hx-push-url="/admin/orders">
|
||||
Orders
|
||||
</button>
|
||||
<button id="db_btn" class="btn {{ buttonClass "database" mode }}"
|
||||
hx-get="/api/database" hx-target="#content"
|
||||
hx-push-url="/admin/database">
|
||||
Database
|
||||
</button>
|
||||
</div>
|
||||
</swap_wrapper>
|
||||
@@ -0,0 +1,11 @@
|
||||
{{> admin/area_buttons mode="database"}}
|
||||
|
||||
<div class="m-2">
|
||||
<h5 class="text-danger text-center">{{admin_msg}}</h5>
|
||||
</div>
|
||||
|
||||
<div class="m-2 text-center">
|
||||
<button class="btn btn-danger m-2"
|
||||
hx-post="/api/database/reset"
|
||||
hx-target="#content">Reset & Seed Database</button>
|
||||
</div>
|
||||
@@ -0,0 +1,12 @@
|
||||
<td>
|
||||
<form hx-post="/api/orders/ship" hx-target="#content">
|
||||
<input type="hidden" name="id" value="{{id}}">
|
||||
{{#if shipped }}
|
||||
<input type="hidden" name="shipped" value="false">
|
||||
<button class="btn btn-sm btn-warning">Mark Unshipped</button>
|
||||
{{else }}
|
||||
<input type="hidden" name="shipped" value="true">
|
||||
<button class="btn btn-sm btn-danger">Ship Order</button>
|
||||
{{/if}}
|
||||
</form>
|
||||
</td>
|
||||
@@ -0,0 +1,40 @@
|
||||
{{> admin/area_buttons mode="orders"}}
|
||||
|
||||
<table class="table table-sm table-bordered">
|
||||
<thead><tr><th colspan="7" class="text-center">Orders</th></tr></thead>
|
||||
<tbody>
|
||||
{{#unless orders}}
|
||||
<tr><td colspan="7" class="text-center">No Orders</td></tr>
|
||||
{{/unless}}
|
||||
{{#each orders}}
|
||||
<tr class="table-active">
|
||||
<th>#</th><th>Customer</th><th>ZIP</th>
|
||||
<th>Product</th><th>Quantity</th><th>Price</th><th></th>
|
||||
</tr>
|
||||
{{#each selections}}
|
||||
<tr>
|
||||
{{#if (first @index)}}
|
||||
<td>{{ ../id }}</td>
|
||||
<td>{{ ../customer.name }}</td>
|
||||
<td>{{ ../address.zip }}</td>
|
||||
{{else }}
|
||||
<th colspan="3"></th>
|
||||
{{/if}}
|
||||
<td>{{product.name}}</td>
|
||||
<td>{{ quantity }}</td>
|
||||
<td>{{currency product.price}}</td>
|
||||
{{#if (first @index)}}
|
||||
{{> admin/order_button id=../id shipped=../shipped}}
|
||||
{{else}}
|
||||
<td></td>
|
||||
{{/if}}
|
||||
</tr>
|
||||
{{/each }}
|
||||
<tr>
|
||||
<th colspan="5" class="text-end">Total:</th>
|
||||
<td>{{currency (total selections)}}</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
{{/each}}
|
||||
</tbody>
|
||||
</table>
|
||||
@@ -0,0 +1,27 @@
|
||||
{{> admin/area_buttons mode="products"}}
|
||||
|
||||
{{#if create}}
|
||||
<form hx-post="/api/products/create">
|
||||
{{else}}
|
||||
<form hx-put="/api/products/{{product.id.value}}">
|
||||
{{/if}}
|
||||
{{> admin/product_input label="ID" name="id" data=product.id }}
|
||||
{{> admin/product_input label="Name" name="name" data=product.name }}
|
||||
<div class="mb-2">
|
||||
<label>Description</label>
|
||||
<textarea name="description"
|
||||
class="form-control">{{ product.description.value }}</textarea>
|
||||
{{> admin/validation_messages product.description }}
|
||||
</div>
|
||||
{{> admin/product_select label="Category" name="categoryId"
|
||||
data=product.categoryId list=categories}}
|
||||
{{> admin/product_select label="Supplier" name="supplierId"
|
||||
data=product.supplierId list=suppliers}}
|
||||
{{> admin/product_input label="Price" name="price" data=product.price }}
|
||||
|
||||
<div>
|
||||
<button type="submit" class="btn btn-secondary text-white">Save</button>
|
||||
<button class="btn btn-outline-secondary"
|
||||
hx-get="/api/products/table" hx-target="#content">Cancel</button>
|
||||
</div>
|
||||
</form>
|
||||
@@ -0,0 +1,6 @@
|
||||
<div class="mb-2">
|
||||
<label>{{label}}</label>
|
||||
<input {{ disabled label }} name="{{ name }}" class="form-control"
|
||||
value="{{ data.value }}" />
|
||||
{{> admin/validation_messages data }}
|
||||
</div>
|
||||
@@ -0,0 +1,19 @@
|
||||
<tr id="row{{ id }}">
|
||||
<td>{{ id }}</td>
|
||||
<td>{{ name }}</td>
|
||||
<td>{{ category.name }}</td>
|
||||
<td>{{ supplier.name }}</td>
|
||||
<td class="text-end">{{ currency price}}</td>
|
||||
<td class="ps-3">
|
||||
<button class="btn btn-sm btn-warning"
|
||||
hx-get="/api/products/edit/{{id}}" hx-target="#content"
|
||||
hx-push-url="/admin/products/edit/{{id}}">
|
||||
Edit
|
||||
</button>
|
||||
<button class="btn btn-sm btn-danger"
|
||||
hx-delete="/api/products/{{id}}" hx-target="#row{{id}}"
|
||||
hx-swap="delete">
|
||||
Delete
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
@@ -0,0 +1,12 @@
|
||||
<div class="mb-2">
|
||||
<label>{{ label }}</label>
|
||||
<select name="{{name}}" class="form-select " >
|
||||
<option value="" disabled selected>Choose Category</option>
|
||||
{{#each list }}
|
||||
<option {{ selected id ../data.value }}
|
||||
value="{{id}}">{{ name }}
|
||||
</option>
|
||||
{{/each}}
|
||||
</select>
|
||||
{{> admin/validation_messages data }}
|
||||
</div>
|
||||
@@ -0,0 +1,22 @@
|
||||
{{> admin/area_buttons mode="products"}}
|
||||
|
||||
<table class="table table-sm">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th><th>Name</th>
|
||||
<th>Category</th><th>Supplier</th>
|
||||
<th class="text-end">Price</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{#each products }}
|
||||
{{> admin/product_row }}
|
||||
{{/each }}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<button class="btn btn-secondary" hx-get="/api/products/create"
|
||||
hx-target="#content">
|
||||
Create
|
||||
</button>
|
||||
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<link href="/css/bootstrap.min.css" rel="stylesheet" />
|
||||
<link href="/font/bootstrap-icons.min.css" rel="stylesheet">
|
||||
<script src="/admin/bundle.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container-fluid">
|
||||
<div class="row bg-info text-white py-2 px-1">
|
||||
<div class="col align-baseline pt-1">SPORTS STORE ADMIN</div>
|
||||
<div class="col-auto text-end"></div>
|
||||
</div>
|
||||
<div class="row p-2">
|
||||
<div class="col"></div>
|
||||
<div class="col-auto">
|
||||
<a class="btn btn-primary" href="/admin/google">
|
||||
<i class="bi bi-google"></i>
|
||||
Sign in with Google Account
|
||||
</a>
|
||||
</div>
|
||||
<div class="col"></div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{{#if invalid }}
|
||||
{{#each messages }}
|
||||
<div class="text-danger">{{ this }}</div>
|
||||
{{/each }}
|
||||
{{/if }}
|
||||
Reference in New Issue
Block a user