From 3e7bb6878f56bb9fd8c97396f409cdcf6ac79c88 Mon Sep 17 00:00:00 2001 From: Cathy Hu Date: Tue, 18 Aug 2020 23:48:24 +0200 Subject: [PATCH] [frontend] Add dashboard routing and bare component logic --- .../app/dashboard/dashboard-routing.module.ts | 4 ++- .../app/dashboard/dashboard.component.html | 2 +- .../src/app/dashboard/dashboard.module.ts | 3 ++- .../app/dashboard/hoods/hoods.component.html | 1 + .../app/dashboard/hoods/hoods.component.ts | 18 +++++++++---- .../src/app/hoodpage/hoodpage.component.html | 2 ++ .../src/app/hoodpage/hoodpage.component.ts | 27 ++++++++++++++++--- 7 files changed, 46 insertions(+), 11 deletions(-) diff --git a/kibicara-frontend/src/app/dashboard/dashboard-routing.module.ts b/kibicara-frontend/src/app/dashboard/dashboard-routing.module.ts index 77fca96..2e4ee40 100644 --- a/kibicara-frontend/src/app/dashboard/dashboard-routing.module.ts +++ b/kibicara-frontend/src/app/dashboard/dashboard-routing.module.ts @@ -3,15 +3,17 @@ import { Routes, RouterModule } from '@angular/router'; import { DashboardComponent } from './dashboard.component'; import { HoodsComponent } from './hoods/hoods.component'; import { SettingspageComponent } from './settingspage/settingspage.component'; +import { AuthGuard } from '../core/auth/auth.guard'; const routes: Routes = [ { path: '', component: DashboardComponent, children: [ - { path: 'list', component: HoodsComponent }, + { path: '', component: HoodsComponent }, { path: 'settings', component: SettingspageComponent }, ], + canActivate: [AuthGuard], }, ]; diff --git a/kibicara-frontend/src/app/dashboard/dashboard.component.html b/kibicara-frontend/src/app/dashboard/dashboard.component.html index 9c5fce9..0680b43 100644 --- a/kibicara-frontend/src/app/dashboard/dashboard.component.html +++ b/kibicara-frontend/src/app/dashboard/dashboard.component.html @@ -1 +1 @@ -

dashboard works!

+ diff --git a/kibicara-frontend/src/app/dashboard/dashboard.module.ts b/kibicara-frontend/src/app/dashboard/dashboard.module.ts index bb8ccad..336d563 100644 --- a/kibicara-frontend/src/app/dashboard/dashboard.module.ts +++ b/kibicara-frontend/src/app/dashboard/dashboard.module.ts @@ -3,9 +3,10 @@ import { CommonModule } from '@angular/common'; import { HoodsComponent } from './hoods/hoods.component'; import { SettingspageComponent } from './settingspage/settingspage.component'; import { DashboardComponent } from './dashboard.component'; +import { DashboardRoutingModule } from './dashboard-routing.module'; @NgModule({ declarations: [HoodsComponent, SettingspageComponent, DashboardComponent], - imports: [CommonModule], + imports: [CommonModule, DashboardRoutingModule], }) export class DashboardModule {} diff --git a/kibicara-frontend/src/app/dashboard/hoods/hoods.component.html b/kibicara-frontend/src/app/dashboard/hoods/hoods.component.html index 3be30ee..7f6d047 100644 --- a/kibicara-frontend/src/app/dashboard/hoods/hoods.component.html +++ b/kibicara-frontend/src/app/dashboard/hoods/hoods.component.html @@ -1 +1,2 @@

hoods works!

+
{{ item.name }}
diff --git a/kibicara-frontend/src/app/dashboard/hoods/hoods.component.ts b/kibicara-frontend/src/app/dashboard/hoods/hoods.component.ts index b1158b5..d56ea2d 100644 --- a/kibicara-frontend/src/app/dashboard/hoods/hoods.component.ts +++ b/kibicara-frontend/src/app/dashboard/hoods/hoods.component.ts @@ -1,15 +1,23 @@ import { Component, OnInit } from '@angular/core'; +import { AdminService } from 'src/app/core/api'; +import { map } from 'rxjs/operators'; @Component({ selector: 'app-hoods', templateUrl: './hoods.component.html', - styleUrls: ['./hoods.component.scss'] + styleUrls: ['./hoods.component.scss'], }) export class HoodsComponent implements OnInit { + hoods$ = this.adminService.getHoodsAdmin().pipe( + map((hoods) => { + const result = hoods.map((hood) => { + return hood.hood; + }); + return result; + }) + ); - constructor() { } - - ngOnInit(): void { - } + constructor(private readonly adminService: AdminService) {} + ngOnInit(): void {} } diff --git a/kibicara-frontend/src/app/hoodpage/hoodpage.component.html b/kibicara-frontend/src/app/hoodpage/hoodpage.component.html index bad613f..0e1c3b6 100644 --- a/kibicara-frontend/src/app/hoodpage/hoodpage.component.html +++ b/kibicara-frontend/src/app/hoodpage/hoodpage.component.html @@ -1 +1,3 @@

hoodpage works!

+ +{{ hood.landingpage }} diff --git a/kibicara-frontend/src/app/hoodpage/hoodpage.component.ts b/kibicara-frontend/src/app/hoodpage/hoodpage.component.ts index bdd832f..b2d22cf 100644 --- a/kibicara-frontend/src/app/hoodpage/hoodpage.component.ts +++ b/kibicara-frontend/src/app/hoodpage/hoodpage.component.ts @@ -1,15 +1,36 @@ import { Component, OnInit } from '@angular/core'; +import { ActivatedRoute, Router } from '@angular/router'; +import { HoodsService, BodyHood } from '../core/api'; +import { first } from 'rxjs/operators'; @Component({ selector: 'app-hoodpage', templateUrl: './hoodpage.component.html', - styleUrls: ['./hoodpage.component.scss'] + styleUrls: ['./hoodpage.component.scss'], }) export class HoodpageComponent implements OnInit { + hood: BodyHood; - constructor() { } + constructor( + private route: ActivatedRoute, + private router: Router, + private readonly hoodService: HoodsService + ) {} ngOnInit(): void { + const hoodId = this.route.snapshot.params['id']; + if (hoodId) { + this.hoodService + .getHood(hoodId) + .pipe(first()) + .subscribe( + (data) => { + this.hood = data; + }, + (error) => { + this.router.navigate(['/404']); + } + ); + } } - }