feat: Updates to employee detail views.

This commit is contained in:
2025-01-12 22:14:39 -05:00
parent 1ce369e156
commit 8228b1dfff
5 changed files with 98 additions and 69 deletions

View File

@@ -1,12 +1,7 @@
<div id="employee-detail" class="float" #if(!employee): style="display:none;" #endif>
#if(employee):
<button class="closebtn"
hx-get="/employees"
hx-target="body"
hx-push-url="true"
hx-swap="outerHTML"
hx-disable-elt="this"
>
onclick="toggleContent('employee-detail');">
&times;
</button>
<form hx-put="/employees/#(employee.id)"
@@ -15,40 +10,34 @@
hx-disable-elt="this"
hx-on::after-request="window.location.href='/employees'; toggleContent('employee-detail');"
>
<table>
<tbody>
<tr>
<td style="width: 20%;"><h3 class="label">First Name:</h3></td>
<td><input type="text" name="firstName" value="#(employee.firstName)"></td>
</tr>
<tr>
<td><h3 class="label">Last Name:</h3></td>
<td><input type="text" name="lastName" value="#(employee.lastName)"></td>
</tr>
<tr>
<td><h3 class="label">Active:</h3></td>
<td>
#if(employee.active):
<a class="toggle"
hx-patch="/employees/#(id)/toggle-active"
hx-target="#employee_#(id)"
hx-swap="outerHTML"
>
<img class="toggle" src="/images/toggle-on.svg" alt="Active">
</a>
#else:
<a class="toggle"
hx-patch="/employees/#(id)/toggle-active"
hx-target="#employee_#(id)"
hx-swap="outerHTML"
>
<img class="toggle" src="/images/toggle-off.svg" alt="Active">
</a>
#endif
</td>
</tr>
</tbody>
</table>
<div class="row">
<label for="firstName"><h3 class="label">First Name:</h3></label>
<input type="text" name="firstName" value="#(employee.firstName)">
<label for="lastName"><h3 class="label">Last Name:</h3></label>
<input type="text" name="lastName" value="#(employee.lastName)">
</div>
<div class="row">
<div class="active-row">
<h3 class="label">Active:</h3>
#if(employee.active):
<a class="toggle"
hx-patch="/employees/#(id)/toggle-active"
hx-target="#employee_#(id)"
hx-swap="outerHTML"
>
<img class="toggle" src="/images/toggle-on.svg" alt="Active">
</a>
#else:
<a class="toggle"
hx-patch="/employees/#(id)/toggle-active"
hx-target="#employee_#(id)"
hx-swap="outerHTML"
>
<img class="toggle" src="/images/toggle-off.svg" alt="Active">
</a>
#endif
</div>
</div>
<div class="btn-row">
<button class="edit"
type="submit"