diff options
Diffstat (limited to 'ufund-ui/src/app/components/cupboard')
3 files changed, 36 insertions, 25 deletions
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.css b/ufund-ui/src/app/components/cupboard/cupboard.component.css index 6e70951..faff4d4 100644 --- a/ufund-ui/src/app/components/cupboard/cupboard.component.css +++ b/ufund-ui/src/app/components/cupboard/cupboard.component.css @@ -1,20 +1,19 @@ :host { display: flex; - justify-content: space-evenly; - border: 2px solid #000; - border-radius: 5px; - padding: 10px 20px; - > div { - width: 40%; - } + justify-content: center; } +#box { + width: 1000px; + display: flex; + flex-direction: column; +} #menu { display: flex; - + margin: 10px; - + } .tab, .selected-tab { @@ -34,10 +33,10 @@ background-color: #d9d9d9; padding: 10px 20px 20px 20px; border: 2px solid #000; - border-radius: 5px; + border-radius: 5px; visibility: visible; } #create-button { padding: 10px 20px; -}
\ No newline at end of file +} diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html index bc5ac1c..855bd7e 100644 --- a/ufund-ui/src/app/components/cupboard/cupboard.component.html +++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html @@ -1,4 +1,4 @@ -<div> +<div id="box"> <h1> Cupboard </h1> <app-need-list (currentNeed) = populateForm($event) #needList></app-need-list> </div> @@ -13,6 +13,8 @@ <form #cupboardForm="ngForm" (ngSubmit)="submit(cupboardForm.value)"> <label>Name:</label><br> <input type="text" name="name" ngModel><br> + <label>Image:</label><br> + <input type="text" name="image" ngModel><br> <label>Location:</label><br> <input type="text" name="location" ngModel><br> <label>Max Goal:</label><br> @@ -24,8 +26,10 @@ <label>Physical</label><br> <input type="checkbox" name="urgent" value="false" ngModel> <label>Urgent</label><br> + <label>Description</label> + <textarea name="description" [(ngModel)]="selectedNeed.description"></textarea><br> <input type="submit" value="Submit"> - + </form> <span *ngIf="statusText">{{statusText | async}}</span> @@ -35,6 +39,7 @@ <label>Needs:</label><br> <form #updateForm="ngForm" (ngSubmit)="update(updateForm.value)"> <input type="text" name="name" [(ngModel)]="selectedNeed.name"><br> + <input type="text" name="image" [(ngModel)]="selectedNeed.image"><br> <input type="text" name="location" [(ngModel)]="selectedNeed.location"><br> <label>Max Goal:</label><br> <input type="number" name="maxGoal" [(ngModel)]="selectedNeed.maxGoal"><br> @@ -45,8 +50,10 @@ <label>Physical</label><br> <input type="checkbox" name="urgent" [(ngModel)]="selectedNeed.urgent"> <label>Urgent</label> <br> + <label>Description</label> <br> + <textarea name="description" [(ngModel)]="selectedNeed.description"></textarea><br> <input type="submit" value="Submit"> - + </form> <span *ngIf="statusText">{{statusText | async}}</span> diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts index 88ab46c..fff8760 100644 --- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts +++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts @@ -2,9 +2,10 @@ import {Component, OnInit, ViewChild} from '@angular/core'; import { CupboardService } from '../../services/cupboard.service'; import { Need, GoalType } from '../../models/Need'; import { userType } from '../../models/User'; -import { BehaviorSubject, catchError, of } from 'rxjs'; +import { catchError, of } from 'rxjs'; import { NeedListComponent } from '../need-list/need-list.component'; import {AuthService} from '../../services/auth.service'; +import {ToastsService, ToastType} from '../../services/toasts.service'; @Component({ selector: 'app-cupboard', @@ -15,14 +16,14 @@ import {AuthService} from '../../services/auth.service'; export class CupboardComponent implements OnInit { - protected statusText = new BehaviorSubject("") selectedForm = "create"; needs: any; @ViewChild("needList") needList?: NeedListComponent constructor( private cupboardService: CupboardService, - private authService: AuthService + private authService: AuthService, + private toastService: ToastsService ) {} ngOnInit(): void { @@ -85,23 +86,25 @@ export class CupboardComponent implements OnInit { console.log(form); const need: Need = { name: form.name, + image: form.image, location: form.location, id: this.selectedNeed.id, //system will control this maxGoal: form.maxGoal, type: GoalType[form.type as keyof typeof GoalType], urgent: form.urgent, filterAttributes: [], - current: 0 + current: 0, + description: form.description }; this.cupboardService.updateNeed(need.id, need) .pipe(catchError((ex, _) => { if (ex.status == 500) { - this.statusText.next("Fields cannot be blank"); + this.toastService.sendToast(ToastType.INFO, 'Fields cannot be blank'); } else if (ex.status == 400) { - this.statusText.next(ex.error); + this.toastService.sendToast(ToastType.INFO, ex.error); } else { - this.statusText.next("Error on creating need"); + this.toastService.sendToast(ToastType.INFO, "Error on creating need"); } return of() })) @@ -121,24 +124,26 @@ export class CupboardComponent implements OnInit { submit(form: any) { const need: Need = { name: form.name, + image: form.image, location: form.location, id: 0, maxGoal: form.maxGoal, type: form.type, urgent: form.urgent ? true : false, filterAttributes: [], - current: 0 + current: 0, + description: form.description }; console.log("need:", need); console.log("form submitted. creating need: ", need); this.cupboardService.createNeed(need) .pipe(catchError((ex, _) => { if (ex.status == 500) { - this.statusText.next("Fields cannot be blank"); + this.toastService.sendToast(ToastType.INFO, "Fields cannot be blank"); } else if (ex.status == 400) { - this.statusText.next(ex.error); + this.toastService.sendToast(ToastType.INFO, ex.error); } else { - this.statusText.next("Error on creating need"); + this.toastService.sendToast(ToastType.INFO, "Error on creating need"); } return of() })) |