19716 - Probative value - Fix date search filters

ui/ui-frontend/projects/referential/src/app/probative-value/probative-value-list/probative-value-list.component.html

@@ -28,17 +28,17 @@
       <tr class="vitamui-table-row">
         <td class="clickable" (click)="probativeValueClick.emit(probativeValue)">
           <i class="vitamui-icon vitamui-icon-probativeValue vitamui-row-icon status-badge"
-             [ngClass]="{'status-badge-green': probativeVlaueStatus(probativeValue) == 'OK', 'status-badge-grey':probativeVlaueStatus(probativeValue) == 'STARTED',
-                        'status-badge-orange': probativeVlaueStatus(probativeValue) == 'WARNING', 'status-badge-red': probativeVlaueStatus(probativeValue) == 'KO' || probativeVlaueStatus(probativeValue) == 'FATAL' }"></i>
+             [ngClass]="{'status-badge-green': probativeValueStatus(probativeValue) == 'OK', 'status-badge-grey':probativeValueStatus(probativeValue) == 'STARTED',
+                        'status-badge-orange': probativeValueStatus(probativeValue) == 'WARNING', 'status-badge-red': probativeValueStatus(probativeValue) == 'KO' || probativeValueStatus(probativeValue) == 'FATAL' }"></i>
         </td>
         <td class="clickable" (click)="probativeValueClick.emit(probativeValue)">{{ probativeValue?.id }}</td>
         <td class="clickable" (click)="probativeValueClick.emit(probativeValue)">{{ probativeValue?.dateTime | date: 'dd/MM/yyyy'  }}
         </td>
         <td class="clickable" (click)="probativeValueClick.emit(probativeValue)"
-          [ngClass]="{'text-green': probativeVlaueStatus(probativeValue) == 'OK', 'text-grey':probativeVlaueStatus(probativeValue) == 'STARTED',
-                                             'text-orange': probativeVlaueStatus(probativeValue) == 'WARNING', 'text-red': probativeVlaueStatus(probativeValue) == 'KO' || probativeVlaueStatus(probativeValue) == 'FATAL' }">
-          {{ probativeVlaueStatus(probativeValue) }}</td>
-        <td class="clickable" (click)="probativeValueClick.emit(probativeValue)">{{ probativeVlaueMessage(probativeValue)  }}</td>
+          [ngClass]="{'text-green': probativeValueStatus(probativeValue) == 'OK', 'text-grey':probativeValueStatus(probativeValue) == 'STARTED',
+                                             'text-orange': probativeValueStatus(probativeValue) == 'WARNING', 'text-red': probativeValueStatus(probativeValue) == 'KO' || probativeValueStatus(probativeValue) == 'FATAL' }">
+          {{ probativeValueStatus(probativeValue) }}</td>
+        <td class="clickable" (click)="probativeValueClick.emit(probativeValue)">{{ probativeValueMessage(probativeValue)  }}</td>
       </tr>
     </ng-container>
     </tbody>

ui/ui-frontend/projects/referential/src/app/probative-value/probative-value-list/probative-value-list.component.ts

@@ -7,6 +7,11 @@ import {ProbativeValueService} from '../probative-value.service';
 
 const FILTER_DEBOUNCE_TIME_MS = 400;
 
+export class ProbativeValueFilters {
+  startDate: string;
+  endDate: string;
+}
+
 @Component({
   selector: 'app-probative-value-list',
   templateUrl: './probative-value-list.component.html',
@@ -23,6 +28,16 @@ export class ProbativeValueListComponent extends InfiniteScrollTable<any> implem
   // tslint:disable-next-line:variable-name
   private _searchText: string;
 
+  @Input('filters')
+  set filters(filters: ProbativeValueFilters) {
+    console.log('Filters: ', filters);
+    this._filters = filters;
+    this.filterChange.next(filters);
+  }
+
+  // tslint:disable-next-line:variable-name
+  private _filters: ProbativeValueFilters;
+
   loaded = false;
 
   orderBy = '#id';
@@ -30,6 +45,7 @@ export class ProbativeValueListComponent extends InfiniteScrollTable<any> implem
 
   private readonly searchChange = new Subject<string>();
   private readonly orderChange = new Subject<string>();
+  private readonly filterChange = new Subject<any>();
 
   @Output() probativeValueClick = new EventEmitter<any>();
 
@@ -46,29 +62,39 @@ export class ProbativeValueListComponent extends InfiniteScrollTable<any> implem
         DEFAULT_PAGE_SIZE,
         this.orderBy,
         Direction.ASCENDANT,
-        JSON.stringify(this.buildProbativeVlaueCriteriaFromSearch())))
+        JSON.stringify(this.buildProbativeValueCriteriaFromSearch())))
       .subscribe((data: any[]) => {
         this.dataSource = data;
       });
 
-    const searchCriteriaChange = merge(this.searchChange, this.orderChange)
+    const searchCriteriaChange = merge(this.searchChange, this.orderChange, this.filterChange)
       .pipe(debounceTime(FILTER_DEBOUNCE_TIME_MS));
 
     searchCriteriaChange.subscribe(() => {
-      const query: any = this.buildProbativeVlaueCriteriaFromSearch();
+      const query: any = this.buildProbativeValueCriteriaFromSearch();
       console.log('query: ', query);
       const pageRequest = new PageRequest(0, DEFAULT_PAGE_SIZE, this.orderBy, this.direction, JSON.stringify(query));
       this.search(pageRequest);
     });
   }
 
-  buildProbativeVlaueCriteriaFromSearch() {
+  buildProbativeValueCriteriaFromSearch() {
     const criteria: any = {};
     criteria.evTypeProc = 'AUDIT';
     criteria.evType = 'EXPORT_PROBATIVE_VALUE';
     if (this._searchText !== undefined && this._searchText.length > 0) {
       criteria['#id'] = this._searchText;
     }
+
+    if (this._filters) {
+      if (this._filters.startDate) {
+        criteria.evDateTime_Start = this._filters.startDate;
+      }
+      if (this._filters.endDate) {
+        criteria.evDateTime_End = this._filters.endDate;
+      }
+    }
+
     return criteria;
   }
 
@@ -76,23 +102,24 @@ export class ProbativeValueListComponent extends InfiniteScrollTable<any> implem
     this.updatedData.unsubscribe();
   }
 
-  searchProbativeVlaueOrdered() {
-    this.search(new PageRequest(0, DEFAULT_PAGE_SIZE, this.orderBy, Direction.ASCENDANT));
+  searchProbativeValueOrdered() {
+    const query: any = this.buildProbativeValueCriteriaFromSearch();
+    this.search(new PageRequest(0, DEFAULT_PAGE_SIZE, this.orderBy, Direction.ASCENDANT, JSON.stringify(query)));
   }
 
   emitOrderChange() {
     this.orderChange.next();
   }
 
-  probativeVlaueStatus(probativeVlaue: any): string {
-    return (probativeVlaue.events !== undefined && probativeVlaue.events.length !== 0) ?
-      probativeVlaue.events[probativeVlaue.events.length - 1].outcome :
-      probativeVlaue.outcome;
+  probativeValueStatus(probativeValue: any): string {
+    return (probativeValue.events !== undefined && probativeValue.events.length !== 0) ?
+      probativeValue.events[probativeValue.events.length - 1].outcome :
+      probativeValue.outcome;
   }
 
-  probativeVlaueMessage(probativeVlaue: any): string {
-    return (probativeVlaue.events !== undefined && probativeVlaue.events.length !== 0) ?
-      probativeVlaue.events[probativeVlaue.events.length - 1].outMessage :
-      probativeVlaue.outMessage;
+  probativeValueMessage(probativeValue: any): string {
+    return (probativeValue.events !== undefined && probativeValue.events.length !== 0) ?
+      probativeValue.events[probativeValue.events.length - 1].outMessage :
+      probativeValue.outMessage;
   }
 }

ui/ui-frontend/projects/referential/src/app/probative-value/probative-value.component.html

 <mat-sidenav-container [autosize]="true" [hasBackdrop]="false">
 
-  <mat-sidenav #panel mode="side" position="end" [fixedInViewport]="true">
-    <app-probative-value-preview *ngIf="openedItem" (previewClose)="closePanel()" [probativeValue]="openedItem"></app-probative-value-preview>
-  </mat-sidenav>
+    <mat-sidenav #panel mode="side" position="end" [fixedInViewport]="true">
+        <app-probative-value-preview *ngIf="openedItem" (previewClose)="closePanel()" [probativeValue]="openedItem">
+        </app-probative-value-preview>
+    </mat-sidenav>
 
-  <mat-sidenav-content>
+    <mat-sidenav-content>
 
         <div class="vitamui-header">
             <div class="vitamui-container">
 
-              <vitamui-common-navbar [appId]="appId" (tenantSelect)="changeTenant($event)" [hideCustomerMenu]="true"></vitamui-common-navbar>
+                <vitamui-common-navbar [appId]="appId" (tenantSelect)="changeTenant($event)" [hideCustomerMenu]="true">
+                </vitamui-common-navbar>
 
                 <h2>
                     Rechercher mes <strong>Relevés de valeur probante</strong>
@@ -17,14 +19,16 @@
 
                 <div class="controls">
                     <div class="search-bar-filters">
-                        <vitamui-common-search-bar #searchBar name="probativeVlaue-search" (search)="onSearchSubmit($event)"
-                            placeholder="Identifiant de relevé, identifiant d'UA" i18n-placeholder="@@probativeValueSearchPlaceholder">
+                        <vitamui-common-search-bar #searchBar name="probativeValue-search"
+                            (search)="onSearchSubmit($event)" placeholder="Identifiant de relevé, identifiant d'UA"
+                            i18n-placeholder="@@probativeValueSearchPlaceholder">
                         </vitamui-common-search-bar>
                         <div class="reset-filters" (click)="resetFilters()">Effacer les filtres et la recherche</div>
                     </div>
                     <div class="actions">
-                        <button class="btn secondary" (click)="openCreateProbativeVlaueDialog()">
-                            <i class="vitamui-icon vitamui-icon-probativeVlaue btn-create"></i> <span>Lancer un relevé</span>
+                        <button class="btn secondary" (click)="openCreateProbativeValueDialog()">
+                            <i class="vitamui-icon vitamui-icon-probativeValue btn-create"></i> <span>Lancer un
+                                relevé</span>
                         </button>
                     </div>
 
@@ -65,8 +69,9 @@
             </div>
         </div>
         <div class="vitamui-body vitamui-container">
-            <app-probative-value-list (probativeValueClick)="showProbativeValue($event)" [search]="search"></app-probative-value-list>
+            <app-probative-value-list (probativeValueClick)="showProbativeValue($event)" [search]="search"
+                [filters]="filters"></app-probative-value-list>
         </div>
     </mat-sidenav-content>
 
-</mat-sidenav-container>
+</mat-sidenav-container>
\ No newline at end of file

ui/ui-frontend/projects/referential/src/app/probative-value/probative-value.component.ts

@@ -20,7 +20,7 @@ export class ProbativeValueComponent extends SidenavPage<Event> implements OnIni
   filters: any = {};
 
   @ViewChild(SearchBarComponent, {static: true}) searchBar: SearchBarComponent;
-  @ViewChild(ProbativeValueListComponent, {static: true}) probativeVlaueListComponent: ProbativeValueListComponent;
+  @ViewChild(ProbativeValueListComponent, {static: true}) probativeValueListComponent: ProbativeValueListComponent;
 
   constructor(
     public dialog: MatDialog,
@@ -35,12 +35,20 @@ export class ProbativeValueComponent extends SidenavPage<Event> implements OnIni
       endDate: null
     });
 
-    this.dateRangeFilterForm.valueChanges.subscribe((value) => {
-      this.filters.dateRange = value;
+    this.dateRangeFilterForm.controls.startDate.valueChanges.subscribe(value => {
+      this.filters.startDate = value;
+      this.probativeValueListComponent.filters = this.filters;
+    });
+    this.dateRangeFilterForm.controls.endDate.valueChanges.subscribe((value: Date) => {
+      if (value) {
+        value.setDate(value.getDate() + 1);
+      }
+      this.filters.endDate = value;
+      this.probativeValueListComponent.filters = this.filters;
     });
   }
 
-  openCreateProbativeVlaueDialog() {
+  openCreateProbativeValueDialog() {
     const dialogRef = this.dialog.open(ProbativeValueCreateComponent, {
       panelClass: 'vitamui-modal',
       disableClose: true
@@ -53,10 +61,10 @@ export class ProbativeValueComponent extends SidenavPage<Event> implements OnIni
   }
 
   private refreshList() {
-    if (!this.probativeVlaueListComponent) {
+    if (!this.probativeValueListComponent) {
       return;
     }
-    this.probativeVlaueListComponent.searchProbativeVlaueOrdered();
+    this.probativeValueListComponent.searchProbativeValueOrdered();
   }
 
   onSearchSubmit(search: string) {
@@ -86,6 +94,6 @@ export class ProbativeValueComponent extends SidenavPage<Event> implements OnIni
   }
 
   changeTenant(tenantIdentifier: number) {
-    this.router.navigate(['..', tenantIdentifier], { relativeTo: this.route });
+    this.router.navigate(['..', tenantIdentifier], {relativeTo: this.route});
   }
 }