bug: criei um bug na page orders🙃

gestaoRaul/orders/templates/orders.html

@@ -35,6 +35,8 @@
         <button class="tablinks" onclick="openTab(event, 'Entregue')">Entregue</button>
     </div>
 
+    <div id="etapas">
+
     <div id="Fila" class="tabcontent">
         {% for order in orders %}
         {% if order.preparing == None and order.productComanda != Null %}
@@ -50,8 +52,8 @@
             <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
             <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
             <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
-            <button
+            <button onclick="delayTab(event, 'Fila')"
-            hx-get="{% url 'preparing' order.id %} " hx-trigger="click" hx-target="#list-orders"
+            hx-get="{% url 'preparing' order.id %} " hx-trigger="click" hx-target="#etapas"
             >Preparar</button>
         </div>
         {% endif %}
@@ -75,8 +77,8 @@
             <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
             <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
             <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
-            <button
+            <button  onclick="delayTab(event, 'Preparo')"
-            hx-get="{% url 'finished' order.id %} " hx-trigger="click" hx-target="#list-orders"
+            hx-get="{% url 'finished' order.id %} " hx-trigger="click" hx-target="#etapas"
             >Finalizar</button>
         </div>
         {% endif %}
@@ -99,8 +101,8 @@
             <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
             <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
             <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
-            <button
+            <button onclick="delayTab(event, 'Finalizado')"
-            hx-get="{% url 'delivered' order.id %} " hx-trigger="click" hx-target="#list-orders"
+            hx-get="{% url 'delivered' order.id %} " hx-trigger="click" hx-target="#etapas"
             >Entregar</button>
         </div>
         {% endif %}
@@ -125,6 +127,7 @@
             <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
             <!-- <button>Preparar</button> -->
         </div>
+    </div>
         {% endif %}
         {% endfor %}
     </div>

gestaoRaul/orders/views.py

@@ -19,7 +19,7 @@ def preparing(request, order_id):
     order.save()
     fifteen_hours_ago = timezone.now() - timezone.timedelta(hours=15)
     orders = Order.objects.filter(queue__gte=fifteen_hours_ago )
-    return  render(request, 'htmx_components/orders/htmx_list_orders.html',{'orders': orders})
+    return  render(request, 'htmx_components/orders/htmx_list_orders_fila.html',{'orders': orders})
 
 
 @group_required(groupName='Cozinha')
@@ -29,7 +29,7 @@ def finished(request, order_id):
     order.save()
     fifteen_hours_ago = timezone.now() - timezone.timedelta(hours=15)
     orders = Order.objects.filter(queue__gte=fifteen_hours_ago )
-    return  render(request, 'htmx_components/orders/htmx_list_orders.html',{'orders': orders})
+    return  render(request, 'htmx_components/orders/htmx_list_orders_fila.html',{'orders': orders})
 
 @group_required(groupName='Garçom')
 def delivered(request, order_id):
@@ -38,4 +38,4 @@ def delivered(request, order_id):
     order.save()
     fifteen_hours_ago = timezone.now() - timezone.timedelta(hours=15)
     orders = Order.objects.filter(queue__gte=fifteen_hours_ago )
-    return  render(request, 'htmx_components/orders/htmx_list_orders.html',{'orders': orders})
+    return  render(request, 'htmx_components/orders/htmx_list_orders_fila.html',{'orders': orders})

gestaoRaul/templates/htmx_components/orders/htmx_list_orders_fila.html

@@ -0,0 +1,102 @@
+
+
+
+<!-- <div class="tab">
+    <button class="tablinks active" onclick="openTab(event, 'Fila')">Fila</button>
+    <button class="tablinks" onclick="openTab(event, 'Preparo')">Preparo</button>
+    <button class="tablinks" onclick="openTab(event, 'Finalizado')">Pronto</button>
+    <button class="tablinks" onclick="openTab(event, 'Entregue')">Entregue</button>
+</div> -->
+
+<div id="Fila" class="tabcontent">
+    {% for order in orders %}
+    {% if order.preparing == None and order.productComanda != Null %}
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button onclick="delayTab(event, 'Fila')"
+        hx-get="{% url 'preparing' order.id %} " hx-trigger="click" hx-target="#etapas"
+        >Preparar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+
+<div id="Preparo" class="tabcontent">
+    {% for order in orders %}
+    {% if order.finished == None and order.preparing != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button onclick="delayTab(event, 'Preparo')"
+        hx-get="{% url 'finished' order.id %} " hx-trigger="click" hx-target="#etapas"
+        >Finalizar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+<div id="Finalizado" class="tabcontent">
+    {% for order in orders %}
+    {% if order.delivered == None and order.finished != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button onclick="delayTab(event, 'Finalizado')"
+        hx-get="{% url 'delivered' order.id %} " hx-trigger="click" hx-target="#etapas"
+        >Entregar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+<div id="Entregue" class="tabcontent">
+    {% for order in orders %}
+    {% if order.delivered != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>

gestaoRaul/templates/htmx_components/orders/htmx_list_orders_preparo.html

@@ -0,0 +1,103 @@
+
+
+
+<div class="tab">
+    <button class="tablinks active" onclick="openTab(event, 'Fila')">Fila</button>
+    <button class="tablinks" onclick="openTab(event, 'Preparo')">Preparo</button>
+    <button class="tablinks" onclick="openTab(event, 'Finalizado')">Pronto</button>
+    <button class="tablinks" onclick="openTab(event, 'Entregue')">Entregue</button>
+</div>
+
+<div id="Fila" class="tabcontent">
+    {% for order in orders %}
+    {% if order.preparing == None and order.productComanda != Null %}
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button
+        hx-get="{% url 'preparing' order.id %} " hx-trigger="click" hx-target="#list-orders"
+        >Preparar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+
+<div id="Preparo" class="tabcontent">
+    {% for order in orders %}
+    {% if order.finished == None and order.preparing != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button
+        hx-get="{% url 'finished' order.id %} " hx-trigger="click" hx-target="#list-orders"
+        >Finalizar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+<div id="Finalizado" class="tabcontent">
+    {% for order in orders %}
+    {% if order.delivered == None and order.finished != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button
+        hx-get="{% url 'delivered' order.id %} " hx-trigger="click" hx-target="#list-orders"
+        >Entregar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+<div id="Entregue" class="tabcontent">
+    {% for order in orders %}
+    {% if order.delivered != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <!-- <button>Preparar</button> -->
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>

gestaoRaul/templates/htmx_components/orders/htmx_list_orders_pronto.html

@@ -0,0 +1,103 @@
+
+
+
+<div class="tab">
+    <button class="tablinks active" onclick="openTab(event, 'Fila')">Fila</button>
+    <button class="tablinks" onclick="openTab(event, 'Preparo')">Preparo</button>
+    <button class="tablinks" onclick="openTab(event, 'Finalizado')">Pronto</button>
+    <button class="tablinks" onclick="openTab(event, 'Entregue')">Entregue</button>
+</div>
+
+<div id="Fila" class="tabcontent">
+    {% for order in orders %}
+    {% if order.preparing == None and order.productComanda != Null %}
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button
+        hx-get="{% url 'preparing' order.id %} " hx-trigger="click" hx-target="#list-orders"
+        >Preparar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+
+<div id="Preparo" class="tabcontent">
+    {% for order in orders %}
+    {% if order.finished == None and order.preparing != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button
+        hx-get="{% url 'finished' order.id %} " hx-trigger="click" hx-target="#list-orders"
+        >Finalizar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+<div id="Finalizado" class="tabcontent">
+    {% for order in orders %}
+    {% if order.delivered == None and order.finished != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <button
+        hx-get="{% url 'delivered' order.id %} " hx-trigger="click" hx-target="#list-orders"
+        >Entregar</button>
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>
+
+<div id="Entregue" class="tabcontent">
+    {% for order in orders %}
+    {% if order.delivered != None %}
+
+    <div class="m-card"
+    {% if order.productComanda == Null %}
+    style="background-color: rgb(253, 69, 69);"
+    {% elif order.obs != '' %}
+    style="background-color: rgb(243, 165, 75);"
+    {% endif %}
+    >
+        <h4>{{order.id_product.name}}</h4>
+        <h4>{{order.obs}} </h4>
+        <h4>{{order.id_comanda.name}} - {{order.id_comanda.mesa.name}} </h4>
+        <h4> Atendente: {{order.id_comanda.user.first_name}} </h4>
+        <h4>{{order.queue|date:"D"}} {{order.queue|date:"d/m/Y - H:i"}}</h4>
+        <!-- <button>Preparar</button> -->
+    </div>
+    {% endif %}
+    {% endfor %}
+</div>

gestaoRaul/templates/static/orders/js/orders.js

@@ -21,3 +21,9 @@ function openTab(evt, etapa) {
     tabcontent[i].style.display = "none";
   }
   tabcontent[0].style.display = "block";
+
+
+  function delayTab(evt,tab){
+    setTimeout(function() {
+      openTab(evt, tab);}, 200);
+  }