Hozz létre egy olyan alkalmazást, amiben táblázatos formában lehet ToDo-kat megjeleníteni!
Hozz létre egy user model-t is, az alábbi attribútumokkal:
id | title | progress | user name |
---|---|---|---|
6 | Write a home work for the class | in progress | Blaskovics Viktor |
3.1 a táblázat Bootstrap-el legyen formázva: https://getbootstrap.com/ Ebben a cikkben 3 út is van, hogy hogyan tudod hozzáadni a Bootstrap-et az Angular-hoz: https://www.techiediaries.com/angular-bootstrap/
3.2 Minden páros sor színe más legyen (pl. szürke)
3.3 Hozz létre dummy adatokat: legalább 5 Todo legyen a táblázatban, és legalább 3 user
Ha rákattintassz egy sorra, akkor a táblázat alatt jelenj meg egy details panel a kiválasztott ToDo részleteivel, valahogy így:
Details
Amikor a táblázatban kiválasztunk egy sort, és megjelenítjük a részleteit a Details panelen, és a kiválasztott todo-nak vannak alfeladatai, akkor az email alatt legyen egy "Sub-todos:" címke is, ami alatt fel vannak sorolva az alfeladatok title-jei!
Az alkalmazás kapjon egy nav bar-t, aminek a bal felső sarkában az alkalmazás neve szerepeljen, jobb sarkában pedig egy számláló, ami azt mutatja, hogy mennyi "In Progress" állapotú todo van a listában.
Bárhol(!), ahol megjelenik a ToDo állapota (Progress), az állapot mellett jelenjen meg egy kis gomb is, amire kattintva a todo a következő állapotba rakható, az alábbi sorrend szerint:
open => in progress => done => open
Pl: In Progress ⏩
A todo táblázat rendezhető legyen növekvő vagy csökkenő sorrendben a Progress oszlop szerint. (Pl. legyen egy kis gomb a Progress címke mellett a táblázat fejlécében, aminek két állapota lehet: ⬆️ vagy ⬇️)