Toast

project/main/templates/main/base/base.html

@@ -5,6 +5,7 @@
     <meta name="viewport"
           content="width=100%, user-scalable=yes, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script>
     <script src="https://unpkg.com/htmx.org@1.9.11" integrity="sha384-0gxUXCCR8yv9FM2b+U3FDbsKthCI66oH5IA9fHppQq9DDMHuMauqq1ZHBpJxQ0J0" crossorigin="anonymous"></script>
     <title>{{ title or "Django-html demo" }}</title>
 </head>

project/main/templates/main/complex_form/container.html

@@ -2,27 +2,42 @@
 
 
 {% block content %}
-    <form class="row">
+    <form>
-        <div
+        <div class="row mb-4">
-            class="col"
+            <div
-            hx-post="{{ url("complex-form-handle-route-module") }}"
+                class="col-md-6"
-            hx-trigger="change"
+                hx-post="{{ url("complex-form-handle-route-module") }}"
-            hx-target="#route-module-content"
+                hx-trigger="change"
-        >
+                hx-target="#route-module-content"
-            <div id="route-module-content">
+            >
-                {% set state = form_state.route_module %}
+                <div id="route-module-content" class="h-100">
-                {% include "main/complex_form/route_module.html" %}
+                    {% set state = form_state.route_module %}
+                    {% include "main/complex_form/route_module.html" %}
+                </div>
+            </div>
+            <div
+                class="col"
+                hx-post="{{ url("complex-form-handle-reports") }}"
+                hx-trigger="change"
+                hx-target="#reports-content"
+            >
+                <div id="reports-content">
+                    {% set state = form_state.reports %}
+                    {% include "main/complex_form/reports.html" %}
+                </div>
             </div>
         </div>
-        <div
+        <div class="row">
-            class="col"
+            <div
-            hx-post="{{ url("complex-form-handle-reports") }}"
+                class="col-md-6"
-            hx-trigger="change"
+                hx-post="{{ url("complex-form-handle-warehouse-management") }}"
-            hx-target="#reports-content"
+                hx-trigger="change"
-        >
+                hx-target="#warehouse-management-content"
-            <div id="reports-content">
+            >
-                {% set state = form_state.reports %}
+                <div id="warehouse-management-content">
-                {% include "main/complex_form/reports.html" %}
+                    {% set state = form_state.warehouse_management %}
+                    {% include "main/complex_form/warehouse_management.html" %}
+                </div>
             </div>
         </div>
     </form>

project/main/templates/main/complex_form/reports.html

@@ -3,7 +3,7 @@
 {% set indent_1 = "ms-4" %}
 {% set indent_2 = "ms-5" %}
 
-<div class="card p-3">
+<div class="card p-3 h-100">
     {{ checkbox(
         title="Enable Reports",
         name="reports",

project/main/templates/main/complex_form/route_module.html

@@ -3,7 +3,7 @@
 {% set indent_1 = "ms-4" %}
 {% set indent_2 = "ms-5" %}
 
-<div class="card p-3">
+<div class="card p-3 h-100">
     {{ checkbox(
         title="Enable Route module",
         name="route_module",

project/main/templates/main/complex_form/warehouse_management.html

@@ -0,0 +1,58 @@
+{% from "main/components/inputs.html" import checkbox, select %}
+
+{% set indent_1 = "ms-4" %}
+{% set indent_2 = "ms-5" %}
+
+<div class="card p-3 h-100">
+    {{ checkbox(
+        title="Product warehouse",
+        name="product_warehouse",
+        state=state.product_warehouse
+    ) }}
+
+    {{ select(
+        title="Delivery option",
+        name="delivery_option",
+        options={
+            "direct": "Direct",
+            "vehicle": "Vehicle",
+        },
+        state=state.delivery_option,
+        cls=indent_1
+    ) }}
+    {{ checkbox(
+        title="Allow negative stock",
+        name="allow_negative_stock",
+        state=state.allow_negative_stock,
+        cls=indent_1
+    ) }}
+    {{ checkbox(
+        title="Route reserve stock",
+        name="route_reserve_stock",
+        state=state.route_reserve_stock,
+        cls=indent_1
+    ) }}
+    {{ checkbox(
+        title="Refill log",
+        name="refill_log",
+        state=state.refill_log,
+        cls=indent_1
+    ) }}
+    {{ checkbox(
+        title="Product order",
+        name="product_order",
+        state=state.product_order,
+        cls=indent_1
+    ) }}
+
+    {{ checkbox(
+        title="Spare parts warehouse",
+        name="spare_parts_warehouse",
+        state=state.spare_parts_warehouse
+    ) }}
+    {{ checkbox(
+        title="Purchase module",
+        name="purchase_module",
+        state=state.purchase_module
+    ) }}
+</div>

project/main/templates/main/components/toast.html

@@ -0,0 +1,9 @@
+{% macro toast(title, id) %}
+    <div class="toast-container position-absolute top-0 start-50 translate-middle-x mt-2">
+        <div id="{{ id }}" class="toast text-bg-success">
+            <div class="toast-body">
+                {{ title }}
+            </div>
+        </div>
+    </div>
+{% endmacro %}

project/main/templates/main/form_validation.html

@@ -1,19 +1,34 @@
 {% extends "main/base/layout.html" %}
+{% from "main/components/toast.html" import toast %}
 
 
 {% block content %}
-	<form
+    <form
-		hx-post="{{ url("form-validation") }}"
+        hx-post="{{ url("form-validation") }}"
-		hx-target="#validation-form-content"
+        hx-target="#validation-form-content"
-		hx-swap="outerHTML"
+        hx-swap="outerHTML"
-	>
+    >
-		<div class="card p-4">
+        <div class="card p-4">
-			{% include "main/form_validation_content.html" %}
+            {% include "main/form_validation_content.html" %}
-			<div class="d-flex">
+            <div class="d-flex">
-				<button type="submit" class="btn btn-success ms-auto">
+                <button type="submit" class="btn btn-success ms-auto">
-					Submit
+                    Submit
-				</button>
+                </button>
-			</div>
+            </div>
-		</div>
+        </div>
-	</form>
+    </form>
+
+    {{ toast(title="Form validated and saved successfully", id="toast-success") }}
+
+
+    <script>
+        let toastSuccess = null;
+
+        document.addEventListener("DOMContentLoaded", function () {
+            const toastElement = document.querySelector("#toast-success");
+            toastSuccess = new bootstrap.Toast(toastElement, {
+                delay: 3000,
+            })
+        });
+    </script>
 {% endblock %}

project/main/templates/main/form_validation_content.html

@@ -57,3 +57,10 @@
         {% endif %}
     </div>
 </div>
+
+
+{% if validation.is_valid %}
+    <script>
+        toastSuccess.show();
+    </script>
+{% endif %}

project/main/views/__init__.py

@@ -1,4 +1,9 @@
-from .complex_form.views import RouteModuleHandleView, ComplexFormView, ReportsHandleView
+from .complex_form.views import (
+    ComplexFormView,
+    ReportsHandleView,
+    RouteModuleHandleView,
+    WarehouseManagementHandleView,
+)
 from .filter_list import FilterListView
 from .form_validation import FormValidationView
 from .home import HomeView

project/main/views/complex_form/reports_state.py

@@ -19,7 +19,6 @@ class ReportsState:
 
     @staticmethod
     def from_form(values: dict[str, str]) -> "ReportsState":
-        print(values)
         return ReportsState(
             enabled=CheckboxState(checked=values.get("reports") == "on"),
             cash_conformity=CheckboxState(checked=values.get("cash_conformity") == "on"),
@@ -36,7 +35,7 @@ class ReportsState:
 
     def control_state(self) -> None:
         self.cash_conformity.enabled = self.enabled.checked
-        self.days_between_cc.enabled = self.cash_conformity.enabled and self.cash_conformity.checked
+        self.days_between_cc.visible = self.cash_conformity.enabled and self.cash_conformity.checked
         self.scan_2nd_bardcode.enabled = self.cash_conformity.enabled and self.cash_conformity.checked
         self.allow_empty_cashbag.enabled = self.enabled.checked
         self.reports_builder.enabled = self.enabled.checked

project/main/views/complex_form/views.py

@@ -7,6 +7,9 @@ from django.views.generic import TemplateView
 
 from project.main.views.complex_form.reports_state import ReportsState
 from project.main.views.complex_form.route_module_state import RouteModuleState
+from project.main.views.complex_form.warehouse_management_state import (
+    WarehouseManagementState,
+)
 from project.main.views.demo_view_base import DemoViewBase
 
 
@@ -14,10 +17,12 @@ from project.main.views.demo_view_base import DemoViewBase
 class FormState:
     route_module: RouteModuleState
     reports: ReportsState
+    warehouse_management: WarehouseManagementState
 
     def control_state(self) -> None:
         self.route_module.control_state()
         self.reports.control_state()
+        self.warehouse_management.control_state()
 
 
 class ComplexFormView(DemoViewBase):
@@ -31,6 +36,7 @@ class ComplexFormView(DemoViewBase):
         state = FormState(
             route_module=RouteModuleState.from_form(values={}),
             reports=ReportsState.from_form(values={}),
+            warehouse_management=WarehouseManagementState.from_form(values={}),
         )
         state.control_state()
 
@@ -71,3 +77,17 @@ class ReportsHandleView(TemplateView):
                 "state": state,
             }
         )
+
+
+class WarehouseManagementHandleView(TemplateView):
+    template_name = "main/complex_form/warehouse_management.html"
+
+    def post(self, request: WSGIRequest, *args, **kwargs) -> HttpResponse:
+        state = WarehouseManagementState.from_form(values=request.POST)
+        state.control_state()
+
+        return self.render_to_response(
+            context={
+                "state": state,
+            }
+        )

project/main/views/complex_form/warehouse_management_state.py

@@ -0,0 +1,48 @@
+from dataclasses import dataclass
+
+from project.main.views.complex_form.state_models import CheckboxState, SelectState
+
+
+@dataclass
+class WarehouseManagementState:
+    product_warehouse: CheckboxState
+    delivery_option: SelectState
+    allow_negative_stock: CheckboxState
+    route_reserve_stock: CheckboxState
+    refill_log: CheckboxState
+    product_order: CheckboxState
+    spare_parts_warehouse: CheckboxState
+    purchase_module: CheckboxState
+
+    @staticmethod
+    def from_form(values: dict[str, str]) -> "WarehouseManagementState":
+        return WarehouseManagementState(
+            product_warehouse=CheckboxState(
+                checked=values.get("product_warehouse") == "on"
+            ),
+            delivery_option=SelectState(value=values.get("delivery_option")),
+            allow_negative_stock=CheckboxState(
+                checked=values.get("allow_negative_stock") == "on"
+            ),
+            route_reserve_stock=CheckboxState(
+                checked=values.get("route_reserve_stock") == "on"
+            ),
+            refill_log=CheckboxState(checked=values.get("refill_log") == "on"),
+            product_order=CheckboxState(checked=values.get("product_order") == "on"),
+            spare_parts_warehouse=CheckboxState(
+                checked=values.get("spare_parts_warehouse") == "on"
+            ),
+            purchase_module=CheckboxState(
+                checked=values.get("purchase_module") == "on"
+            ),
+        )
+
+    def control_state(self) -> None:
+        self.delivery_option.visible = self.product_warehouse.checked
+        self.allow_negative_stock.visible = self.product_warehouse.checked
+        self.route_reserve_stock.visible = self.product_warehouse.checked
+        self.refill_log.visible = self.product_warehouse.checked
+        self.product_order.visible = self.product_warehouse.checked
+        self.purchase_module.enabled = (
+            self.product_warehouse.checked or self.spare_parts_warehouse.checked
+        )

project/main/views/form_validation.py

@@ -11,6 +11,7 @@ from project.main.views.demo_view_base import DemoViewBase
 @dataclass
 class Validation:
     validated: bool = False
+    is_valid: bool = False
 
     name: Optional[str] = None
     consent: Optional[bool] = None
@@ -57,6 +58,10 @@ class FormValidationView(DemoViewBase):
         if not validation.consent:
             validation.consent_error = "You should consent"
 
+        validation.is_valid = not (
+            validation.name_error or validation.age_error or validation.consent_error
+        )
+
         return render(
             context={
                 "validation": validation,

project/urls.py

@@ -10,5 +10,6 @@ urlpatterns = [
     path("complex-form", views.ComplexFormView.as_view(), name="complex-form"),
     path("complex-form/handle/route-module", views.RouteModuleHandleView.as_view(), name="complex-form-handle-route-module"),
     path("complex-form/handle/reports", views.ReportsHandleView.as_view(), name="complex-form-handle-reports"),
+    path("complex-form/handle/warehouse-management", views.WarehouseManagementHandleView.as_view(), name="complex-form-handle-warehouse-management"),
     path("table-inline-edit", views.TableInlineEditView.as_view(), name="table-inline-edit"),
 ]