yaro/inventory
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Compare commits

base: yaro:1051dc84925233a1e64dd09e68c65fbeb4099b71
Branches Tags
yaro:main
...
compare: yaro:28f541fcb64c58ea88290d5702235f43a8341b23
Branches Tags
yaro:main

2 commits
1051dc8492 ... 28f541fcb6

Author SHA1 Message Date
Yaro Kasear
28f541fcb6 Make the layout for inventory more pleasant. 2025-07-14 09:59:19 -05:00
Yaro Kasear
c2d75ee725 Fix picture disappearing if unavailable item. 2025-07-14 09:25:27 -05:00
1 changed files with 164 additions and 148 deletions
Download patch file Download diff file Expand all files Collapse all files

312
inventory/templates/inventory.html
View file

@ -4,154 +4,170 @@
{% block title %}{{ title }}{% endblock %} {% block title %}{{ title }}{% endblock %}
{% block content %} {% block content %}
{{ breadcrumbs.breadcrumb_header( {{ breadcrumbs.breadcrumb_header(
breadcrumbs=[ breadcrumbs=[
{'label': "Inventory", 'url': url_for('main.list_inventory')} {'label': "Inventory", 'url': url_for('main.list_inventory')}
], ],
title=title, title=title,
save_button=True, save_button=True,
delete_button= item.id != None delete_button= item.id != None
) }} ) }}
{% if item.condition in ["Removed", "Disposed"] %} {% if item.condition in ["Removed", "Disposed"] %}
<div class="alert alert-danger"> <div class="alert alert-danger">
This item is not available and cannot be edited. This item is not available and cannot be edited.
</div> </div>
{% endif %} {% endif %}
<input type="hidden" id="inventoryId" value="{{ item.id }}"> <input type="hidden" id="inventoryId" value="{{ item.id }}">
<div class="container"> <div class="container">
<div class="row align-items-center"> <div class="row">
<div class="col"> <div class="col">
<label for="timestamp" class="form-label">Date Entered</label> <div class="row align-items-center">
<input type="date" class="form-control-plaintext" name="timestamp" value="{{ item.timestamp.date().isoformat() }}" readonly> <div class="col">
</div> <label for="timestamp" class="form-label">Date Entered</label>
<div class="col"> <input type="date" class="form-control-plaintext" name="timestamp"
<label for="identifier" class="form-label">Identifier</label> value="{{ item.timestamp.date().isoformat() }}" readonly>
<input type="text" class="form-control-plaintext" value="{{ item.identifier }}" readonly> </div>
</div> <div class="col">
{% if not item.condition in ["Removed", "Disposed"] %} <label for="identifier" class="form-label">Identifier</label>
<div class="col"> <input type="text" class="form-control-plaintext" value="{{ item.identifier }}" readonly>
{{ images.render_image(item.id, item.image, enabled = item.condition not in ["Removed", "Disposed"]) }} </div>
</div> </div>
{% endif %} <div class="row">
</div> <div class="col-4">
<div class="row"> <label for="name" class="form-label">Inventory #</label>
<div class="col-4"> <input type="text" class="form-control" name="name" placeholder="-" value="{{ item.name or '' }}" {%
<label for="name" class="form-label">Inventory #</label> if item.condition in ["Removed", "Disposed" ] %} disabled{% endif %}>
<input type="text" class="form-control" name="name" placeholder="-" </div>
value="{{ item.name or '' }}"{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> <div class="col-4">
</div> <label for="serial" class="form-label">Serial #</label>
<div class="col-4"> <input type="text" class="form-control" name="serial" placeholder="-"
<label for="serial" class="form-label">Serial #</label> value="{{ item.serial if item.serial else '' }}" {% if item.condition in ["Removed", "Disposed"
<input type="text" class="form-control" name="serial" placeholder="-" ] %} disabled{% endif %}>
value="{{ item.serial if item.serial else '' }}"{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> </div>
</div> <div class="col-4">
<div class="col-4"> <label for="barcode" class="form-label">Bar Code #</label>
<label for="barcode" class="form-label">Bar Code #</label> <input type="text" class="form-control" name="barcode" placeholder="-"
<input type="text" class="form-control" name="barcode" placeholder="-" value="{{ item.barcode if item.barcode else '' }}" {% if item.condition in
value="{{ item.barcode if item.barcode else '' }}"{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> ["Removed", "Disposed" ] %} disabled{% endif %}>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-4"> <div class="col-4">
<label for="brand" class="form-label">Brand</label> <label for="brand" class="form-label">Brand</label>
<select class="form-select" id="brand" name="brand"{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> <select class="form-select" id="brand" name="brand" {% if item.condition in ["Removed", "Disposed" ]
<option>-</option> %} disabled{% endif %}>
{% for brand in brands %} <option>-</option>
<option value="{{ brand.id }}" {% if brand.id==item.brand_id %} selected{% endif %}>{{ brand.name }} {% for brand in brands %}
</option> <option value="{{ brand.id }}" {% if brand.id==item.brand_id %} selected{% endif %}>{{
{% endfor %} brand.name }}
</select> </option>
</div> {% endfor %}
<div class="col-4"> </select>
<label for="model" class="form-label">Model</label> </div>
<input type="text" class="form-control" name="model" placeholder="-" value="{{ item.model if item.model else '' }}"{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> <div class="col-4">
</div> <label for="model" class="form-label">Model</label>
<div class="col-4"> <input type="text" class="form-control" name="model" placeholder="-"
<label for="type" class="form-label">Category</label> value="{{ item.model if item.model else '' }}" {% if item.condition in ["Removed", "Disposed" ]
<select name="type" id="type" class="form-select"{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> %} disabled{% endif %}>
<option>-</option> </div>
{% for t in types %} <div class="col-4">
<option value="{{ t.id }}" {% if t.id==item.type_id %} selected{% endif %}>{{ t.description }} <label for="type" class="form-label">Category</label>
</option> <select name="type" id="type" class="form-select" {% if item.condition in ["Removed", "Disposed" ]
{% endfor %} %} disabled{% endif %}>
</select> <option>-</option>
</div> {% for t in types %}
</div> <option value="{{ t.id }}" {% if t.id==item.type_id %} selected{% endif %}>{{ t.description }}
<div class="row"> </option>
<div class="col-4"> {% endfor %}
<label for="owner" class="form-label"> </select>
Contact </div>
{% if item.owner %} </div>
{{ links.entry_link('user', item.owner_id) }} <div class="row">
{% endif %} <div class="col-4">
</label> <label for="owner" class="form-label">
<select class="form-select" id="userList"{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> Contact
<option>-</option> {% if item.owner %}
{% for user in users %} {{ links.entry_link('user', item.owner_id) }}
<option value="{{ user.id }}" {% if user.id==item.owner_id %} selected{% endif %}>{{ user.full_name {% endif %}
}}</option> </label>
{% endfor %} <select class="form-select" id="userList" {% if item.condition in ["Removed", "Disposed" ] %}
</select> disabled{% endif %}>
</div> <option>-</option>
<div class="col-4"> {% for user in users %}
<label for="location" class="form-label">Location</label> <option value="{{ user.id }}" {% if user.id==item.owner_id %} selected{% endif %}>{{
<select class="form-select" id="room"{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> user.full_name
<option>-</option> }}</option>
{% for room in rooms %} {% endfor %}
<option value="{{ room.id }}" {% if room.id==item.location_id %} selected{% endif %}>{{ </select>
room.full_name }}</option> </div>
{% endfor %} <div class="col-4">
</select> <label for="location" class="form-label">Location</label>
</div> <select class="form-select" id="room" {% if item.condition in ["Removed", "Disposed" ] %} disabled{%
<div class="col-2"> endif %}>
<label for="condition" class="form-label">Condition</label> <option>-</option>
<select name="condition" id="condition" class="form-select"> {% for room in rooms %}
<option>-</option> <option value="{{ room.id }}" {% if room.id==item.location_id %} selected{% endif %}>{{
{% for condition in ["Working", "Deployed", "Partially Inoperable", "Inoperable", "Unverified", room.full_name }}</option>
"Removed", "Disposed"] %} {% endfor %}
<option value="{{ condition }}" {% if item.condition==condition %} selected{% endif %}>{{ condition }} </select>
</option> </div>
{% endfor %} <div class="col-2">
</select> <label for="condition" class="form-label">Condition</label>
</div> <select name="condition" id="condition" class="form-select">
<div class="col-2 d-flex align-items-center justify-content-center" style="margin-top: 1.9rem;"> <option>-</option>
<div class="form-check mb-0"> {% for condition in ["Working", "Deployed", "Partially Inoperable", "Inoperable", "Unverified",
<input type="checkbox" class="form-check-input" id="shared" name="shared" {% if item.shared %}checked{% "Removed", "Disposed"] %}
endif %}{% if item.condition in ["Removed", "Disposed"] %} disabled{% endif %}> <option value="{{ condition }}" {% if item.condition==condition %} selected{% endif %}>{{
<label for="shared" class="form-check-label">Shared?</label> condition }}
</option>
{% endfor %}
</select>
</div>
<div class="col-2 d-flex align-items-center justify-content-center" style="margin-top: 1.9rem;">
<div class="form-check mb-0">
<input type="checkbox" class="form-check-input" id="shared" name="shared" {% if item.shared
%}checked{% endif %}{% if item.condition in ["Removed", "Disposed" ] %} disabled{% endif %}>
<label for="shared" class="form-check-label">Shared?</label>
</div>
</div>
</div>
</div> </div>
{% if item.image or item.condition not in ["Removed", "Disposed"] %}
<div class="col">
{{ images.render_image(item.id, item.image, enabled = item.condition not in ["Removed", "Disposed"]) }}
</div>
{% endif %}
</div>
<div class="row">
<div class="col p-3">
{{ editor.render_editor(
id = "notes",
title = "Notes & Comments",
mode = 'view' if item.id else 'edit',
content = item.notes if item.notes else '',
enabled = item.condition not in ["Removed", "Disposed"]
) }}
</div>
{% if worklog %}
<div class="col">
{{ tables.render_table(headers=worklog_headers, rows=worklog_rows, id='worklog',
entry_route='worklog_entry', title='Work Log') }}
</div>
{% endif %}
</div> </div>
</div> </div>
<div class="row">
<div class="col p-3">
{{ editor.render_editor(
id = "notes",
title = "Notes & Comments",
mode = 'view' if item.id else 'edit',
content = item.notes if item.notes else '',
enabled = item.condition not in ["Removed", "Disposed"]
) }}
</div>
{% if worklog %}
<div class="col">
{{ tables.render_table(headers=worklog_headers, rows=worklog_rows, id='worklog',
entry_route='worklog_entry', title='Work Log') }}
</div>
{% endif %}
</div>
</div>
{% endblock %} {% endblock %}
{% block script %} {% block script %}
const saveButton = document.getElementById("saveButton"); const saveButton = document.getElementById("saveButton");
const deleteButton = document.getElementById("deleteButton"); const deleteButton = document.getElementById("deleteButton");
if (saveButton) { if (saveButton) {
saveButton.addEventListener("click", async (e) => { saveButton.addEventListener("click", async (e) => {
e.preventDefault(); e.preventDefault();
const payload = { const payload = {
timestamp: document.querySelector("input[name='timestamp']").value, timestamp: document.querySelector("input[name='timestamp']").value,
condition: document.querySelector("select[name='condition']").value, condition: document.querySelector("select[name='condition']").value,
@ -166,14 +182,14 @@
barcode: document.querySelector("input[name='barcode']").value || null, barcode: document.querySelector("input[name='barcode']").value || null,
shared: document.querySelector("input[name='shared']").checked shared: document.querySelector("input[name='shared']").checked
}; };
try { try {
const id = document.querySelector("#inventoryId").value; const id = document.querySelector("#inventoryId").value;
const isEdit = id && id !== "None"; const isEdit = id && id !== "None";
const endpoint = isEdit ? `/api/inventory/${id}` : "/api/inventory"; const endpoint = isEdit ? `/api/inventory/${id}` : "/api/inventory";
const method = isEdit ? "PUT" : "POST"; const method = isEdit ? "PUT" : "POST";
const response = await fetch(endpoint, { const response = await fetch(endpoint, {
method, method,
headers: { headers: {
@ -181,14 +197,14 @@
}, },
body: JSON.stringify(payload) body: JSON.stringify(payload)
}); });
const result = await response.json(); const result = await response.json();
if (result.success) { if (result.success) {
localStorage.setItem("toastMessage", JSON.stringify({ localStorage.setItem("toastMessage", JSON.stringify({
message: isEdit ? "Inventory item updated!" : "Inventory item created!", message: isEdit ? "Inventory item updated!" : "Inventory item created!",
type: "success" type: "success"
})); }));
window.location.href = `/inventory_item/${result.id}`; window.location.href = `/inventory_item/${result.id}`;
} else { } else {
renderToast({ message: `Error: ${result.error}`, type: "danger" }); renderToast({ message: `Error: ${result.error}`, type: "danger" });
@ -199,33 +215,33 @@
} }
}); });
} }
if (deleteButton) { if (deleteButton) {
deleteButton.addEventListener("click", async () => { deleteButton.addEventListener("click", async () => {
const id = document.querySelector("#inventoryId").value; const id = document.querySelector("#inventoryId").value;
if (!id || id === "None") { if (!id || id === "None") {
renderToast({ message: "No item ID found to delete.", type: "danger"} ); renderToast({ message: "No item ID found to delete.", type: "danger" });
return; return;
} }
if (!confirm("Are you sure you want to delete this inventory item? This action cannot be undone.")) { if (!confirm("Are you sure you want to delete this inventory item? This action cannot be undone.")) {
return; return;
} }
try { try {
const response = await fetch(`/api/inventory/${id}`, { const response = await fetch(`/api/inventory/${id}`, {
method: "DELETE" method: "DELETE"
}); });
const result = await response.json(); const result = await response.json();
if (result.success) { if (result.success) {
localStorage.setItem("toastMessage", JSON.stringify({ localStorage.setItem("toastMessage", JSON.stringify({
message: "Inventory item deleted.", message: "Inventory item deleted.",
type: "success" type: "success"
})); }));
window.location.href = "/inventory"; window.location.href = "/inventory";
} else { } else {
renderToast({ message: `Error: ${result.error}`, type: "danger" }); renderToast({ message: `Error: ${result.error}`, type: "danger" });