gerrit.onap Code Review - portal/sdk.git/blob

   1 import { Component, OnInit, Input, AfterViewInit, ViewChild, ElementRef } from '@angular/core';
   2 import { GridsterConfig, GridType, GridsterItem } from 'angular-gridster2';
   3 import { MatTableDataSource } from '@angular/material/table';
   4 import { MatPaginator } from '@angular/material/paginator';
   5 import { DashboardReportService } from './dashboard-report.service';
   6 import { MatSort } from '@angular/material';
   7 import { Router } from '@angular/router';
   8 import { environment } from '../../../../../../../../environments/environment';
   9 import { DisplayHtml } from '../../../display-html';
  10 import { RunService } from '../../run.service';
  11 import {FormControl} from '@angular/forms';
  12 export interface PeriodicElement {
  13
  14 }
  15
  16 const ELEMENT_DATA: PeriodicElement[] = [{}];
  17
  18 @Component({
  19     selector: 'app-run-dashboard-report',
  20     templateUrl: './run-dashboard-report.component.html',
  21     styleUrls: ['./run-dashboard-report.component.css']
  22 })
  23
  24 export class RunDashboardReportComponent implements AfterViewInit {
  25
  26     @Input('reportId') inputReportId: string;
  27     @Input('queryString') queryString: string;
  28     @Input('hitCnt') hitCnt: number;
  29     @Input('reportType') reportType: string;
  30     @Input('parentId') parentId: string;
  31     dataSource = new MatTableDataSource<PeriodicElement>(ELEMENT_DATA);
  32     @ViewChild(MatPaginator, { static: false } as any) paginator: MatPaginator;
  33     @ViewChild(MatSort, { static: false } as any) sort: MatSort;
  34     @ViewChild('iframe') iframe: ElementRef;
  35     options: GridsterConfig;
  36     dashboard: Array<GridsterItem> = new Array();
  37     displayedColumns: string[];
  38     IncomingReportId: string;
  39     displayedColumnsArr: string[];
  40     displayedRowObj: {}[];
  41     formFieldPresent: boolean;
  42     showSpinner: boolean;
  43     formFieldList: {}[];
  44     isReady: boolean;
  45     responseFormFieldListLength: number;
  46     NEWdisplayedColumns: string[];
  47     initCnt: number;
  48     reportName: string;
  49     showDashboardReport: boolean;
  50     checkCnt: number;
  51     initialQueryString: string;
  52     initCounter: number;
  53     runButtonHitCounter: number;
  54     showChart = false;
  55     displayColumValue: string;
  56     displayTotal: any[];
  57     private chartRunUrl: string;
  58     replaceDisplayValue: String;
  59 saveResponseObj:any;
  60
  61     constructor(private _dashboardReportService: DashboardReportService, private _router: Router,
  62         private _runService: RunService) {
  63         this.initCounter = 0;
  64         this.runButtonHitCounter = 0;
  65     }
  66
  67     ngOnInit() {
  68         this.initialQueryString = this.queryString;
  69         this.initCounter++;
  70         this.runButtonHitCounter = this.hitCnt;
  71         if (this.reportType === 'Chart') {
  72             this.showChart = true;
  73         }
  74
  75         this.initialProcesses();
  76     }
  77
  78     initialProcesses() {
  79         this.dataSource.paginator = this.paginator;
  80     }
  81
  82     ngOnChanges() {
  83         if (this.initialQueryString !== this.queryString && this.initCounter > 0 && this.runButtonHitCounter !== this.hitCnt) {
  84             this.initialQueryString = this.queryString;
  85             this.runButtonHitCounter = this.hitCnt;
  86             this.initialProcesses();
  87             this.afterViewInitProcesses();
  88         } else {
  89             this.runButtonHitCounter = this.hitCnt;
  90             this.initialQueryString = this.queryString;
  91         }
  92     }
  93
  94     ngAfterViewInit() {
  95         this.afterViewInitProcesses();
  96     }
  97
  98     afterViewInitProcesses() {
  99         if (this.showChart) {
 100             this.chartRunUrl = environment.baseUrl + 'raptor.htm?action=chart.run&c_master=' +
 101                 this.inputReportId + this.queryString + '&refresh=Y&display_content=Y&r_page=0';
 102             this.iframe.nativeElement.setAttribute('src', this.chartRunUrl);
 103             this.showSpinner = false;
 104         } else {
 105
 106             this.displayedColumnsArr = new Array();
 107             this.displayedRowObj = new Array();
 108             this.displayedColumns = new Array();
 109             this.formFieldList = new Array();
 110             this.showSpinner = true;
 111             this.isReady = false;
 112             this.NEWdisplayedColumns = new Array();
 113             this.displayTotal = [];
 114             if (localStorage.getItem(this.inputReportId)) {
 115                 this.postFetchingReportDataFn(JSON.parse(localStorage.getItem(this.inputReportId)));
 116                 localStorage.removeItem(this.inputReportId);
 117             } else {
 118                 this._dashboardReportService.getReportDataWithFormFields(this.queryString, this.inputReportId)
 119                     .subscribe((response) => {
 120                         this.postFetchingReportDataFn(response);
 121                     });
 122             }
 123         }
 124     }
 125
 126     postFetchingReportDataFn(response: any){
 127         this.saveResponseObj = response;
 128         this.formFieldPresent = false;
 129         this.responseFormFieldListLength = 0;
 130         this.reportName = response['reportName'];
 131         let columnCntr = 0;
 132         while (response['reportDataColumns'][columnCntr]) {
 133             this.displayedColumnsArr.push(response['reportDataColumns'][columnCntr]['columnTitle'] + ','
 134                 + response['reportDataColumns'][columnCntr]['colId']);
 135             columnCntr++;
 136         }
 137         let totalCnt = 0;
 138         while (response['reportTotalDataRows'][totalCnt]) {
 139             this.displayTotal.push(response['reportTotalDataRows'][totalCnt]);
 140             totalCnt++;
 141         }
 142         let rdr_cntr = 0;
 143         while (response['reportDataRows'][rdr_cntr]) {
 144             let dca_cntr = 0;
 145             const obj = {};
 146             const reportDataRows = response['reportDataRows'][rdr_cntr];
 147             while (this.displayedColumnsArr[dca_cntr]) {
 148                 const rowColumnId = this.displayedColumnsArr[dca_cntr].split(',')[1];
 149                 if (reportDataRows[rowColumnId]) {
 150                     let drillDownHtml = '';
 151                     let displayValue = '';
 152                     drillDownHtml = reportDataRows[rowColumnId]['drillDownURL'];
 153                     displayValue = reportDataRows[rowColumnId]['displayValue'];
 154                     if (drillDownHtml !== null &&
 155                         drillDownHtml.length > 0 &&
 156                         !displayValue.includes('linkToReport')) {
 157                         const value = this.convertToLinkToReport(drillDownHtml);
 158                         if (value.length > 0) {
 159                             this.replaceDisplayValue = value + ',' +
 160                                 reportDataRows[rowColumnId]['displayValue'];
 161                         } else {
 162                             this.replaceDisplayValue = reportDataRows[rowColumnId]['displayValue'];
 163                         }
 164                     } else {
 165                         this.replaceDisplayValue = reportDataRows[rowColumnId]['displayValue'];
 166                     }
 167                     let displayObj: DisplayHtml = new class implements DisplayHtml {
 168                         'background-color': string;
 169                         'font-family': string;
 170                         'font-size': string;
 171                         'font-style': string;
 172                         'font-weight': string;
 173                         'text-align': string;
 174                         'text-decoration': string;
 175                         color: string;
 176                     };
 177                     if (reportDataRows[rowColumnId]['displayValueHtml'].includes('{')) {
 178                         displayObj = JSON.parse(reportDataRows[rowColumnId]['displayValueHtml']);
 179                     }
 180                     displayObj['text-align'] = reportDataRows[rowColumnId]['alignment'];
 181                     if (this.replaceDisplayValue.includes('linkToReport') || this.replaceDisplayValue.includes('linkToFeedback') || this.replaceDisplayValue.includes('linkToMail')) {
 182                         obj[reportDataRows[rowColumnId]['colId']] = this.replaceDisplayValue.split(',').join('|')
 183                             + '|' + JSON.stringify(displayObj);
 184                     } else {
 185                         obj[reportDataRows[rowColumnId]['colId']] = this.replaceDisplayValue
 186                             + '|' + JSON.stringify(displayObj);
 187                     }
 188                 }
 189                 dca_cntr++;
 190             }
 191             this.displayedRowObj.push(obj);
 192             rdr_cntr++;
 193         }
 194         for (let pushCounter = 0; pushCounter < this.displayedColumnsArr.length; pushCounter++) {
 195             this.displayedColumns.push(this.displayedColumnsArr[pushCounter].split(',')[1]);
 196         }
 197         this.showSpinner = false;
 198         this.dataSource = new MatTableDataSource<PeriodicElement>(this.displayedRowObj);
 199         this.dataSource.sort = this.sort;
 200         this.dataSource.paginator = this.paginator;
 201     }
 202
 203     linkToReport(reportID: string, queryParameters: string) {
 204         localStorage.setItem(this.inputReportId, JSON.stringify(this.saveResponseObj));
 205         if (sessionStorage.length === 0) {
 206             sessionStorage.setItem('1', this.parentId + '|' + this.queryString);
 207         } else {
 208             let length = sessionStorage.length;
 209             length++;
 210             sessionStorage.setItem(length.toString(), this.parentId + '|' + this.queryString);
 211         }
 212         this._router.navigate(['v2/app/run', reportID, queryParameters]);
 213     }
 214
 215     linkToFeedback(feedBackId: string, queryParameters: string) {
 216         this._router.navigate(['v2/app/feedback', feedBackId]);
 217     }
 218
 219     linkToMail(mailId: string) {
 220         const email = 'mailto:' + mailId;
 221         window.location.href = email;
 222     }
 223
 224     applyFilter(filterValue: string) {
 225         this.dataSource.filter = filterValue.trim().toLowerCase();
 226     }
 227
 228     setStyle(styles: string) {
 229         if (styles.includes('{')) {
 230             return JSON.parse(styles);
 231         } else {
 232             return {};
 233         }
 234     }
 235
 236     getDisplayTotal(keys: any) {
 237         if (this.displayTotal.length > 0) {
 238             return this.displayTotal[0][keys].displayValue;
 239         } else {
 240             return '';
 241         }
 242     }
 243
 244     convertToLinkToReport(value: string) {
 245         value = value.replace(/;/g, '');
 246         let outPut = '';
 247         while (value.includes('c_master=')) {
 248             const index = value.indexOf('c_master=');
 249             if (index > 0) {
 250                 value = value.substring(index, value.length);
 251             } else if (index === 0) {
 252                 value = value.replace('c_master=', '');
 253             }
 254         }
 255         const split = value.split('&');
 256         // const spltFirst = split[0].split('=');
 257         if (split[1].length <= 0) {
 258             return outPut;
 259         }
 260         outPut = 'linkToReport,' + split[0] + ',';
 261         let splitCounter = 1;
 262         for (splitCounter = 1; splitCounter < split.length; splitCounter++) {
 263             if (!split[splitCounter].includes('LOGIN_ID=') &&
 264                 !split[splitCounter].includes('display_content=') &&
 265                 !split[splitCounter].includes('drilldown_index=') &&
 266                 !split[splitCounter].includes('show_back_btn=') &&
 267                 !split[splitCounter].includes('r_action')) {
 268                 outPut = outPut + '&' + split[splitCounter];
 269             }
 270         }
 271         return outPut;
 272     }
 273
 274
 275 }