Adding filtering to tables
This commit is contained in:
Ian Roddis committed
1 parent
d67b4ceb65
commit
a50fccd56d
10 files changed
+329
-81
No files matched your search
@@ -5,28 +5,44 @@
|
||||
{% if sync_error %}
|
||||
<p class="alert alert-error">{{ sync_error }}</p>
|
||||
{% endif %}
|
||||
<div class="card">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>SKU</th>
|
||||
<th>Description</th>
|
||||
<th>Colour</th>
|
||||
<th>Manufacturer</th>
|
||||
<th>Model</th>
|
||||
<th>Type</th>
|
||||
<th>Sub Type</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for ap in augmented_parts %}
|
||||
{% include "admin/_augmented_part_row.html" %}
|
||||
{% else %}
|
||||
<tr><td colspan="9" class="muted">No augmented parts recorded.</td></tr>
|
||||
<div class="filter-bar">
|
||||
<form hx-get="/admin/augmented-parts/filter"
|
||||
hx-target="#augmented-parts-table-card"
|
||||
hx-trigger="input delay:300ms, change"
|
||||
hx-swap="outerHTML">
|
||||
<input type="text" name="description" placeholder="Filter by description…" value="{{ filter_description or '' }}">
|
||||
<select name="colour_id">
|
||||
<option value="">All colours</option>
|
||||
{% for pc in part_colours %}
|
||||
<option value="{{ pc.id }}" {{ "selected" if filter_colour_id and filter_colour_id|int == pc.id }}>{{ pc.name }}</option>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</select>
|
||||
<select name="manufacturer_id">
|
||||
<option value="">All manufacturers</option>
|
||||
{% for m in manufacturers %}
|
||||
<option value="{{ m.id }}" {{ "selected" if filter_manufacturer_id and filter_manufacturer_id|int == m.id }}>{{ m.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select name="scope_model_id">
|
||||
<option value="">All models</option>
|
||||
{% for sm in scope_models %}
|
||||
<option value="{{ sm.id }}" {{ "selected" if filter_scope_model_id and filter_scope_model_id|int == sm.id }}>{{ sm.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select name="part_type_id">
|
||||
<option value="">All types</option>
|
||||
{% for pt in part_types %}
|
||||
<option value="{{ pt.id }}" {{ "selected" if filter_part_type_id and filter_part_type_id|int == pt.id }}>{{ pt.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<select name="sub_part_type_id">
|
||||
<option value="">All sub types</option>
|
||||
{% for spt in sub_part_types %}
|
||||
<option value="{{ spt.id }}" {{ "selected" if filter_sub_part_type_id and filter_sub_part_type_id|int == spt.id }}>{{ spt.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{% include "admin/_augmented_parts_table_card.html" %}
|
||||
</div>
|
||||
@@ -0,0 +1,24 @@
|
||||
<div id="augmented-parts-table-card" class="card">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>SKU</th>
|
||||
<th>Description</th>
|
||||
<th>Colour</th>
|
||||
<th>Manufacturer</th>
|
||||
<th>Model</th>
|
||||
<th>Type</th>
|
||||
<th>Sub Type</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for ap in augmented_parts %}
|
||||
{% include "admin/_augmented_part_row.html" %}
|
||||
{% else %}
|
||||
<tr><td colspan="9" class="muted">No augmented parts recorded.</td></tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@@ -6,39 +6,14 @@
|
||||
<p style="color:var(--color-danger,#c00)">{{ sync_error }}</p>
|
||||
{% endif %}
|
||||
|
||||
<div class="card" style="overflow-x:auto">
|
||||
<p class="muted" style="margin-bottom:.5rem">
|
||||
Showing {{ parts|length }} record{{ '' if parts|length == 1 else 's' }}{% if total and total > parts|length %} of {{ total }} total{% endif %}.
|
||||
</p>
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>InventoryID</th>
|
||||
<th>Description</th>
|
||||
<th>TBX Colour</th>
|
||||
<th>Max Thread Depth (mm)</th>
|
||||
<th>Max Thread Depth (in)</th>
|
||||
<th>OD (mm)</th>
|
||||
<th>OD (in)</th>
|
||||
<th>Thread Attribute</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for p in parts %}
|
||||
<tr>
|
||||
<td>{{ p.InventoryID }}</td>
|
||||
<td>{{ p.Description or '—' }}</td>
|
||||
<td>{{ p.TBXColour or '—' }}</td>
|
||||
<td>{{ p.ProductMaxThreadDepthmm or '—' }}</td>
|
||||
<td>{{ p.ProductMaxThreadDepthin or '—' }}</td>
|
||||
<td>{{ p.ProductODmm or '—' }}</td>
|
||||
<td>{{ p.ProductODin or '—' }}</td>
|
||||
<td>{{ p.TBXThreadAttribute or '—' }}</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr><td colspan="8" class="muted">No imported parts. Use Refresh to sync from OData.</td></tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="filter-bar">
|
||||
<form hx-get="/admin/imported-parts/filter"
|
||||
hx-target="#imported-parts-table-card"
|
||||
hx-trigger="input delay:300ms, change"
|
||||
hx-swap="outerHTML">
|
||||
<input type="text" name="description" placeholder="Filter by description…" value="{{ filter_description or '' }}">
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{% include "admin/_imported_parts_table_card.html" %}
|
||||
</div>
|
||||
@@ -0,0 +1,35 @@
|
||||
<div id="imported-parts-table-card" class="card" style="overflow-x:auto">
|
||||
<p class="muted" style="margin-bottom:.5rem">
|
||||
Showing {{ parts|length }} record{{ '' if parts|length == 1 else 's' }}{% if total and total > parts|length %} of {{ total }} total{% endif %}.
|
||||
</p>
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>InventoryID</th>
|
||||
<th>Description</th>
|
||||
<th>TBX Colour</th>
|
||||
<th>Max Thread Depth (mm)</th>
|
||||
<th>Max Thread Depth (in)</th>
|
||||
<th>OD (mm)</th>
|
||||
<th>OD (in)</th>
|
||||
<th>Thread Attribute</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for p in parts %}
|
||||
<tr>
|
||||
<td>{{ p.InventoryID }}</td>
|
||||
<td>{{ p.Description or '—' }}</td>
|
||||
<td>{{ p.TBXColour or '—' }}</td>
|
||||
<td>{{ p.ProductMaxThreadDepthmm or '—' }}</td>
|
||||
<td>{{ p.ProductMaxThreadDepthin or '—' }}</td>
|
||||
<td>{{ p.ProductODmm or '—' }}</td>
|
||||
<td>{{ p.ProductODin or '—' }}</td>
|
||||
<td>{{ p.TBXThreadAttribute or '—' }}</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr><td colspan="8" class="muted">No imported parts. Use Refresh to sync from OData.</td></tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@@ -2,7 +2,7 @@
|
||||
{% if sync_result %}<p class="alert alert-success">{{ sync_result }}</p>{% endif %}
|
||||
{% if sync_error %}<p class="alert alert-error">{{ sync_error }}</p>{% endif %}
|
||||
|
||||
{% if unlinked_parts %}
|
||||
{% if any_unlinked %}
|
||||
<form hx-post="/admin/augmented-parts/skipped"
|
||||
hx-target="#skipped-parts-list"
|
||||
hx-swap="outerHTML">
|
||||
@@ -29,29 +29,23 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card" style="overflow-x:auto">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th><input type="checkbox" id="select-all" title="Select all"></th>
|
||||
<th>Inventory ID</th>
|
||||
<th>Description</th>
|
||||
<th>Colour</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for ip in unlinked_parts %}
|
||||
<tr>
|
||||
<td><input type="checkbox" name="inventory_ids" value="{{ ip.InventoryID }}"></td>
|
||||
<td><code>{{ ip.InventoryID }}</code></td>
|
||||
<td>{{ ip.Description | truncate(80) if ip.Description else '—' }}</td>
|
||||
<td>{{ ip.TBXColour or '—' }}</td>
|
||||
</tr>
|
||||
<div class="filter-bar">
|
||||
<form hx-get="/admin/augmented-parts/skipped/filter"
|
||||
hx-target="#skipped-parts-table-card"
|
||||
hx-trigger="input delay:300ms, change"
|
||||
hx-swap="outerHTML">
|
||||
<input type="text" name="description" placeholder="Filter by description…" value="{{ filter_description or '' }}">
|
||||
<select name="colour">
|
||||
<option value="">All colours</option>
|
||||
{% for c in skipped_colours %}
|
||||
<option value="{{ c }}" {{ "selected" if filter_colour == c }}>{{ c }}</option>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</select>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
{% include "admin/_skipped_parts_table_card.html" %}
|
||||
|
||||
</form>
|
||||
{% else %}
|
||||
<div class="card">
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
<div id="skipped-parts-table-card" class="card" style="overflow-x:auto">
|
||||
<table class="table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th><input type="checkbox" id="select-all" title="Select all"></th>
|
||||
<th>Inventory ID</th>
|
||||
<th>Description</th>
|
||||
<th>Colour</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for ip in unlinked_parts %}
|
||||
<tr>
|
||||
<td><input type="checkbox" name="inventory_ids" value="{{ ip.InventoryID }}"></td>
|
||||
<td><code>{{ ip.InventoryID }}</code></td>
|
||||
<td>{{ ip.Description | truncate(80) if ip.Description else '—' }}</td>
|
||||
<td>{{ ip.TBXColour or '—' }}</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr><td colspan="4" class="muted">No parts match the current filter.</td></tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
Reference in new issue
Block a user