ChrisChrome/uhppoted-db-web
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Test

Browse source
This commit is contained in:
Christopher Cookman 2025-09-01 00:33:31 -06:00
parent 8ae3202bc5
commit f477579b27
2 changed files with 121 additions and 70 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

68
views/acl-add.ejs Normal file
View file

@ -0,0 +1,68 @@
<form id="acl-add-form" method="post" action="/acl" style="max-width: 500px; margin: 2em auto; padding: 2em; border: 1px solid #ccc; border-radius: 8px; background: #fafafa; box-shadow: 0 2px 8px rgba(0,0,0,0.05);">
<h2 style="text-align:center; margin-bottom:1em;">Add ACL Entry</h2>
<div style="margin-bottom:1em;">
<label for="Name" style="display:block; margin-bottom:0.5em;">Name:</label>
<input type="text" id="Name" name="Name" required style="width:100%; padding:0.5em; border-radius:4px; border:1px solid #bbb;">
</div>
<div style="margin-bottom:1em;">
<label for="CardNumber" style="display:block; margin-bottom:0.5em;">Card Number:</label>
<input type="text" id="CardNumber" name="CardNumber" required style="width:100%; padding:0.5em; border-radius:4px; border:1px solid #bbb;">
</div>
<div style="margin-bottom:1em;">
<label for="PIN" style="display:block; margin-bottom:0.5em;">PIN:</label>
<input type="text" id="PIN" name="PIN" style="width:100%; padding:0.5em; border-radius:4px; border:1px solid #bbb;">
</div>
<div style="margin-bottom:1em;">
<label for="StartDate" style="display:block; margin-bottom:0.5em;">Start Date:</label>
<input type="date" id="StartDate" name="StartDate" style="width:100%; padding:0.5em; border-radius:4px; border:1px solid #bbb;">
</div>
<div style="margin-bottom:1em;">
<label for="EndDate" style="display:block; margin-bottom:0.5em;">End Date:</label>
<input type="date" id="EndDate" name="EndDate" style="width:100%; padding:0.5em; border-radius:4px; border:1px solid #bbb;">
</div>
<fieldset style="margin-bottom:1em; border-radius:4px; border:1px solid #bbb; padding:1em;">
<legend style="font-weight:bold;">Doors</legend>
<% if (typeof doorsList !== 'undefined') { %>
<% Object.keys(doorsList).forEach(function(door) { %>
<div style="margin-bottom:0.5em;">
<label style="cursor:pointer;">
<input type="checkbox" name="doors[<%= door %>]" value="1">
<%= door %>
</label>
</div>
<% }) %>
<% } else { %>
<div>No doors configured.</div>
<% } %>
</fieldset>
<button type="submit" style="width:100%; padding:0.75em; background:#1976d2; color:#fff; border:none; border-radius:4px; font-size:1em; cursor:pointer;">Add Entry</button>
</form>
<script>
document.getElementById('acl-add-form').addEventListener('submit', function(e) {
e.preventDefault();
const form = e.target;
const formData = new FormData(form);
const data = {
Name: formData.get('Name'),
CardNumber: formData.get('CardNumber'),
PIN: formData.get('PIN'),
StartDate: formData.get('StartDate'),
EndDate: formData.get('EndDate'),
doors: {}
};
<% if (typeof doorsList !== 'undefined') { Object.keys(doorsList).forEach(function(door) { %>
data.doors['<%= door %>'] = formData.get('doors[<%= door %>]') ? 1 : 0;
<% }) } %>
fetch(form.action, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
}).then(res => {
if (res.ok) window.location.href = '/acl';
else alert('Failed to add ACL entry');
}).catch(err => {
alert('Error: ' + err.message);
});
});
</script>

123
views/acl-edit.ejs
View file

@ -1,70 +1,53 @@
<% <style>
// Assume aclEntry is passed to this view with all fields form#acl-edit-form {
// doorsList is an object of door names to grant access, e.g. { "Door1": 1, "Door2": 0, ... } max-width: 500px;
%> margin: 2em auto;
<form id="acl-edit-form" method="patch" action="/acl/<%= aclEntry.CardNumber %>"> padding: 2em;
<div> border: 1px solid #ccc;
<label for="Name">Name:</label> border-radius: 8px;
<input type="text" id="Name" name="Name" value="<%= aclEntry.Name %>" required> background: #fafafa;
</div> box-shadow: 0 2px 8px rgba(0,0,0,0.05);
<div> }
<label for="CardNumber">Card Number:</label> form#acl-edit-form div {
<input type="text" id="CardNumber" name="CardNumber" value="<%= aclEntry.CardNumber %>" readonly> margin-bottom: 1em;
</div> }
<div> form#acl-edit-form label {
<label for="PIN">PIN:</label> display: block;
<input type="text" id="PIN" name="PIN" value="<%= aclEntry.PIN %>"> font-weight: 500;
</div> margin-bottom: 0.3em;
<div> }
<label for="StartDate">Start Date:</label> form#acl-edit-form input[type="text"],
<input type="date" id="StartDate" name="StartDate" value="<%= new Date(aclEntry.StartDate).toISOString().slice(0,10) %>"> form#acl-edit-form input[type="date"] {
</div> width: 100%;
<div> padding: 0.5em;
<label for="EndDate">End Date:</label> border: 1px solid #bbb;
<input type="date" id="EndDate" name="EndDate" value="<%= new Date(aclEntry.EndDate).toISOString().slice(0,10) %>"> border-radius: 4px;
</div> box-sizing: border-box;
<fieldset> }
<legend>Doors</legend> form#acl-edit-form fieldset {
<% Object.keys(doorsList).forEach(function(door) { %> border: 1px solid #ddd;
<div> border-radius: 4px;
<label> padding: 1em;
<input type="checkbox" name="doors[<%= door %>]" value="1" margin-bottom: 1em;
<% if (doorsList[door] && doorsList[door] == 1) { %> checked <% } %> > background: #f5f5f5;
<%= door %> }
<% doorsList[door] %> form#acl-edit-form legend {
</label> font-weight: 600;
</div> }
<% }) %> form#acl-edit-form button[type="submit"] {
</fieldset> background: #1976d2;
<button type="submit">Save</button> color: #fff;
</form> border: none;
padding: 0.7em 1.5em;
<script> border-radius: 4px;
document.getElementById('acl-edit-form').addEventListener('submit', function(e) { font-size: 1em;
e.preventDefault(); cursor: pointer;
const form = e.target; transition: background 0.2s;
const formData = new FormData(form); }
const data = { form#acl-edit-form button[type="submit"]:hover {
Name: formData.get('Name'), background: #1565c0;
CardNumber: formData.get('CardNumber'), }
PIN: formData.get('PIN'), form#acl-edit-form input[type="checkbox"] {
StartDate: formData.get('StartDate'), margin-right: 0.5em;
EndDate: formData.get('EndDate'), }
doors: {} </style>
};
<% Object.keys(doorsList).forEach(function(door) { %>
data.doors['<%= door %>'] = formData.get('doors[<%= door %>]') ? 1 : 0;
<% }) %>
fetch(form.action, {
method: 'PATCH',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
}).then(res => {
console.log(res.status, res.statusText);
if (res.ok) window.location.href = '/acl';
else alert('Failed to update ACL entry');
}).catch(err => {
alert('Error: ' + err.message);
});
});
</script>