Add user creation and update functionality; refactor user template and helpers
This commit is contained in:
parent
f4369348c5
commit
26e55b9a3e
6 changed files with 134 additions and 24 deletions
|
@ -7,26 +7,28 @@
|
|||
|
||||
|
||||
{{ breadcrumbs.breadcrumb_header(
|
||||
title=title,
|
||||
breadcrumbs=[
|
||||
{'label': 'Users', 'url': url_for('main.list_users')}
|
||||
]
|
||||
title=title,
|
||||
breadcrumbs=[
|
||||
{'label': 'Users', 'url': url_for('main.list_users')}
|
||||
],
|
||||
save_button = True
|
||||
) }}
|
||||
{% if not user.active %}
|
||||
<div class="alert alert-danger">This user is inactive. You will not be able to make any changes to this record.</div>
|
||||
{% endif %}
|
||||
|
||||
<input type="hidden" id="userId" value="{{ user.id }}">
|
||||
<div class="container">
|
||||
<form action="POST">
|
||||
<div class="row">
|
||||
<div class="col-6">
|
||||
<label for="lastName" class="form-label">Last Name</label>
|
||||
<input type="text" class="form-control" id="lastName" placeholder="Doe" value="{{ user.last_name }}"{% if not user.active %} disabled readonly{% endif %}>
|
||||
<input type="text" class="form-control" id="lastName" name="lastName" placeholder="Doe" value="{{ user.last_name if user.last_name else '' }}"{% if not user.active %} disabled readonly{% endif %}>
|
||||
</div>
|
||||
|
||||
<div class="col-6">
|
||||
<label for="firstName" class="form-label">First Name</label>
|
||||
<input type="text" class="form-control" id="firstName" placeholder="John" value="{{ user.first_name }}"{% if not user.active %} disabled readonly{% endif %}>
|
||||
<input type="text" class="form-control" id="firstName" name="firstName" placeholder="John" value="{{ user.first_name if user.first_name else '' }}"{% if not user.active %} disabled readonly{% endif %}>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -61,11 +63,11 @@ breadcrumbs=[
|
|||
</div>
|
||||
<div class="row mt-4">
|
||||
<div class="col-6">
|
||||
<input type="checkbox" class="form-check-input" id="activeCheck"{% if user.active %} checked{% endif %}>
|
||||
<input type="checkbox" class="form-check-input" id="activeCheck" name="activeCheck"{% if user.active %} checked{% endif %}>
|
||||
<label for="activeCheck" class="form-check-label">Active</label>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<input type="checkbox" class="form-check-input" id="staffCheck"{% if user.staff %} checked{% endif %}{% if not user.active %} disabled readonly{% endif %}>
|
||||
<input type="checkbox" class="form-check-input" id="staffCheck" name="staffCheck"{% if user.staff %} checked{% endif %}{% if not user.active %} disabled readonly{% endif %}>
|
||||
<label for="staffCheck" class="form-check-label">Staff</label>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -87,4 +89,54 @@ breadcrumbs=[
|
|||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
const saveButton = document.getElementById("saveButton");
|
||||
const deleteButton = document.getElementById("deleteButton");
|
||||
|
||||
if (saveButton) {
|
||||
saveButton.addEventListener("click", async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
const payload = {
|
||||
staff: document.querySelector("input[name='staffCheck']").checked,
|
||||
active: document.querySelector("input[name='activeCheck']").checked,
|
||||
last_name: document.querySelector("input[name='lastName']").value,
|
||||
first_name: document.querySelector("input[name='firstName']").value,
|
||||
supervisor_id: parseInt(document.querySelector("select[name='supervisor']").value) || null,
|
||||
location_id: parseInt(document.querySelector("select[name='location']").value) || null
|
||||
};
|
||||
|
||||
try {
|
||||
const id = document.querySelector("#userId").value;
|
||||
const isEdit = id && id !== "None";
|
||||
|
||||
const endpoint = isEdit ? `/api/user/${id}` : "/api/user";
|
||||
const method = isEdit ? "PUT" : "POST";
|
||||
|
||||
const response = await fetch(endpoint, {
|
||||
method,
|
||||
headers: {
|
||||
"Content-Type": "application/json"
|
||||
},
|
||||
body: JSON.stringify(payload)
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
localStorage.setItem("toastMessage", JSON.stringify({
|
||||
message: isEdit ? "User updated!" : "User created!",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = `/user/${result.id}`;
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
}
|
||||
});
|
||||
}
|
||||
{% endblock %}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue