diff options
Diffstat (limited to 'ufund-ui/src/app/components/cupboard')
3 files changed, 29 insertions, 78 deletions
diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.css b/ufund-ui/src/app/components/cupboard/cupboard.component.css index faff4d4..e45d929 100644 --- a/ufund-ui/src/app/components/cupboard/cupboard.component.css +++ b/ufund-ui/src/app/components/cupboard/cupboard.component.css @@ -4,7 +4,7 @@ } #box { - width: 1000px; + width: 800px; display: flex; flex-direction: column; } @@ -22,7 +22,7 @@ border-top-left-radius: 5px; border-top-right-radius: 5px; margin-right: 5px; - border-bottom: 0px; + border-bottom: 0; } .selected-tab { @@ -30,13 +30,25 @@ } #create-form, #delete-form, #update-form { - background-color: #d9d9d9; + background-color: #3a3a3a; padding: 10px 20px 20px 20px; border: 2px solid #000; border-radius: 5px; visibility: visible; + /*position: absolute;*/ } -#create-button { - padding: 10px 20px; +#header { + display: flex; + gap: 20px; + align-items: center; + + h1 { + display: inline; + width: min-content; + } + + button { + margin-top: 3px; + } } diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html index 6f7799e..37954bb 100644 --- a/ufund-ui/src/app/components/cupboard/cupboard.component.html +++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html @@ -1,13 +1,14 @@ <div id="box"> - <h1> Cupboard </h1> + <div id="header"> + <h1> Cupboard </h1> + <button *ngIf="isManager()" class="button2" (click)="this.selectForm('create')"><span class="icon">add</span>Create Need</button> + </div> <app-need-list (currentNeed) = populateForm($event) #needList></app-need-list> </div> -<div *ngIf="isManager()" > - <h2 > Admin View </h2> - <div id="menu"> - <button [ngClass]="selectedForm === 'create' ? 'selected-tab' : 'tab'" (click)="selectForm('create')">Create new Need</button> - <button [ngClass]="selectedForm === 'update' ? 'selected-tab' : 'tab'" (click)="selectForm('update')">Update existing Need</button> - </div> +<ng-template [ngIf]="isManager()" > +<div> + <app-need-edit *ngIf="selectedForm === 'update'" [selectedNeed]="selectedNeed" (refreshNeedList)="needList.refresh()"></app-need-edit> + <div> <div id="create-form" *ngIf="selectedForm === 'create'"> <h1> Create Need </h1> <form #cupboardForm="ngForm" (ngSubmit)="submit(cupboardForm.value)"> @@ -26,35 +27,12 @@ <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> + <label>Description</label><br> + <textarea name="description"></textarea><br> <input type="submit" value="Submit"> </form> </div> - <div id="update-form" *ngIf="selectedForm === 'update'"> - <h1> Update Need </h1> - <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> - <label>Type</label><br> - <input type="radio" name="type" value="MONETARY" [(ngModel)]="selectedNeed.type"> - <label>Monetary</label><br> - <input type="radio" name="type" value="PHYSICAL" [(ngModel)]="selectedNeed.type"> - <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> - </div> - <hr> - </div> +</ng-template> diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.ts b/ufund-ui/src/app/components/cupboard/cupboard.component.ts index 662def4..2230cd3 100644 --- a/ufund-ui/src/app/components/cupboard/cupboard.component.ts +++ b/ufund-ui/src/app/components/cupboard/cupboard.component.ts @@ -16,7 +16,7 @@ import {ToastsService, ToastType} from '../../services/toasts.service'; export class CupboardComponent implements OnInit { - selectedForm = "create"; + selectedForm?: string = undefined; needs: any; @ViewChild("needList") needList?: NeedListComponent @@ -82,45 +82,6 @@ export class CupboardComponent implements OnInit { return type === ("MANAGER" as unknown as userType); } - update(form: any) { - 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, - description: form.description - }; - - this.cupboardService.updateNeed(need.id, need) - .pipe(catchError((ex, _) => { - if (ex.status == 500) { - this.toastService.sendToast(ToastType.ERROR, 'Fields cannot be blank'); - } else if (ex.status == 400) { - this.toastService.sendToast(ToastType.ERROR, ex.error); - } else { - this.toastService.sendToast(ToastType.ERROR, "Error on creating need"); - } - return of() - })) - .subscribe( - (result) => { - if (result) { - console.log("need updated successfully"); - this.needList?.refresh() - } else { - console.log("need update failed"); - } - } - - ); - } - submit(form: any) { const need: Need = { name: form.name, |