SKE-38 used getCompetitions method

SystemKonkursow/4.2.1/angular/src/app/app-routing.module.ts

@@ -8,6 +8,7 @@ import { UsersComponent } from './users/users.component';
 import { TenantsComponent } from './tenants/tenants.component';
 import { RolesComponent } from 'app/roles/roles.component';
 import { CategoriesListComponent } from '@app/categories-list/categories-list.component';
+import { CompetitionsListComponent } from '@app/competitions-list/competitions-list.component';
 
 @NgModule({
     imports: [
@@ -22,6 +23,7 @@ import { CategoriesListComponent } from '@app/categories-list/categories-list.co
                     { path: 'tenants', component: TenantsComponent, data: { permission: 'Pages.Tenants' }, canActivate: [AppRouteGuard] },
                     { path: 'about', component: AboutComponent },
                     { path: 'categories-list', component: CategoriesListComponent, canActivate: [AppRouteGuard] },
+                    { path: 'categories-list/:id', component: CompetitionsListComponent, canActivate: [AppRouteGuard] }
                 ]
             }
         ])

SystemKonkursow/4.2.1/angular/src/app/app.module.ts

@@ -33,6 +33,7 @@ import { SideBarNavComponent } from '@app/layout/sidebar-nav.component';
 import { SideBarFooterComponent } from '@app/layout/sidebar-footer.component';
 import { RightSideBarComponent } from '@app/layout/right-sidebar.component';
 import { CategoriesListComponent } from '@app/categories-list/categories-list.component';
+import { CompetitionsListComponent } from '@app/competitions-list/competitions-list.component';
 
 @NgModule({
     declarations: [
@@ -54,7 +55,8 @@ import { CategoriesListComponent } from '@app/categories-list/categories-list.co
         SideBarNavComponent,
         SideBarFooterComponent,
         RightSideBarComponent,
-        CategoriesListComponent
+        CategoriesListComponent,
+        CompetitionsListComponent
     
     ],
     imports: [

SystemKonkursow/4.2.1/angular/src/app/categories-list/categories-list.component.css

@@ -18,4 +18,5 @@
     color: darkolivegreen;
     text-shadow: 2px 2px 6px ghostwhite;
     font-weight: bold;
+    cursor: pointer;
 }

SystemKonkursow/4.2.1/angular/src/app/categories-list/categories-list.component.html

@@ -1,5 +1,5 @@
 <div class="flex-container" id="categories-list-area">
-    <div class="flex-item" *ngFor="let category of categoriesList">
+    <div class="flex-item" *ngFor="let category of categoriesList" (click)="goToCompetitions(category)">
         {{ category.name }}
     </div>
 </div>

SystemKonkursow/4.2.1/angular/src/app/categories-list/categories-list.component.ts

@@ -5,6 +5,7 @@ import { List } from 'lodash';
 import { AppComponentBase } from '@shared/app-component-base';
 import { Subscription } from 'rxjs/Rx';
 import { finalize } from 'rxjs/operators';
+import { Router } from '@angular/router';
 
 @Component({
     templateUrl: './categories-list.component.html',
@@ -20,7 +21,8 @@ export class CategoriesListComponent extends AppComponentBase implements OnInit,
 
     constructor(
         injector: Injector,
-        private _categoryService: CategoryServiceProxy
+        private _categoryService: CategoryServiceProxy,
+        private router: Router
     ) {
         super(injector);
     }
@@ -44,4 +46,9 @@ export class CategoriesListComponent extends AppComponentBase implements OnInit,
                 this.categoriesList = result;
             });
     }
+
+    public goToCompetitions(category: CategoryDto): void {
+        const route: string = `app/categories-list/${category.id}`;
+        this.router.navigate([route]);
+    }
 }

SystemKonkursow/4.2.1/angular/src/app/competitions-list/competitions-list.component.html

@@ -0,0 +1,3 @@
+<div id="competitions-list-area">
+Konkursy
+</div>

SystemKonkursow/4.2.1/angular/src/app/competitions-list/competitions-list.component.ts

@@ -0,0 +1,58 @@
+import { Component, OnInit, Injector, OnDestroy } from '@angular/core';
+import { appModuleAnimation } from '@shared/animations/routerTransition';
+import { CompetitionCategoryServiceProxy, CompetitionDto } from '@shared/service-proxies/service-proxies';
+import { List } from 'lodash';
+import { AppComponentBase } from '@shared/app-component-base';
+import { Subscription } from 'rxjs/Rx';
+import { finalize } from 'rxjs/operators';
+import { ActivatedRoute } from '@angular/router';
+import { mergeMap } from 'rxjs/operators';
+
+@Component({
+    templateUrl: './competitions-list.component.html',
+    styleUrls: ['./competitions-list.component.css'],
+    animations: [appModuleAnimation()]
+})
+export class CompetitionsListComponent extends AppComponentBase implements OnInit, OnDestroy {
+
+    public competitionsList: List<CompetitionDto> = [];
+    public competitionsListAreaId: string = 'competitions-list-area';
+
+    private paramSubscription: Subscription;
+
+    public categoryId: number;
+
+    constructor(
+        injector: Injector,
+        private _competitionCategoryService: CompetitionCategoryServiceProxy,
+        private route: ActivatedRoute,
+    ) {
+        super(injector);
+    }
+
+    public ngOnInit() {
+        this.getCompetitions();
+    }
+
+    public ngOnDestroy() {
+        if (this.paramSubscription) {
+            this.paramSubscription.unsubscribe();
+        }
+    }
+
+    private getCompetitions(): void {
+        this.paramSubscription = this.route.params
+            .pipe(mergeMap(params => {
+                this.categoryId = +params['id'];
+                this.setBusy(this.competitionsListAreaId);
+                const competitionListStream = this._competitionCategoryService
+                    .getAllCompetitionsForCategory(this.categoryId)
+                    .pipe(finalize(() => { this.clearBusy(this.competitionsListAreaId); }))
+                return competitionListStream
+            })).subscribe((result: List<CompetitionDto>) => {
+                this.competitionsList = result;
+                console.log(this.competitionsList);
+            });
+    }
+
+}