sboulahtit/orion
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

migrating vendor frontend to new architecture

Browse Source
This commit is contained in:
Samir Boulahtit
2025-10-28 22:58:55 +01:00
parent b0cc0385f8
commit cd5097fc04
28 changed files with 312 additions and 228 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
docs/__REVAMPING/FRONTEND/FRONTEND_ARCHITECTURE_OVERVIEW.txt
View File

@@ -157,20 +157,20 @@ HTML template connects to Alpine.js component:
│ vendor-edit.html │
├─────────────────────────────────────────────────────────────┤
│ {% extends "admin/base.html" %} │
│ │
│ {# This binds to the JavaScript function #} │
│ {% block alpine_data %}adminVendorEdit(){% endblock %} │
│ │
│ {# This binds to the JavaScript function #} │
│ {% block alpine_data %}adminVendorEdit(){% endblock %} │
│ └──────────────────┐ │
│ {% block content %} │ │
│ <div x-show="loading">Loading...</div> │ │
│ <div x-show="!loading"> │ │
│ <p x-text="vendor.name"></p> ← Reactive binding │ │
│ <p x-text="vendor.name"></p> ← Reactive binding │ │
│ </div> │ │
│ {% endblock %} │ │
│ │ │
│ {% block extra_scripts %} │ │
│ <script src="...vendor-edit.js"></script> ──────────┐ │ │
│ {% endblock %} │ │ │
│ {% block extra_scripts %} │ │
│ <script src="...vendor-edit.js"></script> ──────────┐ │ │
│ {% endblock %} │ │ │
└───────────────────────────────────────────────────────│──│─┘
│ │
│ │
@@ -178,14 +178,14 @@ HTML template connects to Alpine.js component:
│ vendor-edit.js │ │ │
├───────────────────────────────────────────────────────│──│─┤
│ function adminVendorEdit() { ◄────────────────────────┘ │ │
│ return { │ │
│ ...data(), │ │
│ return { │ │
│ ...data(), │ │
│ vendor: null, ← Bound to x-text="vendor.name"│ │
│ loading: false, ← Bound to x-show="loading" │ │
│ async init() {...} │ │
│ }; │ │
│ } │ │
└───────────────────────────────────────────────────────────┘
│ async init() {...} │ │
│ }; │ │
│ } │ │
└──────────────────────────────────────────────────────────┘
🔄 PAGE LIFECYCLE