diff --git a/src/Ombi/ClientApp/app/requests/movierequests.component.html b/src/Ombi/ClientApp/app/requests/movierequests.component.html index 8eded8dba..19814b330 100644 --- a/src/Ombi/ClientApp/app/requests/movierequests.component.html +++ b/src/Ombi/ClientApp/app/requests/movierequests.component.html @@ -56,7 +56,7 @@
-
+
@@ -212,6 +212,8 @@
+ +
diff --git a/src/Ombi/ClientApp/app/requests/movierequests.component.ts b/src/Ombi/ClientApp/app/requests/movierequests.component.ts index e28b86eaa..bb6e17b7f 100644 --- a/src/Ombi/ClientApp/app/requests/movierequests.component.ts +++ b/src/Ombi/ClientApp/app/requests/movierequests.component.ts @@ -8,7 +8,7 @@ import { Subject } from "rxjs/Subject"; import { AuthService } from "../auth/auth.service"; import { NotificationService, RadarrService, RequestService } from "../services"; -import { FilterType, IFilter, IIssueCategory, IMovieRequests, IRadarrProfile, IRadarrRootFolder } from "../interfaces"; +import { FilterType, IFilter, IIssueCategory, IMovieRequests, IPagenator, IRadarrProfile, IRadarrRootFolder } from "../interfaces"; @Component({ selector: "movie-requests", @@ -65,8 +65,8 @@ export class MovieRequestsComponent implements OnInit { } public ngOnInit() { - this.amountToLoad = 100; - this.currentlyLoaded = 100; + this.amountToLoad = 10; + this.currentlyLoaded = 10; this.loadInit(); this.isAdmin = this.auth.hasRole("admin") || this.auth.hasRole("poweruser"); this.filter = { @@ -74,8 +74,10 @@ export class MovieRequestsComponent implements OnInit { statusFilter: FilterType.None}; } - public loadMore() { - this.loadRequests(this.amountToLoad, this.currentlyLoaded); + public paginate(event: IPagenator) { + const skipAmount = event.first; + + this.loadRequests(this.amountToLoad, skipAmount); } public search(text: any) { @@ -226,7 +228,7 @@ export class MovieRequestsComponent implements OnInit { if(!this.movieRequests) { this.movieRequests = []; } - this.movieRequests.push.apply(this.movieRequests, x); + this.movieRequests = x; this.currentlyLoaded = currentlyLoaded + amountToLoad; }); } diff --git a/src/Ombi/ClientApp/app/requests/requests.module.ts b/src/Ombi/ClientApp/app/requests/requests.module.ts index 7bddee71c..18be5ed25 100644 --- a/src/Ombi/ClientApp/app/requests/requests.module.ts +++ b/src/Ombi/ClientApp/app/requests/requests.module.ts @@ -6,7 +6,7 @@ import { OrderModule } from "ngx-order-pipe"; import { InfiniteScrollModule } from "ngx-infinite-scroll"; -import { ButtonModule, DialogModule } from "primeng/primeng"; +import { ButtonModule, DialogModule, PaginatorModule } from "primeng/primeng"; import { MovieRequestsComponent } from "./movierequests.component"; // Request import { RequestComponent } from "./request.component"; @@ -36,6 +36,7 @@ const routes: Routes = [ SharedModule, SidebarModule, OrderModule, + PaginatorModule, ], declarations: [ RequestComponent, diff --git a/src/Ombi/ClientApp/styles/base.scss b/src/Ombi/ClientApp/styles/base.scss index 3a5deb2a3..2f9b35982 100644 --- a/src/Ombi/ClientApp/styles/base.scss +++ b/src/Ombi/ClientApp/styles/base.scss @@ -959,3 +959,7 @@ a > h4:hover { width: 94%; } +.ui-state-active { + background-color: $primary-colour-outline $i; + color: black $i; +} \ No newline at end of file