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

The experiment with floating labels is a success!

Browse source
This commit is contained in:
Yaro Kasear 2025-11-12 09:09:57 -06:00
parent d0551d52a1
commit c3ad0fba84
5 changed files with 49 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

36
inventory/routes/entry.py
View file

@ -33,27 +33,27 @@ def _fields_for_model(model: str):
"attrs": {"class": "display-6 mb-3"}, "wrap": {"class": "col"}},
{"name": "buttons", "label": "", "row": "label", "type": "template", "template": "entry_buttons.html",
"wrap": {"class": "col-auto text-end me-2"}, "attrs": {"data-model": model}},
{"name": "name", "row": "names", "label": "Name", "wrap": {"class": "col-3"},
"attrs": {"class": "form-control"}, "label_attrs": {"class": "form-label"}},
{"name": "serial", "row": "names", "label": "Serial #", "wrap": {"class": "col"},
"attrs": {"class": "form-control"}, "label_attrs": {"class": "form-label"}},
{"name": "barcode", "row": "names", "label": "Barcode #", "wrap": {"class": "col"},
"attrs": {"class": "form-control"}, "label_attrs": {"class": "form-label"}},
{"name": "brand", "label_spec": "{name}", "row": "device", "wrap": {"class": "col"},
"attrs": {"class": "form-control"}, "label": "Brand", "label_attrs": {"class": "form-label"}},
{"name": "model", "row": "device", "wrap": {"class": "col"},
"attrs": {"class": "form-control"}, "label": "Model #", "label_attrs": {"class": "form-label"}},
{"name": "device_type", "label_spec": "{description}", "row": "device", "wrap": {"class": "col"},
"attrs": {"class": "form-control"}, "label": "Device Type", "label_attrs": {"class": "form-label"}},
{"name": "owner", "row": "status", "label": "Contact", "wrap": {"class": "col"},
"attrs": {"class": "form-control"}, "label_attrs": {"class": "form-label"},
{"name": "name", "row": "names", "label": "Name", "wrap": {"class": "col form-floating"},
"attrs": {"class": "form-control", "placeholder": "Device Name"}, "label_attrs": {"class": "ms-2"}},
{"name": "serial", "row": "names", "label": "Serial #", "wrap": {"class": "col form-floating"},
"attrs": {"class": "form-control", "placeholder": "Serial Number"}, "label_attrs": {"class": "ms-2"}},
{"name": "barcode", "row": "names", "label": "Barcode #", "wrap": {"class": "col form-floating"},
"attrs": {"class": "form-control", "placeholder": "Bar Code"}, "label_attrs": {"class": "ms-2"}},
{"name": "brand", "label_spec": "{name}", "row": "device", "wrap": {"class": "col form-floating"},
"attrs": {"class": "form-control"}, "label": "Brand", "label_attrs": {"class": "ms-2"}},
{"name": "model", "row": "device", "wrap": {"class": "col form-floating"},
"attrs": {"class": "form-control", "placeholder": "Model Number"}, "label": "Model #", "label_attrs": {"class": "ms-2"}},
{"name": "device_type", "label_spec": "{description}", "row": "device", "wrap": {"class": "col form-floating"},
"attrs": {"class": "form-control"}, "label": "Device Type", "label_attrs": {"class": "ms-2"}},
{"name": "owner", "row": "status", "label": "Contact", "wrap": {"class": "col form-floating"},
"attrs": {"class": "form-control"}, "label_attrs": {"class": "ms-2 link-label"},
"label_spec": "{label}", "link": {"endpoint": "entry.entry", "params": {"model": "user", "id": "{owner.id}"}},
"options_params": {"active__eq": True}},
{"name": "location", "row": "status", "label": "Location", "wrap": {"class": "col"},
"attrs": {"class": "form-control"}, "label_attrs": {"class": "form-label"},
{"name": "location", "row": "status", "label": "Location", "wrap": {"class": "col form-floating"},
"attrs": {"class": "form-control"}, "label_attrs": {"class": "ms-2"},
"label_spec": "{name} - {room_function.description}"},
{"name": "condition", "label": "Condition", "row": "status", "wrap": {"class": "col"},
"label_attrs": {"class": "form-label"}, "label_spec": "{description}"},
{"name": "condition", "label": "Condition", "row": "status", "wrap": {"class": "col form-floating"},
"label_attrs": {"class": "ms-2"}, "label_spec": "{description}"},
{"name": "image", "label": "", "row": "image", "type": "template", "label_spec": "{filename}",
"template": "image_display.html", "attrs": {"class": "img-fluid img-thumbnail h-auto"},
"wrap": {"class": "h-100 w-100"}},

8
inventory/static/css/components/dropdown.css
View file

@ -2,3 +2,11 @@
border-color: rgb(222, 226, 230) !important;
overflow-y: auto;
}
.link-label {
pointer-events: none;
}
.link-label a {
pointer-events: auto;
}

2
inventory/static/js/components/dropdown.js
View file

@ -21,7 +21,7 @@ DropDown.utilities = {
const inp = document.getElementById(id);
btn.dataset.value = value;
btn.textContent = txt;
btn.value = txt;
inp.value = value;
},

30
inventory/templates/crudkit/field.html
View file

@ -1,16 +1,4 @@
<!-- FIELD: {{ field_name }} ({{ field_type }}) -->
{% if field_type != 'hidden' and field_label %}
<label for="{{ field_name }}" {% if label_attrs %}{% for k,v in label_attrs.items() %} {{k}}{% if v is not sameas true
%}="{{ v }}" {% endif %} {% endfor %}{% endif %}>
{% if link_href %}
<a href="{{ link_href }}" class="link-success link-underline link-underline-opacity-0 fw-semibold">
{% endif %}
{{ field_label }}
{% if link_href %}
</a>
{% endif %}
</label>
{% endif %}
{% if field_type == 'select' %}
{#
@ -47,8 +35,10 @@
{% else %}
{% set sel_label = "-- Select --" %}
{% endif %}
<button type="button" class="btn btn-outline-dark d-block w-100 text-start dropdown-toggle inventory-dropdown"
id="{{ field_name }}-button" data-bs-toggle="dropdown" data-value="{{ value }}">{{ sel_label }}</button>
<!-- button type="button" class="btn btn-outline-dark d-block w-100 text-start dropdown-toggle inventory-dropdown"
id="{{ field_name }}-button" data-bs-toggle="dropdown" data-value="{{ value }}">{{ sel_label }}</button -->
<input type="button" class="form-control btn btn-outline-dark d-block w-100 text-start dropdown-toggle inventory-dropdown"
id="{{ field_name }}-button" data-bs-toggle="dropdown" data-value="{{ value }}" value="{{ sel_label }}">
<div class="dropdown-menu pt-0" id="{{ field_name }}-dropdown">
<input type="text" class="form-control mt-0 border-top-0 border-start-0 border-end-0 rounded-bottom-0"
id="{{ field_name }}-filter" placeholder="Filter..." oninput="DropDown.utilities.filterList('{{ field_name }}')">
@ -101,3 +91,15 @@
{% if help %}
<div class="form-text">{{ help }}</div>
{% endif %}
{% if field_type != 'hidden' and field_label %}
<label for="{{ field_name }}" {% if label_attrs %}{% for k,v in label_attrs.items() %} {{k}}{% if v is not sameas true
%}="{{ v }}" {% endif %} {% endfor %}{% endif %}>
{% if link_href %}
<a href="{{ link_href }}" class="link-success link-underline link-underline-opacity-0 fw-semibold">
{% endif %}
{{ field_label }}
{% if link_href %}
</a>
{% endif %}
</label>
{% endif %}

10
inventory/templates/user_worklogs.html
View file

@ -3,13 +3,13 @@
<label class="form-label mt-2">Work Logs</label>
{% set wl = field['template_ctx']['values']['work_logs'] %}
{% set check %}
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check text-success" viewBox="0 0 16 16">
<path d="M10.97 4.97a.75.75 0 0 1 1.07 1.05l-3.99 4.99a.75.75 0 0 1-1.08.02L4.324 8.384a.75.75 0 1 1 1.06-1.06l2.094 2.093 3.473-4.425z"/>
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-check-lg text-success" viewBox="0 0 16 16">
<path d="M12.736 3.97a.733.733 0 0 1 1.047 0c.286.289.29.756.01 1.05L7.88 12.01a.733.733 0 0 1-1.065.02L3.217 8.384a.757.757 0 0 1 0-1.06.733.733 0 0 1 1.047 0l3.052 3.093 5.4-6.425z"/>
</svg>
{% endset %}
{% set x %}
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x text-danger" viewBox="0 0 16 16">
<path d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708"/>
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-x-lg text-danger" viewBox="0 0 16 16">
<path d="M2.146 2.854a.5.5 0 1 1 .708-.708L8 7.293l5.146-5.147a.5.5 0 0 1 .708.708L8.707 8l5.147 5.146a.5.5 0 0 1-.708.708L8 8.707l-5.146 5.147a.5.5 0 0 1-.708-.708L7.293 8z"/>
</svg>
{% endset %}
@ -29,7 +29,7 @@
<td>{{ l['work_item']['label'] if l['work_item'] else '-' }}</td>
<td>{{ l.start_time if l.start_time else '-' }}</td>
<td>{{ l.end_time if l.end_time else '-' }}</td>
<td class="text-center">{{ check if l.complete else x }}</td>
<td class="text-center align-items-center {{ 'bg-success-subtle' if l.complete else 'bg-danger-subtle' }}">{{ check if l.complete else x }}</td>
</tr>
{% endfor %}
</tbody>