Merge branch 'feature/PROD-3998/navigation-from-statistics-state-to-configuration' of github.com:Aniutikm/thingsboard into improvement/gateway-dashboard

ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.html

@@ -17,7 +17,7 @@
 -->
 <div class="statistics-container" fxLayout="row" fxLayout.lt-md="column">
   <mat-card [formGroup]="statisticForm" *ngIf="!general">
-    <mat-form-field class="mat-block">
+    <mat-form-field class="mat-block" subscriptSizing="dynamic">
       <mat-label>{{ 'gateway.statistics.statistic' | translate }}</mat-label>
       <mat-select formControlName="statisticKey">
         <mat-option *ngFor="let key of statisticsKeys" [value]="key">
@@ -30,8 +30,13 @@
     </mat-form-field>
     <mat-error
       *ngIf="!statisticsKeys.length && !commands.length">
-      {{'gateway.statistics.statistic-commands-empty' | translate }}
+      {{ 'gateway.statistics.statistic-commands-empty' | translate }}
     </mat-error>
+    <div>
+      <button mat-flat-button color="primary" (click)="navigateToStatistics()">
+        {{ 'gateway.statistics.statistics-button' | translate }}
+      </button>
+    </div>
     <mat-form-field class="mat-block" *ngIf="commandObj">
       <mat-label>{{ 'gateway.statistics.command' | translate }}</mat-label>
       <input matInput [value]="commandObj.command" disabled>
@@ -43,13 +48,16 @@
            matSort [matSortActive]="pageLink.sortOrder.property" [matSortDirection]="pageLink.sortDirection()"
            matSortDisableClear>
       <ng-container matColumnDef="0">
-        <mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'widgets.gateway.created-time' | translate }}</mat-header-cell>
+        <mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'widgets.gateway.created-time' | translate }}
+        </mat-header-cell>
         <mat-cell *matCellDef="let row; let rowIndex = index">
-          {{row[0]| date:'yyyy-MM-dd HH:mm:ss' }}
+          {{ row[0]| date:'yyyy-MM-dd HH:mm:ss' }}
         </mat-cell>
       </ng-container>
       <ng-container matColumnDef="1">
-        <mat-header-cell *matHeaderCellDef mat-sort-header style="width: 70%">{{ 'widgets.gateway.message' | translate }}</mat-header-cell>
+        <mat-header-cell *matHeaderCellDef mat-sort-header
+                         style="width: 70%">{{ 'widgets.gateway.message' | translate }}
+        </mat-header-cell>
         <mat-cell *matCellDef="let row">
           {{ row[1] }}
         </mat-cell>

ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.scss

@@ -28,6 +28,7 @@
       height: 100%;
       margin-right: 35px;
       padding: 15px;
+      gap: 22px;
     }
 
     @media only screen and (max-width: 750px) {

ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-statistics.component.ts

@@ -32,6 +32,7 @@ import { Direction, SortOrder } from '@shared/models/page/sort-order';
 import { MatTableDataSource } from '@angular/material/table';
 import { MatSort } from '@angular/material/sort';
 import { NULL_UUID } from '@shared/models/id/has-uuid';
+import { deepClone } from '@core/utils';
 
 @Component({
   selector: 'tb-gateway-statistics',
@@ -135,6 +136,11 @@ export class GatewayStatisticsComponent implements AfterViewInit {
     }
   }
 
+  public navigateToStatistics() {
+    const params = deepClone(this.ctx.stateController.getStateParams());
+    this.ctx.stateController.openState('configuration', params);
+  }
+
   public sortData() {
     this.dataSource.sortData(this.dataSource.data, this.sort);
   }

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

@@ -3152,6 +3152,7 @@
             "statistic": "Statistic",
             "statistics": "Statistics",
             "statistic-commands-empty": "No configured statistic keys found. You can configure them in \"Statistics\" tab in general configuration.",
+            "statistics-button": "Go to configuration",
             "commands": "Commands",
             "send-period": "Statistic send period (in sec)",
             "send-period-required": "Statistic send period is required",