Changes between Version 17 and Version 18 of UseCaseImplementations
- Timestamp:
- 09/24/25 18:53:41 (3 weeks ago)
Legend:
- Unmodified
- Added
- Removed
- Modified
-
UseCaseImplementations
v17 v18 1 = UseCaseImplementations=1 == UseCaseImplementations == 2 2 3 3 || ИД || Use Case || Опис || … … 27 27 За регистрацијата е креиран URL кој го поврзува register view-то со соодветниот шаблон. Формуларот RegisterForm се користи за внес на корисничките податоци и нивна валидација. По успешно пополнување и зачувување на податоците, корисникот автоматски се логира, слично како кај LoginView, и се пренасочува на почетната страница. 28 28 29 [[Imagenajava_kod1.png)]] 30 [[Imagenajava_kod2.png)]] 31 29 [[Image(najava_kod1.jpg)]] 30 [[Image(najava_kod2.jpg)]] 32 31 33 32 == ИД 3 - Преглед на сите продукти == 34 33 Преглед на сите продукти: ова view ја прикажува листата на сите продукти со опции за пребарување, филтрирање по категории, продавници, цена и попусти, сортирање по различни критериуми, пагинација, прикажување слични продукти и одбележување на омилените продукти за логирани корисници. 35 34 36 [[Image(productlist_kod1. png)]]37 [[Image(productlist_kod2. png)]]38 [[Image(productlist_kod3. png)]]39 [[Image(productlist_kod4. png)]]40 [[Image(productlist_kod5. png)]]35 [[Image(productlist_kod1.jpg)]] 36 [[Image(productlist_kod2.jpg)]] 37 [[Image(productlist_kod3.jpg)]] 38 [[Image(productlist_kod4.jpg)]] 39 [[Image(productlist_kod5.jpg)]] 41 40 42 41 == ИД 4 - Филтрирање на продукти == 43 42 Овој JavaScript го управува филтерот за продукти. Секциите со филтри можат да се отвораат и затвораат, а при кликање надвор од филтрите тие автоматски се затвораат. Слајдерот за максимална цена ја прикажува моменталната вредност во реално време, а кога корисникот менува категории, продавници или сортирање, формуларот се испраќа автоматски за да се апдејтира листата на продукти без рефреш на страницата. 44 43 45 [[Image(filter_kod1. png)]]46 [[Image(filter_kod2. png)]]47 [[Image(filter_kod3. png)]]44 [[Image(filter_kod1.jpg)]] 45 [[Image(filter_kod2.jpg)]] 46 [[Image(filter_kod3.jpg)]] 48 47 49 48 == ИД 5 - Преглед детали за еден продукт == 50 49 Ова view ја прикажува деталната страница на еден продукт. Се вчитува продуктот по неговото ID, се извлекува историјата на цените од базата за креирање график, и се наоѓаат слични продукти. Сите овие податоци се проследуваат на шаблонот product_detail.html за прикажување на информациите и графикот со цените. 51 50 52 [[Image(productdetail_kod. png)]]51 [[Image(productdetail_kod.jpg)]] 53 52 54 53 == ИД 6 - Додавање продукт во листа == 55 54 Овој JavaScript го управува додавањето продукти во корисничката листа. Кога корисникот кликне на копчето ‘add to list’, се зема ID-то на продуктот и се праќа POST барање до /add-to-list/ преку fetch со JSON тело и CSRF токен за заштита. Серверот враќа JSON со статус; ако е успешен, се прикажува известување дека продуктот е додаден, а ако не, се прикажува грешка. На овој начин целата операција се случува без рефреш на страницата, што ја прави интеракцијата побрза и поинтерактивна. 56 55 57 [[Image(dodadivolista_kod1. png)]]58 [[Image(dodadivolista_kod2. png)]]56 [[Image(dodadivolista_kod1.jpg)]] 57 [[Image(dodadivolista_kod2.jpg)]] 59 58 60 59 == ИД 7 - Креирање нова листа на продукти == 61 60 Овој JavaScript управува создавањето на нови листи: при кликање на копчето за креирање се прикажува формуларот, а при кликање на ‘откажи’ се сокрива. Формуларот за листа се валидара локално (име не смее да е празно или подолго од 100 карактери) и се испраќа преку AJAX повик без рефреш на страницата. 62 [[Image(kreirajlista_kod1. png)]]63 [[Image(kreirajlista_kod2. png)]]64 [[Image(kreirajlista_kod3. png)]]61 [[Image(kreirajlista_kod1.jpg)]] 62 [[Image(kreirajlista_kod2.jpg)]] 63 [[Image(kreirajlista_kod3.jpg)]] 65 64 66 65 == ИД 8 - Преглед на сите листи на корисникот == 67 66 Ова view го прикажува сите листи на тековниот корисник. Ако корисникот е логирани, се вчитуваат неговите листи од базата и се прикажуваат во шаблонот lists.html. 68 67 69 [[Image(prikazlisti_kod. png)]]68 [[Image(prikazlisti_kod.jpg)]] 70 69 71 70 == ИД 9 - Уредување/бришење листа == 72 71 Овој view овозможува корисникот да ја избрише конкретната шопинг листа. Серверот најпрво ја наоѓа листата што соодветствува на дадениот list_id и припаѓа на тековниот корисник, а потоа, ако е примено POST барање, ја брише од базата и го пренасочува корисникот на прегледот на останатите листи. 73 72 74 [[Image(brishenjelista_kod.png)]] 75 73 [[Image(brishenjelista_kod.jpg)]] 76 74 77 75 == ИД 10 - Додавање продукт во омилени == 78 76 Овој use case овозможува корисникот да додава или отстранува производи од својата листа на омилени. Кога корисникот кликне на иконата за омилени, JavaScript-от праќа POST барање до серверот, кој проверува дали производот веќе е омилен и соодветно го додава или отстранува од базата. Статусот на омилените производи се прикажува веднаш на интерфејсот со промена на иконата и бојата, а ако корисникот е на страницата „Омилени“, се освежува листата за да се прикаже актуелната содржина. 79 77 80 [[Image(favorite_kod1. png)]]81 [[Image(favorite_kod2. png)]]82 [[Image(togglefav_kod1. png)]]83 [[Image(togglefav_kod2. png)]]84 [[Image(togglefav_kod3. png)]]78 [[Image(favorite_kod1.jpg)]] 79 [[Image(favorite_kod2.jpg)]] 80 [[Image(togglefav_kod1.jpg)]] 81 [[Image(togglefav_kod2.jpg)]] 82 [[Image(togglefav_kod3.jpg)]] 85 83 86 84 == ИД 11 - Преглед на омилени продукти == 87 85 Овој код ја прикажува листата на омилени продукти за тековниот најавен корисник. Тој ги влече омилените продукти од базата и ги предава на шаблонот favorites.html за прикажување на страницата. 88 [[Image(pregledfav_kod1. png)]]86 [[Image(pregledfav_kod1.jpg)]] 89 87 90 88 == ИД 12 - Отстранување продукт од омилени == … … 94 92 Функцијата stats_view ја прикажува статистиката за цените на одреден производ во избрана продавница. Таа ја пребарува базата според името на производот и продавницата, наоѓа точен натпревар или слични производи, и ги зема податоците за цените во зададен временски период. Потоа пресметува тековна, минимална, максимална и просечна цена, и ги предава овие информации за прикажување во шаблонот (stats.html). 95 93 96 [[Image(stats_kod1. png)]]97 [[Image(stats_kod2. png)]]98 [[Image(stats_kod3. png)]]99 [[Image(stats_kod4. png)]]100 [[Image(stats_kod5. png)]]101 [[Image(stats_kod6. png)]]94 [[Image(stats_kod1.jpg)]] 95 [[Image(stats_kod2.jpg)]] 96 [[Image(stats_kod3.jpg)]] 97 [[Image(stats_kod4.jpg)]] 98 [[Image(stats_kod5.jpg)]] 99 [[Image(stats_kod6.jpg)]] 102 100 103 101 == ИД 14 - Сортирање == 104 102 Кога корисникот избира нов критериум од select полето, се ажурира URL-от со новиот параметар sort и ресетира page на 1. На тој начин страницата се освежува и прикажува продукти сортирани според избраниот критериум без потреба за повторно рачно пребарување. 105 103 106 [[Image(sort_kod. png)]]104 [[Image(sort_kod.jpg)]] 107 105 108 106 == ИД 15 - Приказ на флаери за продукти кои се на попуст == 109 107 Овој скрипт управува со модален прозорец кој прикажува сите продукти на попуст за одредена продавница. Кога корисникот кликне на „Види ги сите“ копчето, се испраќа AJAX барање до backend (/get-store-products/) за да се добијат продуктите на попуст. Добиените продукти се прикажуваат динамички во модалниот прозорец со слики, имиња, стара и нова цена и процент на попуст. Доколку нема продукти на попуст, се прикажува порака „Нема достапни попусти“. 110 108 111 [[Image(flaeri_kod1. png)]]112 [[Image(flaeri_kod2. png)]]113 [[Image(flaeri_kod3. png)]]109 [[Image(flaeri_kod1.jpg)]] 110 [[Image(flaeri_kod2.jpg)]] 111 [[Image(flaeri_kod3.jpg)]] 114 112 115 113 == ИД 16 - Пребарување продукти со прилагодлив алгоритам == … … 120 118 На frontend-от, JavaScript кодот ги нормализира пребарувањата на корисникот со преведување од латиница во кирилица и автоматска корекција на честите печатни грешки. Ова овозможува пребарување без разлика дали корисникот внесува текст на латиница, кирилица или со грешки, а резултатот се испраќа до backend-от за да се прикажат соодветните продукти. 121 119 122 [[Image(alg_kod1.png)]] 123 [[Image(alg_kod2.png)]] 124 [[Image(alg_kod3.png)]] 125 [[Image(sim_kod1.png)]] 126 [[Image(sim_kod2.png)]] 127 [[Image(sim_kod3.png)]] 128 [[Image(sim_kod4.png)]] 129 120 [[Image(alg_kod1.jpg)]] 121 [[Image(alg_kod2.jpg)]] 122 [[Image(alg_kod3.jpg)]] 123 [[Image(sim_kod1.jpg)]] 124 [[Image(sim_kod2.jpg)]] 125 [[Image(sim_kod3.jpg)]] 126 [[Image(sim_kod4.jpg)]]