Skip to content

PstasDev/f-igazolas

BranchesTags

Repository files navigation

🎓 Igazoláskezelő (f-igazolas)

Kőbányai Szent László Gimnázium - F Tagozat Igazoláskezelő Rendszer

Központi platform hiányzások, késések és stúdiós távollétek kezelésére

Next.js TypeScript Tailwind CSS Django

🚀 Áttekintés

Az Igazoláskezelő (f-igazolas) egy átfogó igazoláskezelő rendszer, amelyet kifejezetten a Kőbányai Szent László Gimnázium F tagozata (Osztott Informatika-Média) számára fejlesztettek. A rendszer célja, hogy központosítsa és egyszerűsítse az osztályfőnökök munkáját a különböző típusú hiányzások kezelésében.

🎯 A Probléma, Amit Megold

Korábban:

  • 📧 Hiányzások Google Form-okon, Messengeren és Gmail-en keresztül érkeztek be
  • 🎬 FTV Forgatásszervezési Platform külön figyelése szükséges volt
  • 📝 Minden osztálynak külön Google Form volt a stúdiós távollétek követésére
  • ⌨️ Ezeket mind manuálisan kell rögzíteni az eKréta Digitális Naplóba
  • 🔄 Széttagolt, nehezen követhető rendszer

Most:

  • ✅ Egy központi felület minden típusú hiányzásra
  • 🎬 FTV integrált forgatási távollétek kezelése
  • 🚇 BKK integráció közlekedési késések automatikus hitelesítésére (kísérleti)
  • 📊 Strukturált, átlátható adminisztráció

✨ Főbb Funkciók

📋 Igazoláskezelés

  • 📄 Általános Hiányzások - Betegség, családi okok, egyéb
  • 🎬 Stúdiós Távollétek - FTV forgatási igazolások
  • 🚇 Közlekedési Késések - BKK integrációval hitelesített késések
  • 📊 Központi Dashboard - Minden igazolás egy helyen
  • ✅ Jóváhagyás/Elutasítás - Gyors döntéshozatal

👥 Szerepkörök

  • 🎯 Diák Felület - Egyszerű igazolás beadás, státusz követés
  • 👨‍🏫 Osztályfőnöki Felület - Áttekintés, jóváhagyás, kezelés

🚇 BKK Integráció (Kísérleti Innováció)

  • 📡 Forgalmi Zavarok - Valós idejű BKK riasztások nyomonkövetése
  • 🚍 Jármű Információk - Menetrend módosítások és késések hitelesítése
  • ✅ Automatikus Validáció - Diák késések összevetése valós BKK eseményekkel

🎨 Modern Felület

  • 🌓 Világos/Sötét Téma - Egyedi témák támogatása
  • 📱 Reszponzív Design - Mobil, tablet, desktop
  • 🚦 Közlekedési Ikonok - Teljes BKK vonal ikonkészlet
  • 🗂️ Export/Import - CSV, TSV és XLSX támogatás

🛠️ Technológiai Stack

Frontend (Ez a Repository)

Backend

  • Repository: PstasDev/f-igazolas-backend
  • Keretrendszer: Django
  • API: NinjaAPI
  • Adatbázis: SQLite (vagy környezet szerinti)
  • BKK API Integráció: GTFS-RT protokoll, GTFS protokoll, OpenData API és állandó megálló-, valamint járatinformációk

📦 Kezdő Lépések

Előfeltételek

  • Node.js 20.x vagy újabb
  • npm vagy yarn vagy pnpm

Telepítés

  1. Repository klónozása
git clone https://github.com/PstasDev/f-igazolas.git
cd f-igazolas
  1. Függőségek telepítése
npm install
  1. Fejlesztői szerver indítása
npm run dev
  1. Böngésző megnyitása
http://localhost:3000

Éles Build Készítése

npm run build
npm start

🏗️ Projekt Struktúra

f-igazolas/
├── app/
│   ├── components/          # Megosztott alkalmazás komponensek
│   │   ├── Footer.tsx
│   │   ├── Header.tsx
│   │   └── Navigation.tsx
│   ├── context/             # React context-ek
│   │   ├── RoleContext.tsx  # Diák/Tanár szerepkör kezelés
│   │   └── ThemeContext.tsx # Téma váltás
│   ├── dashboard/           # Fő dashboard
│   │   ├── student/        # Diák nézetek (igazolás beadás)
│   │   ├── teacher/        # Tanári nézetek (jóváhagyás, kezelés)
│   │   └── data.json       # Minta adatok
│   ├── login/              # Bejelentkezés
│   └── utmutato/           # Felhasználói útmutatók
│       ├── tanuloi/        # Diák kézikönyv
│       └── osztalyfonoki/  # Osztályfőnöki kézikönyv
├── components/
│   ├── ui/                 # Újrafelhasználható UI komponensek
│   │   ├── BKKAlertCard.tsx        # BKK forgalmi zavar kártyák
│   │   ├── BKKVerificationCard.tsx # Késés hitelesítés
│   │   ├── RouteBadge.tsx          # Járat badge-ek
│   │   └── ...
│   └── icons/              # Közlekedési ikonok
│       ├── MetroIcon.tsx   # M1, M2, M3, M4 metró
│       ├── BuszIcon.tsx    # Busz vonalak
│       ├── VillamosIcon.tsx # Villamos vonalak
│       └── ...             # Trolibusz, HÉV, hajó, vonat
├── lib/
│   ├── bkk-processor.ts    # BKK GTFS-RT adat feldolgozás
│   ├── bkk-types.ts        # TypeScript típusok a BKK API-hoz
│   ├── bkk-verification-schema.ts # Késés validációs logika
│   ├── hungarian-grammar.ts # Magyar nyelvi segédeszközök
│   ├── periods.ts          # Iskolai órarend/tanítási órák logika
│   └── api.ts              # Backend API kommunikáció
├── hooks/
│   └── use-ftv-sync.ts     # FTV forgatás szinkronizálás
└── public/
    ├── BKK Examples/       # Minta BKK API válaszok (fejlesztéshez)
    └── icons/              # Statikus eszközök (logo, stb.)

🚦 BKK Integráció (Kísérleti Innováció)

A rendszer innovatív módon integrálja a BKK (Budapesti Közlekedési Központ) GTFS-RT API-ját, amely egy kísérleti funkció a közlekedési késések automatikus hitelesítésére.

🎯 Funkciók

1️⃣ Forgalmi Zavarok Követése

  • 📡 Valós idejű riasztások lekérése szolgáltatási zavarokról
  • � Útvonalzárások, pótlóbuszok, rendkívüli események
  • 📍 Érintett megállók és járatok azonosítása

2️⃣ Menetrend Módosítások (Késések)

  • 🚇 Járművek pozíciójának és késéseinek valós idejű követése
  • ⏱️ Pontos késési idők rögzítése
  • 🗺️ Diák útvonalak és időzítések validálása

3️⃣ Automatikus Hitelesítés

  • ✅ Diák késések összevetése valós BKK eseményekkel
  • 🔍 Útvonal, időpont és késési okok ellenőrzése
  • 📊 Hitelesítési részletek automatikus rögzítése

🔗 API Végpontok

Az alábbi BKK GTFS-RT végpontokat használja a backend (API kulcs szükséges - igénylés itt):

# Riasztások (Forgalmi zavarok)
https://go.bkk.hu/api/query/v1/ws/gtfs-rt/full/Alerts.pb?key=API_KULCS

# Járműpozíciók
https://go.bkk.hu/api/query/v1/ws/gtfs-rt/full/VehiclePositions.pb?key=API_KULCS

# Menetrendi Frissítések (Késések)
https://go.bkk.hu/api/query/v1/ws/gtfs-rt/full/TripUpdates.pb?key=API_KULCS

📂 Fejlesztői Példák

Példa BKK API válaszok találhatók a public/BKK Examples/ mappában:

  • Alerts.txt - Forgalmi zavarok, figyelmeztetések
  • VehiclePositions.txt - Járművek pozíciói
  • TripUpdates.txt - Menetrend módosítások, késések

Ezek segítenek a fejlesztésben és tesztelésben, API kulcs nélkül is.

🔄 Működés

  1. Diák bejelenti a közlekedési késést az applikációban
  2. Megadja az érintett járatot, útvonalat és időpontot
  3. Backend lekéri a BKK valós idejű adatokat
  4. Rendszer összekapcsolja a bejelentést a BKK eseményekkel
  5. Automatikus hitelesítés vagy további ellenőrzés szükségessége
  6. Osztályfőnök látja a hitelesítési részleteket és jóváhagyja

👥 Felhasználói Szerepkörök

🎒 Diákok (F Tagozatos Tanulók)

  • 📝 Igazolás Beadás - Egyszerű, intuitív űrlapok
    • Általános hiányzások (betegség, családi ok, egyéb)
    • Stúdiós távollétek (FTV forgatások)
    • Közlekedési késések (BKK adatokkal)
  • 📊 Státusz Követés - Beadott igazolások állapotának nyomon követése
  • 📜 Előzmények - Összes korábbi igazolás megtekintése
  • ✅ Visszajelzés - Jóváhagyási/elutasítási értesítések

👨‍🏫 Osztályfőnökök

  • 📋 Központi Áttekintés - Összes diák igazolásának egy helyen való kezelése
  • ✅ Jóváhagyás/Elutasítás - Gyors döntéshozatal részletes információkkal
  • 🔍 BKK Hitelesítés - Közlekedési késések automatikus validációjának megtekintése
  • 📤 Export Funkció - Adatok exportálása eKréta rögzítéshez (XLSX)
  • 👥 Diák Kezelés - Diák adatok, FTV státusz kezelése
  • 📈 Jelentések - Összesítések időszak szerint

🎬 FTV Integráció

  • 🎥 Forgatási Naptár - FTV forgatások nyomon követése
  • 📅 Automatikus Szinkronizálás - FTV platform adatok beolvasása

🎨 Dizájn Rendszer

Színpaletta

  • Témák: Világos és sötét mód támogatás
  • BKK Vonalszínek: Autentikus színek metró/villamos/busz vonalakhoz, Arculati útmutatónak megfelelő ikonok és pályaszámok

Tipográfia

  • Szövegtörzs: Noto Sans
  • Címsorok: Playfair Display (elegáns talpas betű)

🔧 Konfiguráció

Környezeti Változók

Frontend .env.local fájl:

# Backend API
NEXT_PUBLIC_API_URL=http://localhost:8000/api

# BKK API Kulcs (backend használja, opcionális frontendhez)
NEXT_PUBLIC_BKK_API_KEY=api_kulcsod_ide

Vercel Telepítés

  1. Frontend telepítése:

    • Push GitHub-ra
    • Importálás Vercel-be
    • Környezeti változók beállítása
    • Automatikus telepítés

  2. Backend telepítés (ajánlott: Railway, Render, vagy VPS):

    • Django backend külön szerveren
    • Környezeti változók konfigurálása

🤝 Közreműködés

A közreműködéseket szívesen fogadjuk! Pull Request-eket várunk.

  1. Fork-old a repository-t
  2. Hozd létre a feature ágadat (git checkout -b feature/UjFunkció)
  3. Commit-old a változtatásaidat (git commit -m '✨ Új funkció hozzáadása')
  4. Push-old az ágra (git push origin feature/UjFunkció)
  5. Nyiss egy Pull Request-et

🐛 Hibajelentés

Ha hibát találsz, kérjük nyiss egy Issue-t a következő információkkal:

  • Hiba leírása
  • Lépések a reprodukáláshoz
  • Elvárt működés
  • Képernyőképek (ha releváns)

📚 Dokumentáció

📄 Licensz

Ez a projekt a Kőbányai Szent László Gimnázium belső használatára készült.

💙 Készítette: Balla Botond (PstasDev), a 23F osztály tanulója

❤️ A Kőbányai Szent László Gimnázium F Tagozata számára

🐛 Hiba Bejelentése · 💡 Funkció Kérése · 📖 Backend Repo

About

A Kőbányai Szent László Gimnázium F Tagozatának Igazoláskezelő rendszerének Next.js frontendje

igazolas.szlg.info

Resources

Readme
Activity

Stars

0 stars

Watchers

0 watching

Forks

0 forks
Report repository

Languages