UI: Improvement event statistics filter

ui-ngx/src/app/modules/home/components/event/event-filter-panel.component.html

@@ -29,6 +29,15 @@
           </mat-select>
         </mat-form-field>
       </ng-template>
+      <ng-template [ngSwitchCase]="isNumberFields(column.key)">
+        <mat-form-field>
+          <mat-label>{{ column.title | translate}}</mat-label>
+          <input matInput type="number" min="0" [name]="column.key" [formControlName]="column.key">
+          <mat-error *ngIf="eventFilterFormGroup.get(column.key).hasError('min')">
+            {{ 'event.min-value' | translate }}
+          </mat-error>
+        </mat-form-field>
+      </ng-template>
       <ng-template [ngSwitchCase]="'isError'">
         <tb-checkbox formControlName="isError" [falseValue]="''">
           {{ 'event.has-error' | translate }}

ui-ngx/src/app/modules/home/components/event/event-filter-panel.component.ts

@@ -15,7 +15,7 @@
 ///
 
 import { Component, Inject, InjectionToken } from '@angular/core';
-import { FormBuilder, FormGroup } from '@angular/forms';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { OverlayRef } from '@angular/cdk/overlay';
 import { EntityType } from '@shared/models/entity-type.models';
 import { FilterEventBody } from '@shared/models/event.models';
@@ -59,7 +59,11 @@ export class EventFilterPanelComponent {
     this.eventFilterFormGroup = this.fb.group({});
     this.data.columns.forEach((column) => {
       this.showColumns.push(column);
-      this.eventFilterFormGroup.addControl(column.key, this.fb.control(this.data.filterParams[column.key] || ''));
+      const validators = [];
+      if (this.isNumberFields(column.key)) {
+        validators.push(Validators.min(0));
+      }
+      this.eventFilterFormGroup.addControl(column.key, this.fb.control(this.data.filterParams[column.key] || '', validators));
       if (column.key === 'isError') {
         this.conditionError = true;
       }
@@ -70,6 +74,10 @@ export class EventFilterPanelComponent {
     return ['msgDirectionType', 'status', 'entityName'].includes(key) ? key : '';
   }
 
+  isNumberFields(key: string): string {
+    return ['messagesProcessed', 'errorsOccurred'].includes(key) ? key : '';
+  }
+
   selectorValues(key: string): string[] {
     switch (key) {
       case 'msgDirectionType':

ui-ngx/src/app/modules/home/components/event/event-table-config.ts

@@ -295,8 +295,8 @@ export class EventTableConfig extends EntityTableConfig<Event, TimePageLink> {
         break;
       case EventType.STATS:
         this.filterColumns.push(
-          {key: 'messagesProcessed', title: 'event.messages-processed'},
+          {key: 'messagesProcessed', title: 'event.min-messages-processed'},
-          {key: 'errorsOccurred', title: 'event.errors-occurred'}
+          {key: 'errorsOccurred', title: 'event.min-errors-occurred'}
         );
         break;
       case DebugEventType.DEBUG_RULE_NODE:

ui-ngx/src/assets/locale/locale.constant-en_US.json

@@ -1641,7 +1641,10 @@
         "success": "Success",
         "failed": "Failed",
         "messages-processed": "Messages processed",
+        "min-messages-processed": "Minimum messages processed",
         "errors-occurred": "Errors occurred",
+        "min-errors-occurred": "Minimum errors occurred",
+        "min-value": "Minimum value is 0.",
         "all-events": "All",
         "has-error": "Has error",
         "entity-id": "Entity Id",