From 6ec35cf16c3cbf2186b4ab22fb338fb736c65e36 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lukas=20Mau=C3=9F?= <lukas.mauss@mni.thm.de>
Date: Mon, 27 May 2019 15:58:23 +0200
Subject: [PATCH] Fix statistics list layout
---
.../list-statistic/list-statistic.component.html | 14 +++++++-------
.../list-statistic/list-statistic.component.scss | 7 +++++--
.../list-statistic/list-statistic.component.ts | 8 +++++++-
3 files changed, 19 insertions(+), 10 deletions(-)
diff --git a/src/app/components/shared/list-statistic/list-statistic.component.html b/src/app/components/shared/list-statistic/list-statistic.component.html
index db1011636..7819f3608 100644
--- a/src/app/components/shared/list-statistic/list-statistic.component.html
+++ b/src/app/components/shared/list-statistic/list-statistic.component.html
@@ -23,25 +23,25 @@
'positive' : cp.percent >= status.good,
'okay' : cp.percent >= status.okay && cp.percent < status.good,
'negative' : cp.percent < status.okay,
- 'empty' : cp.percent < status.zero }" (click)="goToStats(cp.contentId)">{{cp.percent.toFixed() + ' %'}}</mat-cell>
+ 'empty invisible' : cp.percent < status.zero }" (click)="goToStats(cp.contentId)">{{cp.percent.toFixed() + ' %'}}</mat-cell>
</ng-container>
- <ng-container matColumnDef="counts">
- <mat-header-cell *matHeaderCellDef> {{'statistic.answers' | translate}} </mat-header-cell>
+ <ng-container matColumnDef="abstentions">
+ <mat-header-cell *matHeaderCellDef> {{'statistic.abstentions' | translate}} </mat-header-cell>
<mat-cell *matCellDef="let cp" [ngClass]="{
'positive' : cp.percent >= status.good,
'okay' : cp.percent >= status.okay && cp.percent < status.good,
'negative' : cp.percent < status.okay,
- 'empty' : cp.percent < status.zero }" (click)="goToStats(cp.contentId)">{{cp.counts}}</mat-cell>
+ 'empty invisible' : cp.percent < status.zero }" (click)="goToStats(cp.contentId)">{{cp.abstentions}}</mat-cell>
</ng-container>
- <ng-container matColumnDef="abstentions">
- <mat-header-cell *matHeaderCellDef> {{'statistic.abstentions' | translate}} </mat-header-cell>
+ <ng-container matColumnDef="counts">
+ <mat-header-cell *matHeaderCellDef> {{'statistic.answers' | translate}} </mat-header-cell>
<mat-cell *matCellDef="let cp" [ngClass]="{
'positive' : cp.percent >= status.good,
'okay' : cp.percent >= status.okay && cp.percent < status.good,
'negative' : cp.percent < status.okay,
- 'empty' : cp.percent < status.zero }" (click)="goToStats(cp.contentId)">{{cp.abstentions}}</mat-cell>
+ 'empty invisible' : cp.percent < status.zero }" (click)="goToStats(cp.contentId)">{{cp.counts}}</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
diff --git a/src/app/components/shared/list-statistic/list-statistic.component.scss b/src/app/components/shared/list-statistic/list-statistic.component.scss
index 9d5e36959..4a6726750 100644
--- a/src/app/components/shared/list-statistic/list-statistic.component.scss
+++ b/src/app/components/shared/list-statistic/list-statistic.component.scss
@@ -20,7 +20,7 @@ table {
.mat-column-abstentions {
display: flex;
- justify-content: flex-end;
+ justify-content: center;
}
mat-header-cell {
@@ -51,7 +51,10 @@ mat-toolbar {
}
.empty {
- color: var(--grey)!important;
background: var(--grey);
pointer-events: none;
}
+
+.invisible {
+ color: var(--grey)!important;
+}
diff --git a/src/app/components/shared/list-statistic/list-statistic.component.ts b/src/app/components/shared/list-statistic/list-statistic.component.ts
index 96e86855e..c1223d79b 100644
--- a/src/app/components/shared/list-statistic/list-statistic.component.ts
+++ b/src/app/components/shared/list-statistic/list-statistic.component.ts
@@ -37,7 +37,7 @@ export class ListStatisticComponent implements OnInit {
@Input() contentGroup: ContentGroup;
contents: Content[] = [];
- displayedColumns = ['content', 'counts', 'percentage'];
+ displayedColumns: string[] = [];
status = {
good: 85 ,
okay: 50 ,
@@ -50,6 +50,7 @@ export class ListStatisticComponent implements OnInit {
contentCounter = 0;
roomId: number;
baseUrl: string;
+ deviceType = localStorage.getItem('deviceType');
constructor(private contentService: ContentService,
private translateService: TranslateService,
@@ -69,6 +70,11 @@ export class ListStatisticComponent implements OnInit {
this.getData(contents);
});
this.getBaseUrl();
+ if (this.deviceType === 'desktop') {
+ this.displayedColumns = ['content', 'counts', 'abstentions', 'percentage'];
+ } else {
+ this.displayedColumns = ['content', 'counts', 'percentage'];
+ }
}
getBaseUrl() {
--
GitLab