From c9393be5619eae279a695e0606f552eadc998db2 Mon Sep 17 00:00:00 2001
From: Lukas Haase <lukas.haase@mni.thm.de>
Date: Thu, 7 Oct 2021 16:10:20 +0200
Subject: [PATCH] fix filter bug, adjust style
---
.../shared/comment-list/comment-list.component.html | 11 +++++++++--
.../shared/comment-list/comment-list.component.scss | 5 +++++
.../shared/comment-list/comment-list.component.ts | 12 +++++++++---
3 files changed, 23 insertions(+), 5 deletions(-)
diff --git a/src/app/components/shared/comment-list/comment-list.component.html b/src/app/components/shared/comment-list/comment-list.component.html
index 98e0004f6..facf12722 100644
--- a/src/app/components/shared/comment-list/comment-list.component.html
+++ b/src/app/components/shared/comment-list/comment-list.component.html
@@ -264,7 +264,8 @@
<app-mat-spinner-overlay *ngIf="isLoading" overlay="true"></app-mat-spinner-overlay>
<div *ngIf="!isLoading">
- <app-comment *ngFor="let current of (hideCommentsList ? filteredComments : commentsFilteredByTime).slice(page*5,(page*5)+5); let i = index"
+ <app-comment *ngFor="let current of (hideCommentsList ?
+ filteredComments : commentsFilteredByTime).slice(pageIndex*pageSize,(pageIndex*pageSize)+pageSize); let i = index"
[appScrollIntoView]="current.id === focusCommentId"
[usesJoyride]="i === 0 && isJoyrideActive"
[comment]="current"
@@ -279,7 +280,13 @@
(clickedOnKeyword)="clickedOnKeyword($event)"
(votedComment)="votedComment($event)">
</app-comment>
- <mat-paginator [pageSize]="5" (page)="setPage($event)"
+ <mat-paginator class="mat-paginator"
+ [pageSize]="5"
+ (page)="handlePageEvent($event)"
+ [showFirstLastButtons]="showFirstLastButtons"
+ [pageSizeOptions]="pageSizeOptions"
+ [pageIndex]="pageIndex"
+ [color]="'primary'"
[length]="(hideCommentsList ? filteredComments : commentsFilteredByTime).length"></mat-paginator>
<ars-row [height]="64">
</ars-row>
diff --git a/src/app/components/shared/comment-list/comment-list.component.scss b/src/app/components/shared/comment-list/comment-list.component.scss
index 0406d467b..95eea764c 100644
--- a/src/app/components/shared/comment-list/comment-list.component.scss
+++ b/src/app/components/shared/comment-list/comment-list.component.scss
@@ -275,3 +275,8 @@ h3 {
h1 {
color: red;
}
+
+.mat-paginator{
+ background-color:transparent;
+ color:var(--on-background);
+}
diff --git a/src/app/components/shared/comment-list/comment-list.component.ts b/src/app/components/shared/comment-list/comment-list.component.ts
index 111c8d64c..1e73a75e1 100644
--- a/src/app/components/shared/comment-list/comment-list.component.ts
+++ b/src/app/components/shared/comment-list/comment-list.component.ts
@@ -33,6 +33,7 @@ import { WsRoomService } from '../../../services/websockets/ws-room.service';
import { ActiveUserService } from '../../../services/http/active-user.service';
import { OnboardingService } from '../../../services/util/onboarding.service';
import { WorkerDialogComponent } from '../_dialogs/worker-dialog/worker-dialog.component';
+import { PageEvent } from '@angular/material/paginator';
export interface CommentListData {
currentFilter: CommentFilter;
@@ -109,7 +110,10 @@ export class CommentListComponent implements OnInit, OnDestroy {
private _subscriptionEventServiceTagConfig = null;
private _subscriptionEventServiceRoomData = null;
private _subscriptionRoomService = null;
- page=0;
+ pageIndex = 0;
+ pageSize = 10;
+ pageSizeOptions = [5, 10, 25];
+ showFirstLastButtons = true;
constructor(
private commentService: CommentService,
@@ -142,8 +146,9 @@ export class CommentListComponent implements OnInit, OnDestroy {
});
}
- setPage(e:any){
- this.page=e.pageIndex;
+ handlePageEvent(e:PageEvent){
+ this.pageIndex = e.pageIndex;
+ this.pageSize = e.pageSize;
}
initNavigation() {
@@ -369,6 +374,7 @@ export class CommentListComponent implements OnInit, OnDestroy {
}
filterComments(type: string, compare?: any): void {
+ this.pageIndex=0;
this.currentFilter = type;
this.currentFilterCompare = compare;
if (type === '') {
--
GitLab