[{"data":1,"prerenderedAt":143},["ShallowReactive",2],{"project-\u002Fpl\u002Fprojects\u002F2026\u002Fagrestapp":3,"project-posts-\u002Fpl\u002Fprojects\u002F2026\u002Fagrestapp":142},{"id":4,"title":5,"agency":6,"body":7,"compare":65,"cover":66,"date":72,"description":73,"draft":74,"extension":75,"facts":76,"featured":74,"gallery":90,"galleryLead":112,"highlights":113,"image":126,"links":127,"meta":129,"navigation":97,"note":130,"ogImage":131,"path":132,"seo":133,"stack":134,"stem":138,"tags":139,"__hash__":141},"projects_pl\u002Fpl\u002Fprojects\u002F2026\u002Fagrestapp\u002Findex.md","AgrestApp","Pesi",{"type":8,"value":9,"toc":60},"minimark",[10,14,19],[11,12,13],"p",{},"AgrestApp to system zakupów dla firm z branży spożywczej: zamówienia i przetargi na surowce, monitoring cen, oferty dostawców i analityka oszczędności. Pracuję przy nim w zespole Pesi od października 2025. Front-end w Vue 3 i Inertia tworzy kilka osób, dlatego poniżej opisuję tylko części, przy których front-end jest mój.",[15,16,18],"h2",{"id":17},"co-zrobiłem","Co zrobiłem",[20,21,22,30,36,42,48,54],"ul",{},[23,24,25,29],"li",{},[26,27,28],"strong",{},"Zestaw komponentów UI"," – przyciski, akordeon, podpowiedzi, pola liczbowe i 69 ikon jako komponenty Vue; przeniesienie przycisków aplikacji na jeden komponent i wspólny przełącznik motywu",[23,31,32,35],{},[26,33,34],{},"Strona firmowa"," – strona „O systemie”, zestaw sekcji, z których powstały strony dla piekarni, cukierni, lodziarni i HoReCa, kafelki cenowe i cennik z przełącznikiem płatności",[23,37,38,41],{},[26,39,40],{},"Analityka"," – główny wykres, wybór zakresu dat z trybem porównania, najlepsi dostawcy, podsumowanie oszczędności i rentowność produktów",[23,43,44,47],{},[26,45,46],{},"Zarządzanie ofertą dostawcy"," – rozbudowa istniejącego ekranu: okno ceny indywidualnej, dodawanie artykułów, praca z klawiatury i zaznaczanie zakresu",[23,49,50,53],{},[26,51,52],{},"Sklep"," (dziś zamknięty) – koszyk z minimum logistycznym każdego dostawcy, zakup bez konta, historia zamówień i reklamacje",[23,55,56,59],{},[26,57,58],{},"Migracja na Tailwind CSS v4"," całego projektu",{"title":61,"searchDepth":62,"depth":62,"links":63},"",2,[64],{"id":17,"depth":62,"text":18},null,{"desktop":67,"phone":68,"width":69,"height":70,"alt":71},"\u002Fprojects\u002F2026\u002Fagrestapp\u002Fhome-top.webp","\u002Fprojects\u002F2026\u002Fagrestapp\u002Fhome-phone-top.webp",1440,900,"AgrestApp – pierwszy ekran strony głównej","2026-10-01","System zakupów surowców dla piekarni, cukierni, lodziarni i gastronomii – w zespole Pesi robię front-end: komponenty UI, stronę firmową, analitykę i zarządzanie ofertą dostawcy.",false,"md",[77,81,84,87],{"value":78,"suffix":79,"text":80},"12"," mies.","w projekcie – od października 2025",{"value":82,"text":83},"69","ikon jako komponenty Vue w nowym zestawie UI",{"value":85,"text":86},"4","strony branżowe – piekarnie, cukiernie, lodziarnie i HoReCa – zbudowane z tych samych sekcji",{"value":88,"text":89},"296","klas w szablonach bez zmian przy przejściu na Tailwind v4",[91,95,100,104,108],{"src":92,"width":69,"height":70,"alt":93,"caption":94},"\u002Fprojects\u002F2026\u002Fagrestapp\u002Fanalytics-top.webp","Analityka w trybie porównania","Analityka – zakres dat z suwakiem i polami, porównanie dwóch okresów, oszczędności i wykres (zmyślone dane)",{"src":96,"full":97,"alt":98,"caption":99},"\u002Fprojects\u002F2026\u002Fagrestapp\u002Fhome-full.webp",true,"Strona główna AgrestApp","Strona główna – od pierwszego ekranu do newslettera",{"src":101,"full":97,"alt":102,"caption":103},"\u002Fprojects\u002F2026\u002Fagrestapp\u002Fabout-system-full.webp","Strona „O systemie”","„O systemie” – sekcje z opisem modułów",{"src":105,"full":97,"alt":106,"caption":107},"\u002Fprojects\u002F2026\u002Fagrestapp\u002Findustry-ice-cream-full.webp","Strona dla lodziarni","Strona branżowa dla lodziarni – zbudowana z tych samych sekcji co pozostałe",{"src":109,"full":97,"alt":110,"caption":111},"\u002Fprojects\u002F2026\u002Fagrestapp\u002Findustry-confectionery-full.webp","Strona dla cukierni","Strona branżowa dla cukierni","Strona firmowa i panel aplikacji – analityka na zmyślonych danych. Kliknij zrzut, żeby go powiększyć.",[114,117,120,123],{"title":115,"text":116},"Zakres dat w trzech miejscach naraz","W analityce suwak, pola dat i adres strony pokazują ten sam zakres. Zmiana w jednym miejscu od razu zmienia pozostałe, a dane odświeżają się dopiero chwilę po ostatniej zmianie. Kalendarz nie pozwala ustawić początku po końcu, a domyślny zakres zaczyna się w dniu rejestracji firmy.",{"title":118,"text":119},"Tabela cen jak arkusz","W zarządzaniu ofertą dostawcy Enter i strzałki przenoszą do pola w następnym wierszu, a jego zawartość jest od razu zaznaczona do nadpisania. Shift z kliknięciem zaznacza cały zakres wierszy, jak w poczcie.",{"title":121,"text":122},"Cena indywidualna bez pomyłek","Okno ceny indywidualnej pilnuje minimalnej ceny netto, nie przyjmuje zera ani pustej wartości i podpowiada wartość domyślną dla pojedynczej pozycji. Cena podświetla się na zielono, gdy jest niższa lub równa najniższej cenie.",{"title":124,"text":125},"Tailwind v4 bez przepisywania szablonów","Zamiast zmieniać setki klas przywróciłem w konfiguracji trzy wartości z v3. Potem porównałem wynikowy CSS z poprzednią wersją, przejrzałem strony i poprawiłem regresje, których nie zgłosił build – m.in. okna, które po migracji chowały się pod własnym przyciemnieniem.","\u002Fprojects\u002F2026\u002Fagrestapp\u002Fthumbnail.webp",{"live":128},"https:\u002F\u002Fagrestapp.pl",{},"Pracuję w zespole – opisuję tylko części, przy których front-end jest mój. Panel aplikacji nie jest publiczny.","\u002Fog\u002Fprojects\u002Fagrestapp-pl.jpg","\u002Fpl\u002Fprojects\u002F2026\u002Fagrestapp",{"title":5,"description":73},[135,136,137],"Vue 3","Inertia","Tailwind CSS v4","pl\u002Fprojects\u002F2026\u002Fagrestapp\u002Findex",[140],"vue","fT5qeNhYjuq5Ldv69UXSLqqJhIxyAi-kaAuSngKFV2g",[],1792087406074]