RI-155: [admin/company] recharge le tableau lors de la création d'une…

… nouvelle entreprise (#186) * modification du composant companies-table.component pour qu'il extends base-with-pagination.component * ajout d'un toaster lors de l'ajout ou maj d'une entreprise * ajout du company-context-service.service
dyno-nuggets · Nov 19, 2021 · 4b9e833 · 4b9e833
1 parent b5df848
commit 4b9e833
Show file tree

Hide file tree

Showing 15 changed files with 192 additions and 88 deletions.
diff --git a/...mplicaction/src/app/admin/companies/components/companies-form/companies-form.component.ts b/...mplicaction/src/app/admin/companies/components/companies-form/companies-form.component.ts
@@ -8,6 +8,7 @@ import {Pageable} from '../../../../shared/models/pageable';
 import {Constants} from '../../../../config/constants';
 import {Company} from '../../../../shared/models/company';
 import {CompanyService} from '../../../../company/services/company.service';
+import {CompanyContextServiceService} from '../../../../shared/services/company-context-service.service';
 
 @Component({
   selector: 'app-companies-form',
@@ -28,6 +29,7 @@ export class CompaniesFormComponent extends SidebarContentComponent implements O
     private companyService: CompanyService,
     private toasterService: ToasterService,
     private sidebarService: SidebarService,
+    private companyContextService: CompanyContextServiceService
   ) {
     super();
   }
@@ -53,13 +55,22 @@ export class CompaniesFormComponent extends SidebarContentComponent implements O
       company$ = this.companyService.createCompany(company);
     }
     company$.subscribe(
-      (companyUpdate) => {
+      companySave => {
         if (this.isUpdate) {
-          this.updateFields(companyUpdate);
+          this.updateFields(companySave);
+        } else {
+          this.companyContextService.notify(companySave);
         }
       },
-      () => this.toasterService.error('Oops', `Une erreur est survenue lors de ${this.isUpdate ? 'la mise à jour' : `l'ajout`} de votre entreprise.`),
-      () => this.sidebarService.close()
+      () => {
+        const actionType = this.isUpdate ? 'la mise à jour' : `l'ajout`;
+        this.toasterService.error('Oops', `Une erreur est survenue lors de ${actionType} de votre entreprise.`);
+      },
+      () => {
+        const actionType = this.isUpdate ? 'mise à jour' : `ajoutée`;
+        this.toasterService.success('Succès', `L'entreprise ${company.name} a été ${actionType} avec succès.`);
+        this.sidebarService.close();
+      }
     );
   }
 

diff --git a/...caction/src/app/admin/companies/components/companies-table/companies-table.component.html b/...caction/src/app/admin/companies/components/companies-table/companies-table.component.html
@@ -11,7 +11,7 @@ <h2 class="panel-title">Toutes les entreprises</h2>
   </div>
 </div>
 <p-table
-  (onLazyLoad)="loadCompanies($event)"
+  (onLazyLoad)="paginate($event)"
   [lazy]="true"
   [loading]="loading"
   [paginator]="true"

diff --git a/...licaction/src/app/admin/companies/components/companies-table/companies-table.component.ts b/...licaction/src/app/admin/companies/components/companies-table/companies-table.component.ts
@@ -1,20 +1,21 @@
-import {Component} from '@angular/core';
+import {Component, OnInit} from '@angular/core';
 import {Pageable} from '../../../../shared/models/pageable';
 import {finalize, take} from 'rxjs/operators';
-import {LazyLoadEvent} from 'primeng/api';
 import {Company} from '../../../../shared/models/company';
 import {Constants} from '../../../../config/constants';
 import {CompanyService} from '../../../../company/services/company.service';
 import {ToasterService} from '../../../../core/services/toaster.service';
 import {SidebarService} from '../../../../shared/services/sidebar.service';
 import {CompaniesFormComponent} from '../companies-form/companies-form.component';
+import {CompanyContextServiceService} from '../../../../shared/services/company-context-service.service';
+import {BaseWithPaginationComponent} from '../../../../shared/components/base-with-pagination/base-with-pagination.component';
 
 @Component({
   selector: 'app-companies-table',
   templateUrl: './companies-table.component.html',
   styleUrls: ['./companies-table.component.scss']
 })
-export class CompaniesTableComponent {
+export class CompaniesTableComponent extends BaseWithPaginationComponent<Company> implements OnInit {
 
   readonly ROWS_PER_PAGE_OPTIONS = Constants.ROWS_PER_PAGE_OPTIONS;
   loading = true; // indique si les données sont en chargement
@@ -26,28 +27,19 @@ export class CompaniesTableComponent {
     private companyService: CompanyService,
     private toastService: ToasterService,
     private sidebarService: SidebarService,
+    private companyContextService: CompanyContextServiceService
   ) {
+    super();
   }
 
-  loadCompanies(event: LazyLoadEvent): void {
-    this.loading = true;
-    const page = event.first / event.rows;
-
-    this.companyService
-      .getAll({page, rows: event.rows})
-      .pipe(
-        take(1),
-        finalize(() => this.loading = false)
-      )
-      .subscribe(
-        data => {
-          this.pageable.totalPages = data.totalPages;
-          this.pageable.rows = data.size;
-          this.pageable.totalElements = data.totalElements;
-          this.pageable.content = data.content;
-        },
-        () => this.toastService.error('Oops', 'Une erreur est survenue lors de la récupération des données'),
-      );
+  ngOnInit(): void {
+    this.companyContextService
+      .observe$
+      .subscribe(company => {
+        if (company) {
+          this.paginate();
+        }
+      });
   }
 
   onEditCompany(company: Company): void {
@@ -68,5 +60,26 @@ export class CompaniesTableComponent {
         width: 650
       });
   }
+
+  protected innerPaginate(): void {
+    // FIXME: il faut forcer les paramètres de tri car ils restent définis avec les valeurs du dernier composant visité
+    this.pageable.sortBy = 'id';
+    this.pageable.sortOrder = 'ASC';
+    this.companyService
+      .getAll(this.pageable)
+      .pipe(
+        take(1),
+        finalize(() => this.loading = false)
+      )
+      .subscribe(
+        data => {
+          this.pageable.totalPages = data.totalPages;
+          this.pageable.rows = data.size;
+          this.pageable.totalElements = data.totalElements;
+          this.pageable.content = data.content;
+        },
+        () => this.toastService.error('Oops', 'Une erreur est survenue lors de la récupération des données'),
+      );
+  }
 }
 
diff --git a/frontend-implicaction/src/app/admin/jobs/components/jobs-table/jobs-table.component.ts b/frontend-implicaction/src/app/admin/jobs/components/jobs-table/jobs-table.component.ts
@@ -42,10 +42,6 @@ export class JobsTableComponent implements OnInit {
   }
 
   ngOnInit(): void {
-    this.pageable.sortOrder = JobSortEnum.DATE_DESC.sortDirection;
-    this.pageable.sortBy = JobSortEnum.DATE_DESC.sortBy;
-    this.selectedOrderCode = JobSortEnum.DATE_DESC.code;
-
     this.filterService
       .observeFilter()
       .subscribe(criteria => {
@@ -88,6 +84,37 @@ export class JobsTableComponent implements OnInit {
     this.filterService.setFilter(this.criteria);
   }
 
+  loadJobs(event: LazyLoadEvent): void {
+    this.loading = true;
+    const page = event.first / event.rows;
+
+    this.jobService
+      .getAllByCriteria({page, rows: event.rows}, this.criteria)
+      .pipe(
+        take(1),
+        finalize(() => this.loading = false)
+      )
+      .subscribe(
+        data => {
+          this.pageable.totalPages = data.totalPages;
+          this.pageable.rows = data.size;
+          this.pageable.totalElements = data.totalElements;
+          this.pageable.content = data.content;
+        },
+        () => this.toastService.error('Oops', 'Une erreur est survenue lors de la récupération des données'),
+      );
+  }
+
+  editJob(job: JobPosting): void {
+    this.sidebarService
+      .open({
+        title: `Editer une nouvelle offre d'emploi`,
+        input: {job},
+        component: JobPostingFormComponent,
+        width: 650
+      });
+  }
+
   private async getFilterFromQueryParams(): Promise<void> {
     // TODO: voir si y'a un moyen plus élégant avec typeof
     const filterKeys = ['search', 'contractType'];
@@ -121,35 +148,4 @@ export class JobsTableComponent implements OnInit {
       sortOrder: this.pageable.sortOrder
     };
   }
-
-  loadJobs(event: LazyLoadEvent): void {
-    this.loading = true;
-    const page = event.first / event.rows;
-
-    this.jobService
-      .getAllByCriteria({page, rows: event.rows}, this.criteria)
-      .pipe(
-        take(1),
-        finalize(() => this.loading = false)
-      )
-      .subscribe(
-        data => {
-          this.pageable.totalPages = data.totalPages;
-          this.pageable.rows = data.size;
-          this.pageable.totalElements = data.totalElements;
-          this.pageable.content = data.content;
-        },
-        () => this.toastService.error('Oops', 'Une erreur est survenue lors de la récupération des données'),
-      );
-  }
-
-  editJob(job: JobPosting): void {
-    this.sidebarService
-      .open({
-        title: `Editer une nouvelle offre d'emploi`,
-        input: {job},
-        component: JobPostingFormComponent,
-        width: 650
-      });
-  }
 }
diff --git a/frontend-implicaction/src/app/discussion/components/comment-list/comment-list.component.ts b/frontend-implicaction/src/app/discussion/components/comment-list/comment-list.component.ts
@@ -7,7 +7,7 @@ import {Subscription} from 'rxjs';
 import {ActivatedRoute} from '@angular/router';
 import {finalize} from 'rxjs/operators';
 import {Comment} from '../../model/comment';
-import {BaseWithPaginationComponent} from '../../../shared/components/base-with-pagination-component/base-with-pagination.component';
+import {BaseWithPaginationComponent} from '../../../shared/components/base-with-pagination/base-with-pagination.component';
 import {CommentPayload} from '../../model/comment-payload';
 import {FormControl, FormGroup, Validators} from '@angular/forms';
 import {CommentService} from '../../services/comment.service';

diff --git a/frontend-implicaction/src/app/discussion/components/post-list/post-list.component.ts b/frontend-implicaction/src/app/discussion/components/post-list/post-list.component.ts
@@ -1,6 +1,6 @@
 import {Component, OnInit} from '@angular/core';
 import {Post} from '../../model/post';
-import {BaseWithPaginationComponent} from '../../../shared/components/base-with-pagination-component/base-with-pagination.component';
+import {BaseWithPaginationComponent} from '../../../shared/components/base-with-pagination/base-with-pagination.component';
 import {PostService} from '../../services/post.service';
 import {ToasterService} from '../../../core/services/toaster.service';
 import {finalize} from 'rxjs/operators';

diff --git a/frontend-implicaction/src/app/job/components/jobs-list/jobs-list.component.ts b/frontend-implicaction/src/app/job/components/jobs-list/jobs-list.component.ts
@@ -8,13 +8,15 @@ import {JobCriteriaFilter} from '../../models/job-criteria-filter';
 import {JobFilterContextService} from '../../services/job-filter-context.service';
 import {ActivatedRoute} from '@angular/router';
 import {SortDirectionEnum} from '../../../shared/enums/sort-direction.enum';
+import {BaseWithPaginationComponent} from '../../../shared/components/base-with-pagination/base-with-pagination.component';
+import {JobPosting} from '../../../shared/models/job-posting';
 
 @Component({
   selector: 'app-jobs-list',
   templateUrl: './jobs-list.component.html',
   styleUrls: ['./jobs-list.component.scss']
 })
-export class JobsListComponent implements OnInit {
+export class JobsListComponent extends BaseWithPaginationComponent<JobPosting> implements OnInit {
 
   readonly ROWS_PER_PAGE_OPTIONS = Constants.ROWS_PER_PAGE_OPTIONS;
 
@@ -33,6 +35,7 @@ export class JobsListComponent implements OnInit {
     private filterService: JobFilterContextService,
     private route: ActivatedRoute
   ) {
+    super();
   }
 
   ngOnInit(): void {
@@ -53,11 +56,18 @@ export class JobsListComponent implements OnInit {
       .then(() => this.filterService.setFilter(this.criteria));
   }
 
-  paginate({page, first, rows} = this.pageable): void {
-    this.isLoading = true;
-    this.pageable.page = page;
-    this.pageable.first = first;
-    this.pageable.rows = rows;
+  onSortChange({value}): void {
+    const selectedOrderField = JobSortEnum.from(value);
+    this.pageable.sortBy = selectedOrderField.sortBy;
+    this.pageable.sortOrder = selectedOrderField.sortDirection;
+    this.filterService.setFilter(this.criteria); // on relance la recherche en updatant le filtre
+  }
+
+  onSearchChange(): void {
+    this.filterService.setFilter(this.criteria);
+  }
+
+  protected innerPaginate(): void {
     this.jobsService
       .getAllByCriteria(this.pageable, this.criteria)
       .pipe(finalize(() => this.isLoading = false))
@@ -71,17 +81,6 @@ export class JobsListComponent implements OnInit {
       );
   }
 
-  onSortChange({value}): void {
-    const selectedOrderField = JobSortEnum.from(value);
-    this.pageable.sortBy = selectedOrderField.sortBy;
-    this.pageable.sortOrder = selectedOrderField.sortDirection;
-    this.filterService.setFilter(this.criteria); // on relance la recherche en updatant le filtre
-  }
-
-  onSearchChange(): void {
-    this.filterService.setFilter(this.criteria);
-  }
-
   private async getFilterFromQueryParams(): Promise<void> {
     // TODO: voir si y'a un moyen plus élégant avec typeof
     const filterKeys = ['search', 'contractType'];

diff --git a/...nt/base-with-pagination.component.spec.ts → ...on/base-with-pagination.component.spec.ts b/...nt/base-with-pagination.component.spec.ts → ...on/base-with-pagination.component.spec.ts
@@ -3,8 +3,8 @@ import {ComponentFixture, TestBed} from '@angular/core/testing';
 import {BaseWithPaginationComponent} from './base-with-pagination.component';
 
 describe('AbstractPaginationComponentComponent', () => {
-  let component: BaseWithPaginationComponent;
-  let fixture: ComponentFixture<BaseWithPaginationComponent>;
+  let component: BaseWithPaginationComponent<any>;
+  let fixture: ComponentFixture<BaseWithPaginationComponent<any>>;
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({

diff --git a/...mponent/base-with-pagination.component.ts → ...ination/base-with-pagination.component.ts b/...mponent/base-with-pagination.component.ts → ...ination/base-with-pagination.component.ts
@@ -11,15 +11,31 @@ export class BaseWithPaginationComponent<T> {
   // Pagination
   pageable: Pageable<T> = Constants.PAGEABLE_DEFAULT;
 
+  /**
+   * Lance la pagination en invoquant la méthode {@link innerPaginate}
+   * @param page numéro de la page
+   * @param first indice du 1er élément à récupérer
+   * @param rows nombre d'éléments par page
+   */
   paginate({page, first, rows} = this.pageable): void {
     this.isLoading = true;
-    this.pageable.page = page;
+    if (page) {
+      this.pageable.page = page;
+    } else if (rows > 0) {
+      this.pageable.page = first / rows;
+    } else {
+      this.pageable.page = 0;
+    }
     this.pageable.first = first;
     this.pageable.rows = rows;
 
     this.innerPaginate();
   }
 
+  /**
+   * méthode à implémenter qui lance les appels au service voulu
+   * @protected
+   */
   protected innerPaginate(): void {
   }
 }
diff --git a/frontend-implicaction/src/app/shared/components/job-filter/job-filter.component.ts b/frontend-implicaction/src/app/shared/components/job-filter/job-filter.component.ts
@@ -1,23 +1,25 @@
-import {Component, OnInit} from '@angular/core';
+import {Component, OnDestroy, OnInit} from '@angular/core';
 import {ContractTypeCode, ContractTypeEnum} from '../../../job/models/contract-type-enum';
 import {JobCriteriaFilter} from '../../../job/models/job-criteria-filter';
 import {JobFilterContextService} from '../../../job/services/job-filter-context.service';
+import {Subscription} from 'rxjs';
 
 @Component({
   selector: 'app-job-filter',
   templateUrl: './job-filter.component.html',
   styleUrls: ['./job-filter.component.scss']
 })
-export class JobFilterComponent implements OnInit {
+export class JobFilterComponent implements OnInit, OnDestroy {
 
   contractTypes = ContractTypeEnum.all();
   criteria: JobCriteriaFilter = {};
+  subscription: Subscription;
 
   constructor(private filterContextService: JobFilterContextService) {
   }
 
   ngOnInit(): void {
-    this.filterContextService
+    this.subscription = this.filterContextService
       .observeFilter()
       .subscribe(criteria => this.criteria = criteria);
   }
@@ -26,4 +28,8 @@ export class JobFilterComponent implements OnInit {
     this.criteria.contractType = code;
     this.filterContextService.setFilter(this.criteria);
   }
+
+  ngOnDestroy(): void {
+    this.subscription?.unsubscribe();
+  }
 }