From 8811480c199b7b2a97ee0532d3488ed9512b6f37 Mon Sep 17 00:00:00 2001 From: sowgro Date: Wed, 26 Feb 2025 21:31:52 -0500 Subject: get angular services working --- ufund-ui/src/app/app-routing.module.ts | 23 +++++----- ufund-ui/src/app/app.module.ts | 51 ++++++++++++---------- .../components/cupboard/cupboard.component.html | 1 + .../components/need-list/need-list.component.html | 7 ++- .../components/need-list/need-list.component.ts | 10 +++++ .../components/need-page/need-page.component.html | 8 +++- .../components/need-page/need-page.component.ts | 12 +++++ ufund-ui/src/app/services/cupboard.service.ts | 2 +- ufund-ui/src/app/services/users.service.ts | 2 +- 9 files changed, 78 insertions(+), 38 deletions(-) (limited to 'ufund-ui/src') diff --git a/ufund-ui/src/app/app-routing.module.ts b/ufund-ui/src/app/app-routing.module.ts index 36e74d3..d4f14da 100644 --- a/ufund-ui/src/app/app-routing.module.ts +++ b/ufund-ui/src/app/app-routing.module.ts @@ -1,21 +1,24 @@ -import { NgModule } from '@angular/core'; -import { RouterModule, Routes } from '@angular/router'; +import {NgModule} from '@angular/core'; +import {RouterModule, Routes} from '@angular/router'; import {CupboardComponent} from './components/cupboard/cupboard.component'; import {DashboardComponent} from './components/dashboard/dashboard.component'; import {LoginComponent} from './components/login/login.component'; import {HomePageComponent} from './components/home-page/home-page.component'; import {FundingBasketComponent} from './components/funding-basket/funding-basket.component'; +import {NeedPageComponent} from './components/need-page/need-page.component'; const routes: Routes = [ - {path: '', component: HomePageComponent}, - {path: 'login', component: LoginComponent}, - {path: 'cupboard', component: CupboardComponent}, - {path: 'dashboard', component: DashboardComponent}, - {path: 'funding-basket', component: FundingBasketComponent}, + {path: '', component: HomePageComponent}, + {path: 'login', component: LoginComponent}, + {path: 'cupboard', component: CupboardComponent}, + {path: 'dashboard', component: DashboardComponent}, + {path: 'funding-basket', component: FundingBasketComponent}, + {path: 'need/:id', component: NeedPageComponent} ]; @NgModule({ - imports: [RouterModule.forRoot(routes)], - exports: [RouterModule] + imports: [RouterModule.forRoot(routes)], + exports: [RouterModule] }) -export class AppRoutingModule { } +export class AppRoutingModule { +} diff --git a/ufund-ui/src/app/app.module.ts b/ufund-ui/src/app/app.module.ts index 95208e1..d818841 100644 --- a/ufund-ui/src/app/app.module.ts +++ b/ufund-ui/src/app/app.module.ts @@ -1,28 +1,31 @@ -import { NgModule } from '@angular/core'; -import { BrowserModule } from '@angular/platform-browser'; +import {NgModule} from '@angular/core'; +import {BrowserModule} from '@angular/platform-browser'; -import { AppRoutingModule } from './app-routing.module'; -import { AppComponent } from './app.component'; -import { NeedPageComponent } from './components/need-page/need-page.component'; -import { HomePageComponent } from './components/home-page/home-page.component'; -import { FundingBasketComponent } from './components/funding-basket/funding-basket.component'; -import { CupboardComponent } from './components/cupboard/cupboard.component'; -import { NeedListComponent } from './components/need-list/need-list.component'; +import {AppRoutingModule} from './app-routing.module'; +import {AppComponent} from './app.component'; +import {NeedPageComponent} from './components/need-page/need-page.component'; +import {HomePageComponent} from './components/home-page/home-page.component'; +import {FundingBasketComponent} from './components/funding-basket/funding-basket.component'; +import {CupboardComponent} from './components/cupboard/cupboard.component'; +import {NeedListComponent} from './components/need-list/need-list.component'; +import {HttpClientModule} from '@angular/common/http'; @NgModule({ - declarations: [ - AppComponent, - NeedPageComponent, - HomePageComponent, - FundingBasketComponent, - CupboardComponent, - NeedListComponent - ], - imports: [ - BrowserModule, - AppRoutingModule - ], - providers: [], - bootstrap: [AppComponent] + declarations: [ + AppComponent, + NeedPageComponent, + HomePageComponent, + FundingBasketComponent, + CupboardComponent, + NeedListComponent + ], + imports: [ + BrowserModule, + AppRoutingModule, + HttpClientModule, + ], + providers: [], + bootstrap: [AppComponent] }) -export class AppModule { } +export class AppModule { +} diff --git a/ufund-ui/src/app/components/cupboard/cupboard.component.html b/ufund-ui/src/app/components/cupboard/cupboard.component.html index bcddb33..056c167 100644 --- a/ufund-ui/src/app/components/cupboard/cupboard.component.html +++ b/ufund-ui/src/app/components/cupboard/cupboard.component.html @@ -1 +1,2 @@

cupboard works!

+ 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 d366ee6..6e48d96 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 @@ -1 +1,6 @@ -

need-list works!

+

Needs List

+
  • + + {{need.name}} + +
  • 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 61ed089..a3eb072 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,4 +1,6 @@ import { Component } from '@angular/core'; +import {Need} from '../../models/Need'; +import {CupboardService} from '../../services/cupboard.service'; @Component({ selector: 'app-need-list', @@ -7,5 +9,13 @@ import { Component } from '@angular/core'; styleUrl: './need-list.component.css' }) export class NeedListComponent { + needs: Need[] = []; + constructor( + private cupboardService: CupboardService + ) {} + + ngOnInit(): void { + this.cupboardService.getNeeds().subscribe(n => this.needs = n) + } } diff --git a/ufund-ui/src/app/components/need-page/need-page.component.html b/ufund-ui/src/app/components/need-page/need-page.component.html index ed5b6d8..0bc4746 100644 --- a/ufund-ui/src/app/components/need-page/need-page.component.html +++ b/ufund-ui/src/app/components/need-page/need-page.component.html @@ -1 +1,7 @@ -

    need-page works!

    +

    Need page

    +

    id: {{need?.id}}

    +

    name: {{need?.name}}

    +

    filterAttributes: {{need?.filterAttributes}}

    +

    type: {{need?.type}}

    +

    max goal: {{need?.maxGoal}}

    +

    current: {{need?.maxGoal}}

    diff --git a/ufund-ui/src/app/components/need-page/need-page.component.ts b/ufund-ui/src/app/components/need-page/need-page.component.ts index 390bfb6..15c1e87 100644 --- a/ufund-ui/src/app/components/need-page/need-page.component.ts +++ b/ufund-ui/src/app/components/need-page/need-page.component.ts @@ -1,5 +1,7 @@ import {Component, Input} from '@angular/core'; import {Need} from '../../models/Need'; +import {ActivatedRoute} from "@angular/router"; +import {CupboardService} from "../../services/cupboard.service"; @Component({ selector: 'app-need-page', @@ -8,5 +10,15 @@ import {Need} from '../../models/Need'; styleUrl: './need-page.component.css' }) export class NeedPageComponent { + constructor( + private route: ActivatedRoute, + private cupboardService: CupboardService, + ) {} + @Input() need?: Need; + + ngOnInit(): void { + const id = Number(this.route.snapshot.paramMap.get('id')); + this.cupboardService.getNeed(id).subscribe(n => this.need = n); + } } diff --git a/ufund-ui/src/app/services/cupboard.service.ts b/ufund-ui/src/app/services/cupboard.service.ts index 6e2671a..c123841 100644 --- a/ufund-ui/src/app/services/cupboard.service.ts +++ b/ufund-ui/src/app/services/cupboard.service.ts @@ -8,7 +8,7 @@ import {Observable} from 'rxjs'; }) export class CupboardService { - private url = "localhost:8080/cupboard" + private url = "http://localhost:8080/cupboard" private httpOptions = { headers: new HttpHeaders({'Content-Type': 'application/json'}) }; diff --git a/ufund-ui/src/app/services/users.service.ts b/ufund-ui/src/app/services/users.service.ts index 65a9e61..1b6dfb6 100644 --- a/ufund-ui/src/app/services/users.service.ts +++ b/ufund-ui/src/app/services/users.service.ts @@ -8,7 +8,7 @@ import {User} from '../models/User'; }) export class UsersService { - private url = "localhost:8080/cupboard" + private url = "http://localhost:8080/users" private httpOptions = { headers: new HttpHeaders({'Content-Type': 'application/json'}) }; -- cgit v1.2.3