diff --git a/src/app/modules/companies/components/companies-page/companies-page.component.html b/src/app/modules/companies/components/companies-page/companies-page.component.html
index 40e48106..19a29843 100644
--- a/src/app/modules/companies/components/companies-page/companies-page.component.html
+++ b/src/app/modules/companies/components/companies-page/companies-page.component.html
@@ -85,6 +85,7 @@
diff --git a/src/app/modules/companies/components/companies-page/companies-page.component.ts b/src/app/modules/companies/components/companies-page/companies-page.component.ts
index add28476..6a302be6 100644
--- a/src/app/modules/companies/components/companies-page/companies-page.component.ts
+++ b/src/app/modules/companies/components/companies-page/companies-page.component.ts
@@ -1,5 +1,5 @@
import { Component, OnDestroy, OnInit } from "@angular/core";
-import { Router } from "@angular/router";
+import { Router, ActivatedRoute } from "@angular/router";
import { Company } from "@models/companies.model";
import { defaultPageParams, PageParams } from "@models/page-params";
import { PaginatedList } from "@models/paginated-list";
@@ -24,13 +24,18 @@ export class CompaniesPageComponent implements OnInit, OnDestroy {
private readonly service: CompaniesService,
private readonly title: TitleService,
private readonly router: Router,
+ private readonly route: ActivatedRoute,
private readonly gtag: GoogleAnalyticsService,
) {
this.title.setTitle("Отзывы к IT компаниям");
}
ngOnInit(): void {
- this.loadData(1);
+ this.route.queryParams.pipe(untilDestroyed(this)).subscribe(params => {
+ this.currentPage = params['page'] ? Number(params['page']) : 1;
+ this.searchQuery = params['search'] || '';
+ this.loadData(this.currentPage, false);
+ });
}
search(): void {
@@ -40,7 +45,7 @@ export class CompaniesPageComponent implements OnInit, OnDestroy {
"company_reviews",
this.searchQuery,
);
- this.loadData(1);
+ this.updateUrlParams(1);
}
}
@@ -61,13 +66,24 @@ export class CompaniesPageComponent implements OnInit, OnDestroy {
"company_reviews",
this.searchQuery,
);
- this.loadData(1);
+
+ this.router.navigate([], {
+ relativeTo: this.route,
+ queryParams: {},
+ });
+
+ this.loadData(1, false);
}
- loadData(pageToLoad: number): void {
+ loadData(pageToLoad: number, updateUrl: boolean = true): void {
this.companies = null;
this.source = null;
- this.currentPage = pageToLoad;
+
+ if (updateUrl) {
+ this.updateUrlParams(pageToLoad);
+ } else {
+ this.currentPage = pageToLoad;
+ }
this.service
.all({
@@ -82,6 +98,20 @@ export class CompaniesPageComponent implements OnInit, OnDestroy {
});
}
+ private updateUrlParams(page: number): void {
+ const queryParams: any = { page };
+
+ if (this.searchQuery && this.searchQuery.length >= 3) {
+ queryParams.search = this.searchQuery;
+ }
+
+ this.router.navigate([], {
+ relativeTo: this.route,
+ queryParams,
+ queryParamsHandling: 'merge',
+ });
+ }
+
navigateToCompany(id: string): void {
this.router.navigate(["/companies", id]);
}
diff --git a/src/app/shared/components/pagination-buttons/pagination-buttons.component.ts b/src/app/shared/components/pagination-buttons/pagination-buttons.component.ts
index bd9d9b1d..9a808f89 100644
--- a/src/app/shared/components/pagination-buttons/pagination-buttons.component.ts
+++ b/src/app/shared/components/pagination-buttons/pagination-buttons.component.ts
@@ -10,6 +10,9 @@ export class PaginationButtonsComponent implements OnInit {
@Input()
source: PaginatedModel | null = null;
+ @Input()
+ currentPage: number | null = null;
+
@Output()
pageChange: EventEmitter = new EventEmitter();
@@ -17,16 +20,18 @@ export class PaginationButtonsComponent implements OnInit {
lastPage: number | null = null;
get disablePreviousButton(): boolean {
+ const current = this.currentPage || (this.source ? this.source.currentPage : 1);
return (
this.source != null &&
- (this.source.currentPage === 1 || this.source.totalItems === 0)
+ (current === 1 || this.source.totalItems === 0)
);
}
get disableNextButton(): boolean {
+ const current = this.currentPage || (this.source ? this.source.currentPage : 1);
return (
this.source != null &&
- (this.source.currentPage === this.lastPage ||
+ (current === this.lastPage ||
this.source.totalItems === 0)
);
}
@@ -37,24 +42,26 @@ export class PaginationButtonsComponent implements OnInit {
const allPages = Array.from(Array(this.lastPage).keys()).map(
(i) => i + 1,
);
+
+ const current = this.currentPage || this.source.currentPage;
if (allPages.length > 7) {
if (
- this.source.currentPage > 3 &&
- this.source.currentPage < this.lastPage - 2
+ current > 3 &&
+ current < this.lastPage - 2
) {
this.pages = [
1,
2,
null,
- this.source.currentPage - 1,
- this.source.currentPage,
- this.source.currentPage + 1,
+ current - 1,
+ current,
+ current + 1,
null,
this.lastPage - 1,
this.lastPage,
];
- } else if (this.source.currentPage <= 3) {
+ } else if (current <= 3) {
this.pages = [1, 2, 3, 4, 5, null, this.lastPage - 1, this.lastPage];
} else {
this.pages = [
@@ -75,18 +82,20 @@ export class PaginationButtonsComponent implements OnInit {
}
previous(): void {
- if (this.source && this.source.currentPage > 1) {
- this.pageClicked(this.source.currentPage - 1);
+ const current = this.currentPage || (this.source ? this.source.currentPage : 1);
+ if (this.source && current > 1) {
+ this.pageClicked(current - 1);
}
}
next(): void {
+ const current = this.currentPage || (this.source ? this.source.currentPage : 1);
if (
this.source &&
this.lastPage &&
- this.source.currentPage < this.lastPage
+ current < this.lastPage
) {
- this.pageClicked(this.source.currentPage + 1);
+ this.pageClicked(current + 1);
}
}
@@ -100,7 +109,8 @@ export class PaginationButtonsComponent implements OnInit {
if (page == null) {
return "";
}
-
- return this.source && this.source.currentPage === page ? "active" : "";
+
+ const current = this.currentPage || (this.source ? this.source.currentPage : 1);
+ return this.source && current === page ? "active" : "";
}
}