[ otwórz bilet → ]
$ cat ./docs/teplohub-mobile.v1
// architektura_systemu / role_nawigacja_kosztorysy

TeploHub: Tworzenie kosztorysów i mobilne planowanie dla usług HVAC

Klient
TeploHub (Instalacje grzewcze i hydrauliczne)
Architektura
Dostęp rolny (Dyrektor / Pracownik)
Platformy
Android / iOS / Klient Web
Status
Production Live (Działa produkcyjnie)

Wyzwanie Biznesowe

TeploHub specjalizuje się w projektowaniu, montażu i serwisie pomp ciepła, ogrzewania podłogowego, kotłów i systemów kanalizacyjnych. Z ponad 800 ukończonymi projektami, ręczne wyliczanie materiałów, czasochłonne sporządzanie kosztorysów dla klientów oraz koordynacja pracowników terenowych stały się wąskim gardłem. Potrzebowali zintegrowanego rozwiązania mobilnego i internetowego do zarządzania bazą klientów, szczegółowym katalogiem materiałów oraz natychmiastowego generowania profesjonalnych kosztorysów PDF bezpośrednio na budowie.

Panel dyrektora TeploHub

Architektura i stos technologiczny

Zbudowaliśmy wydajny system wieloplatformowy oparty na **Expo SDK 56 (React Native)** oraz **React 19**, dzieląc bazę kodu między aplikacjami mobilnymi a narzędziami internetowymi dyrektora.

  • Frontend: React Native + Expo Router v4 (TSX / TypeScript)
  • Stylizowanie: Styled Components (style natywne)
  • Backend: Firebase (Auth, Firestore, Storage, Hosting)
  • Generator PDF: Kliencki bezserwerowy kompilator ofert handlowych
  • Ikony: Lucide React Native

Główne moduły techniczne

Dyrektor może wygenerować szczegółowy kosztorys instalacji ogrzewania podłogowego lub pompy ciepła bezpośrednio ze swojego smartfona. Aplikacja automatycznie zlicza ilości, pobiera ceny z katalogu, tworzy markowy dokument PDF i oferuje wysłanie go do klienta za pomocą wbudowanego udostępniania (WhatsApp, Email itp.).

Hydraulicy i instalatorzy w terenie widzą swój harmonogram i przypisane zadania. Otrzymują natychmiastowe powiadomienia push z Firebase o aktualizacji zadań i mogą zmieniać etapy prac bezpośrednio na budowie.

Ekran główny aplikacji TeploHub
Lista zleceń w aplikacji
Tworzenie nowego zlecenia
Menu aplikacji mobilnej

Wewnętrzny uporządkowany katalog rur, złączek, kotłów oraz usług. System zapisuje dane lokalnie w pamięci podręcznej, co pozwala na wyszukiwanie cen i towarów nawet w piwnicach nowo budowanych domów bez dostępu do Internetu.

Interaktywny panel analityczny wyświetlający całkowity obrót, średnią wartość kosztorysu, aktywne budowy w podziale na instalatorów oraz finansowy status zleceń w czasie rzeczywistym.

Interfejs zarządzania zleceniami

Synchronizacja danych w czasie rzeczywistym

Dzięki synchronizacji na żywo z Firestore, dyrektor natychmiast otrzymuje powiadomienia, gdy monter w terenie zmienia status prac, dodaje raport fotograficzny lub zgłasza potrzebę zamówienia dodatkowych części.

  • Błyskawiczny kontakt: Aktualizacja etapów prac bez zbędnych telefonów do biura.
  • Tryb Offline: Możliwość tworzenia szkiców zamówień bez zasięgu (auto-synchronizacja po połączeniu z siecią).
  • Bezpieczeństwo danych: Rygorystyczne reguły Firestore ograniczające dostęp do danych finansowych firmy w zależności od roli.
Panel analityki na komputerze
Analityka w aplikacji TeploHub
Katalog towarów na komputerze
Katalog w aplikacji mobilnej

Podział funkcji według ról

  • Zarządzanie klientami: Tworzenie kart klientów, przypisywanie obiektów budowlanych
  • Tworzenie kosztorysów: Dodawanie pozycji, kalkulacja cen, generowanie PDF
  • Zarządzanie katalogiem: Edycja cennika usług oraz bazy produktów hydraulicznych
  • Koordynacja pracowników: Przydzielanie zleceń aktywnym instalatorom
  • Lista zadań: Widok zleceń przydzielonych na dany dzień/tydzień
  • Zmiana statusu: Aktualizacja statusu zadania za pomocą 1 kliknięcia (Oczekuje/W toku/Wykonano)
  • Podgląd kosztorysu: Wgląd w listę urządzeń montowanych na danym obiekcie
────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
SILNIK
Expo 56
BACKEND
Firebase
PDF CLIENT
Auto-generacja
STYLE
Styled Comp.
────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
[ ← powrót do projektów ]