Przedstawiony kod JavaScript wraz z biblioteką jQuery tworzy interaktywny formularz awizacji dla systemu magazynowego. Funkcja prepareForm generuje dynamiczny formularz HTML zawierający następujące elementy:
Funkcja przygotowuje formularz awizacji transportu w systemie magazynowym, wykorzystując dynamiczne generowanie elementów interfejsu. Głównym zadaniem jest sekwencyjne zbieranie danych od użytkownika poprzez interaktywne pola wyboru i walidację wprowadzanych wartości.
Formularz rozpoczyna się od wyboru lokalizacji - obiektu, magazynu i bramy, gdzie każdy kolejny krok zależy od poprzedniego wyboru. Po wybraniu kontrahenta i przewoźnika system prosi o określenie rodzaju awizacji oraz typu transportu, które wpływają na widoczność kolejnych pól.
istotna logika oblicza czas trwania operacji na podstawie ilości palet i rodzaju transportu - np. dla transportu kontenerowego (KTR) przy mniej niż 10 paletach przewiduje 120 minut, a przy większej ilości 180 minut. Mechanizm harmonogramowania sprawdza dostępność terminów w bazie danych i blokuje zapis jeśli wykryje kolizję czasową.
Warto zwrócić uwagę na integrację z zewnętrznymi komponentami jak kalendarz Androidowy i numeryczne pole wprowadzania danych. Po pomyślnej walidacji wszystkie informacje są pakowane w zapytanie SQL wykonujące procedurę składowaną sp_maw_calendar_ins, która aktualizuje kalendarz zdarzeń i generuje numer dokumentu Load Plan.
Formularz składa się z kilku głównych sekcji gdzie użytkownik wprowadza kolejno:
- Obiekt magazynowy wraz z opisem
- Magazyn z opisem
- Bramę dostawczą
- Kontrahenta poprzez pole wyszukiwania
- Przewoźnika przez pole wyszukiwania
- Rodzaj awizacji z rozwijanej listy
- Rodzaj transportu z rozwijanej listy
- Ilość palet jako pole numeryczne
- Datę dostawy z kalendarzem
- Godzinę dostawy
Formularz wykorzystuje zaawansowane mechanizmy walidacji oraz dynamicznie ukrywa i pokazuje kolejne pola w zależności od wprowadzonych danych. Na przykład pole wyboru przewoźnika pojawia się dopiero po wybraniu kontrahenta.
Funkcja saveFunc zapisuje wprowadzone dane wykonując procedurę składowaną sp_maw_calendar_ins. Zapisywane są wszystkie wprowadzone informacje wraz z wyliczonym czasem zakończenia awizacji zależnym od ilości palet oraz rodzaju transportu.
Dodatkowo kod zawiera funkcje pomocnicze:
- checkHours - sprawdza dostępność wybranych godzin
- setDateFromTo - wylicza czas zakończenia awizacji
- hidePartOfDom - ukrywa części formularza
- clearPage - czyści wprowadzone dane
- scrollToEndOfPage - przewija stronę do końca formularza
Cały interfejs został zaprojektowany z myślą o urządzeniach mobilnych wykorzystując klasy CSS z przedrostkiem „Mob”.