Relayout of Augmented Part details page
This commit is contained in:
1 parent
6806caf8d7
commit
2ce4f91e4f
5 files changed
+127
-103
No files matched your search
+15
-27
@@ -505,43 +505,31 @@ textarea:focus {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.fit-item {
|
||||
padding: 0.5rem 0;
|
||||
border-bottom: 1px solid var(--border);
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.fit-item:last-of-type {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.fit-item-main {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 0.3rem;
|
||||
}
|
||||
|
||||
.fit-item-arrow {
|
||||
color: var(--muted);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fit-badge {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/*
|
||||
/*font-size: 0.7rem;
|
||||
letter-spacing: 0.03em;
|
||||
padding: 0.1rem 0.5rem;
|
||||
font-weight: 600;
|
||||
/* Fits table on the augmented part detail page */
|
||||
.fit-table select,
|
||||
.fit-table input[type="text"] {
|
||||
min-width: 8rem;
|
||||
}
|
||||
*/
|
||||
|
||||
.augmented-fit-row-group {
|
||||
padding: 0.5rem 0;
|
||||
border-bottom: 2px solid var(--muted);
|
||||
.fit-table .fit-add-row {
|
||||
background: var(--surface-2);
|
||||
}
|
||||
|
||||
.fit-table .fit-add-row td {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.fit-notes-cell {
|
||||
min-width: 14rem;
|
||||
}
|
||||
|
||||
.fit-badge-possible {
|
||||
|
||||
@@ -12,42 +12,18 @@
|
||||
{%- endif -%}
|
||||
{%- endmacro %}
|
||||
|
||||
<div id="fit-{{ fit.id }}" class="fit-item">
|
||||
<div class="fit-item-main">
|
||||
<span class="fit-badge fit-badge-{{ fit.label.value }}">{{ fit.label.value | capitalize }}</span>
|
||||
<span class="fit-item-side"><strong>{{ own_ap.attachment_point_name.name }}</strong> ({{ conn_desc(own_ap) }})</span>
|
||||
<span class="fit-item-arrow">↔</span>
|
||||
<span class="fit-item-side"><a href="/admin/augmented-parts/{{ other_part.id }}" title="{{ other_part.description }}">{{ other_part.sku }}</a> <strong>{{ other_part.part_type.name }}</strong></span>
|
||||
</div>
|
||||
{% if can_write %}
|
||||
<div class="row-actions">
|
||||
{% if fit.label.value != "exact" %}
|
||||
<button class="btn btn-ghost"
|
||||
hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits/{{ fit.id }}/label"
|
||||
hx-vals='{"label": "exact"}'
|
||||
hx-target="#fit-{{ fit.id }}" hx-swap="outerHTML">Mark Exact</button>
|
||||
{% endif %}
|
||||
{% if fit.label.value != "possible" %}
|
||||
<button class="btn btn-ghost"
|
||||
hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits/{{ fit.id }}/label"
|
||||
hx-vals='{"label": "possible"}'
|
||||
hx-target="#fit-{{ fit.id }}" hx-swap="outerHTML">Mark Possible</button>
|
||||
{% endif %}
|
||||
{% if fit.label.value != "none" %}
|
||||
<button class="btn btn-ghost"
|
||||
hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits/{{ fit.id }}/label"
|
||||
hx-vals='{"label": "none"}'
|
||||
hx-target="#fit-{{ fit.id }}" hx-swap="outerHTML">Mark Impossible</button>
|
||||
{% endif %}
|
||||
<button class="btn btn-danger"
|
||||
hx-delete="/admin/augmented-parts/{{ augmented_part_id }}/fits/{{ fit.id }}"
|
||||
hx-target="#ap-{{ augmented_part_id }}-fits"
|
||||
hx-swap="outerHTML"
|
||||
hx-confirm="Delete this fit?">Delete</button>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="fit-notes">
|
||||
<tr id="fit-{{ fit.id }}" class="fit-row">
|
||||
<td><span class="fit-badge fit-badge-{{ fit.label.value }}">{{ fit.label.value | capitalize }}</span></td>
|
||||
<td>
|
||||
<strong>{{ own_ap.attachment_point_name.name }}</strong>
|
||||
<div class="muted" style="font-size:0.8rem">{{ conn_desc(own_ap) }}</div>
|
||||
</td>
|
||||
<td class="fit-item-arrow">↔</td>
|
||||
<td>
|
||||
<a href="/admin/augmented-parts/{{ other_part.id }}" title="{{ other_part.description }}">{{ other_part.sku or other_part.description }}</a>
|
||||
<div class="muted" style="font-size:0.8rem">{{ other_part.part_type.name }}</div>
|
||||
</td>
|
||||
<td class="fit-notes-cell">
|
||||
{% for note in fit.notes %}
|
||||
<div class="fit-note">
|
||||
<span class="fit-note-meta">{{ note.username }} · {{ note.created_at.strftime("%Y-%m-%d %H:%M") }}</span>
|
||||
@@ -59,8 +35,37 @@
|
||||
hx-target="#fit-{{ fit.id }}" hx-swap="outerHTML"
|
||||
class="inline-edit fit-note-form">
|
||||
<input type="text" name="body" placeholder="Add a note…" required>
|
||||
<button type="submit" class="btn btn-ghost">Add note</button>
|
||||
<button type="submit" class="btn btn-ghost btn-sm">Add note</button>
|
||||
</form>
|
||||
{% endif %}
|
||||
</td>
|
||||
{% if can_write %}
|
||||
<td>
|
||||
<div class="row-actions">
|
||||
{% if fit.label.value != "exact" %}
|
||||
<button class="btn btn-ghost btn-sm"
|
||||
hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits/{{ fit.id }}/label"
|
||||
hx-vals='{"label": "exact"}'
|
||||
hx-target="#fit-{{ fit.id }}" hx-swap="outerHTML">Mark Exact</button>
|
||||
{% endif %}
|
||||
{% if fit.label.value != "possible" %}
|
||||
<button class="btn btn-ghost btn-sm"
|
||||
hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits/{{ fit.id }}/label"
|
||||
hx-vals='{"label": "possible"}'
|
||||
hx-target="#fit-{{ fit.id }}" hx-swap="outerHTML">Mark Possible</button>
|
||||
{% endif %}
|
||||
{% if fit.label.value != "none" %}
|
||||
<button class="btn btn-ghost btn-sm"
|
||||
hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits/{{ fit.id }}/label"
|
||||
hx-vals='{"label": "none"}'
|
||||
hx-target="#fit-{{ fit.id }}" hx-swap="outerHTML">Mark Impossible</button>
|
||||
{% endif %}
|
||||
<button class="btn btn-danger btn-sm"
|
||||
hx-delete="/admin/augmented-parts/{{ augmented_part_id }}/fits/{{ fit.id }}"
|
||||
hx-target="#ap-{{ augmented_part_id }}-fits"
|
||||
hx-swap="outerHTML"
|
||||
hx-confirm="Delete this fit?">Delete</button>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
{% endif %}
|
||||
</tr>
|
||||
@@ -4,36 +4,46 @@
|
||||
{% if message %}<p class="alert alert-success">{{ message }}</p>{% endif %}
|
||||
{% if error %}<p class="alert alert-error">{{ error }}</p>{% endif %}
|
||||
|
||||
{% for view in fit_views %}
|
||||
{% with fit=view.fit, own_ap=view.own_ap, other_ap=view.other_ap, other_part=view.other_part %}
|
||||
{% include "admin/_augmented_part_fit_row.html" %}
|
||||
{% endwith %}
|
||||
{% else %}
|
||||
<p class="muted" style="font-size:0.85rem;margin:0 0 0.5rem">No fits recorded yet.</p>
|
||||
{% endfor %}
|
||||
|
||||
{% set add_form_id = "ap-" ~ augmented_part_id ~ "-fit-add-form" %}
|
||||
{% if can_write %}
|
||||
<div class="row-actions" style="margin:0.5rem 0">
|
||||
<form hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits/recompute"
|
||||
hx-target="#ap-{{ augmented_part_id }}-fits" hx-swap="outerHTML">
|
||||
<button type="submit" class="btn btn-ghost">Recompute possible fits</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<form hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits"
|
||||
<form id="{{ add_form_id }}"
|
||||
hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits"
|
||||
hx-target="#ap-{{ augmented_part_id }}-fits"
|
||||
hx-swap="outerHTML"
|
||||
class="inline-edit" style="margin-top:0.5rem">
|
||||
<label>This part's point
|
||||
<select name="own_attachment_point_id" required>
|
||||
hx-swap="outerHTML"></form>
|
||||
{% endif %}
|
||||
|
||||
<table class="table fit-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Type</th>
|
||||
<th>This part's point</th>
|
||||
<th></th>
|
||||
<th>Fits with part</th>
|
||||
<th>Notes</th>
|
||||
{% if can_write %}<th></th>{% endif %}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% if can_write %}
|
||||
<tr class="fit-add-row">
|
||||
<td>
|
||||
<select form="{{ add_form_id }}" name="label">
|
||||
<option value="exact" selected>Exact</option>
|
||||
<option value="possible">Possible</option>
|
||||
<option value="none">None</option>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select form="{{ add_form_id }}" name="own_attachment_point_id" required>
|
||||
<option value="">— select —</option>
|
||||
{% for p in own_points %}
|
||||
<option value="{{ p.id }}">{{ p.attachment_point_name.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</label>
|
||||
<label>Fits with part
|
||||
<select name="other_augmented_part_id" required
|
||||
</td>
|
||||
<td class="fit-item-arrow">↔</td>
|
||||
<td>
|
||||
<select form="{{ add_form_id }}" name="other_augmented_part_id" required
|
||||
hx-get="/admin/augmented-parts/{{ augmented_part_id }}/fits/other-points"
|
||||
hx-target="#ap-{{ augmented_part_id }}-fit-other-points"
|
||||
hx-trigger="change"
|
||||
@@ -43,19 +53,35 @@
|
||||
<option value="{{ p.id }}">{{ p.description | truncate(40) }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</label>
|
||||
<div id="ap-{{ augmented_part_id }}-fit-other-points"></div>
|
||||
<label>Fit type
|
||||
<select name="label">
|
||||
<option value="exact" selected>Exact</option>
|
||||
<option value="possible">Possible</option>
|
||||
<option value="none">None</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>Note (optional)
|
||||
<input type="text" name="note" placeholder="Add a note…">
|
||||
</label>
|
||||
<button type="submit" class="btn btn-primary">Add fit</button>
|
||||
</td>
|
||||
<td>
|
||||
<input form="{{ add_form_id }}" type="text" name="note" placeholder="Add a note…">
|
||||
</td>
|
||||
<td>
|
||||
<button type="submit" form="{{ add_form_id }}" class="btn btn-primary btn-sm">Add fit</button>
|
||||
</td>
|
||||
</tr>
|
||||
{% endif %}
|
||||
|
||||
{% for view in fit_views %}
|
||||
{% with fit=view.fit, own_ap=view.own_ap, other_ap=view.other_ap, other_part=view.other_part %}
|
||||
{% include "admin/_augmented_part_fit_row.html" %}
|
||||
{% endwith %}
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="{{ 6 if can_write else 5 }}" class="muted" style="font-size:0.85rem">No fits recorded yet.</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
{% if can_write %}
|
||||
<div class="row-actions" style="margin:0.5rem 0">
|
||||
<form hx-post="/admin/augmented-parts/{{ augmented_part_id }}/fits/recompute"
|
||||
hx-target="#ap-{{ augmented_part_id }}-fits" hx-swap="outerHTML">
|
||||
<button type="submit" class="btn btn-ghost">Recompute possible fits</button>
|
||||
</form>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@@ -1,12 +1,12 @@
|
||||
{% if points %}
|
||||
<select name="other_attachment_point_id" required>
|
||||
<select name="other_attachment_point_id" form="{{ form_id }}" required>
|
||||
<option value="">— select —</option>
|
||||
{% for p in points %}
|
||||
<option value="{{ p.id }}">{{ p.attachment_point_name.name }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
{% else %}
|
||||
<input type="hidden" name="other_attachment_point_id" value="">
|
||||
<input type="hidden" name="other_attachment_point_id" value="" form="{{ form_id }}">
|
||||
<p class="muted" style="font-size:0.85rem;margin:0">
|
||||
This part has no attachment points yet — one matching yours will be created automatically.
|
||||
</p>
|
||||
|
||||
+6
-1
@@ -2682,7 +2682,12 @@ async def fit_other_points(
|
||||
else []
|
||||
)
|
||||
return templates.TemplateResponse(
|
||||
request, "admin/_fit_other_points_select.html", {"points": points}
|
||||
request,
|
||||
"admin/_fit_other_points_select.html",
|
||||
{
|
||||
"points": points,
|
||||
"form_id": f"ap-{augmented_part_id}-fit-add-form",
|
||||
},
|
||||
)
|
||||
|
||||
|
||||
|
||||
Reference in new issue
Block a user