diff options
Diffstat (limited to 'ufund-ui/src/app')
8 files changed, 163 insertions, 22 deletions
diff --git a/ufund-ui/src/app/app.component.html b/ufund-ui/src/app/app.component.html index 6b9338c..a490237 100644 --- a/ufund-ui/src/app/app.component.html +++ b/ufund-ui/src/app/app.component.html @@ -1,6 +1,6 @@ <h1>jelly solutions</h1> -<span>{{currentUser$ | async}}</span> +<span>{{currentUser$ | async}}</span> <br> <button *ngIf="currentUser$.value != 'Logged out.'" (click)="reloadPage()"> Log Out</button> <hr> <router-outlet /> diff --git a/ufund-ui/src/app/app.component.ts b/ufund-ui/src/app/app.component.ts index 6f4e1f5..7dc8ffb 100644 --- a/ufund-ui/src/app/app.component.ts +++ b/ufund-ui/src/app/app.component.ts @@ -1,6 +1,7 @@ -import {Component, OnInit} from '@angular/core'; +import {Component, OnInit, Inject} from '@angular/core'; import {UsersService} from './services/users.service'; import {BehaviorSubject} from 'rxjs'; +import { DOCUMENT } from '@angular/common'; @Component({ selector: 'app-root', @@ -13,9 +14,14 @@ export class AppComponent implements OnInit { currentUser$: BehaviorSubject<string> = new BehaviorSubject<string>("Logged out."); constructor( - private userService: UsersService + private userService: UsersService, + @Inject(DOCUMENT) private document: Document ) {} + reloadPage() { + this.document.defaultView?.location.reload(); + } + ngOnInit() { this.userService.getCurrentUserSubject().subscribe(r => { this.currentUser$?.next(r diff --git a/ufund-ui/src/app/components/funding-basket/funding-basket.component.html b/ufund-ui/src/app/components/funding-basket/funding-basket.component.html index 3fb2b5b..0a880af 100644 --- a/ufund-ui/src/app/components/funding-basket/funding-basket.component.html +++ b/ufund-ui/src/app/components/funding-basket/funding-basket.component.html @@ -1 +1,41 @@ -<p>funding-basket works!</p> +<h1>Funding Basket</h1> + +<div id="needCount"> + <label for="needCount">Needs in Basket:</label> + <span>{{ needCount }}</span> +</div> + +<div *ngIf="isBasketEmpty"> + <h2>There are no needs in the basket</h2> +</div> + +<table class="needs" *ngIf="!isBasketEmpty"> + <thead> + <tr> + <th class="need"></th> + </tr> + </thead> + <tbody> + <tr *ngFor="let need of basket"> + <td> + <a routerLink="/need/{{need.id}}"> + {{need.name}} + </a> + <div> + <button type="button" class="addNeed" title="add need" + (click)="addNeed(need)">Add Need</button> + </div> + <br> + <div> + <button type="button" class="removeNeed" title="delete need" + (click)="removeNeed(need)">Remove Need</button> + </div> + </td> + </tr> + </tbody> +</table> +<br> +<div> + <button type="submit" class="checkout" title="checkout" + (click)="checkout()">Checkout</button> +</div>
\ No newline at end of file diff --git a/ufund-ui/src/app/components/funding-basket/funding-basket.component.ts b/ufund-ui/src/app/components/funding-basket/funding-basket.component.ts index c44aa27..dd68c0c 100644 --- a/ufund-ui/src/app/components/funding-basket/funding-basket.component.ts +++ b/ufund-ui/src/app/components/funding-basket/funding-basket.component.ts @@ -1,23 +1,91 @@ import {Component, OnInit} from '@angular/core'; -import {Router} from '@angular/router'; -import {UsersService} from '../../services/users.service'; +import {User} from '../../models/User'; +import { UsersService } from '../../services/users.service'; +import { Need } from '../../models/Need'; +import { NeedListComponent } from '../need-list/need-list.component'; +import { Router } from '@angular/router'; +import { CupboardService } from '../../services/cupboard.service'; @Component({ - selector: 'app-funding-basket', - standalone: false, - templateUrl: './funding-basket.component.html', - styleUrl: './funding-basket.component.css' + selector: 'app-funding-basket', + standalone: false, + templateUrl: './funding-basket.component.html', + styleUrl: './funding-basket.component.css' }) -export class FundingBasketComponent implements OnInit{ - constructor( - private router: Router, - private userService: UsersService - ) {} - - ngOnInit() { - if (!this.userService.getCurrentUser()) { - this.router.navigate(['/login'], {queryParams: {redir: this.router.url}}) +export class FundingBasketComponent implements + OnInit { + user!: User; + needs: Need[] = []; + basket: Need[] = []; + needCount = 0; + need_quantity: {[key: number]: number} = {}; + + constructor( + private router: Router, + private cupboardService: CupboardService, private usersService: UsersService + ) {} + + ngOnInit(): void { + if (!this.usersService.getCurrentUser()) { + this.router.navigate(['/login'], {queryParams: {redir: this.router.url}}); + return; + } + this.cupboardService.getNeeds().subscribe(n => this.needs = n) + const currentUser = this.usersService.getCurrentUser(); + if (currentUser) { + this.user = currentUser; + } + this.getBasketNeeds(); + } + + getBasketNeeds(): void { + if (this.user && this.user.basket) { + this.user.basket.forEach(need => { + // if (this.isInBasket(need)) { + // this.basket.push(need); + // } + }); } } + isInBasket(need: Need): boolean { + return this.basket.includes(need) + } + + addNeed(need: Need, quantity: number = 1): void { + if (this.user && !this.isInBasket(need)) { + this.basket.push(need); + this.need_quantity[need.id] = quantity; + } + if (this.isInBasket(need)) { + this.need_quantity[need.id] += quantity; + } + this.needCount++; + } + + removeNeed(need: Need, quantity: number = 1): void { + if (this.user && this.isInBasket(need)) { + this.need_quantity[need.id] -= quantity; + if (this.need_quantity[need.id] === 0) { + this.basket = this.basket.filter(n => need.id !== n.id); + } + this.needCount--; + } + } + + removeAllNeeds(): void { + this.basket.forEach(need => { + this.need_quantity = []; + }); + this.basket = []; + this.needCount = 0; + } + + isBasketEmpty(): boolean { + return this.needCount === 0; + } + + checkout(): void { + this.removeAllNeeds(); + } } diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html index 07f6735..4a67dfa 100644 --- a/ufund-ui/src/app/components/need-list/need-list.component.html +++ b/ufund-ui/src/app/components/need-list/need-list.component.html @@ -14,6 +14,7 @@ {{need.name}} </a> <button (click)="delete(need.id)" *ngIf="isManager()">Delete</button> + <!-- <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button> --> </div> </div> </div> @@ -23,4 +24,5 @@ {{need.name}} </a> <button (click)="delete(need.id)" *ngIf="isManager()">Delete</button> + <!-- <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button> --> </li> 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 fc2a594..e1c0de1 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 @@ -100,6 +100,29 @@ export class NeedListComponent { return type === ("MANAGER" as unknown as userType); } + isHelper() { + const type = this.usersService.getCurrentUser()?.type; + return type === ("HELPER" as unknown as userType); + } + + add(need: number) { + const currentUser = this.usersService.getCurrentUser(); + if (currentUser) { + this.usersService.updateUser(currentUser.username, currentUser).subscribe(() => { + const currentUser = this.usersService.getCurrentUser(); + if (currentUser && currentUser.basket) { + currentUser.basket.push(need); + console.log("added to basket"); + } + error: (err: any) => { + console.error(err); + } + }); + + } + + } + back() { this.searchResults = []; } diff --git a/ufund-ui/src/app/models/User.ts b/ufund-ui/src/app/models/User.ts index b640e04..f4396f6 100644 --- a/ufund-ui/src/app/models/User.ts +++ b/ufund-ui/src/app/models/User.ts @@ -7,6 +7,6 @@ export enum userType { export interface User { username: string; - basket: Need[]; + basket: number[]; type: userType } diff --git a/ufund-ui/src/app/services/users.service.ts b/ufund-ui/src/app/services/users.service.ts index c570ccf..bc31870 100644 --- a/ufund-ui/src/app/services/users.service.ts +++ b/ufund-ui/src/app/services/users.service.ts @@ -40,8 +40,10 @@ export class UsersService { return this.http.get<User>(`${this.url}/${id}`, this.httpOptions) } - updateUser(id: number): Observable<User> { - return this.http.put<User>(`${this.url}/${id}`, this.httpOptions) + updateUser(id: string, user: User): Observable<User> { + console.log(id, user) + console.log(this.apiKey) + return this.http.put<User>(`${this.url}/${id}`,user, this.httpOptions) } deleteUser(id: number): Observable<boolean> { |