hhe/vapor-po
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: working on detail views.

Browse Source
This commit is contained in:
Michael Housh
2025-01-12 17:42:06 -05:00
parent 0e31d2c30c
commit 1ce369e156
27 changed files with 527 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
Resources/Views/employees/detail.leaf Normal file
View File

@@ -0,0 +1,63 @@
<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"
>
&times;
</button>
<form hx-put="/employees/#(employee.id)"
hx-target="#employee_#(employee.id)"
hx-swap="outerHTML"
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="btn-row">
<button class="edit"
type="submit"
hx-swap="outerHTML"
>
Update
</button>
<button class="danger">Delete</button>
</div>
</form>
#endif
</div>

1
Resources/Views/employees/index.leaf
View File

@@ -7,6 +7,7 @@
<h3>Employees are who purchase orders can be generated for.</h3>
<br>
</div>
#extend("employees/detail")
#extend("form-container"): #export("formContent"):
#extend("employees/form", form)
#endexport #endextend

43
Resources/Views/employees/table-row.leaf
View File

@@ -19,22 +19,33 @@
</a>
#endif
</td>
<td style="width: 100px;">
<a class="btn btn-delete"
href="javascript:void(0)"
hx-delete="/employees/#(id)"
hx-target="#employee-table"
hx-swap="outerHTML"
hx-confirm="Are you sure you want to delete this employee?"
>
#extend("img/trash-can")
</a>
<a class="btn btn-edit" hx-get="/employees/#(id)"
hx-target="#employee-form"
hx-on::after-request=" if(event.detail.successful) toggleContent('form')"
>
#extend("img/pencil")
</a>
<td style="width: 50px;">
<button hx-get="/employees/#(id)"
hx-target="#employee-detail"
hx-swap="outerHTML swap:0.5s"
hx-push-url="true"
class="btn btn-detail"
>
&rsaquo;
</button>
</td>
<!-- <td style="width: 100px;"> -->
<!-- <a class="btn btn-delete" -->
<!-- href="javascript:void(0)" -->
<!-- hx-delete="/employees/#(id)" -->
<!-- hx-target="#employee-table" -->
<!-- hx-swap="outerHTML" -->
<!-- hx-confirm="Are you sure you want to delete this employee?" -->
<!-- > -->
<!-- #extend("img/trash-can") -->
<!-- </a> -->
<!-- <a class="btn btn-edit" hx-get="/employees/#(id)" -->
<!-- hx-target="#employee-form" -->
<!-- hx-on::after-request=" if(event.detail.successful) toggleContent('form')" -->
<!-- > -->
<!-- #extend("img/pencil") -->
<!-- </a> -->
<!-- </td> -->
</tr>