Add cell hilighting function when jumping to a container from a search result

This commit is contained in:
Johannes Schriewer 2025-01-06 03:18:12 +01:00
parent 558033e67e
commit a35537d52c
15 changed files with 36 additions and 31 deletions

View file

@ -46,6 +46,10 @@ td.disabled {
align-items: center; align-items: center;
} }
.search-hilight {
background-color: #ffa0a0;
}
.cell:nth-child(2n) { .cell:nth-child(2n) {
background-color: #f8f8f8; background-color: #f8f8f8;
} }

View file

@ -15,7 +15,7 @@
<h3>Items</h3> <h3>Items</h3>
<ul> <ul>
{% for item in box.item_related.all %} {% for item in box.item_related.all %}
<li><a href="{% url 'item-detail' item.id %}" title="{{ item.description }}">{{ item.name }}</a></li> <li {% if hilight == item.id %}class="hilighted"{% endif %}><a href="{% url 'item-detail' item.id %}" title="{{ item.description }}">{{ item.name }}</a></li>
{% endfor %} {% endfor %}
</ul> </ul>
{% endif %} {% endif %}

View file

@ -9,7 +9,7 @@
<td rowspan="2"> <td rowspan="2">
<div class="compartments-vertical"> <div class="compartments-vertical">
{% for compartment in layouted.0.0 %} {% for compartment in layouted.0.0 %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -17,7 +17,7 @@
<td class="triple-height" colspan="3"> <td class="triple-height" colspan="3">
<div class="compartments"> <div class="compartments">
{% for compartment in layouted.0.1 %} {% for compartment in layouted.0.1 %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -27,7 +27,7 @@
<td class="triple-height"> <td class="triple-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -9,7 +9,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in layouted.0 %} {% for compartment in layouted.0 %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -10,7 +10,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -20,7 +20,7 @@
<td rowspan="2"> <td rowspan="2">
<div class="compartments-vertical"> <div class="compartments-vertical">
{% for compartment in layouted.1.0 %} {% for compartment in layouted.1.0 %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -29,7 +29,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -40,7 +40,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -11,7 +11,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -27,7 +27,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -42,7 +42,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -11,7 +11,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -27,7 +27,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -42,7 +42,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -11,7 +11,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -27,7 +27,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -42,7 +42,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -11,7 +11,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -10,7 +10,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -21,7 +21,7 @@
<td> <td>
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -10,7 +10,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -21,7 +21,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -32,7 +32,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -45,7 +45,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -10,7 +10,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -21,7 +21,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -32,7 +32,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>
@ -45,7 +45,7 @@
<td class="double-height"> <td class="double-height">
<div class="compartments"> <div class="compartments">
{% for compartment in item %} {% for compartment in item %}
{% include "inventory/cell.html" with item=compartment %} {% include "inventory/cell.html" with item=compartment hilight=hilight %}
{% endfor %} {% endfor %}
</div> </div>
</td> </td>

View file

@ -1,7 +1,6 @@
{% load static %} {% load static %}
{% load admin_urls %} {% load admin_urls %}
<div class="cell{% if hilight == item.id %} search-hilight{% endif %}">
<div class="cell">
{% if item.name %} {% if item.name %}
{% if item.metadata.package %} {% if item.metadata.package %}
<div class="package">{{ item.metadata.package }}</div> <div class="package">{{ item.metadata.package }}</div>

View file

@ -49,9 +49,11 @@ class BoxView(CanBeIndexMixin, DetailView):
return result, idx return result, idx
def get(self, request, *args, **kwargs): def get(self, request, *args, **kwargs):
hilighted = int(request.GET.get('hilight', "0"))
self.object = cast(Box, self.get_object()) self.object = cast(Box, self.get_object())
context = self.get_context_data(object=self.object) context = self.get_context_data(object=self.object)
context['layouted'], _ = self.layout(self.object.item_related.all().order_by('index'), self.object.layout.data) context['layouted'], _ = self.layout(self.object.item_related.all().order_by('index'), self.object.layout.data)
context['hilight'] = hilighted
return self.render_to_response(context) return self.render_to_response(context)