Easier access to food details

apps/food/templates/food/food_list.html

@@ -7,7 +7,52 @@ SPDX-License-Identifier: GPL-3.0-or-later
 {% load i18n %}
 
 {% block content %}
-{{ block.super }}
+<div class="card bg-light">
+  <h3 class="card-header text-center">
+      {{ title }}
+  </h3>
+  <div class="card-body">
+    <style>
+      input[type=number]::-webkit-inner-spin-button,
+      input[type=number]::-webkit-outer-spin-button {
+          -webkit-appearance: none;
+          margin: 0;
+      }
+      input[type=number] {
+          appearance: textfield;
+          padding: 6px;
+          border: 1px solid #ccc;
+          border-radius: 4px;
+          width: 100px;
+      }
+    </style>
+    <div class="d-flex align-items-center" style="max-width: 300px;">
+      <form method="get" action="{% url 'food:redirect_view' %}" class="d-flex w-100">
+        <input type="number" name="slug" placeholder="QR-code" required class="form-control form-control-sm" style="max-width: 120px;">
+        <button type="submit" class="btn btn-sm btn-primary">{% trans "View food" %}</button>
+      </form>
+    </div>
+  </div>
+  <div class="card-body">
+      <input id="searchbar" type="text" class="form-control"
+          placeholder="{% trans "Search by attribute such as name..." %}">
+  </div>
+
+  {% block extra_inside_card %}
+  {% endblock %}
+
+  <div id="dynamic-table">
+      {% if table.data %}
+      {% render_table table %}
+      {% else %}
+      <div class="card-body">
+          <div class="alert alert-warning">
+              {% trans "There is no results." %}
+          </div>
+      </div>
+      {% endif %}
+  </div>
+</div>
 <br>
 <div class="card bg-light mb-3">
   <h3 class="card-header text-center">
@@ -68,4 +113,20 @@ SPDX-License-Identifier: GPL-3.0-or-later
   {% endfor %}
   {% endif %}
 </div>
-{% endblock %}
+
+
+<script>
+  document.addEventListener('DOMContentLoaded', function() {
+      document.getElementById('goButton').addEventListener('click', function(event) {
+          event.preventDefault();
+          const slug = document.getElementById('slugInput').value;
+          if (slug && !isNaN(slug)) {
+              window.location.href = `/food/${slug}/`;
+          } else {
+              alert("Veuillez entrer un nombre valide.");
+          }
+      });
+  });
+  </script>
+
+{% endblock %}

apps/food/urls.py

@@ -18,4 +18,5 @@ urlpatterns = [
     path('detail/basic/<int:pk>', views.BasicFoodDetailView.as_view(), name='basicfood_view'),
     path('detail/transformed/<int:pk>', views.TransformedFoodDetailView.as_view(), name='transformedfood_view'),
     path('add/ingredient/<int:pk>', views.AddIngredientView.as_view(), name='add_ingredient'),
+    path('redirect/', views.QRCodeRedirectView.as_view(), name='redirect_view'),
 ]

apps/food/views.py

@@ -10,6 +10,7 @@ from django.db.models import Q
 from django.http import HttpResponseRedirect, Http404
 from django.views.generic import DetailView, UpdateView, CreateView
 from django.views.generic.list import ListView
+from django.views.generic.base import RedirectView
 from django.urls import reverse_lazy
 from django.utils import timezone
 from django.utils.translation import gettext_lazy as _
@@ -483,3 +484,14 @@ class TransformedFoodDetailView(FoodDetailView):
         if Food.objects.filter(pk=kwargs['pk']).count() == 1:
             kwargs['stop_redirect'] = (Food.objects.get(pk=kwargs['pk']).polymorphic_ctype.model == 'transformedfood')
         return super().get(*args, **kwargs)
+
+
+class QRCodeRedirectView(RedirectView):
+    """
+    Redirects to the QR code creation page from Food List
+    """
+    def get_redirect_url(self, *args, **kwargs):
+        slug = self.request.GET.get('slug')
+        if slug:
+            return reverse_lazy('food:qrcode_create', kwargs={'slug': slug})
+        return reverse_lazy('food:list')