Skip to content

Commit 3212868

Browse files
authored
Merge pull request #116 from marc101101/feature/my-courses
Feature/my courses
2 parents f910c10 + 60da9a7 commit 3212868

20 files changed

Lines changed: 157 additions & 36 deletions

client/app/components/home/categories/categories.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
</div>
1414

1515
<section style="padding: 1rem;" *ngIf="dataIsAvailable">
16-
<div class="card" *ngFor="let category of categories; let i=index" (click)="routeToCourse(category.RUB_ID, colorArray[i])">
16+
<div class="card" *ngFor="let category of categories; let i=index" (click)="routeToCourse(category.RUB_ID, colorArray[i], category.RUB_NAME)">
1717
<div class="color-marker" [ngClass]="colorArray[i]">
1818
</div>
1919
<div class="card-content">

client/app/components/home/categories/categories.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,9 +24,9 @@ export class CategoriesComponent implements OnInit {
2424
});
2525
}
2626

27-
routeToCourse(categoryId: number, color: string) {
27+
routeToCourse(categoryId: number, color: string, category: string) {
2828
this.router.navigateByUrl('home/kurs-uebersicht/' + categoryId);
29-
this.comService.setColor(color);
29+
this.comService.setInfo(color, category);
3030
}
3131

3232
}

client/app/components/home/courses/courses.component.html

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
<div class="circleBackground" #backgroundElement></div>
33
<div class="columns is-mobile">
44
<div class="column is-12" style="z-index: 0; padding: 2rem; padding-left: 5rem;">
5-
<div style="font-size: 1.5rem; color:white;">
6-
Kurs Kategorien
5+
<div style="font-size: 1.5rem; color:white;" >
6+
{{headerText}} - Kurse
77
</div>
88
</div>
99
</div>
@@ -23,6 +23,9 @@
2323
<p class="subtitle">
2424
{{course.KURS_BESCHREIBUNG}}
2525
</p>
26+
<p class="subtitle applicationDate" *ngIf="course.ANM_DATUM">
27+
Anmeldung | {{course.ANM_DATUM | date:'dd.MM.yyyy'}}
28+
</p>
2629
</div>
2730
</div>
2831
</section>

client/app/components/home/courses/courses.component.scss

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,11 @@
4141
border-bottom-left-radius: 0.8rem;
4242
}
4343

44+
.applicationDate {
45+
float: right;
46+
font-size: 0.8rem;
47+
}
48+
4449
.primary{
4550
background-color: #00d1b2;
4651
}

client/app/components/home/courses/courses.component.ts

Lines changed: 48 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,73 @@
1-
import { Component, OnInit, Renderer2, ViewChild, ElementRef } from '@angular/core';
1+
import { Component, Renderer2, ViewChild, ElementRef, AfterViewInit } from '@angular/core';
22
import { CategoryService } from '../../../services/category.service';
33
import { ActivatedRoute, Params } from '@angular/router';
44
import { CommunicationService } from '../shared/communication.service';
55
import { log } from 'util';
6+
import { UserService } from '../../../services/user.service';
7+
import { CoursesService } from '../shared/courses.service';
68

79
@Component({
810
selector: 'courses',
911
templateUrl: './courses.component.html',
1012
styleUrls: ['./courses.component.scss']
1113
})
12-
export class CoursesComponent implements OnInit {
14+
export class CoursesComponent implements AfterViewInit {
1315

1416
@ViewChild('backgroundElement') backgroundElement: ElementRef;
1517

1618
public dataIsAvailable: boolean = false;
1719
public courses: Array<any>;
20+
public headerText: string = "";
21+
public category: string = "";
1822

19-
constructor(public categoryService: CategoryService,
23+
constructor(
24+
public categoryService: CategoryService,
25+
public userService: UserService,
2026
private activatedRoute: ActivatedRoute,
2127
public comService: CommunicationService,
22-
public renderer: Renderer2) {
23-
let localThis = this;
24-
this.comService.getColor().subscribe(color => {
25-
console.log(color);
26-
this.renderer.addClass(this.backgroundElement.nativeElement, color);
28+
public coursesService: CoursesService,
29+
public renderer: Renderer2) {}
30+
31+
ngAfterViewInit() {
32+
this.comService.getInfo().subscribe(response => {
33+
this.category = response.category;
34+
this.renderer.addClass(this.backgroundElement.nativeElement, response.color);
2735
});
28-
}
2936

30-
ngOnInit() {
3137
this.activatedRoute.params.subscribe((params: Params) => {
32-
this.categoryService.getCoursesByCategoryId(params.courseId).subscribe(response =>{
33-
this.courses = response;
34-
if(response.name != "HttpResponseError"){
35-
this.dataIsAvailable = true;
36-
this.courses = response;
37-
}
38+
if(params.id == "me"){
39+
this.requestCoursesByUser();
40+
}
41+
else{
42+
this.requestCoursesByCategory(params.id);
43+
}
44+
});
45+
}
46+
47+
requestCoursesByUser():void{
48+
this.headerText = "Meine";
49+
this.userService.getCoursesByUser().subscribe(response =>{
50+
response.forEach(element => {
51+
this.courses = [];
52+
this.coursesService.getCoursesByCourseId(element.ANM_KURS_ID).subscribe(response => {
53+
response.ANM_DATUM = element.ANM_DATUM;
54+
this.courses.push(response);
55+
});
3856
});
57+
if(response.name != "HttpResponseError"){
58+
this.dataIsAvailable = true;
59+
}
60+
});
61+
}
62+
63+
requestCoursesByCategory(courseId: string):void{
64+
this.headerText = this.category;
65+
this.categoryService.getCoursesByCategoryId(courseId).subscribe(response =>{
66+
this.courses = response;
67+
if(response.name != "HttpResponseError"){
68+
this.dataIsAvailable = true;
69+
this.courses = response;
70+
}
3971
});
4072
}
4173

client/app/components/home/home-routing.module.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,15 @@ const routes: Routes = [
1717
component: CategoriesComponent
1818
},
1919
{
20-
path: 'meine-kurse',
20+
path: 'aktuelles',
2121
component: CategoriesComponent
2222
},
2323
{
24-
path: 'aktuelles',
25-
component: CategoriesComponent
24+
path: 'kurs-uebersicht/:id',
25+
component: CoursesComponent
2626
},
2727
{
28-
path: 'kurs-uebersicht/:courseId',
28+
path: 'kurs-uebersicht/me',
2929
component: CoursesComponent
3030
},
3131
{

client/app/components/home/home.module.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import { SharedModule } from '../../sharedModule/shared.module';
1414
import { AlertService } from '../../services/alert.service';
1515
import { CategoryService } from '../../services/category.service';
1616
import { CoursesComponent } from './courses/courses.component';
17+
import { CoursesService } from './shared/courses.service';
1718

1819
@NgModule({
1920
declarations: [
@@ -34,7 +35,8 @@ import { CoursesComponent } from './courses/courses.component';
3435
UserService,
3536
AlertService,
3637
CommunicationService,
37-
CategoryService
38+
CategoryService,
39+
CoursesService
3840
],
3941
exports: [MenuComponent],
4042
})

client/app/components/home/shared/communication.service.ts

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ export class CommunicationService{
88

99
public instruction_sub_comb = new Subject<any>();
1010
private color: string;
11+
private category: string;
1112

1213
constructor() {
1314
}
@@ -16,12 +17,17 @@ export class CommunicationService{
1617
this.instruction_sub_comb.next(message);
1718
}
1819

19-
setColor(color: string) {
20+
setInfo(color: string, category: string) {
2021
this.color = color;
22+
this.category = category;
2123
}
2224

23-
getColor(): Observable<string>{
24-
return Observable.of(this.color);
25+
getInfo(): Observable<any>{
26+
return Observable.of(
27+
{
28+
'color': this.color,
29+
'category': this.category
30+
});
2531
}
2632

2733
}
Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import { Injectable } from '@angular/core';
2+
import { map, catchError } from 'rxjs/operators';
3+
import { Observable } from 'rxjs';
4+
import { environment } from '../../../../environments/environment.prod';
5+
import { HttpHeaders, HttpClient, HttpErrorResponse } from '@angular/common/http';
6+
import { AlertService } from '../../../services/alert.service';
7+
8+
@Injectable({
9+
providedIn: 'root'
10+
})
11+
12+
export class CoursesService {
13+
14+
private url: string = environment.apiUrl;
15+
16+
private httpOptions = {
17+
headers: new HttpHeaders({
18+
'Content-Type': 'application/json',
19+
'Authorization': localStorage.getItem('token')
20+
})
21+
};
22+
23+
constructor(public http: HttpClient, public alertService: AlertService) { }
24+
25+
getCoursesByCourseId(courseId: String): Observable<any>{
26+
return this.http.get(this.url + "/courses/" + courseId, this.httpOptions).pipe(
27+
map((res: Response) => {
28+
return res;
29+
}),
30+
catchError((err: HttpErrorResponse) => {
31+
this.alertService.push(err);
32+
return Observable.of(err);
33+
})
34+
);
35+
}
36+
37+
}

client/app/components/home/shared/menu/menu.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
Nutzerprofil
99
</div>
1010

11-
<div class="menuPoint" style="margin-top: 8rem" [routerLink]="['meine-kurse']" (click)="routing()">
11+
<div class="menuPoint" style="margin-top: 8rem" [routerLink]="['kurs-uebersicht/me']" (click)="routing()">
1212
<span class="icon">
1313
<i class="fa fa-star"></i>
1414
</span>

0 commit comments

Comments
 (0)