-/**\r
-============LICENSE_START=======================================================\r
- Copyright (C) 2018 Ericsson. All rights reserved.\r
-================================================================================\r
-Licensed under the Apache License, Version 2.0 (the "License");\r
-you may not use this file except in compliance with the License.\r
-You may obtain a copy of the License at\r
-\r
- http://www.apache.org/licenses/LICENSE-2.0\r
-\r
-Unless required by applicable law or agreed to in writing, software\r
-distributed under the License is distributed on an "AS IS" BASIS,\r
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
-See the License for the specific language governing permissions and\r
- limitations under the License.\r
-\r
-SPDX-License-Identifier: Apache-2.0\r
-============LICENSE_END=========================================================\r
-\r
-@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com\r
-*/\r
-\r
-import { BrowserModule } from '@angular/platform-browser';\r
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';\r
-\r
-import { AppRoutingModule } from './app-routing.module';\r
-import { AppComponent } from './app.component';\r
-import { SidebarComponent } from './sidebar/sidebar.component';\r
-import { TopbarComponent } from './topbar/topbar.component';\r
-import { HomeComponent } from './home/home.component';\r
-import { HttpClientModule } from '@angular/common/http';\r
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';\r
-import { MatTableModule } from '@angular/material';\r
-import { DetailsComponent } from './details/details.component';\r
-import { ToastrNotificationService } from './toastr-notification-service.service';\r
-import { MatTabsModule } from '@angular/material/tabs';\r
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations';\r
-import { MatSelectModule } from '@angular/material/select';\r
-import { MatFormFieldModule, MatInputModule } from '@angular/material';\r
-import { MatDatepickerModule } from '@angular/material/datepicker';\r
-import { MatNativeDateModule } from '@angular/material';\r
-import { MatCardModule } from '@angular/material/card';\r
-import { NgxSpinnerModule } from 'ngx-spinner';\r
-import { RouterModule, Routes } from '@angular/router';\r
-import { APP_BASE_HREF } from '@angular/common';\r
-\r
-@NgModule({\r
- declarations: [\r
- AppComponent,\r
- SidebarComponent,\r
- TopbarComponent,\r
- HomeComponent,\r
- DetailsComponent\r
- ],\r
- imports: [\r
- BrowserModule,\r
- AppRoutingModule,\r
- HttpClientModule,\r
- FormsModule,\r
- MatTableModule,\r
- MatTabsModule,\r
- BrowserAnimationsModule,\r
- MatSelectModule,\r
- MatFormFieldModule,\r
- MatInputModule,\r
- MatDatepickerModule,\r
- MatNativeDateModule,\r
- MatCardModule,\r
- NgxSpinnerModule,\r
- RouterModule,\r
- RouterModule.forRoot([])\r
- ],\r
- schemas: [\r
- CUSTOM_ELEMENTS_SCHEMA\r
- ],\r
- providers: [ToastrNotificationService],\r
- bootstrap: [AppComponent]\r
-})\r
-export class AppModule { }\r
+/**
+============LICENSE_START=======================================================
+ Copyright (C) 2018 Ericsson. All rights reserved.
+================================================================================
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+ limitations under the License.
+
+SPDX-License-Identifier: Apache-2.0
+============LICENSE_END=========================================================
+
+@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com
+*/
+
+import { BrowserModule } from '@angular/platform-browser';
+import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+
+import { AppRoutingModule } from './app-routing.module';
+import { AppComponent } from './app.component';
+import { SidebarComponent } from './sidebar/sidebar.component';
+import { TopbarComponent } from './topbar/topbar.component';
+import { HomeComponent } from './home/home.component';
+import { HttpClientModule } from '@angular/common/http';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { DetailsComponent } from './details/details.component';
+import { ToastrNotificationService } from './toastr-notification-service.service';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { MatFormFieldModule, MatInputModule, MatTableModule, MatTabsModule, MatSelectModule, MatNativeDateModule, MatDatepickerModule, MatCardModule, MatPaginatorModule, MatSortModule } from '@angular/material';
+import { NgxSpinnerModule } from 'ngx-spinner';
+import { RouterModule, Routes } from '@angular/router';
+import { APP_BASE_HREF } from '@angular/common';
+
+@NgModule({
+ declarations: [
+ AppComponent,
+ SidebarComponent,
+ TopbarComponent,
+ HomeComponent,
+ DetailsComponent
+ ],
+ imports: [
+ BrowserModule,
+ AppRoutingModule,
+ HttpClientModule,
+ FormsModule,
+ MatTableModule,
+ MatTabsModule,
+ BrowserAnimationsModule,
+ MatSelectModule,
+ MatFormFieldModule,
+ MatInputModule,
+ MatDatepickerModule,
+ MatNativeDateModule,
+ MatCardModule,
+ NgxSpinnerModule,
+ RouterModule,
+ MatPaginatorModule,
+ MatSortModule,
+ RouterModule.forRoot([])
+ ],
+ schemas: [
+ CUSTOM_ELEMENTS_SCHEMA
+ ],
+ providers: [ToastrNotificationService],
+ bootstrap: [AppComponent]
+})
+export class AppModule { }
-/**\r
-============LICENSE_START=======================================================\r
- Copyright (C) 2018 Ericsson. All rights reserved.\r
-================================================================================\r
-Licensed under the Apache License, Version 2.0 (the "License");\r
-you may not use this file except in compliance with the License.\r
-You may obtain a copy of the License at\r
-\r
- http://www.apache.org/licenses/LICENSE-2.0\r
-\r
-Unless required by applicable law or agreed to in writing, software\r
-distributed under the License is distributed on an "AS IS" BASIS,\r
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
-See the License for the specific language governing permissions and\r
- limitations under the License.\r
-\r
-SPDX-License-Identifier: Apache-2.0\r
-============LICENSE_END=========================================================\r
-\r
-@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com\r
-*/\r
-\r
-import { TestBed, inject } from '@angular/core/testing';\r
-\r
-import { DataService } from './data.service';\r
-import { HttpClient } from '@angular/common/http';\r
-import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';\r
-import { async } from '@angular/core/testing';\r
-import { HttpClientModule } from '@angular/common/http';\r
-import { ToastrNotificationService } from './toastr-notification-service.service';\r
-import { environment } from '../environments/environment';\r
-\r
-class StubbedToastrNotificationService extends ToastrNotificationService {\r
- toastrSettings() {\r
- }\r
-}\r
-\r
-describe('DataService', () => {\r
- beforeEach(() => {\r
- TestBed.configureTestingModule({\r
- providers: [DataService, { provide: ToastrNotificationService, useClass: StubbedToastrNotificationService }],\r
- imports: [HttpClientTestingModule]\r
- });\r
- });\r
-\r
- // Ensure creation of DataService component\r
- it('component should be created', async(inject([HttpTestingController, DataService, ToastrNotificationService],\r
- (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {\r
- expect(service).toBeTruthy();\r
- })));\r
-\r
- // Test retrieveInstance function making POST call\r
- it('test retrieveInstance POST request', async(inject([HttpTestingController, DataService, ToastrNotificationService],\r
- (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {\r
- service.retrieveInstance({}, 1, 2).subscribe(data => { });\r
- var url = environment.soMonitoringBackendURL + 'v1/search?from=1&to=2';\r
- const mockReq = httpClient.expectOne(url);\r
- expect(mockReq.request.method).toEqual('POST');\r
- mockReq.flush({});\r
- })));\r
-\r
- // Test getProcessInstanceId function making GET request to retrieve processInstanceID\r
- it('test getProcessInstanceId GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],\r
- (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {\r
- service.getProcessInstanceId("").subscribe(data => { });\r
- var url = environment.soMonitoringBackendURL + 'process-instance-id/' + "";\r
- const mockReq = httpClient.expectOne(url);\r
- expect(mockReq.request.method).toEqual('GET');\r
- mockReq.flush({});\r
- })));\r
-\r
- // Test getActivityInstance function making GET request to retrieve activityInstance\r
- it('test getActivityInstance GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],\r
- (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {\r
- service.getActivityInstance("").subscribe(data => { });\r
- var url = environment.soMonitoringBackendURL + 'activity-instance/' + "";\r
- const mockReq = httpClient.expectOne(url);\r
- expect(mockReq.request.method).toEqual('GET');\r
- mockReq.flush({});\r
- })));\r
-\r
- // Test getProcessInstance function making GET request to retrieve processInstance\r
- it('test getProcessInstance GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],\r
- (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {\r
- service.getProcessInstance("");\r
- var url = environment.soMonitoringBackendURL + 'process-instance/' + "";\r
- const mockReq = httpClient.expectOne(url);\r
- expect(mockReq.request.method).toEqual('GET');\r
- })));\r
-\r
- // Test getProcessDefinition function making GET request to retrieve processDefinition\r
- it('test getProcessDefinition GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],\r
- (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {\r
- service.getProcessDefinition("").subscribe(data => { });\r
- var url = environment.soMonitoringBackendURL + 'process-definition/' + "";\r
- const mockReq = httpClient.expectOne(url);\r
- expect(mockReq.request.method).toEqual('GET');\r
- mockReq.flush({});\r
- })));\r
-\r
- // Test getVariableInstance function making GET request to retrieve variableInstance\r
- it('test getVariableInstance GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],\r
- (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {\r
- service.getVariableInstance("").subscribe(data => { });\r
- var url = environment.soMonitoringBackendURL + 'variable-instance/' + "";\r
- const mockReq = httpClient.expectOne(url);\r
- expect(mockReq.request.method).toEqual('GET');\r
- mockReq.flush({});\r
- })));\r
-});\r
+/**
+============LICENSE_START=======================================================
+ Copyright (C) 2018 Ericsson. All rights reserved.
+================================================================================
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+ limitations under the License.
+
+SPDX-License-Identifier: Apache-2.0
+============LICENSE_END=========================================================
+
+@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com
+*/
+
+import { TestBed, inject } from '@angular/core/testing';
+
+import { DataService } from './data.service';
+import { HttpClient } from '@angular/common/http';
+import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
+import { async } from '@angular/core/testing';
+import { HttpClientModule } from '@angular/common/http';
+import { ToastrNotificationService } from './toastr-notification-service.service';
+import { environment } from '../environments/environment';
+
+class StubbedToastrNotificationService extends ToastrNotificationService {
+ toastrSettings() {
+ }
+}
+
+describe('DataService', () => {
+ beforeEach(() => {
+ TestBed.configureTestingModule({
+ providers: [DataService, { provide: ToastrNotificationService, useClass: StubbedToastrNotificationService }],
+ imports: [HttpClientTestingModule]
+ });
+ });
+
+ // Ensure creation of DataService component
+ it('component should be created', async(inject([HttpTestingController, DataService, ToastrNotificationService],
+ (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {
+ expect(service).toBeTruthy();
+ })));
+
+ // Test retrieveInstance function making POST call
+ it('test retrieveInstance POST request', async(inject([HttpTestingController, DataService, ToastrNotificationService],
+ (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {
+ service.retrieveInstance({}, 1, 2).subscribe(data => { });
+ var url = environment.soMonitoringBackendURL + 'v1/search?from=1&to=2';
+ const mockReq = httpClient.expectOne(url);
+ expect(mockReq.request.method).toEqual('POST');
+ mockReq.flush({});
+ })));
+
+ // Test getProcessInstanceId function making GET request to retrieve processInstanceID
+ it('test getProcessInstanceId GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],
+ (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {
+ service.getProcessInstanceId("").subscribe(data => { });
+ var url = environment.soMonitoringBackendURL + 'process-instance-id/' + "";
+ const mockReq = httpClient.expectOne(url);
+ expect(mockReq.request.method).toEqual('GET');
+ mockReq.flush({});
+ })));
+
+ // Test getActivityInstance function making GET request to retrieve activityInstance
+ it('test getActivityInstance GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],
+ (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {
+ service.getActivityInstance("").then(data => { });
+ var url = environment.soMonitoringBackendURL + 'activity-instance/' + "";
+ const mockReq = httpClient.expectOne(url);
+ expect(mockReq.request.method).toEqual('GET');
+ mockReq.flush({});
+ })));
+
+ // Test getProcessInstance function making GET request to retrieve processInstance
+ it('test getProcessInstance GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],
+ (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {
+ service.getProcessInstance("");
+ var url = environment.soMonitoringBackendURL + 'process-instance/' + "";
+ const mockReq = httpClient.expectOne(url);
+ expect(mockReq.request.method).toEqual('GET');
+ })));
+
+ // Test getProcessDefinition function making GET request to retrieve processDefinition
+ it('test getProcessDefinition GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],
+ (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {
+ service.getProcessDefinition("").subscribe(data => { });
+ var url = environment.soMonitoringBackendURL + 'process-definition/' + "";
+ const mockReq = httpClient.expectOne(url);
+ expect(mockReq.request.method).toEqual('GET');
+ mockReq.flush({});
+ })));
+
+ // Test getVariableInstance function making GET request to retrieve variableInstance
+ it('test getVariableInstance GET request', async(inject([HttpTestingController, DataService, ToastrNotificationService],
+ (httpClient: HttpTestingController, service: DataService, toastr: ToastrNotificationService) => {
+ service.getVariableInstance("").subscribe(data => { });
+ var url = environment.soMonitoringBackendURL + 'variable-instance/' + "";
+ const mockReq = httpClient.expectOne(url);
+ expect(mockReq.request.method).toEqual('GET');
+ mockReq.flush({});
+ })));
+});
-/**\r
-============LICENSE_START=======================================================\r
- Copyright (C) 2018 Ericsson. All rights reserved.\r
-================================================================================\r
-Licensed under the Apache License, Version 2.0 (the "License");\r
-you may not use this file except in compliance with the License.\r
-You may obtain a copy of the License at\r
-\r
- http://www.apache.org/licenses/LICENSE-2.0\r
-\r
-Unless required by applicable law or agreed to in writing, software\r
-distributed under the License is distributed on an "AS IS" BASIS,\r
-WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r
-See the License for the specific language governing permissions and\r
- limitations under the License.\r
-\r
-SPDX-License-Identifier: Apache-2.0\r
-============LICENSE_END=========================================================\r
-\r
-@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com\r
-*/\r
-\r
-#canvas {\r
- background: white;\r
- padding: 0;\r
- margin: 0;\r
- width: 70%;\r
- height: 470px;\r
- margin-top: 0;\r
- box-shadow: 0 5px 5px -3px rgba(0,0,0,.2), 0 8px 10px 1px rgba(0,0,0,.14), 0 3px 14px 2px rgba(0,0,0,.12);\r
-}\r
-\r
-#besideCanvas {\r
- background: white;\r
- padding-left: 20px;\r
- margin: 0;\r
- width: 28%;\r
- height: 470px;\r
- margin-top: 0;\r
- box-shadow: 0 5px 5px -3px rgba(0,0,0,.2), 0 8px 10px 1px rgba(0,0,0,.14), 0 3px 14px 2px rgba(0,0,0,.12);\r
- font-family: 'Montserrat', sans-serif;\r
- font-size: 17px;\r
-}\r
-\r
-.topCanvas {\r
- display: flex;\r
- justify-content: space-between;\r
-}\r
-\r
-.mat-column-durationInMillis {\r
- flex: 0 0 8%;\r
-}\r
-\r
-.mat-column-name {\r
- flex: 0 0 40%;\r
-}\r
-\r
-.mat-column-type {\r
- flex: 0 0 8%;\r
-}\r
-\r
-.mat-column-value {\r
- flex: 0 0 52%;\r
-}\r
-\r
-.highlight:not(.djs-connection) .djs-visual > :nth-child(1) {\r
- fill: cyan !important; /* color elements as green */\r
- }\r
+/**
+============LICENSE_START=======================================================
+ Copyright (C) 2018 Ericsson. All rights reserved.
+================================================================================
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+ limitations under the License.
+
+SPDX-License-Identifier: Apache-2.0
+============LICENSE_END=========================================================
+
+@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com
+*/
+#canvas {
+ background: white;
+ padding: 0;
+ margin: 0;
+ width: 70%;
+ height: 470px;
+ margin-top: 0;
+ box-shadow: 0 5px 5px -3px rgba(0,0,0,.2), 0 8px 10px 1px rgba(0,0,0,.14), 0 3px 14px 2px rgba(0,0,0,.12);
+}
+
+#besideCanvas {
+ background: white;
+ padding-left: 20px;
+ margin: 0;
+ width: 28%;
+ height: 470px;
+ margin-top: 0;
+ box-shadow: 0 5px 5px -3px rgba(0,0,0,.2), 0 8px 10px 1px rgba(0,0,0,.14), 0 3px 14px 2px rgba(0,0,0,.12);
+ font-family: 'Montserrat', sans-serif;
+ font-size: 17px;
+}
+
+.topCanvas {
+ display: flex;
+ justify-content: space-between;
+}
+
+.mat-column-durationInMillis {
+ flex: 0 0 8%;
+}
+
+.mat-column-name {
+ flex: 0 0 40%;
+}
+
+.mat-column-type {
+ flex: 0 0 8%;
+}
+
+.mat-column-value {
+ flex: 0 0 52%;
+}
+
+.highlight:not(.djs-connection) .djs-visual > :nth-child(1) {
+ fill: cyan !important;
+ /* color elements as green */
+}
+
+.tab-group {
+ word-break: break-all;
+}
SPDX-License-Identifier: Apache-2.0
============LICENSE_END=========================================================
-@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com
+@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com, andrei.barcovschi@ericsson.com
-->
<base href="/">
<input matInput #searchValueRI type="text" [(ngModel)]="searchData.requestId" placeholder="Request Id">
</mat-form-field>
- <!-- Angular Start Date Picker -->
- <mat-form-field class="startDate">
- <input matInput #startDate [matDatepicker]="picker" [(ngModel)]="searchData.startDate" placeholder="Choose a start date">
- <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
- <mat-datepicker #picker></mat-datepicker>
- </mat-form-field>
-
- <!-- Dropdown box for Start Hour selection -->
- <mat-form-field class="selectHour">
- <mat-select class="formatBox" [(ngModel)]="searchData.selectedStartHour" name="hourFrom" placeholder="Select Hour">
- <mat-option *ngFor="let option of hourOptions" [value]="option">{{option}}</mat-option>
- </mat-select>
- </mat-form-field>
-
- <!-- Dropdown box for Start Minute selection -->
- <mat-form-field class="selectMinute">
- <mat-select class="formatBox" [(ngModel)]="searchData.selectedStartMinute" name="minuteFrom" placeholder="Select Minute">
- <mat-option *ngFor="let option of minuteOptions" [value]="option">{{option}}</mat-option>
- </mat-select>
- </mat-form-field>
+ <!-- Angular Start Date Picker -->
+ <mat-form-field class="startDate">
+ <input matInput #startDate [matDatepicker]="picker" [(ngModel)]="searchData.startDate" placeholder="Choose a start date">
+ <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
+ <mat-datepicker #picker></mat-datepicker>
+ </mat-form-field>
+
+ <!-- Dropdown box for Start Hour selection -->
+ <mat-form-field class="selectHour">
+ <mat-select class="formatBox" [(ngModel)]="searchData.selectedStartHour" name="hourFrom" placeholder="Select Hour">
+ <mat-option *ngFor="let option of hourOptions" [value]="option">{{option}}</mat-option>
+ </mat-select>
+ </mat-form-field>
+
+ <!-- Dropdown box for Start Minute selection -->
+ <mat-form-field class="selectMinute">
+ <mat-select class="formatBox" [(ngModel)]="searchData.selectedStartMinute" name="minuteFrom" placeholder="Select Minute">
+ <mat-option *ngFor="let option of minuteOptions" [value]="option">{{option}}</mat-option>
+ </mat-select>
+ </mat-form-field>
</div>
<!-- Dropdown Filter and TextBox for Service Name -->
<input matInput #searchValueSN type="text" [(ngModel)]="searchData.serviceInstanceName" placeholder="Service Name">
</mat-form-field>
- <!-- Angular End Date Picker -->
- <mat-form-field class="endDate">
- <input matInput #endDate [matDatepicker]="endpicker" [(ngModel)]="searchData.endDate" placeholder="Choose an end date">
- <mat-datepicker-toggle matSuffix [for]="endpicker"></mat-datepicker-toggle>
- <mat-datepicker #endpicker></mat-datepicker>
- </mat-form-field>
-
- <!-- Dropdown box for End Hour selection -->
- <mat-form-field class="selectHour">
- <mat-select class="formatBox" [(ngModel)]="searchData.selectedEndHour" name="hourTo" placeholder="Select Hour">
- <mat-option *ngFor="let option of hourOptions" [value]="option">{{option}}</mat-option>
- </mat-select>
- </mat-form-field>
-
- <!-- Dropdown box for End Minute selection -->
- <mat-form-field class="selectMinute">
- <mat-select class="formatBox" [(ngModel)]="searchData.selectedEndMinute" name="minuteTo" placeholder="Select Minute">
- <mat-option *ngFor="let option of minuteOptions" [value]="option">{{option}}</mat-option>
- </mat-select>
- </mat-form-field>
+ <!-- Angular End Date Picker -->
+ <mat-form-field class="endDate">
+ <input matInput #endDate [matDatepicker]="endpicker" [(ngModel)]="searchData.endDate" placeholder="Choose an end date">
+ <mat-datepicker-toggle matSuffix [for]="endpicker"></mat-datepicker-toggle>
+ <mat-datepicker #endpicker></mat-datepicker>
+ </mat-form-field>
+
+ <!-- Dropdown box for End Hour selection -->
+ <mat-form-field class="selectHour">
+ <mat-select class="formatBox" [(ngModel)]="searchData.selectedEndHour" name="hourTo" placeholder="Select Hour">
+ <mat-option *ngFor="let option of hourOptions" [value]="option">{{option}}</mat-option>
+ </mat-select>
+ </mat-form-field>
+
+ <!-- Dropdown box for End Minute selection -->
+ <mat-form-field class="selectMinute">
+ <mat-select class="formatBox" [(ngModel)]="searchData.selectedEndMinute" name="minuteTo" placeholder="Select Minute">
+ <mat-option *ngFor="let option of minuteOptions" [value]="option">{{option}}</mat-option>
+ </mat-select>
+ </mat-form-field>
</div>
<!-- Dropdown Filter for Status -->
<div class="example-container mat-elevation-z8">
<mat-tab-group class="tab-group">
<mat-tab label="Service Instances">
- <mat-table [dataSource]="processData">
+ <mat-table [dataSource]="processData" matSort>
<ng-container matColumnDef="requestId">
- <mat-header-cell *matHeaderCellDef> Request Id </mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header> Request Id </mat-header-cell>
<mat-cell *matCellDef="let process"><a routerLink="" (click)="getProcessIsntanceId(process.requestId)">{{ process.requestId }}</a></mat-cell>
</ng-container>
<ng-container matColumnDef="serviceInstanceId">
- <mat-header-cell *matHeaderCellDef> Instance Id </mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header> Instance Id </mat-header-cell>
<mat-cell *matCellDef="let process"> {{ process.serviceInstanceId }} </mat-cell>
</ng-container>
<ng-container matColumnDef="serviceIstanceName">
- <mat-header-cell *matHeaderCellDef> Instance Name </mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header> Instance Name </mat-header-cell>
<mat-cell *matCellDef="let process"> {{ process.serviceIstanceName }} </mat-cell>
</ng-container>
<ng-container matColumnDef="networkId">
- <mat-header-cell *matHeaderCellDef> Network Id </mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header> Network Id </mat-header-cell>
<mat-cell *matCellDef="let process"> {{ process.networkId }} </mat-cell>
</ng-container>
<ng-container matColumnDef="requestStatus">
- <mat-header-cell *matHeaderCellDef> Request Status </mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header> Request Status </mat-header-cell>
<mat-cell *matCellDef="let process"> {{ process.requestStatus }} </mat-cell>
</ng-container>
<ng-container matColumnDef="serviceType">
- <mat-header-cell *matHeaderCellDef> Service Type </mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header> Service Type </mat-header-cell>
<mat-cell *matCellDef="let process"> {{ process.serviceType }} </mat-cell>
</ng-container>
<ng-container matColumnDef="startTime">
- <mat-header-cell *matHeaderCellDef> Start Time </mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header> Start Time </mat-header-cell>
<mat-cell *matCellDef="let process"> {{ (process.startTime | date:'yyyy-MM-dd HH:mm:sss Z') }} </mat-cell>
</ng-container>
<ng-container matColumnDef="endTime">
- <mat-header-cell *matHeaderCellDef> End Time </mat-header-cell>
+ <mat-header-cell *matHeaderCellDef mat-sort-header> End Time </mat-header-cell>
<mat-cell *matCellDef="let process"> {{ (process.endTime | date:'yyyy-MM-dd HH:mm:sss Z') }} </mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
+ <mat-paginator [pageSizeOptions]="pageSizeOptions" showFirstLastButtons>
+ </mat-paginator>
</mat-tab>
<mat-tab label="Service Statistics">
SPDX-License-Identifier: Apache-2.0
============LICENSE_END=========================================================
-@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com
+@authors: ronan.kenny@ericsson.com, waqas.ikram@ericsson.com, andrei.barcovschi@ericsson.com
*/
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, ViewChild, ElementRef, Input, ViewEncapsulation } from '@angular/core';
import { DataService } from '../data.service';
import { ActivatedRoute, Router } from "@angular/router";
import { Process } from '../model/process.model';
-
import { ProcessInstanceId } from '../model/processInstanceId.model';
import { ToastrNotificationService } from '../toastr-notification-service.service';
import { MatSelectModule } from '@angular/material/select';
-import { ViewEncapsulation } from '@angular/core';
-import { FormsModule } from '@angular/forms';
-import { MatFormFieldModule, MatInputModule } from '@angular/material';
+import { FormsModule, FormControl } from '@angular/forms';
import { SearchData } from '../model/searchData.model';
import { MatDatepickerModule } from '@angular/material/datepicker';
-import { FormControl } from '@angular/forms';
import { SearchRequest } from '../model/SearchRequest.model';
-import { ElementRef } from '@angular/core';
-import { Input } from '@angular/core';
import { NgxSpinnerService } from 'ngx-spinner';
+import { MatFormFieldModule, MatInputModule, MatPaginator, MatSort, MatTableDataSource } from '@angular/material';
+import { Constants } from './home.constant';
@Component({
selector: 'app-home',
percentagePending = 0;
percentageUnlocked = 0;
- options = [{ name: "EQUAL", value: "EQ" }, { name: "NOT EQUAL", value: "NEQ" }, { name: "LIKE", value: "LIKE" }];
- statusOptions = [{ name: "ALL", value: "ALL" }, { name: "COMPLETE", value: "COMPLETE" }, { name: "IN_PROGRESS", value: "IN_PROGRESS" },
- { name: "FAILED", value: "FAILED" }, { name: "PENDING", value: "PENDING" }, { name: "UNLOCKED", value: "UNLOCKED" }];
-
- hourOptions = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11",
- "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"];
+ options = Constants.OPTIONS;
+ statusOptions = Constants.STATUS_OPTIONS;
+ hourOptions = Constants.HOUR_OPTIONS;
+ minuteOptions = Constants.MINUTE_OPTIONS;
+ displayedColumns = Constants.DISPLAYED_COLUMNS;
+ pageSizeOptions = Constants.DEFAULT_PAGE_SIZE_OPTIONS;
- minuteOptions = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15",
- "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35",
- "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55",
- "56", "57", "58", "59"];
-
- processData: Process[];
searchData: SearchData;
-
startingDate: Date;
+ processData: MatTableDataSource<Process>;
- displayedColumns = ['requestId', 'serviceInstanceId', 'serviceIstanceName', 'networkId', 'requestStatus', 'serviceType', 'startTime', 'endTime'];
+ @ViewChild(MatPaginator) paginator: MatPaginator;
+ @ViewChild(MatSort) sort: MatSort;
constructor(private route: ActivatedRoute, private data: DataService,
private router: Router, private popup: ToastrNotificationService,
this.data.retrieveInstance(result.getFilters(), result.getStartTimeInMilliseconds(), result.getEndTimeInMilliseconds())
.subscribe((data: Process[]) => {
this.spinner.hide();
- this.processData = data;
+ var processData: Process[] = data;
+ this.processData = new MatTableDataSource<Process>(processData);
+ this.processData.sort = this.sort;
+ this.processData.paginator = this.paginator;
+ this.processData.paginator.firstPage();
+
this.popup.info("Number of records found: " + data.length)
// Calculate Statistics for Service Statistics tab
- this.completeVal = this.processData.filter(i => i.requestStatus === "COMPLETE").length;
- this.inProgressVal = this.processData.filter(i => i.requestStatus === "IN_PROGRESS").length;
- this.failedVal = this.processData.filter(i => i.requestStatus === "FAILED").length;
- this.pendingVal = this.processData.filter(i => i.requestStatus === "PENDING").length;
- this.unlockedVal = this.processData.filter(i => i.requestStatus === "UNLOCKED").length;
- this.totalVal = this.processData.length;
+ this.completeVal = processData.filter(i => i.requestStatus === "COMPLETE").length;
+ this.inProgressVal = processData.filter(i => i.requestStatus === "IN_PROGRESS").length;
+ this.failedVal = processData.filter(i => i.requestStatus === "FAILED").length;
+ this.pendingVal = processData.filter(i => i.requestStatus === "PENDING").length;
+ this.unlockedVal = processData.filter(i => i.requestStatus === "UNLOCKED").length;
+ this.totalVal = processData.length;
// Calculate percentages to 2 decimal places and compare to 0 to avoid NaN error
if (this.totalVal != 0) {
});
}
- ngOnInit() {
-
- }
+ ngOnInit() { }
}
--- /dev/null
+
+/**
+============LICENSE_START=======================================================
+ Copyright (C) 2019 Ericsson. All rights reserved.
+================================================================================
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+ limitations under the License.
+
+SPDX-License-Identifier: Apache-2.0
+============LICENSE_END=========================================================
+
+@authors: andrei.barcovschi@ericsson.com, waqas.ikram@ericsson.com
+*/
+
+export class Constants {
+ public static OPTIONS = [{ name: "EQUAL", value: "EQ" }, { name: "NOT EQUAL", value: "NEQ" }, { name: "LIKE", value: "LIKE" }];
+
+ public static STATUS_OPTIONS = [{ name: "ALL", value: "ALL" }, { name: "COMPLETE", value: "COMPLETE" }, { name: "IN_PROGRESS", value: "IN_PROGRESS" },
+ { name: "FAILED", value: "FAILED" }, { name: "PENDING", value: "PENDING" }, { name: "UNLOCKED", value: "UNLOCKED" }];
+
+ public static HOUR_OPTIONS = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11",
+ "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23"];
+
+ public static MINUTE_OPTIONS = ["00", "01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12", "13", "14", "15",
+ "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35",
+ "36", "37", "38", "39", "40", "41", "42", "43", "44", "45", "46", "47", "48", "49", "50", "51", "52", "53", "54", "55",
+ "56", "57", "58", "59"];
+
+ public static DISPLAYED_COLUMNS = ['requestId', 'serviceInstanceId', 'serviceIstanceName', 'networkId', 'requestStatus', 'serviceType', 'startTime', 'endTime'];
+
+ public static DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100];
+}