hardi
/
opt-cc
1
0
Fork 0
Code Pull Requests Releases 47 Activity

Fix select options in decoration dropdown #3

Merged
hardi merged 1 commits from task/apply-select-standard-option into master 2017-08-05 09:36:48 +02:00
Conversation 0 Commits 1 Files Changed 6
6 changed files with 42 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
static/src/app/request/award/req-award.component.html
View File

@ -8,7 +8,7 @@
id="user"
[(ngModel)]="user"
[compareWith]="equals"
(change)="toggleUser(decoPreview, decoDescription)"
(change)="toggleUser()"
required>
<option [ngValue]="{_id: '0'}">Auswählen...</option>
<option *ngFor="let user of users" [ngValue]="user">
@ -18,14 +18,16 @@
</div>
<div class="form-group" *ngIf="showForm">
<div class="form-group">
<label for="decoration">Auszeichnung</label>
<select class="form-control"
name="decoration"
id="decoration"
[(ngModel)]="decoration"
[compareWith]="equals"
(change)="toggleDecoPreview(decoDescription, decoPreview)"
required>
<option [ngValue]="{_id: '0'}">Auswählen...</option>
<option *ngFor="let deco of decorations" [ngValue]="deco">
{{deco.name}}
</option>
@ -42,7 +44,7 @@
</div>
</div>
<div class="form-group" *ngIf="showForm">
<div class="form-group">
<label for="reason">Begründung</label>
<textarea class="form-control center-block" name="reason" [(ngModel)]="reason" required
id="reason" placeholder="Begründung eingeben..." rows="3" ></textarea>
@ -57,8 +59,7 @@
<button id="save"
(click)="addAwarding(decoPreview, decoDescription)"
class="btn btn-default"
*ngIf="showForm"
[disabled]="!form.valid">
[disabled]="!form.valid || user._id === '0' || decoration._id === '0'">
Bestätigen
</button>

31
static/src/app/request/award/req-award.component.ts
View File

@ -21,7 +21,7 @@ export class RequestAwardComponent {
user: User = {_id: '0'};
decoration: Decoration = null;
decoration: Decoration = {_id: '0'};
reason: string = '';
@ -41,35 +41,28 @@ export class RequestAwardComponent {
}
ngOnInit() {
let currentUser = JSON.parse(localStorage.getItem('currentUser'));
// show only current users squad members
const currentUser = JSON.parse(localStorage.getItem('currentUser'));
this.userService.findUsers('', undefined, currentUser.squad._id).subscribe(users => {
this.users = users;
});
}
toggleUser(previewImage, decoDescription) {
if (this.user._id != '0') {
this.decoration = null;
if (previewImage && decoDescription) {
previewImage.src = decoDescription.innerHTML = '';
}
this.decorationService.findDecorations('', this.user.squad.fraction).subscribe(decorations => {
this.decorationService.findDecorations('', currentUser.squad.fraction).subscribe(decorations => {
this.decorations = decorations;
});
}
toggleUser() {
if (this.user._id !== '0') {
this.awardingService.getUserAwardings(this.user._id).subscribe(awards => {
this.awards = awards;
});
this.showForm = true;
} else {
this.showForm = false;
}
}
toggleDecoPreview(descriptionField, image) {
if (this.decoration._id !== '0') {
this.decoPreviewDisplay = 'flex'; // visible & keep same height for all children
const description = this.decorations.find(
@ -78,12 +71,14 @@ export class RequestAwardComponent {
image.src = 'resource/decoration/' + this.decoration._id + '.png';
descriptionField.innerHTML = description;
} else {
this.decoPreviewDisplay = 'none';
}
}
addAwarding(previewImage, descriptionField) {
if (this.decoration._id && this.reason.length > 0) {
const award : Award = {
const award: Award = {
"userId": this.user._id,
"decorationId": this.decoration._id,
"reason": this.reason,
@ -93,7 +88,7 @@ export class RequestAwardComponent {
this.awardingService.getUserAwardings(this.user._id)
.subscribe(awards => {
this.awards = awards;
this.decoration = null;
this.decoration = {_id: '0'};
this.reason = previewImage.src = descriptionField.innerHTML = '';
this.decoPreviewDisplay = 'none';
this.showSuccessLabel = true;
@ -113,7 +108,7 @@ export class RequestAwardComponent {
/**
* compare ngValue with ngModel to assign selected element
*/
equals(o1: User, o2: User) {
equals(o1, o2) {
if (o1 && o2) {
return o1._id === o2._id;
}

5
static/src/app/users/award-user/award-user.component.html
View File

@ -8,9 +8,10 @@
id="decoration"
#decorationField
(change)="toggleDecoPreview(decoDescription, decorationField.value, decoPreview)"
[ngModel]="undefined"
[ngModel]="0"
required
style="min-width: 200px;">
<option [value]="0">Auswählen...</option>
<option *ngFor="let deco of decorations" [value]="deco._id">
{{deco.fraction == 'BLUFOR'? 'NATO' : deco.fraction == 'OPFOR'? 'CSAT' : 'Global'}}: {{deco.name}}
</option>
@ -52,7 +53,7 @@
<button id="save"
(click)="addAwarding(decorationField, awardTextArea, decoPreview, decoDescription)"
class="btn btn-default"
[disabled]="!form.valid">
[disabled]="decorationField.value === '0' || !form.valid">
Bestätigen
</button>

5
static/src/app/users/award-user/award-user.component.ts
View File

@ -50,6 +50,7 @@ export class AwardUserComponent {
toggleDecoPreview(descriptionField, decorationId, image) {
if (decorationId !== '0') {
this.decoPreviewDisplay = 'flex'; // visible & keep same height for all children
const description = this.decorations.find(
@ -58,7 +59,9 @@ export class AwardUserComponent {
image.src = 'resource/decoration/' + decorationId + '.png';
descriptionField.innerHTML = description;
} else {
this.decoPreviewDisplay = 'none';
}
}
addAwarding(decorationField, reasonField, previewImage, descriptionField) {

2
static/src/app/wars/war-detail.component.css
View File

@ -22,7 +22,7 @@
.scoreboard-table-container {
min-width: 920px;
max-width: 920px;
margin-left: 10%
margin-left: 5%
}
.table-container {

4
static/src/app/wars/war-detail.component.html
View File

@ -1,6 +1,6 @@
<div class="overview" xmlns="http://www.w3.org/1999/html">
<div style="margin-left: 5%; min-height: 248px;">
<div style="margin-left: 5%; min-height: 263px;">
<h2>{{war.title}} - Schlacht vom {{war.date | date: 'dd.MM.yyyy'}}</h2>
<h3 class="pull-left">
<h4>Endpunktestand:</h4>
@ -53,7 +53,7 @@
</div>
</div>
<div class="pull-left" style="margin-top:20px;">
<div class="pull-left">
<div class="table-container scoreboard-table-container">
<table class="table table-hover" [mfData]="players" #mf="mfDataTable" [(mfSortBy)]="sortBy"
[(mfSortOrder)]="sortOrder">