Autókölcsönző admin felület – Wheelzie
CRUD | Frontend | Vue.js
A Wheelzie egy Vue.js 3 alapú admin felület, amelyet egy autókölcsönző szolgáltatás igényeire szabtam. A projekt célja egy modern, könnyen kezelhető adminisztrációs rendszer létrehozása volt, amely segíti az autókölcsönzőket az ügyféladatok, foglalások és járművek kezelésében. Az alkalmazás öt fő oldallal rendelkezik: Kezdőoldal, Kliensek, Foglalások, Járművek és Jármű aloldal, amelyek mindegyike átlátható felületet és hatékony adatkezelési lehetőségeket biztosít.
A fejlesztés során Vue.js 3 Composition API-t használtam. A Vite build eszköz biztosította a gyors fejlesztési környezetet, míg a Tailwind CSS és a PrimeVue UI könyvtár együttes használata gondoskodott a felület letisztult és reszponzív megjelenéséről. Az alkalmazás olyan funkciókat kínál, mint a szabadszavas keresők, státusz alapú szűrések, listanézetek váltása, valamint az adatok egyszerű kezelhetősége felugró ablakokkal.
Kezdőoldal
A Kezdőoldal oldal az adminisztrátorok elsődleges információs központja. Itt találhatóak a szolgáltatás legfontosabb mutatói (KPI-ok), például:
- Teljes bevétel
- Kölcsönzött autók száma
- Új foglalások száma
- Foglalható autók száma
Egy táblázatban megjelennek a legfrissebb foglalások, amelyeket szabadszavas keresővel lehet átnézni. Ez az oldal a gyors döntéshozatal támogatását szolgálja.
Kliensek
A Kliensek oldalon az ügyfelek listáját kezelhetjük. A lista böngészését egy szabadszavas kereső teszi egyszerűvé. Új ügyfelek hozzáadására is van lehetőség, amit egy letisztult felugró ablak tesz intuitívvá. Az ügyfelek adatait szintén felugró ablakban lehet szerkeszteni, ami gyors és zökkenőmentes adatkezelést biztosít.
Foglalások
A Foglalások oldal az összes kölcsönzési foglalást tartalmazza. Az adminisztrátorok könnyedén kereshetnek a foglalások között szabadszavas kereső segítségével, de lehetőség van szűrni státusz alapján is. Ezen az oldalon új foglalásokat is fel lehet venni, ami lehetővé teszi az adminisztráció hatékonyságának növelését.
Járművek
Ez az oldal a leglátványosabb része az admin felületnek. A járművek listája itt érhető el, amely többféle szűrési lehetőséget kínál:
- Szabadszavas kereső
- Szűrés státusz és autótípus alapján
A felület támogatja a listanézet és rácsnézet közötti váltást, így az adminisztrátorok az igényeiknek megfelelő nézetet használhatják. Új járművek hozzáadása egy intuitív űrlapon keresztül történik.
Jármű aloldal
A járművek képére kattintva eljutunk a jármű aloldalára, ahol részletes információkat találunk az adott autóról. Ez az oldal különösen hasznos, ha egy konkrét autóval kapcsolatos adatokra van szükség, például a foglalási előzmények vagy a karbantartási állapot megtekintéséhez.
Próbáld Ki Te Magad!
- Élő Demó: Wheelzie autókölcsönző
- GitHub Repository: Tekintsd meg a kódot