Trudny / egzaminacyjny · lekcja 23

Projekt 4: System zamówień restauracji (Angular + EF Core, relacje)

Trzeci projekt to pełny system zarządzania menu i zamówieniami restauracji — najbardziej rozbudowany dotąd, łączący WSZYSTKIE elementy backendu z lekcji 13-19 (relacje w EF Core, sesje, przesyłanie plików) z pełnym interfejsem Angular. To dokładnie ten typ zad...

Zacznij tutaj

Po co się tego uczymy?

Trzeci projekt to pełny system zarządzania menu i zamówieniami restauracji — najbardziej rozbudowany dotąd, łączący WSZYSTKIE elementy backendu z lekcji 13-19 (relacje w EF Core, sesje, przesyłanie plików) z pełnym interfejsem Angular. To dokładnie ten typ zadania (CRUD z powiązanymi tabelami), jaki najczęściej pojawia się w części praktycznej egzaminu INF.04.

Wprowadzenie

Teoria

Wymagania projektu:

  • Menu restauracji podzielone na kategorie (Przystawki, Dania główne, Desery...) — relacja jeden-do-wielu między Kategoria a Danie (EF Core, lekcja 16);
  • Każde danie ma nazwę, cenę, opis i OPCJONALNIE zdjęcie (upload plików, lekcja 17);
  • Klient wybiera dania i tworzy zamówienie — relacja jeden-do-wielu między Zamowienie a PozycjaZamowienia (każda pozycja: danie + ilość);
  • Panel kelnera/administratora (Angular) do zarządzania menu (CRUD dań i kategorii) — pełny zestaw operacji: lista, dodawanie, edycja, usuwanie;
  • Lista złożonych zamówień ze statusem ("Przyjęte" / "W przygotowaniu" / "Gotowe") — aktualizowanym przez personel.

Model danych (4 powiązane klasy, C#):

public class Kategoria { public int Id; public string Nazwa; public List<Danie> Dania; }
public class Danie { public int Id; public string Nazwa; public double Cena; public string? SciezkaZdjecia;
                      public int KategoriaId; public Kategoria? Kategoria; }
public class Zamowienie { public int Id; public DateTime DataZlozenia; public string Status;
                           public List<PozycjaZamowienia> Pozycje; }
public class PozycjaZamowienia { public int Id; public int ZamowienieId; public int DanieId;
                                   public Danie? Danie; public int Ilosc; }

Struktura komponentów Angular (rozłożenie dużej aplikacji na mniejsze części, zgodnie z lekcją 8-9): MenuComponent (lista dań pogrupowana wg kategorii) → używa DanieKartaComponent (potomny, jedna pozycja menu z przyciskiem "Dodaj do zamówienia") → KoszykZamowieniaComponent (aktualnie składane zamówienie, serwis ZamowienieService współdzielony między komponentami) → PanelAdminComponent (CRUD zarządzania menu, chroniony — pełne logowanie wykracza poza zakres tego projektu, ale można dodać prosty ekran z hasłem jako rozszerzenie).

Relacja w praktyce — pobieranie zamówienia z pozycjami. context.Zamowienia.Include(z => z.Pozycje).ThenInclude(p => p.Danie).ToListAsync() — ThenInclude (nowość względem Include z lekcji 17) pozwala dociągnąć relację NA DRUGIM POZIOMIE zagnieżdżenia: nie tylko pozycje zamówienia, ale też danie przypisane do KAŻDEJ pozycji.

Zobacz zależności

Schemat

Kategoria (1) ──── (N) Danie                Zamowienie (1) ──── (N) PozycjaZamowienia (N) ──── (1) Danie
"Dania główne"        "Pierogi" 24.99zł         Zamówienie #7           2× Pierogi
                      "Schabowy" 32.00zł        Status: W przygotowaniu 1× Schabowy

Angular:
MenuComponent (rodzic)
  @for (kategoria of kategorie) {
    <h3>{{ kategoria.nazwa }}</h3>
    @for (danie of kategoria.dania; track danie.id) {
      <app-danie-karta [danie]="danie" (dodano)="dodajDoZamowienia($event)">
    }
  }
        │ @Output() dodano
        ▼
ZamowienieService (singleton, przechowuje aktualnie składane zamówienie)
        │
        ▼
KoszykZamowieniaComponent — pokazuje pozycje, sumę, przycisk "Złóż zamówienie"
        │  POST /api/zamowienia
        ▼
ASP.NET Core: ZamowieniaController → EF Core → SQLite

Połącz z praktyką

Przykład z życia

Aplikacje do składania zamówień w restauracjach (tablety przy stolikach, systemy dla kelnerów) działają dokładnie na tej zasadzie: menu podzielone na kategorie, możliwość dodania kilku pozycji do jednego zamówienia, i śledzenie statusu przygotowania — to jeden z najbardziej praktycznych, kompletnych przykładów systemu CRUD z relacjami w prawdziwym biznesie.