feat: Adds employee form and table view, begins user form and table view.

This commit is contained in:
2025-01-07 14:05:40 -05:00
parent e3f150b32c
commit 08a0a8e1a3
15 changed files with 366 additions and 93 deletions

View File

@@ -0,0 +1,42 @@
<table id="employee-table">
<tr>
<th>Name</th>
<th>Active</th>
<th></th>
</tr>
#for(employee in employees):
<tr id="employee_#(employee.id)">
<td>#capitalized(employee.firstName) #capitalized(employee.lastName)</td>
<td style="width: 10%; text-align: center;">
#if(employee.active):
<a class="toggle"
hx-post="/employees/#(employee.id)/toggle-active"
hx-target="#employee-table"
hx-swap="outerHTML"
>
<img src="images/toggle-on.svg" alt="Active">
</a>
#else:
<a class="toggle"
hx-post="/employees/#(employee.id)/toggle-active"
hx-target="#employee-table"
hx-swap="outerHTML"
>
<img src="images/toggle-off.svg" alt="Active">
</a>
#endif
</td>
<td style="width: 30px;">
<a class="btn-delete"
hx-delete="/employees/#(employee.id)"
hx-target="#employee-table"
hx-swap="outerHTML"
hx-confirm="Are you sure you want to delete this employee?"
>
<img src="images/trash-can.svg" alt="Delete">
</a>
</td>
</tr>
#endfor
</table>

View File

@@ -0,0 +1,22 @@
<div id="home-conent" class="container">
<div class="container">
<h1>Employees</h1>
<br>
<p>Employees are who purchase orders can be generated for.</p>
<br>
</div>
<form class="employee-form"
hx-post="/employees"
hx-target="#employee-table"
hx-swap="outerHTML"
>
<label for="firstName">First Name</label>
<input type="text" id="firstName" name="firstName" placeholder="First Name" autofocus required>
<br>
<label for="lastName">Last Name</label>
<input type="text" id="lastName" name="lastName" placeholder="Last Name" required>
<br>
<input type="submit" value="Create">
</form>
#extend("employee-table")
</div>

35
Resources/Views/home.leaf Normal file
View File

@@ -0,0 +1,35 @@
<div id="content">
<header>
<div class="container">
#extend("logo")
#extend("navbar")
</div>
</header>
<section class="content">
<div class="container">
<nav>
<ul class="nav-links">
<li>
<a hx-get="/users"
hx-target="#home-content"
hx-swap="outerHTML"
>
Users
</a>
</li>
<li>
<a hx-get="/employees"
hx-target="#home-content"
hx-swap="outerHTML"
>
Employees
</a>
</li>
</ul>
</nav>
</div>
<div id="home-content" class="container">
<p>We're in!</p>
</div>
</section>
</div>

View File

@@ -1,17 +0,0 @@
<div id="content">
<header>
<div class="container">
<div id="logo">HHE - Purchase Orders</div>
<nav>
<ul class="nav-links">
<li><a hx-post="logout" hx-target="#content" hx-trigger="click" hx-swap="outerHTML">Logout</a></li>
</ul>
</nav>
</div>
</header>
<section class="content">
<div class="container">
<p>We're in!</p>
</div>
</section>
</div>

View File

@@ -1,7 +1,7 @@
<div id="content">
<header>
<div class="container">
<div id="logo">HHE - Purchase Orders</div>
#extend("logo")
</div>
</header>

View File

@@ -0,0 +1 @@
<div id="logo">HHE - Purchase Orders</div>

View File

@@ -0,0 +1,5 @@
<nav>
<ul class="nav-links">
<li><a hx-post="logout" hx-target="#content" hx-trigger="click" hx-swap="outerHTML">Logout</a></li>
</ul>
</nav>

View File

@@ -0,0 +1,19 @@
<div id="home-content" class="container">
<div class="container">
<h1>Users</h1>
<p>Users are people that can login and generate puchase orders for employees.</p>
<br>
</div>
<table>
<tr>
<th>Username</th>
<th>Email</th>
</tr>
#for(user in users):
<tr>
<td>#(user.username)</td>
<td>#(user.email)</td>
</tr>
#endfor
</table>
</div>