diff options
Diffstat (limited to 'ufund-ui/src/app/components/need-list/need-list.component.ts')
| -rw-r--r-- | ufund-ui/src/app/components/need-list/need-list.component.ts | 212 |
1 files changed, 109 insertions, 103 deletions
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts index 25f05d6..3a89a20 100644 --- a/ufund-ui/src/app/components/need-list/need-list.component.ts +++ b/ufund-ui/src/app/components/need-list/need-list.component.ts @@ -1,132 +1,138 @@ -import { Component } from '@angular/core'; +import {Component} from '@angular/core'; import {Need} from '../../models/Need'; import {CupboardService} from '../../services/cupboard.service'; -import { UsersService } from '../../services/users.service'; -import { userType } from '../../models/User'; +import {UsersService} from '../../services/users.service'; +import {userType} from '../../models/User'; +import {catchError, of} from 'rxjs'; +import {AuthService} from '../../services/auth.service'; + @Component({ - selector: 'app-need-list', - standalone: false, - templateUrl: './need-list.component.html', - styleUrl: './need-list.component.css' + selector: 'app-need-list', + standalone: false, + templateUrl: './need-list.component.html', + styleUrl: './need-list.component.css' }) export class NeedListComponent { - needs: Need[] = []; - searchResults: Need[] = []; + needs: Need[] = []; + searchResults: Need[] = []; - constructor( - private cupboardService: CupboardService, - private usersService: UsersService - ) {} + constructor( + private cupboardService: CupboardService, + private usersService: UsersService, + private authService: AuthService + ) {} refresh() { this.cupboardService.getNeeds().subscribe(n => this.needs = n) } - ngOnInit(): void { - this.refresh() - - this.close(); - } + ngOnInit(): void { + this.refresh() - private showElement(element: any) { - if (element){ - element.style.visibility = 'visible'; - element.style.position = 'relative'; + this.close(); } - } - private hideElement(element: any) { - if (element){ - element.style.visibility = 'hidden'; - element.style.position = 'absolute'; + private showElement(element: any) { + if (element) { + element.style.visibility = 'visible'; + element.style.position = 'relative'; + } } - } - private updateSearchStatus(text: string) { - let element = document.getElementById('search-status'); - if (element) { - element.innerHTML = text; + private hideElement(element: any) { + if (element) { + element.style.visibility = 'hidden'; + element.style.position = 'absolute'; + } } - } - open() { - this.hideElement(document.getElementById('search-button')); - this.showElement(document.getElementById('search-form')); - } + private updateSearchStatus(text: string) { + let element = document.getElementById('search-status'); + if (element) { + element.innerHTML = text; + } + } - close() { - this.hideElement(document.getElementById('search-form')); - this.showElement(document.getElementById('search-button')); - this.hideElement(document.getElementById('search-status')); - } + open() { + this.hideElement(document.getElementById('search-button')); + this.showElement(document.getElementById('search-form')); + } - private searchDelay: any; + close() { + this.hideElement(document.getElementById('search-form')); + this.showElement(document.getElementById('search-button')); + this.hideElement(document.getElementById('search-status')); + } - async search(form: any) { - //wait .25 seconds before searching but cancel if another search is made during the wait to prevent too many api calls + private searchDelay: any; - //remove previous search if it exists - if (this.searchDelay) { - clearTimeout(this.searchDelay); - } + async search(form: any) { + //wait .25 seconds before searching but cancel if another search is made during the wait to prevent too many api calls - this.searchDelay = setTimeout(() => { - const currentSearchValue = form.search; //latest value of the search - this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => { - this.searchResults = n; - console.log(currentSearchValue, this.searchResults); - this.showElement(document.getElementById('search-results')); - this.showElement(document.getElementById('search-status')); - if (this.searchResults.length === this.needs.length) { - this.updateSearchStatus("Please refine your search"); - this.searchResults = []; - } else if (this.searchResults.length === 0) { - this.updateSearchStatus("No results found"); - } else { - this.updateSearchStatus("Search results:"); + //remove previous search if it exists + if (this.searchDelay) { + clearTimeout(this.searchDelay); } - }); - }, 250); - } - - delete(id : number) { - this.cupboardService.deleteNeed(id).subscribe(() => { - this.needs = this.needs.filter(n => n.id !== id) - }) - } - - isManager() { - const type = this.usersService.getCurrentUser()?.type; - return type === ("MANAGER" as unknown as userType); - } - - isHelper() { - const type = this.usersService.getCurrentUser()?.type; - return type === ("HELPER" as unknown as userType); - } - - add(need: Need) { - const currentUser = this.usersService.getCurrentUser(); - //console.log("get current user in angular:", currentUser) - if (currentUser) { - if (!currentUser.basket.includes(need.id)) { - currentUser.basket.push(need.id); - this.usersService.updateUser(currentUser).subscribe(() => { - this.usersService.refreshBasket(); - error: (err: any) => { - console.error(err); - } - }); - } else { - window.alert("This need is already in your basket!") - } - + this.searchDelay = setTimeout(() => { + const currentSearchValue = form.search; //latest value of the search + this.cupboardService.searchNeeds(currentSearchValue).subscribe((n) => { + this.searchResults = n; + console.log(currentSearchValue, this.searchResults); + this.showElement(document.getElementById('search-results')); + this.showElement(document.getElementById('search-status')); + if (this.searchResults.length === this.needs.length) { + this.updateSearchStatus("Please refine your search"); + this.searchResults = []; + } else if (this.searchResults.length === 0) { + this.updateSearchStatus("No results found"); + } else { + this.updateSearchStatus("Search results:"); + } + }); + }, 250); + } + + delete(id: number) { + this.cupboardService.deleteNeed(id).subscribe(() => { + this.needs = this.needs.filter(n => n.id !== id) + }) } - } + isManager() { + const type = this.authService.getCurrentUser()?.type; + return type === ("MANAGER" as unknown as userType); + } + + isHelper() { + const type = this.authService.getCurrentUser()?.type; + return type === ("HELPER" as unknown as userType); + } + + add(need: Need) { + const currentUser = this.authService.getCurrentUser(); + //console.log("get current user in angular:", currentUser) + if (currentUser) { + if (!currentUser.basket.includes(need.id)) { + currentUser.basket.push(need.id); + this.usersService.updateUser(currentUser) + .pipe(catchError((err: any, _) => { + console.error(err); + return of(); + })) + .subscribe(() => { + this.usersService.refreshBasket(); + }); + } else { + window.alert("This need is already in your basket!") + } + - back() { - this.searchResults = []; - } + } + + } + + back() { + this.searchResults = []; + } } |