Merge pull request #489 from bruecksen/473-bug-separate-buttons-in-pr…

…oduction-plan-on-small-devices 473 improve production plan on mobile screens
bruecksen · May 30, 2024 · efa0364 · efa0364
2 parents 48d40fa + c93488b
commit efa0364
Show file tree

Hide file tree

Showing 6 changed files with 83 additions and 38 deletions.
diff --git a/bakeup/templates/workshop/includes/production_plan_actions.html b/bakeup/templates/workshop/includes/production_plan_actions.html
@@ -1,11 +1,59 @@
 {% load i18n %}
-{% if production_plan.is_planned %}
-<a href="{% url "workshop:production-plan-start" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}" class="btn btn-warning {{ btn_css }} d-print-none">{% trans "Start" %}</a>
-{% elif production_plan.is_production %}
-<a href="{% url "workshop:production-plan-finish" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}" class="btn btn-success {{ btn_css }} d-print-none">{% trans "Finish" %}</a>
-{% endif %}
-{% if production_plan.is_canceled %}
-<a href="{% url "workshop:production-plan-update" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}" class="btn btn-outline-primary {{ btn_css }} d-print-none">{% trans "Reset" %}</a>
+<div class="d-none d-sm-block">
+{% if production_plan.is_planned or production_plan.is_production %}
+<div class="btn-group btn-group-sm">
+    {% if production_plan.is_planned %}
+    <a role="button" class="btn btn-warning {{ btn_css }} d-print-none" href="{% url "workshop:production-plan-start" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Start" %}</a>
+    <a role="button" class="btn btn-warning dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
+      <span class="visually-hidden">Toggle Dropdown</span>
+    </a>
+    {% elif production_plan.is_production %}
+    <a role="button" class="btn btn-success {{ btn_css }} d-print-none" href="{% url "workshop:production-plan-finish" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Finish" %}</a>
+    <a role="button" class="btn btn-success dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
+      <span class="visually-hidden">Toggle Dropdown</span>
+    </a>
+    {% endif %}
+    <ul class="dropdown-menu">
+        {% if production_plan.is_canceled %}
+        <li><a class="dropdown-item d-print-none" href="{% url "workshop:production-plan-update" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Reset" %}</a></li>
+        {% else %}
+        <li><a class="dropdown-item d-print-none" href="{% url "workshop:production-plan-cancel" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Cancel" %}</a></li>
+        {% endif %}
+    </ul>
+</div>
 {% else %}
-<a href="{% url "workshop:production-plan-cancel" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}" class="btn btn-outline-primary {{ btn_css }} d-print-none">{% trans "Cancel" %}</a>
+<div class="dropdown">
+    <button type="button" class="btn btn-sm btn-outline-primary dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
+        <i class="fa-solid fa-ellipsis-vertical"></i>
+        <span class="visually-hidden">Toggle Dropdown</span>
+      </button>
+      <ul class="dropdown-menu">
+        {% if production_plan.is_canceled %}
+        <li><a class="dropdown-item d-print-none" href="{% url "workshop:production-plan-update" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Reset" %}</a></li>
+        {% else %}
+        <li><a class="dropdown-item d-print-none" href="{% url "workshop:production-plan-cancel" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Cancel" %}</a></li>
+        {% endif %}
+      </ul>
+</div>
 {% endif %}
+</div>
+<div class="d-block d-sm-none">
+    <div class="dropdown">
+        <button type="button" class="btn btn-sm btn-outline-primary dropdown-toggle-split" data-bs-toggle="dropdown" aria-expanded="false">
+            <i class="fa-solid fa-ellipsis-vertical"></i>
+            <span class="visually-hidden">Toggle Dropdown</span>
+          </button>
+          <ul class="dropdown-menu">
+            {% if production_plan.is_planned %}
+            <li><a role="button" class="dropdown-item btn-warning {{ btn_css }} d-print-none" href="{% url "workshop:production-plan-start" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Start" %}</a></li>
+            {% elif production_plan.is_production %}
+            <li><a role="button" class="dropdown-item btn-success {{ btn_css }} d-print-none" href="{% url "workshop:production-plan-finish" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Finish" %}</a></li>
+            {% endif %}
+            {% if production_plan.is_canceled %}
+            <li><a class="dropdown-item d-print-none" href="{% url "workshop:production-plan-update" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Reset" %}</a></li>
+            {% else %}
+            <li><a class="dropdown-item d-print-none" href="{% url "workshop:production-plan-cancel" pk=production_plan.pk %}{% if next_url%}?next={{ next_url }}{% endif %}">{% trans "Cancel" %}</a></li>
+            {% endif %}
+          </ul>
+    </div>
+</div>
diff --git a/bakeup/templates/workshop/includes/production_plan_table.html b/bakeup/templates/workshop/includes/production_plan_table.html
@@ -26,39 +26,36 @@
                 <td class="align-middle" data-bs-toggle="collapse" data-bs-target="#pb-{{ production_plan.root.pk }}" width="5%">{{ production_plan.root.production_day.day_of_sale|date:'d.m.' }}</td>
                 <td class="align-middle" data-bs-toggle="collapse" data-bs-target="#pb-{{ production_plan.root.pk }}" width="5%">{{ production_plan.root.quantity|floatformat }}x</td>
                 <td class="accordion-toggle align-middle"><span class="text-uppercase fw-bold"><a href="{% url 'workshop:product-detail' pk=production_plan.root.product.product_template.pk %}">{{ production_plan.root.product }}</a></span> ({{ production_plan.root.quantity|multiply:production_plan.root.product.weight|floatformat:0 }} g) {% include "workshop/includes/production_plan_state.html" with state_css_class=production_plan.root.get_state_css_class label=production_plan.root.get_state_display_value %}</td>
-                <td class="text-end">
-                    {% include "workshop/includes/production_plan_actions.html" with production_plan=production_plan.root btn_css="btn-sm" %}
-                </td>
+                <td class="text-end">{% include "workshop/includes/production_plan_actions.html" with production_plan=production_plan.root btn_css="btn-sm" %}</td>
             </tr>
             <tr class="tr-collapsed">
                 <td></td>
                 <td colspan="4">
                     <div class="collapse d-print-block{% if expand_all %} show{% endif %}" id="pb-{{ production_plan.root.pk }}">
-                        <table class="table table-sm table-borderless">
-                            <tbody>
-                                <tr>
-                                    <td width=33%">{% for child_plan in production_plan|get_item:'Hauptteig' %}
-                                        {% include "workshop/includes/production_plan_ingredients.html" with plan=child_plan %}
-                                        {% endfor %}
-                                    </td>
-                                    <td width="33%">{% for child_plan in production_plan|get_item:'Vorteig' %}
-                                        {% include "workshop/includes/production_plan_ingredients.html" with plan=child_plan %}
-                                        {% endfor %}
-                                    </td>
-                                    <td width="33%">{% for child_plan in production_plan|get_item:'Zubereitungen' %}
-                                        {% include "workshop/includes/production_plan_ingredients.html" with plan=child_plan %}
-                                        {% endfor %}
-                                    </td>
-                                </tr>
-                                <tr>
-                                    <td>
-                                        {% if not production_plan.root.is_locked %}
-                                        <a href="{% url 'workshop:production-plan-update' pk=production_plan.root.pk %}" class="btn btn-outline-primary btn-sm d-print-none"><i class="fas fa-sync-alt"></i> {% trans "Update plan" %}</a>
-                                        {% endif %}
-                                    </td>
-                                </tr>
-                            </tbody>
-                        </table>
+                        <div class="row">
+                            <div class="col-12 col-sm-6 col-lg-4">
+                                {% for child_plan in production_plan|get_item:'Hauptteig' %}
+                                    {% include "workshop/includes/production_plan_ingredients.html" with plan=child_plan %}
+                                {% endfor %}
+                            </div>
+                            <div class="col-12 col-sm-6 col-lg-4">
+                                {% for child_plan in production_plan|get_item:'Vorteig' %}
+                                    {% include "workshop/includes/production_plan_ingredients.html" with plan=child_plan %}
+                                {% endfor %}
+                            </div>
+                            <div class="col-12 col-sm-6 col-lg-4">
+                                {% for child_plan in production_plan|get_item:'Zubereitungen' %}
+                                    {% include "workshop/includes/production_plan_ingredients.html" with plan=child_plan %}
+                                {% endfor %}
+                            </div>
+                        </div>
+                        <div class="row mb-2">
+                            <div class="col">
+                                {% if not production_plan.root.is_locked %}
+                                <a href="{% url 'workshop:production-plan-update' pk=production_plan.root.pk %}" class="btn btn-outline-primary btn-sm d-print-none"><i class="fas fa-sync-alt"></i> {% trans "Update plan" %}</a>
+                                {% endif %}
+                            </div>
+                        </div>
                     </div>
                 </td>
             </tr>

diff --git a/locale/de_DE/LC_MESSAGES/django.mo b/locale/de_DE/LC_MESSAGES/django.mo
diff --git a/locale/de_DE/LC_MESSAGES/django.po b/locale/de_DE/LC_MESSAGES/django.po
@@ -815,7 +815,7 @@ msgstr "Tag"
 #: bakeup/templates/workshop/includes/dashboard.html:33
 #: bakeup/templates/workshop/includes/production_plan_table.html:12
 msgid "Qty"
-msgstr "Menge"
+msgstr "Qty"
 
 #: bakeup/templates/workshop/includes/dashboard.html:46
 msgid "Go to production plans"

diff --git a/locale/de_DE@formal/LC_MESSAGES/django.mo b/locale/de_DE@formal/LC_MESSAGES/django.mo
diff --git a/locale/de_DE@formal/LC_MESSAGES/django.po b/locale/de_DE@formal/LC_MESSAGES/django.po
@@ -850,7 +850,7 @@ msgstr "Tag"
 #: bakeup/templates/workshop/includes/dashboard.html:33
 #: bakeup/templates/workshop/includes/production_plan_table.html:12
 msgid "Qty"
-msgstr "Menge"
+msgstr "Qty"
 
 #: bakeup/templates/workshop/includes/dashboard.html:46
 msgid "Go to production plans"