Feature/pagination

package.json

@@ -4,7 +4,7 @@
   "scripts": {
     "ng": "ng",
     "start": "ng serve --proxy-config proxy.conf.json",
-    "build": "ng build",
+    "build": "ng build --prod",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e"
@@ -35,7 +35,7 @@
     "file-saver": "^2.0.1",
     "live-server": "^1.2.1",
     "marked": "^0.7.0",
-    "ng-multiselect-dropdown": "^0.2.3",
+    "ng-multiselect-dropdown": "0.2.3",
     "ngx-file-drop": "^5.0.6",
     "rxjs": "^6.4.0",
     "tslib": "^1.9.0",

src/app/admin-applications/admin-applications.component.html

@@ -7,4 +7,5 @@ <h1 class="h2">Administration des applications</h1>
   [table]="table"
   (actionClicked)="onActionClicked($event)"
   (globalActionClicked)="onClickAddApplication()">
+  <ngb-pagination footer class="d-flex justify-content-center" [maxSize]="5" [collectionSize]="totalSize" [pageSize]="size" [(page)]="page" (pageChange)="onPageChange($event)" aria-label="Default pagination"></ngb-pagination>
 </app-table>

src/app/admin-applications/admin-applications.component.ts

@@ -7,6 +7,8 @@ import {ActionClickEvent} from '../shared/table/action-click-event.model';
 import {ModalApplicationComponent} from './modal-application/modal-application.component';
 import {ModalUsersComponent} from './modal-users/modal-users.component';
 import {ModalApplicationDeletionComponent} from './modal-application-deletion/modal-application-deletion.component';
+import {Constants} from "../shared/Constants";
+import {Pageable} from "../core/models/pageable.model";
 
 @Component({
   selector: 'app-admin-applications',
@@ -15,6 +17,9 @@ import {ModalApplicationDeletionComponent} from './modal-application-deletion/mo
 })
 export class AdminApplicationsComponent implements OnInit {
   table: Table;
+  size = this.constants.numberByPage;
+  page = 0;
+  totalSize = 0;
 
   private idActionModify = 'actionModify';
   private idActionDelete = 'actionDelete';
@@ -23,6 +28,7 @@ export class AdminApplicationsComponent implements OnInit {
 
   constructor(private modalService: NgbModal,
               private applicationsService: ApplicationsService,
+              private constants: Constants,
               private notifierService: NotifierService) {
   }
 
@@ -33,7 +39,7 @@ export class AdminApplicationsComponent implements OnInit {
   showApplications() {
     this.table = new Table();
     this.table.showHeader = false;
-    this.table.showFooter = false;
+    this.table.showFooter = true;
 
     this.table.settings.globalAction = new Action('Ajouter une application', '');
 
@@ -58,10 +64,11 @@ export class AdminApplicationsComponent implements OnInit {
     this.refreshApplication();
   }
 
-  refreshApplication() {
-    this.applicationsService.getAllManage().subscribe(
+  refreshApplication(pageable?: Pageable) {
+    this.applicationsService.getAllManage(pageable).subscribe(
       (applications) => {
-        this.table.items = applications;
+        this.table.items = applications.content;
+        this.totalSize = applications.totalElements;
       }
     );
   }
@@ -70,7 +77,7 @@ export class AdminApplicationsComponent implements OnInit {
     const modalRef = this.modalService.open(ModalApplicationComponent);
     modalRef.result.then((result) => {
       this.notifierService.notify('success', `L'application ${result.name} a bien été ajoutée`);
-      this.refreshApplication();
+      this.page = 1;
     }, (reason) => {
       if (reason.message !== undefined) {
         this.notifierService.notify('error', `Une erreur est survenue lors de l'ajout de l'application : ${reason.message}`);
@@ -84,7 +91,7 @@ export class AdminApplicationsComponent implements OnInit {
       const modalRef = this.modalService.open(ModalApplicationComponent);
       modalRef.result.then((result) => {
         this.notifierService.notify('success', `L'application ${result.name} a bien été modifiée`);
-        this.refreshApplication();
+        this.page = 1;
       }, (reason) => {
         if (reason.message !== undefined) {
           this.notifierService.notify('error', `Une erreur est survenue lors de la modification de l'application : ${reason.message}`);
@@ -100,7 +107,7 @@ export class AdminApplicationsComponent implements OnInit {
         this.applicationsService.deleteApplication(event.item.id).subscribe(
           () => {
             this.notifierService.notify('success', `L'application a été supprimée`);
-            this.refreshApplication();
+            this.page = 1;
           },
           reason => {
             this.notifierService.notify('error', `Une erreur est survenue lors de la suppression de l'application : ${reason}`);
@@ -126,4 +133,8 @@ export class AdminApplicationsComponent implements OnInit {
       modalRef.componentInstance.isModerator = true;
     }
   }
+
+  onPageChange(event) {
+    this.refreshApplication(new Pageable(this.page-1, this.size))
+  }
 }

src/app/admin-news/admin-news.component.html

@@ -5,4 +5,5 @@ <h1 class="h2">Administration des actualités</h1>
            [table]="table"
            (actionClicked)="onActionClicked($event)"
            (globalActionClicked)="onClickAddNew()">
+  <ngb-pagination footer class="d-flex justify-content-center" [maxSize]="5" [collectionSize]="totalSize" [pageSize]="size" [(page)]="page" (pageChange)="onPageChange($event)" aria-label="Default pagination"></ngb-pagination>
 </app-table>

src/app/admin-news/admin-news.component.ts

@@ -6,6 +6,8 @@ import {NewsService} from '../core/services';
 import {ActionClickEvent} from '../shared/table/action-click-event.model';
 import {ModalNewComponent} from './modal-new/modal-new.component';
 import {ModalNewDeletionComponent} from './modal-new-deletion/modal-new-deletion.component';
+import {Pageable} from "../core/models/pageable.model";
+import {Constants} from "../shared/Constants";
 
 @Component({
   selector: 'app-admin-news',
@@ -18,9 +20,13 @@ export class AdminNewsComponent implements OnInit {
 
   private idActionModify = 'actionModify';
   private idActionDelete = 'actionDelete';
+  size = this.constants.numberByPage;
+  page = 0;
+  totalSize = 0;
 
   constructor(private modalService: NgbModal,
               private notifierService: NotifierService,
+              private constants: Constants,
               private newsService: NewsService) {
   }
 
@@ -49,13 +55,16 @@ export class AdminNewsComponent implements OnInit {
     this.table.settings.actionsDefinition.actions.push(new Action('Modifier', this.idActionModify));
     this.table.settings.actionsDefinition.actions.push(new Action('Supprimer', this.idActionDelete));
 
-    this.refreshNorms();
+    this.refreshNews();
   }
 
-  refreshNorms() {
-    this.newsService.getAll().subscribe(
+  refreshNews(pageable?: Pageable) {
+    if(pageable.sort === undefined){
+      pageable.sort = "id,desc";
+    }
+    this.newsService.getAll(pageable).subscribe(
       (norms) => {
-        this.table.items = norms;
+        this.table.items = norms.content;
       }
     );
   }
@@ -64,7 +73,7 @@ export class AdminNewsComponent implements OnInit {
     const modalRef = this.modalService.open(ModalNewComponent, {size: 'lg'});
     modalRef.result.then(() => {
       this.notifierService.notify('success', `L'actualité a bien été ajoutée`);
-      this.refreshNorms();
+      this.refreshNews();
     }, (reason) => {
       if (reason.message !== undefined) {
         this.notifierService.notify('error', `Une erreur est survenue lors de l'ajout de l'actualité : ${reason.message}`);
@@ -78,7 +87,7 @@ export class AdminNewsComponent implements OnInit {
       const modalRef = this.modalService.open(ModalNewComponent, {size: 'lg'});
       modalRef.result.then((result) => {
         this.notifierService.notify('success', `L'actualité a bien été modifiée`);
-        this.refreshNorms();
+        this.refreshNews();
       }, (reason) => {
         if (reason.message !== undefined) {
           this.notifierService.notify('error', `Une erreur est survenue lors de la modification de l'actualité : ${reason.message}`);
@@ -94,7 +103,7 @@ export class AdminNewsComponent implements OnInit {
         this.newsService.deleteNew(event.item.id).subscribe(
           () => {
             this.notifierService.notify('success', `L'actualité a été supprimée`);
-            this.refreshNorms();
+            this.refreshNews();
           },
           reason => {
             this.notifierService.notify('error', `Une erreur est survenue lors de la suppression de l'actualité : ${reason}`);
@@ -107,4 +116,7 @@ export class AdminNewsComponent implements OnInit {
 
   }
 
+  onPageChange(event) {
+    this.refreshNews(new Pageable(this.page-1, this.size))
+  }
 }

src/app/admin-news/admin-news.module.ts

@@ -5,14 +5,16 @@ import {SharedModule} from '../shared';
 import {ModalNewComponent} from './modal-new/modal-new.component';
 import {ModalNewDeletionComponent} from './modal-new-deletion/modal-new-deletion.component';
 import { CKEditorModule } from '@ckeditor/ckeditor5-angular';
+import {NgbPaginationModule} from "@ng-bootstrap/ng-bootstrap";
 
 
 @NgModule({
   declarations: [AdminNewsComponent, ModalNewComponent, ModalNewDeletionComponent],
   imports: [
     AdminNewsRoutingModule,
     SharedModule,
-    CKEditorModule
+    CKEditorModule,
+    NgbPaginationModule
   ],
   entryComponents: [
     ModalNewDeletionComponent,

src/app/admin-norms/admin-norms.component.html

@@ -7,4 +7,5 @@ <h1 class="h2">Administration des normes</h1>
   [table]="table"
   (actionClicked)="onActionClicked($event)"
   (globalActionClicked)="onClickAddNorm()">
+  <ngb-pagination footer class="d-flex justify-content-center" [maxSize]="5" [collectionSize]="totalSize" [pageSize]="size" [(page)]="page" (pageChange)="onPageChange($event)" aria-label="Default pagination"></ngb-pagination>
 </app-table>

src/app/admin-norms/admin-norms.component.ts

@@ -6,6 +6,8 @@ import {NgbModal} from '@ng-bootstrap/ng-bootstrap';
 import {NotifierService} from 'angular-notifier';
 import {ModalNormComponent} from './modal-norm/modal-norm.component';
 import {ModalNormDeletionComponent} from './modal-norm-deletion/modal-norm-deletion.component';
+import {Constants} from "../shared/Constants";
+import {Pageable} from "../core/models/pageable.model";
 
 @Component({
   selector: 'app-admin-norms',
@@ -15,12 +17,16 @@ import {ModalNormDeletionComponent} from './modal-norm-deletion/modal-norm-delet
 export class AdminNormsComponent implements OnInit {
 
   table: Table;
+  size = this.constants.numberByPage;
+  page = 0;
+  totalSize = 0;
 
   private idActionModify = 'actionModify';
   private idActionDelete = 'actionDelete';
 
   constructor(private modalService: NgbModal,
               private notifierService: NotifierService,
+              private constants: Constants,
               private normsService: NormsService) {
   }
 
@@ -31,7 +37,7 @@ export class AdminNormsComponent implements OnInit {
   showNorms() {
     this.table = new Table();
     this.table.showHeader = false;
-    this.table.showFooter = false;
+    this.table.showFooter = true;
 
     this.table.settings.globalAction = new Action('Ajouter une norme', '');
 
@@ -58,10 +64,11 @@ export class AdminNormsComponent implements OnInit {
     this.refreshNorms();
   }
 
-  refreshNorms() {
-    this.normsService.getAll().subscribe(
+  refreshNorms(pageable?: Pageable) {
+    this.normsService.getAll(pageable).subscribe(
       (norms) => {
-        this.table.items = norms;
+        this.table.items = norms.content;
+        this.totalSize = norms.totalElements;
       }
     );
   }
@@ -112,4 +119,8 @@ export class AdminNormsComponent implements OnInit {
     }
 
   }
+
+  onPageChange(event) {
+    this.refreshNorms(new Pageable(this.page-1, this.size))
+  }
 }

src/app/admin-norms/admin-norms.module.ts

@@ -4,12 +4,14 @@ import {AdminNormsRoutingModule} from './admin-norms-routing.module';
 import {SharedModule} from '../shared';
 import {ModalNormComponent} from './modal-norm/modal-norm.component';
 import {ModalNormDeletionComponent} from './modal-norm-deletion/modal-norm-deletion.component';
+import {NgbPaginationModule} from "@ng-bootstrap/ng-bootstrap";
 
 @NgModule({
   declarations: [AdminNormsComponent, ModalNormComponent, ModalNormDeletionComponent],
   imports: [
     AdminNormsRoutingModule,
-    SharedModule
+    SharedModule,
+    NgbPaginationModule
   ],
   entryComponents: [
     ModalNormDeletionComponent,

src/app/admin-users/admin-users.component.html

@@ -5,7 +5,7 @@ <h1 class="h2">Administration des utilisateurs</h1>
   <div class="col-md-12">
     <div class="card">
       <div class="card-header py-1 d-flex">
-        <h5>{{ title }}</h5>
+<!--        <h5>{{ title }}</h5>-->
         <div class="ml-auto">
           <button type="button" class="btn btn-primary btn-sm float-right" (click)="onClickAddUser()">
             Ajouter un utilisateur

src/app/app.component.ts

@@ -4,8 +4,6 @@ import {UserService} from './core';
 import {TranslateService} from "@ngx-translate/core";
 import {OauthService} from "./security/oauth.service";
 import {environment} from "../environments/environment";
-import {Router} from "@angular/router";
-import {Location} from "@angular/common";
 
 @Component({
   selector: 'app-root',
@@ -17,9 +15,7 @@ export class AppComponent implements OnInit {
   constructor(
     private userService: UserService,
     private translate: TranslateService,
-    private oauthService: OauthService,
-    private router: Router,
-    private location: Location
+    private oauthService: OauthService
   ) {
     translate.addLangs(['en', 'fr']);
     translate.setDefaultLang('en');
@@ -28,9 +24,10 @@ export class AppComponent implements OnInit {
   }
 
   ngOnInit() {
-    console.log(this.location.path());
     if (!environment.jwt) {
-      this.oauthService.runInitialLoginSequence();
+      this.oauthService.runInitialLoginSequence().then(
+        () => this.userService.populate()
+      );
     }
     this.userService.populate();
     this.userService.isAuthenticated.subscribe((result) => this.isAuthenticated = result);

src/app/batchs/batchs.component.html

@@ -3,4 +3,5 @@
            [title]="environmentSelected.name" [table]="table"
            (actionClicked)="onActionClicked($event)">
 <app-date-traitement header [infoEnvironment]="environmentSelectedInfo"></app-date-traitement>
+  <ngb-pagination footer class="d-flex justify-content-center" [maxSize]="5" [collectionSize]="totalSize" [pageSize]="size" [(page)]="page" (pageChange)="onPageChange($event)" aria-label="Default pagination"></ngb-pagination>
 </app-table>