diff --git a/static/src/app/services/awarding-service/awarding.service.ts b/static/src/app/services/awarding-service/awarding.service.ts index a5e93f5..6695d29 100644 --- a/static/src/app/services/awarding-service/awarding.service.ts +++ b/static/src/app/services/awarding-service/awarding.service.ts @@ -20,6 +20,7 @@ export class AwardingService { */ getUserAwardings(userId: string) { return this.http.get(this.config.apiUrl + this.config.apiAwardPath + '?userId=' + userId) + .map(res => res.json()) } addAwarding(award) { diff --git a/static/src/app/users/user-award/user-award.component.css b/static/src/app/users/user-award/user-award.component.css index 8cd0081..595eeb8 100644 --- a/static/src/app/users/user-award/user-award.component.css +++ b/static/src/app/users/user-award/user-award.component.css @@ -13,11 +13,32 @@ } .table-container { + margin-top: 40px; overflow-x: auto; - width: 250%; - margin-top: 50px + width: 50%; +} + +.overview { + position: fixed; + overflow-y: scroll; + overflow-x: hidden; + width: 100%; + border-left: thin solid lightgrey; + padding-left: 50px; + padding-top: 20px; + margin-left: 10px; + height: 100vh; +} + +.form-group { + width: 25%; } h3 { margin-bottom: 20px; + margin-left: -20px; +} + +label { + display: block; } diff --git a/static/src/app/users/user-award/user-award.component.html b/static/src/app/users/user-award/user-award.component.html index 72cdd31..fa5f4cb 100644 --- a/static/src/app/users/user-award/user-award.component.html +++ b/static/src/app/users/user-award/user-award.component.html @@ -56,18 +56,24 @@ Bestätigen + + Erfolgreich gespeichert + +
- +
- + - - + + - +
BildBild BezeichnungBegründungDatumBegründungDatum
diff --git a/static/src/app/users/user-award/user-award.component.ts b/static/src/app/users/user-award/user-award.component.ts index 8a1228e..e8e1d76 100644 --- a/static/src/app/users/user-award/user-award.component.ts +++ b/static/src/app/users/user-award/user-award.component.ts @@ -1,9 +1,6 @@ import {Component, ViewChild} from "@angular/core"; import {ActivatedRoute, Router} from "@angular/router"; -import * as model from "../../models/model-interfaces"; -import {Decoration, Squad, User} from "../../models/model-interfaces"; -import {UserService} from "../../services/user-service/user.service"; -import {Subscription} from "rxjs"; +import {Award, Decoration} from "../../models/model-interfaces"; import {NgForm} from "@angular/forms"; import {AwardingService} from "../../services/awarding-service/awarding.service"; import {DecorationService} from "../../services/decoration-service/decoration.service"; @@ -11,91 +8,44 @@ import {DecorationService} from "../../services/decoration-service/decoration.se @Component({ templateUrl: './user-award.component.html', - styleUrls: ['./user-award.component.css', '../../style/new-entry-form.css'], + styleUrls: ['./user-award.component.css'], }) export class UserAwardComponent { @ViewChild(NgForm) form: NgForm; - subscription: Subscription; - showSuccessLabel = false; - user: User = {}; + userId: string; decorations: Decoration[]; - award: { decorationId: '', reason: '' }; - - saved = false; + awards: Award[]; decoPreviewDisplay = 'none'; constructor(private router: Router, private route: ActivatedRoute, - private userService: UserService, private awardingService: AwardingService, private decorationService: DecorationService) { } ngOnInit() { - this.subscription = this.route.params - .map(params => params['id']) - .filter(id => id != undefined) - .flatMap(id => this.userService.getUser(id)) - .subscribe(user => { - this.user = user; - }); - this.decorationService.findDecorations().subscribe(decorations => { this.decorations = decorations; }); - } - ngOnDestroy() { - this.subscription.unsubscribe(); - } + this.route.params + .map(params => params['id']) + .flatMap(id => this.awardingService.getUserAwardings(id)) + .subscribe(awards => { + this.awards = awards; + }); - saveUser(rankLevel) { - const updateObject = { - _id: this.user._id, - username: this.user.username, - squadId: this.user.squad._id, - rankLvl: rankLevel - }; - this.userService.updateUser(updateObject) - .subscribe(user => { - this.user = user; - this.showSuccessLabel = true; - setTimeout(() => { - this.showSuccessLabel = false; - }, 2000) - }) - } - - - cancel() { - this.router.navigate(['../..'], {relativeTo: this.route}); - return false; - } - - /** - * compare ngValue with ngModel to assign selected element - */ - equals(o1: Squad, o2: Squad) { - if (o1 && o2) { - return o1._id === o2._id; - } - } - - deleteUser(confirm) { - if (confirm.toLowerCase() === this.user.username.toLocaleLowerCase()) { - this.userService.deleteUser(this.user) - .subscribe((res) => { - this.router.navigate(['../..'], {relativeTo: this.route}); - }) - } + this.route.params + .map(params => params['id']) + .subscribe(id => this.userId = id) } @@ -111,40 +61,23 @@ export class UserAwardComponent { } - deleteAwarding(awardingId) { - this.awardingService.deleteAwarding(awardingId).subscribe((res) => { - this.awardingService.getUserAwardings(this.user._id) - .map((res) => res.json()) - .subscribe((awards) => { - this.user.awards = awards; - this.showSuccessLabel = true; - setTimeout(() => { - this.showSuccessLabel = false; - }, 2000) - }) - }) - } - addAwarding(decorationField, reasonField, previewImage, descriptionField) { const decorationId = decorationField.value; const reason = reasonField.value; if (decorationId && reason.length > 0) { const award = { - "userId": this.user._id, + "userId": this.userId, "decorationId": decorationId, "reason": reason, "date": Date.now() }; this.awardingService.addAwarding(award).subscribe(() => { - this.awardingService.getUserAwardings(this.user._id) - .map((res) => res.json()) + this.awardingService.getUserAwardings(this.userId) .subscribe(awards => { - this.user.awards = awards; + this.awards = awards; this.decoPreviewDisplay = 'none'; decorationField.value = undefined; - reasonField.value = ''; - previewImage.src = ''; - descriptionField.innerHTML = ''; + reasonField.value = previewImage.src = descriptionField.innerHTML = ''; this.showSuccessLabel = true; setTimeout(() => { this.showSuccessLabel = false; @@ -154,12 +87,22 @@ export class UserAwardComponent { } } + deleteAwarding(awardingId) { + this.awardingService.deleteAwarding(awardingId).subscribe((res) => { + this.awardingService.getUserAwardings(this.userId) + .subscribe((awards) => { + this.awards = awards; + this.showSuccessLabel = true; + setTimeout(() => { + this.showSuccessLabel = false; + }, 2000) + }) + }) + } - canDeactivate(): boolean { - if (this.saved || !this.form.dirty) { - return true; - } - return window.confirm(`Ihr Formular besitzt ungespeicherte Änderungen, möchten Sie die Seite wirklich verlassen?`); + cancel() { + this.router.navigate(['../..'], {relativeTo: this.route}); + return false; } } diff --git a/static/src/app/users/user-overview/user-overview.component.css b/static/src/app/users/user-overview/user-overview.component.css index 789b2f5..e69de29 100644 --- a/static/src/app/users/user-overview/user-overview.component.css +++ b/static/src/app/users/user-overview/user-overview.component.css @@ -1,4 +0,0 @@ -.decoration-preview { - background-color: white; - padding: 5px; -} diff --git a/static/src/app/users/user-overview/user-overview.component.ts b/static/src/app/users/user-overview/user-overview.component.ts index f852a29..d18d05c 100644 --- a/static/src/app/users/user-overview/user-overview.component.ts +++ b/static/src/app/users/user-overview/user-overview.component.ts @@ -19,10 +19,6 @@ export class UserOverviewComponent { subscription: Subscription; - id: string; - - model = model; - showSuccessLabel = false; ranksDisplay = 'none'; @@ -122,15 +118,6 @@ export class UserOverviewComponent { } } - deleteUser(confirm) { - if (confirm.toLowerCase() === this.user.username.toLocaleLowerCase()) { - this.userService.deleteUser(this.user) - .subscribe((res) => { - this.router.navigate(['../..'], {relativeTo: this.route}); - }) - } - } - canDeactivate(): boolean { if (this.saved || !this.form.dirty) { return true;