Added button fragment and did the do.
This commit is contained in:
Yaro Kasear
parent
34f1c5a824
commit
9ca9aa86a1
4 changed files with 301 additions and 263 deletions
|
|
@ -1,14 +1,15 @@
|
|||
{% import "fragments/_icon_fragment.html" as icons %}
|
||||
|
||||
{% macro render_button(id, icon, style='primary', logic = None) %}
|
||||
<!-- Button Fragment -->
|
||||
<button type="submit" class="btn btn-{{ style }}" id="{{ id }}Button">{{ icons.render_icon(icon, 16) }}</button>
|
||||
{% if logic %}
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
document.addEventListener("DOMContentLoaded", (e) => {
|
||||
{{ id }}Button = document.getElementById("{{ id }}Button");
|
||||
|
||||
{{ id }}Button.addEventListener("click", async () =>{
|
||||
{{ logic }}
|
||||
{{ logic | safe }}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -3,22 +3,134 @@
|
|||
|
||||
{% block title %}{{ title }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{{ breadcrumbs.breadcrumb_header(
|
||||
{% block precontent %}
|
||||
{% set saveLogic %}
|
||||
e.preventDefault();
|
||||
|
||||
const payload = {
|
||||
timestamp: document.querySelector("input[name='timestamp']").value,
|
||||
condition: document.querySelector("select[name='condition']").value,
|
||||
type_id: parseInt(document.querySelector("select[name='type']").value),
|
||||
name: document.querySelector("input[name='name']").value || null,
|
||||
serial: document.querySelector("input[name='serial']").value || null,
|
||||
model: document.querySelector("input[name='model']").value || null,
|
||||
notes: document.querySelector("textarea[name='editornotes']").value || null,
|
||||
owner_id: parseInt(document.querySelector("select#userList").value) || null,
|
||||
brand_id: parseInt(document.querySelector("select[name='brand']").value) || null,
|
||||
location_id: parseInt(document.querySelector("select#room").value) || null,
|
||||
barcode: document.querySelector("input[name='barcode']").value || null,
|
||||
shared: document.querySelector("input[name='shared']").checked
|
||||
};
|
||||
|
||||
try {
|
||||
const id = document.querySelector("#inventoryId").value;
|
||||
const isEdit = id && id !== "None";
|
||||
|
||||
const endpoint = isEdit ? `/api/inventory/${id}` : "/api/inventory";
|
||||
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 ? "Inventory item updated!" : "Inventory item created!",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = `/inventory_item/${result.id}`;
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
renderToast({ message: `Error: ${err}`, type: "danger" });
|
||||
}
|
||||
{% endset %}
|
||||
{% set deleteLogic %}
|
||||
const id = document.querySelector("#inventoryId").value;
|
||||
|
||||
if (!id || id === "None") {
|
||||
renderToast({ message: "No item ID found to delete.", type: "danger" });
|
||||
return;
|
||||
}
|
||||
|
||||
if (!confirm("Are you sure you want to delete this inventory item? This action cannot be undone.")) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/inventory/${id}`, {
|
||||
method: "DELETE"
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (result.success) {
|
||||
localStorage.setItem("toastMessage", JSON.stringify({
|
||||
message: "Inventory item deleted.",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = "/inventory";
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
renderToast({ message: `Error: ${err}`, type: "danger" });
|
||||
}
|
||||
{% endset %}
|
||||
{% set buttonBar %}
|
||||
<div class="btn-group">
|
||||
{{ buttons.render_button(
|
||||
id='save',
|
||||
icon='floppy',
|
||||
logic=saveLogic
|
||||
) }}
|
||||
{% if item.id != None %}
|
||||
{{ buttons.render_button(
|
||||
id='delete',
|
||||
icon='trash',
|
||||
style='danger',
|
||||
logic=deleteLogic
|
||||
) }}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endset %}
|
||||
{{ toolbars.render_toolbar(
|
||||
id='inventory',
|
||||
left=breadcrumbs.breadcrumb_header(
|
||||
breadcrumbs=[
|
||||
{'label': "Inventory", 'url': url_for('main.list_inventory')}
|
||||
],
|
||||
title=title
|
||||
),
|
||||
right=buttonBar
|
||||
) }}
|
||||
{# { breadcrumbs.breadcrumb_header(
|
||||
breadcrumbs=[
|
||||
{'label': "Inventory", 'url': url_for('main.list_inventory')}
|
||||
],
|
||||
title=title,
|
||||
save_button=True,
|
||||
delete_button= item.id != None
|
||||
) }}
|
||||
) } #}
|
||||
|
||||
{% if item.condition in ["Removed", "Disposed"] %}
|
||||
<div class="alert alert-danger">
|
||||
This item is not available and cannot be edited.
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<input type="hidden" id="inventoryId" value="{{ item.id }}">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
|
@ -171,97 +283,3 @@
|
|||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
const saveButton = document.getElementById("saveButton");
|
||||
const deleteButton = document.getElementById("deleteButton");
|
||||
|
||||
if (saveButton) {
|
||||
saveButton.addEventListener("click", async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
const payload = {
|
||||
timestamp: document.querySelector("input[name='timestamp']").value,
|
||||
condition: document.querySelector("select[name='condition']").value,
|
||||
type_id: parseInt(document.querySelector("select[name='type']").value),
|
||||
name: document.querySelector("input[name='name']").value || null,
|
||||
serial: document.querySelector("input[name='serial']").value || null,
|
||||
model: document.querySelector("input[name='model']").value || null,
|
||||
notes: document.querySelector("textarea[name='editornotes']").value || null,
|
||||
owner_id: parseInt(document.querySelector("select#userList").value) || null,
|
||||
brand_id: parseInt(document.querySelector("select[name='brand']").value) || null,
|
||||
location_id: parseInt(document.querySelector("select#room").value) || null,
|
||||
barcode: document.querySelector("input[name='barcode']").value || null,
|
||||
shared: document.querySelector("input[name='shared']").checked
|
||||
};
|
||||
|
||||
try {
|
||||
const id = document.querySelector("#inventoryId").value;
|
||||
const isEdit = id && id !== "None";
|
||||
|
||||
const endpoint = isEdit ? `/api/inventory/${id}` : "/api/inventory";
|
||||
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 ? "Inventory item updated!" : "Inventory item created!",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = `/inventory_item/${result.id}`;
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
renderToast({ message: `Error: ${err}`, type: "danger" });
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (deleteButton) {
|
||||
deleteButton.addEventListener("click", async () => {
|
||||
const id = document.querySelector("#inventoryId").value;
|
||||
|
||||
if (!id || id === "None") {
|
||||
renderToast({ message: "No item ID found to delete.", type: "danger" });
|
||||
return;
|
||||
}
|
||||
|
||||
if (!confirm("Are you sure you want to delete this inventory item? This action cannot be undone.")) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/inventory/${id}`, {
|
||||
method: "DELETE"
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (result.success) {
|
||||
localStorage.setItem("toastMessage", JSON.stringify({
|
||||
message: "Inventory item deleted.",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = "/inventory";
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
renderToast({ message: `Error: ${err}`, type: "danger" });
|
||||
}
|
||||
});
|
||||
}
|
||||
{% endblock %}
|
||||
|
|
@ -3,20 +3,69 @@
|
|||
|
||||
{% block title %}{{ title }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
{% block precontent %}
|
||||
{% set saveLogic %}
|
||||
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
|
||||
};
|
||||
|
||||
{{ breadcrumbs.breadcrumb_header(
|
||||
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);
|
||||
}
|
||||
{% endset %}
|
||||
{{ toolbars.render_toolbar(
|
||||
id = 'newUser',
|
||||
left = breadcrumbs.breadcrumb_header(
|
||||
title=title,
|
||||
breadcrumbs=[
|
||||
{'label': 'Users', 'url': url_for('main.list_users')}
|
||||
],
|
||||
save_button = True
|
||||
]
|
||||
),
|
||||
right = buttons.render_button(
|
||||
id = 'save',
|
||||
icon = 'floppy',
|
||||
logic = saveLogic
|
||||
)
|
||||
) }}
|
||||
{% 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 %}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<input type="hidden" id="userId" value="{{ user.id }}">
|
||||
<div class="container">
|
||||
<form action="POST">
|
||||
|
|
@ -90,53 +139,3 @@
|
|||
</div>
|
||||
</div>
|
||||
{% 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 %}
|
||||
|
|
|
|||
|
|
@ -3,23 +3,139 @@
|
|||
|
||||
{% block title %}{{ title }}{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<nav>
|
||||
{{ breadcrumbs.breadcrumb_header(
|
||||
{% block precontent %}
|
||||
{% set saveLogic %}
|
||||
e.preventDefault();
|
||||
|
||||
const updateTextareas = Array.from(document.querySelectorAll("textarea[name^='editor']"));
|
||||
const updates = updateTextareas
|
||||
.map(el => {
|
||||
const content = el.value.trim();
|
||||
if (!content) return null;
|
||||
const id = el.dataset.noteId;
|
||||
return id ? { id, content } : { content };
|
||||
})
|
||||
.filter(u => u !== null);
|
||||
|
||||
const payload = {
|
||||
start_time: document.querySelector("input[name='start']").value,
|
||||
end_time: document.querySelector("input[name='end']").value,
|
||||
complete: document.querySelector("input[name='complete']").checked,
|
||||
analysis: document.querySelector("input[name='analysis']").checked,
|
||||
followup: document.querySelector("input[name='followup']").checked,
|
||||
contact_id: parseInt(document.querySelector("select[name='contact']").value) || null,
|
||||
work_item_id: parseInt(document.querySelector("select[name='item']").value) || null,
|
||||
updates: updates
|
||||
};
|
||||
|
||||
try {
|
||||
const id = document.querySelector("#logId").value;
|
||||
const isEdit = id && id !== "None";
|
||||
|
||||
const endpoint = isEdit ? `/api/worklog/${id}` : "/api/worklog";
|
||||
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 ? "Work Log entry updated!" : "Work Log entry created!",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = `/worklog/${result.id}`;
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err)
|
||||
renderToast({ message: `Error: ${err}`, type: "danger" });
|
||||
}
|
||||
{% endset %}
|
||||
{% set deleteLogic %}
|
||||
const id = document.querySelector("#logId").value;
|
||||
|
||||
if (!id || id === "None") {
|
||||
renderToast({ message: "No item ID found to delete.", type: "danger" });
|
||||
return;
|
||||
}
|
||||
|
||||
if (!confirm("Are you sure you want to delete this work log entry? This action cannot be undone.")) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/worklog/${id}`, {
|
||||
method: "DELETE"
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (result.success) {
|
||||
localStorage.setItem("toastMessage", JSON.stringify({
|
||||
message: "Work log entry deleted.",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = "/worklog";
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
renderToast({ message: `Error: ${err}`, type: "danger" });
|
||||
}
|
||||
{% endset %}
|
||||
{% set iconBar %}
|
||||
<div class="btn-group">
|
||||
{{ buttons.render_button(
|
||||
id='save',
|
||||
icon='floppy',
|
||||
logic=saveLogic
|
||||
) }}
|
||||
{% if log.id != None %}
|
||||
{{ buttons.render_button(
|
||||
id='delete',
|
||||
icon='trash',
|
||||
style='danger',
|
||||
logic=deleteLogic
|
||||
) }}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endset %}
|
||||
{{ toolbars.render_toolbar(
|
||||
id='newWorklog',
|
||||
left=breadcrumbs.breadcrumb_header(
|
||||
breadcrumbs=[
|
||||
{'label': 'Work Log', 'url': url_for('main.list_worklog')}
|
||||
],
|
||||
title=title
|
||||
),
|
||||
right=iconBar
|
||||
) }}
|
||||
{# { breadcrumbs.breadcrumb_header(
|
||||
breadcrumbs=[
|
||||
{'label': 'Work Log', 'url': url_for('main.list_worklog')}
|
||||
],
|
||||
title=title,
|
||||
save_button=True,
|
||||
delete_button=log.id != None
|
||||
) }}
|
||||
</nav>
|
||||
) } #}
|
||||
{% if log.complete %}
|
||||
<div class="alert alert-success">
|
||||
This work item is complete. You cannot make any further changes.
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<input type="hidden" id="logId" value="{{ log.id }}">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
|
@ -124,7 +240,6 @@
|
|||
{% endblock %}
|
||||
|
||||
{% block script %}
|
||||
const saveButton = document.getElementById("saveButton");
|
||||
const deleteButton = document.getElementById("deleteButton");
|
||||
const addUpdateButton = document.getElementById("addUpdateButton");
|
||||
|
||||
|
|
@ -143,99 +258,4 @@
|
|||
updatesContainer.appendChild(newEditor);
|
||||
});
|
||||
}
|
||||
|
||||
if (saveButton) {
|
||||
saveButton.addEventListener("click", async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
const updateTextareas = Array.from(document.querySelectorAll("textarea[name^='editor']"));
|
||||
const updates = updateTextareas
|
||||
.map(el => {
|
||||
const content = el.value.trim();
|
||||
if (!content) return null;
|
||||
const id = el.dataset.noteId;
|
||||
return id ? { id, content } : { content };
|
||||
})
|
||||
.filter(u => u !== null);
|
||||
|
||||
const payload = {
|
||||
start_time: document.querySelector("input[name='start']").value,
|
||||
end_time: document.querySelector("input[name='end']").value,
|
||||
complete: document.querySelector("input[name='complete']").checked,
|
||||
analysis: document.querySelector("input[name='analysis']").checked,
|
||||
followup: document.querySelector("input[name='followup']").checked,
|
||||
contact_id: parseInt(document.querySelector("select[name='contact']").value) || null,
|
||||
work_item_id: parseInt(document.querySelector("select[name='item']").value) || null,
|
||||
updates: updates
|
||||
};
|
||||
|
||||
try {
|
||||
const id = document.querySelector("#logId").value;
|
||||
const isEdit = id && id !== "None";
|
||||
|
||||
const endpoint = isEdit ? `/api/worklog/${id}` : "/api/worklog";
|
||||
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 ? "Work Log entry updated!" : "Work Log entry created!",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = `/worklog/${result.id}`;
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err)
|
||||
renderToast({ message: `Error: ${err}`, type: "danger" });
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (deleteButton) {
|
||||
deleteButton.addEventListener("click", async () => {
|
||||
const id = document.querySelector("#logId").value;
|
||||
|
||||
if (!id || id === "None") {
|
||||
renderToast({ message: "No item ID found to delete.", type: "danger" });
|
||||
return;
|
||||
}
|
||||
|
||||
if (!confirm("Are you sure you want to delete this work log entry? This action cannot be undone.")) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/worklog/${id}`, {
|
||||
method: "DELETE"
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (result.success) {
|
||||
localStorage.setItem("toastMessage", JSON.stringify({
|
||||
message: "Work log entry deleted.",
|
||||
type: "success"
|
||||
}));
|
||||
|
||||
window.location.href = "/worklog";
|
||||
} else {
|
||||
renderToast({ message: `Error: ${result.error}`, type: "danger" });
|
||||
}
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
renderToast({ message: `Error: ${err}`, type: "danger" });
|
||||
}
|
||||
});
|
||||
}
|
||||
{% endblock %}
|
||||
Loading…
Add table
Add a link
Reference in a new issue